Merge branch '26900-pipelines-tabs' into 'master'

Resolve "CI - Pipelines and Builds screens are inconsistent"

Closes #26900

See merge request !9265

app/assets/javascripts/vue_pipelines_index/pipelines.js.es6

@@ -23,7 +23,7 @@ const CommitPipelinesStoreWithTimeAgo = require('../commit/pipelines/pipelines_s
         apiScope: 'all',
         pageInfo: {},
         pagenum: 1,
-        count: { all: 0, running_or_pending: 0 },
+        count: {},
         pageRequest: false,
       };
     },

app/controllers/projects/pipelines_controller.rb

@@ -13,9 +13,15 @@ class Projects::PipelinesController < Projects::ApplicationController
       .page(params[:page])
       .per(30)
-    @running_or_pending_count = PipelinesFinder
+    @running_count = PipelinesFinder
       .new(project).execute(scope: 'running').count
+    @pending_count = PipelinesFinder
+      .new(project).execute(scope: 'pending').count
+
+    @finished_count = PipelinesFinder
+      .new(project).execute(scope: 'finished').count
+
     @pipelines_count = PipelinesFinder
       .new(project).execute.count
@@ -29,7 +35,9 @@ class Projects::PipelinesController < Projects::ApplicationController
             .represent(@pipelines),
           count: {
             all: @pipelines_count,
-            running_or_pending: @running_or_pending_count
+            running: @running_count,
+            pending: @pending_count,
+            finished: @finished_count,
           }
         }
       end

app/finders/pipelines_finder.rb

@@ -10,7 +10,11 @@ class PipelinesFinder
     scoped_pipelines =
       case scope
       when 'running'
-        pipelines.running_or_pending
+        pipelines.running
+      when 'pending'
+        pipelines.pending
+      when 'finished'
+        pipelines.finished
       when 'branches'
         from_ids(ids_for_ref(branches))
       when 'tags'

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

@@ -5,23 +5,35 @@
 %div{ class: container_class }
   .top-area
     %ul.nav-links
-      %li{ class: active_when(@scope.nil?) }>
+      %li.js-pipelines-tab-all{ class: active_when(@scope.nil?) }>
         = link_to project_pipelines_path(@project) do
           All
           %span.badge.js-totalbuilds-count
             = number_with_delimiter(@pipelines_count)
-      %li{ class: active_when(@scope == 'running') }>
+      %li.js-pipelines-tab-pending{ class: active_when(@scope == 'pending') }>
+        = link_to project_pipelines_path(@project, scope: :pending) do
+          Pending
+          %span.badge
+            = number_with_delimiter(@pending_count)
+
+      %li.js-pipelines-tab-running{ class: active_when(@scope == 'running') }>
         = link_to project_pipelines_path(@project, scope: :running) do
           Running
           %span.badge.js-running-count
-            = number_with_delimiter(@running_or_pending_count)
-      %li{ class: active_when(@scope == 'branches') }>
+            = number_with_delimiter(@running_count)
+
+      %li.js-pipelines-tab-finished{ class: active_when(@scope == 'finished') }>
+        = link_to project_pipelines_path(@project, scope: :finished) do
+          Finished
+          %span.badge
+            = number_with_delimiter(@finished_count)
+      %li.js-pipelines-tab-branches{ class: active_when(@scope == 'branches') }>
         = link_to project_pipelines_path(@project, scope: :branches) do
           Branches
-      %li{ class: active_when(@scope == 'tags') }>
+      %li.js-pipelines-tab-tags{ class: active_when(@scope == 'tags') }>
         = link_to project_pipelines_path(@project, scope: :tags) do
           Tags

changelogs/unreleased/26900-pipelines-tabs.yml

+---
+title: Adds Pending and Finished tabs to pipelines page
+merge_request:
+author:

spec/controllers/projects/pipelines_controller_spec.rb

@@ -12,7 +12,10 @@ describe Projects::PipelinesController do
   describe 'GET index.json' do
     before do
-      create_list(:ci_empty_pipeline, 2, project: project)
+      create(:ci_empty_pipeline, status: 'pending', project: project)
+      create(:ci_empty_pipeline, status: 'running', project: project)
+      create(:ci_empty_pipeline, status: 'created', project: project)
+      create(:ci_empty_pipeline, status: 'success', project: project)
       get :index, namespace_id: project.namespace.path,
                   project_id: project.path,
