Update stage rendering views

app/views/projects/builds/_sidebar.html.haml

@@ -111,7 +111,7 @@
           %span.label.label-primary
             = tag
 
-    - if @build.pipeline.stages_count.many?
+    - if @build.pipeline.stages_count > 1
       .dropdown.build-dropdown
         .title Stage
         %button.dropdown-menu-toggle{type: 'button', 'data-toggle' => 'dropdown'}
@@ -120,7 +120,7 @@
         %ul.dropdown-menu
           - @build.pipeline.stages.each do |stage|
             %li
-              %a.stage-item= stage
+              %a.stage-item= stage.name
 
   .builds-container
     - HasStatus::ORDERED_STATUSES.each do |build_status|

app/views/projects/commit/_pipeline.html.haml

@@ -25,18 +25,7 @@
           = time_interval_in_words pipeline.duration
 
   .row-content-block.build-content.middle-block.pipeline-graph.hidden
-    .pipeline-visualization
-      %ul.stage-column-list
-        - pipeline.stages.each do |stage|
-          %li.stage-column
-            .stage-name
-              %a{name: stage.name}
-              - if stage.name
-                = stage.name.titleize
-            .builds-container
-              %ul
-                = render "projects/commit/pipeline_stage", statuses: stage.statuses
-
+    = render "projects/pipelines/graph", subject: pipeline
 
 - if pipeline.yaml_errors.present?
   .bs-callout.bs-callout-danger
@@ -61,4 +50,5 @@
         - if pipeline.project.build_coverage_enabled?
           %th Coverage
         %th
-      = render pipeline.stages
+    - pipeline.stages.each do |stage|
+      = render "projects/stage/stage", subject: stage

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

+.pipeline-visualization
+  %ul.stage-column-list
+    - subject.stages.each do |stage|
+      = render "projects/stage/graph", subject: stage

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

@@ -13,17 +13,7 @@
 .tab-content
   #js-tab-pipeline.tab-pane
     .build-content.middle-block.pipeline-graph
-      .pipeline-visualization
-        %ul.stage-column-list
-          - pipeline.stages.each do |stage|
-            %li.stage-column
-              .stage-name
-                %a{name: stage.name}
-                - if stage.name
-                  = stage.name.titleize
-              .builds-container
-                %ul
-                  = render "projects/commit/pipeline_stage", statuses: statuses
+      = render "projects/pipelines/graph", subject: pipeline
 
   #js-tab-builds.tab-pane
     - if pipeline.yaml_errors.present?
@@ -49,4 +39,5 @@
             - if pipeline.project.build_coverage_enabled?
               %th Coverage
             %th
-        = render pipeline.stages
+      - pipeline.stages.each do |stage|
+        = render "projects/stage/stage", subject: stage

app/views/projects/commit/_pipeline_stage.html.haml → app/views/projects/stage/_graph.html.haml

-- status_groups = statuses.sort_by(&:name).group_by(&:group_name)
-- status_groups.each do |group_name, grouped_statuses|
-  - if grouped_statuses.one?
-    - status = grouped_statuses.first
-    - is_playable = status.playable? && can?(current_user, :update_build, @project)
-    %li.build{ class: ("playable" if is_playable) }
-      .curve
-      .build-content
-        = render "projects/#{status.to_partial_path}_pipeline", subject: status
-  - else
-    %li.build
-      .curve
-      .dropdown.inline.build-content
-        = render "projects/commit/pipeline_status_group", name: group_name, subject: grouped_statuses
+%li.stage-column
+  .stage-name
+    %a{ name: subject.name }
+    - if subject.name
+      = subject.name.titleize
+  .builds-container
+    %ul
+      - statuses = subject.statuses.latest
+      - status_groups = statuses.sort_by(&:name).group_by(&:group_name)
+      - status_groups.each do |group_name, grouped_statuses|
+        - if grouped_statuses.one?
+          - status = grouped_statuses.first
+          - is_playable = status.playable? && can?(current_user, :update_build, @project)
+          %li.build{ class: ("playable" if is_playable) }
+            .curve
+            .build-content
+              = render "projects/#{status.to_partial_path}_pipeline", subject: status
+        - else
+          %li.build
+            .curve
+            .dropdown.inline.build-content
+              = render "projects/stage/in_stage_group", name: group_name, subject: grouped_statuses

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

 %tr
   %th{colspan: 10}
     %strong
-      %a{name: subject.name}
+      %a{ name: subject.name }
       %span{class: "ci-status-link ci-status-icon-#{subject.status}"}
         = ci_icon_for_status(subject.status)
       - if subject.name