Render stage dropdown in separate API call as HTML

app/controllers/projects/pipelines_controller.rb

@@ -8,6 +8,7 @@ class Projects::PipelinesController < Projects::ApplicationController
   def index
     @scope = params[:scope]
     @pipelines = PipelinesFinder.new(project).execute(scope: @scope).page(params[:page]).per(30)
+    @pipelines = @pipelines.includes(project: :namespace)
 
     @running_or_pending_count = PipelinesFinder.new(project).execute(scope: 'running').count
     @pipelines_count = PipelinesFinder.new(project).execute.count
@@ -40,6 +41,17 @@ class Projects::PipelinesController < Projects::ApplicationController
     end
   end
 
+  def stage
+    @stage = pipeline.stages.find do |stage|
+      stage.name == params[:stage]
+    end
+    return not_found unless @stage
+
+    respond_to do |format|
+      format.json { render json: { html: view_to_html_string('projects/pipelines/_stage') } }
+    end
+  end
+
   def retry
     pipeline.retry_failed(current_user)
 

app/views/projects/pipelines/_stage.html.haml

+- detailed_status = @stage.detailed_status(current_user)
+- klass = "has-tooltip ci-status-icon ci-status-icon-#{detailed_status}"
+- hasMultipleBuilds = @stage.statuses.count > 1
+- icon_status = "#{detailed_status.icon}_borderless"
+- icon_status_klass = "ci-status-icon ci-status-icon-#{detailed_status}"
+- tooltip = "#{@stage.name}: #{detailed_status.label || 'not found'}"
+
+.dropdown.inline.build-content
+  %button.has-tooltip.builds-dropdown{ type: 'button', data: { toggle: 'dropdown', title: tooltip} }
+    %span{ class: klass }
+      %span.mini-pipeline-graph-icon-container
+        %span{ class: icon_status_klass }= custom_icon(icon_status)
+        = icon('caret-down', class: 'dropdown-caret')

config/routes/project.rb

@@ -127,6 +127,7 @@ constraints(ProjectUrlConstrainer.new) do
         end
 
         member do
+          get :stage
           post :cancel
           post :retry
           get :builds