Start changing group label page

1 files changed, 41 insertions, 17 deletions

diff --git a/app/views/groups/labels/index.html.haml b/app/views/groups/labels/index.html.haml
index ac7e12fcd0b..1173499f921 100644
--- a/app/views/groups/labels/index.html.haml
+++ b/app/views/groups/labels/index.html.haml
@@ -1,21 +1,45 @@
-- page_title 'Labels'
+- @no_container = true
+- page_title "Labels"
+- can_admin_label = can?(current_user, :admin_label, @group)
+- hide_class = ''
 
-- issuables = ['issues', 'merge requests']
+- if can_admin_label
+  - content_for(:header_content) do
+    .nav-controls
+      = link_to new_group_label_path(@group), class: "btn btn-new" do
+        New label
 
-.top-area.adjust
-  .nav-text
-    = _("Labels can be applied to %{features}. Group labels are available for any project within the group.") % { features: issuables.to_sentence }
+- if @labels.exists? || @prioritized_labels.exists?
+  #promote-label-modal
+  %div{ class: container_class }
+    .top-area.adjust
+      .nav-text
+        Labels can be applied to issues, merge requests and epics. Group labels are available for any project within the group.
+        - if can_admin_label
+          Star a label to make it a priority label. Order the prioritized labels to change their relative priority, by dragging.
 
-  .nav-controls
-    - if can?(current_user, :admin_label, @group)
-      = link_to "New label", new_group_label_path(@group), class: "btn btn-new"
+    .labels-container.prepend-top-5
+      - if can_admin_label
+        -# Only show it in the first page
+        - hide = @available_labels.empty? || (params[:page].present? && params[:page] != '1')
+        .prioritized-labels{ class: ('hide' if hide) }
+          %h5.prepend-top-0 Prioritized Labels
+          %ul.content-list.manage-labels-list.js-prioritized-labels
+            #js-priority-labels-empty-state{ class: "#{'hidden' unless @prioritized_labels.empty?}" }
+              = render 'shared/empty_states/priority_labels'
+            - if @prioritized_labels.present?
+              = render partial: 'shared/label', subject: @group, collection: @prioritized_labels, as: :label
 
-.labels
-  .other-labels
-    - if @labels.present?
-      %ul.content-list.manage-labels-list.js-other-labels
-        = render partial: 'shared/label', subject: @group, collection: @labels, as: :label
-        = paginate @labels, theme: 'gitlab'
-    - else
-      .nothing-here-block
-        = _("No labels created yet.")
+      - if @labels.present?
+        .other-labels
+          - if can_admin_label
+            %h5{ class: ('hide' if hide) } Other Labels
+          %ul.content-list.manage-labels-list.js-other-labels
+            = render partial: 'shared/label', subject: @group, collection: @labels, as: :label
+            = paginate @labels, theme: 'gitlab'
+- else
+  = render 'shared/empty_states/labels'
+
+%template#js-badge-item-template
+  %li.label-link-item.js-priority-badge.inline.prepend-left-10
+    .label-badge.label-badge-blue Prioritized label