Add CRUD functionality to global labels

5 files changed, 82 insertions, 25 deletions

diff --git a/app/views/admin/labels/_label.html.haml b/app/views/admin/labels/_label.html.haml
index f417b2e44a4..c6d5c9edce9 100644
--- a/app/views/admin/labels/_label.html.haml
+++ b/app/views/admin/labels/_label.html.haml
@@ -1,7 +1,48 @@
-%li{id: dom_id(label)}
-  .label-row
-    = render_colored_label(label, tooltip: false)
-    = markdown(label.description, pipeline: :single_line)
-    .pull-right
-      = link_to 'Edit', edit_admin_label_path(label), class: 'btn btn-sm'
-      = link_to 'Delete', admin_label_path(label), class: 'btn btn-sm btn-remove remove-row', method: :delete, remote: true, data: {confirm: "Delete this label? Are you sure?"}
+- label_css_id = dom_id(label)
+- open_issues_count = label.open_issues_count(current_user)
+- open_merge_requests_count = label.open_merge_requests_count(current_user)
+
+%li{id: label_css_id, data: { id: label.id } }
+  = render 'label_row', label: label
+
+  .visible-xs.visible-sm-inline-block.visible-md-inline-block.dropdown
+    %button.btn.btn-default.label-options-toggle{ data: { toggle: 'dropdown' } }
+      Options
+      %span.caret
+    .dropdown-menu.dropdown-menu-align-right
+      %ul
+        %li
+          = link_to_label(label, type: :merge_request) do
+            = pluralize open_merge_requests_count, 'merge request'
+        %li
+          = link_to_label(label) do
+            = pluralize open_issues_count, 'open issue'
+        %li.label-subscription{ data: { url: toggle_subscription_admin_label_path(label) } }
+          %a.js-subscribe-button.label-subscribe-button.subscription-status{ role: "button", href: "#", data: { toggle: "tooltip", status: label_subscription_status(label) } }
+            %span= label_subscription_toggle_button_text(label)
+        %li
+          = link_to 'Edit', edit_admin_label_path(label)
+        %li
+          = link_to 'Delete', admin_label_path(label), title: 'Delete', method: :delete, remote: true, data: { confirm: 'Remove this label? Are you sure?' }
+
+  .pull-right.hidden-xs.hidden-sm.hidden-md
+    = link_to_label(label, type: :merge_request, css_class: 'btn btn-transparent btn-action') do
+      = pluralize label.open_merge_requests_count, 'merge request'
+    = link_to_label(label, css_class: 'btn btn-transparent btn-action') do
+      = pluralize open_issues_count, 'open issue'
+
+    .label-subscription.inline{ data: { url: toggle_subscription_admin_label_path(label) } }
+      %button.js-subscribe-button.label-subscribe-button.btn.btn-transparent.btn-action.subscription-status{ type: "button", title: label_subscription_toggle_button_text(label), data: { toggle: "tooltip", status: label_subscription_status(label) } }
+        %span.sr-only= label_subscription_toggle_button_text(label)
+        = icon('eye', class: 'label-subscribe-button-icon')
+        = icon('spinner spin', class: 'label-subscribe-button-loading')
+
+    = link_to edit_admin_label_path(label), title: 'Edit', class: 'btn btn-transparent btn-action', data: { toggle: 'tooltip' } do
+      %span.sr-only Edit
+      = icon('pencil-square-o')
+    = link_to admin_label_path(label), title: 'Delete', class: 'btn btn-transparent btn-action remove-row', method: :delete, remote: true, data: { confirm: 'Remove this label? Are you sure?', toggle: 'tooltip' } do
+      %span.sr-only Delete
+      = icon('trash-o')
+
+  :javascript
+    new Subscription('##{dom_id(label)} .label-subscription');
diff --git a/app/views/admin/labels/_label_row.html.haml b/app/views/admin/labels/_label_row.html.haml
new file mode 100644
index 00000000000..84c5c44ddcb
--- /dev/null
+++ b/app/views/admin/labels/_label_row.html.haml
@@ -0,0 +1,6 @@
+%span.label-row
+  %span.label-name
+    = render_colored_label(label, tooltip: false)
+  - if label.description
+    %span.label-description
+      = markdown(label.description, pipeline: :single_line)
diff --git a/app/views/admin/labels/edit.html.haml b/app/views/admin/labels/edit.html.haml
index 309aedceded..35ce01ccfbf 100644
--- a/app/views/admin/labels/edit.html.haml
+++ b/app/views/admin/labels/edit.html.haml
@@ -1,5 +1,8 @@
-- page_title "Edit", @label.name, "Labels"
+- page_title 'Edit', @label.name, 'Labels'
+
 %h3.page-title
-  Edit Label
+  = icon('globe')
+  Edit Global Label
 %hr
+
 = render 'form'
diff --git a/app/views/admin/labels/index.html.haml b/app/views/admin/labels/index.html.haml
index 05d6b9ed238..58c2bdae9f5 100644
--- a/app/views/admin/labels/index.html.haml
+++ b/app/views/admin/labels/index.html.haml
@@ -1,18 +1,22 @@
-- page_title "Labels"
+- page_title 'Labels'
 
-%div
-  = link_to new_admin_label_path, class: "pull-right btn btn-nr btn-new" do
-    New label
-  %h3.page-title
-    Labels
-%hr
+.top-area.adjust
+  .nav-text
+    Labels can be applied to issues and merge requests.
+
+  .nav-controls
+    = link_to new_admin_label_path, class: 'btn btn-new' do
+      New label
 
 .labels
-  - if @labels.present?
-    %ul.bordered-list.manage-labels-list
-      = render @labels
+  .global-labels
+    %h5
+      = icon('globe')
+      Global Labels
+    %ul.content-list.manage-labels-list.js-global-labels
+      - if @labels.present?
+        = render @labels
     = paginate @labels, theme: 'gitlab'
-  - else
-    .light-well
-      .nothing-here-block There are no labels yet
-
+    - if @labels.blank?
+      .nothing-here-block
+        There are no labels yet
diff --git a/app/views/admin/labels/new.html.haml b/app/views/admin/labels/new.html.haml
index 0135ad0723d..1ab87bc8ec1 100644
--- a/app/views/admin/labels/new.html.haml
+++ b/app/views/admin/labels/new.html.haml
@@ -1,5 +1,8 @@
-- page_title "New Label"
+- page_title 'New Global Label'
+
 %h3.page-title
-  New Label
+  = icon('globe')
+  New Global Label
 %hr
+
 = render 'form'