Start changing group label page

app/controllers/groups/labels_controller.rb

@@ -2,27 +2,20 @@ class Groups::LabelsController < Groups::ApplicationController
   include ToggleSubscriptionAction
 
   before_action :label, only: [:edit, :update, :destroy]
+  before_action :find_labels, only: [:index]
   before_action :authorize_admin_labels!, only: [:new, :create, :edit, :update, :destroy]
   before_action :save_previous_label_path, only: [:edit]
 
   respond_to :html
 
   def index
-    respond_to do |format|
-      format.html do
-        @labels = @group.labels.page(params[:page])
-      end
+    @prioritized_labels = @available_labels.prioritized(@group)
+    @labels = @available_labels.unprioritized(@group).page(params[:page])
 
+    respond_to do |format|
+      format.html
       format.json do
-        available_labels = LabelsFinder.new(
-          current_user,
-          group_id: @group.id,
-          only_group_labels: params[:only_group_labels],
-          include_ancestor_groups: params[:include_ancestor_groups],
-          include_descendant_groups: params[:include_descendant_groups]
-        ).execute
-
-        render json: LabelSerializer.new.represent_appearance(available_labels)
+        render json: LabelSerializer.new.represent_appearance(@available_labels)
       end
     end
   end
@@ -113,4 +106,15 @@ class Groups::LabelsController < Groups::ApplicationController
   def save_previous_label_path
     session[:previous_labels_path] = URI(request.referer || '').path
   end
+
+  def find_labels
+    @available_labels ||=
+      LabelsFinder.new(
+        current_user,
+        group_id: @group.id,
+        only_group_labels: params[:only_group_labels],
+        include_ancestor_groups: params[:include_ancestor_groups],
+        include_descendant_groups: params[:include_descendant_groups]
+      ).execute
+  end
 end

app/views/groups/labels/index.html.haml

-- 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
+- if @labels.exists? || @prioritized_labels.exists?
+  #promote-label-modal
+  %div{ class: container_class }
+    .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 }
+        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?
+        .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
-      .nothing-here-block
-        = _("No labels created yet.")
+- 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

app/views/shared/_label.html.haml

@@ -6,11 +6,12 @@
 - show_label_issues_link = show_label_issuables_link?(label, :issues, project: @project)
 
 %li.label-list-item{ id: label_css_id, data: { id: label.id } }
-  = render "shared/label_row", label: label
+  = render "shared/label_row", label: label, subject: subject
   %ul.label-actions-list
     %li.inline
       .label-badge.label-badge-gray= label.model_name.human.capitalize
-    - if can?(current_user, :admin_label, @project)
+    - if can?(current_user, :admin_label, label)
+      - if subject.is_a?(Project)
         %li.inline.js-toggle-priority{ data: { url: remove_priority_project_label_path(@project, label),
           dom_id: dom_id(label), type: label.type } }
           %button.label-action.add-priority.btn.btn-transparent.has-tooltip{ title: 'Prioritize', type: 'button', :'data-placement' => 'top' }