@@ -23,9 +26,11 @@ describe Projects::PipelinesController do
       expect(response).to have_http_status(:ok)
       expect(json_response).to include('pipelines')
-      expect(json_response['pipelines'].count).to eq 2
-      expect(json_response['count']['all']).to eq 2
-      expect(json_response['count']['running_or_pending']).to eq 2
+      expect(json_response['pipelines'].count).to eq 4
+      expect(json_response['count']['all']).to eq 4
+      expect(json_response['count']['running']).to eq 1
+      expect(json_response['count']['pending']).to eq 1
+      expect(json_response['count']['finished']).to eq 1
     end
   end

spec/features/projects/pipelines/pipelines_spec.rb

@@ -26,22 +26,66 @@ describe 'Pipelines', :feature, :js do
         )
       end
-      [:all, :running, :branches].each do |scope|
-        context "when displaying #{scope}" do
-          before do
-            visit_project_pipelines(scope: scope)
-          end
-          it 'contains pipeline commit short SHA' do
-            expect(page).to have_content(pipeline.short_sha)
-          end
-          it 'contains branch name' do
-            expect(page).to have_content(pipeline.ref)
+      context 'scope' do
+        before do
+          create(:ci_empty_pipeline, status: 'pending', project: project, sha: project.commit.id, ref: 'master')
+          create(:ci_empty_pipeline, status: 'running', project: project, sha: project.commit.id, ref: 'master')
+          create(:ci_empty_pipeline, status: 'created', project: project, sha: project.commit.id, ref: 'master')
+          create(:ci_empty_pipeline, status: 'success', project: project, sha: project.commit.id, ref: 'master')
+        end
+        [:all, :running, :pending, :finished, :branches].each do |scope|
+          context "when displaying #{scope}" do
+            before do
+              visit_project_pipelines(scope: scope)
+            end
+
+            it 'contains pipeline commit short SHA' do
+              expect(page).to have_content(pipeline.short_sha)
+            end
+            it 'contains branch name' do
+              expect(page).to have_content(pipeline.ref)
+            end
           end
         end
       end
+      context 'header tabs' do
+        before do
+          visit namespace_project_pipelines_path(project.namespace, project)
+          wait_for_vue_resource
+        end
+
+        it 'shows a tab for All pipelines and count' do
+          expect(page.find('.js-pipelines-tab-all a').text).to include('All')
+          expect(page.find('.js-pipelines-tab-all .badge').text).to include('1')
+        end
+
+        it 'shows a tab for Pending pipelines and count' do
+          expect(page.find('.js-pipelines-tab-pending a').text).to include('Pending')
+          expect(page.find('.js-pipelines-tab-pending .badge').text).to include('0')
+        end
+
+        it 'shows a tab for Running pipelines and count' do
+          expect(page.find('.js-pipelines-tab-running a').text).to include('Running')
+          expect(page.find('.js-pipelines-tab-running .badge').text).to include('1')
+        end
+
+        it 'shows a tab for Finished pipelines and count' do
+          expect(page.find('.js-pipelines-tab-finished a').text).to include('Finished')
+          expect(page.find('.js-pipelines-tab-finished .badge').text).to include('0')
+        end
+
+        it 'shows a tab for Branches' do
+          expect(page.find('.js-pipelines-tab-branches a').text).to include('Branches')
+        end
+
+        it 'shows a tab for Tags' do
+          expect(page.find('.js-pipelines-tab-tags a').text).to include('Tags')
+        end
+      end
+
       context 'when pipeline is cancelable' do
         let!(:build) do
           create(:ci_build, pipeline: pipeline,

spec/finders/pipelines_finder_spec.rb

@@ -39,8 +39,8 @@ describe PipelinesFinder do
       end
     end
-    # Scoping to running will speed up the test as it doesn't hit the FS
-    let(:params) { { scope: 'running' } }
+    # Scoping to pending will speed up the test as it doesn't hit the FS
+    let(:params) { { scope: 'pending' } }
     it 'orders in descending order on ID' do
       feature_pipeline = create(:ci_pipeline, project: project, ref: 'feature')