Paginate group runners in CI/CD settings

This change prevents large group runner datasets from impacting
performance in the CI/CD settings page by enabling paginating them.

Users will be able to locate group runners in the list via
pagination.

A small font size issue in the available runners label is fixed as well.

Changelog: fixed

app/controllers/projects/settings/ci_cd_controller.rb

@@ -126,7 +126,9 @@ def define_runners_variables
         @shared_runners_count = active_shared_runners.count(:all)
         @shared_runners = active_shared_runners.page(params[:shared_runners_page]).per(NUMBER_OF_RUNNERS_PER_PAGE).with_tags
 
-        @group_runners = ::Ci::Runner.belonging_to_parent_group_of_project(@project.id).with_tags
+        parent_group_runners = ::Ci::Runner.belonging_to_parent_group_of_project(@project.id)
+        @group_runners_count = parent_group_runners.count(:all)
+        @group_runners = parent_group_runners.page(params[:group_runners_page]).per(NUMBER_OF_RUNNERS_PER_PAGE).with_tags
       end
 
       def define_ci_variables

app/views/projects/runners/_group_runners.html.haml

@@ -35,7 +35,9 @@
     = _('Ask your group owner to set up a group runner.')
 
 - else
-  %h4.underlined-title
-    = _('Available group runners: %{runners}').html_safe % { runners: @group_runners.count }
-  %ul.bordered-list
-    = render partial: 'projects/runners/runner', collection: @group_runners, as: :runner
+  %div{ data: { testid: 'group-runners' } }
+    %h5.gl-mt-6.gl-mb-0
+      = _('Available group runners: %{runners}').html_safe % { runners: @group_runners_count }
+    %ul.bordered-list
+      = render partial: 'projects/runners/runner', collection: @group_runners, as: :runner
+    = paginate @group_runners, theme: "gitlab", param_name: "group_runners_page", params: { expand_runners: true, anchor: 'js-runners-settings' }

app/views/projects/runners/_shared_runners.html.haml

@@ -5,8 +5,8 @@
 - if @shared_runners_count == 0
   = _('This GitLab instance does not provide any shared runners yet. Instance administrators can register shared runners in the admin area.')
 - else
-  %h5.gl-mt-6.gl-mb-0 #{_('Available shared runners:')} #{@shared_runners_count}
   %div{ data: { testid: 'available-shared-runners' } }
+    %h5.gl-mt-6.gl-mb-0 #{_('Available shared runners:')} #{@shared_runners_count}
     %ul.bordered-list
       = render partial: 'projects/runners/runner', collection: @shared_runners, as: :runner
     = paginate @shared_runners, theme: "gitlab", param_name: "shared_runners_page", params: { expand_runners: true, anchor: 'js-runners-settings' }

spec/controllers/projects/settings/ci_cd_controller_spec.rb

@@ -19,8 +19,10 @@
       let_it_be(:group) { create(:group, parent: parent_group) }
       let_it_be(:other_project) { create(:project, group: group) }
 
+      subject { get :show, params: { namespace_id: project.namespace, project_id: project } }
+
       it 'renders show with 200 status code' do
-        get :show, params: { namespace_id: project.namespace, project_id: project }
+        subject
 
         expect(response).to have_gitlab_http_status(:ok)
         expect(response).to render_template(:show)
@@ -32,27 +34,40 @@
         end
 
         it 'renders show with 404 status code' do
-          get :show, params: { namespace_id: project.namespace, project_id: project }
+          subject
+
           expect(response).to have_gitlab_http_status(:not_found)
         end
       end
 
-      context 'with group runners' do
-        let_it_be(:group_runner) { create(:ci_runner, :group, groups: [group]) }
+      context 'with assignable project runners' do
         let_it_be(:project_runner) { create(:ci_runner, :project, projects: [other_project]) }
-        let_it_be(:shared_runner) { create(:ci_runner, :instance) }
 
         before do
           group.add_maintainer(user)
         end
 
-        subject { get :show, params: { namespace_id: project.namespace, project_id: project } }
-
-        it 'sets assignable project runners only' do
+        it 'sets assignable project runners' do
           subject
 
           expect(assigns(:assignable_runners)).to contain_exactly(project_runner)
         end
+      end
+
+      context 'with group runners' do
+        let_it_be(:group) { create :group }
+        let_it_be(:project) { create :project, group: group }
+        let_it_be(:group_runner) { create(:ci_runner, :group, groups: [group]) }
+
+        it 'sets group runners' do
+          subject
+
+          expect(assigns(:group_runners)).to contain_exactly(group_runner)
+        end
+      end
+
+      context 'with instance runners' do
+        let_it_be(:shared_runner) { create(:ci_runner, :instance) }
 
         it 'sets shared runners' do
           subject

spec/features/runners_spec.rb

@@ -123,7 +123,15 @@
         end
 
         context 'when multiple shared runners are configured' do
-          let!(:shared_runner_2) { create(:ci_runner, :instance) }
+          let_it_be(:shared_runner_2) { create(:ci_runner, :instance) }
+
+          it 'shows the runner count' do
+            visit project_runners_path(project)
+
+            within '[data-testid="available-shared-runners"]' do
+              expect(page).to have_content "#{_('Available shared runners:')} 2"
+            end
+          end
 
           it 'adds pagination to the shared runner list' do
             stub_const('Projects::Settings::CiCdController::NUMBER_OF_RUNNERS_PER_PAGE', 1)
@@ -322,7 +330,7 @@
         end
 
         context 'project with a group and a group runner' do
-          let_it_be(:ci_runner) do
+          let_it_be(:group_runner) do
             create(:ci_runner, :group, groups: [group], description: 'group-runner')
           end
 
@@ -346,6 +354,28 @@
             expect(page).to have_content 'Disable group runners'
             expect(project.reload.group_runners_enabled).to be true
           end
+
+          context 'when multiple group runners are configured' do
+            let_it_be(:group_runner_2) { create(:ci_runner, :group, groups: [group]) }
+
+            it 'shows the runner count' do
+              visit project_runners_path(project)
+
+              within '[data-testid="group-runners"]' do
+                expect(page).to have_content format(_('Available group runners: %{runners}'), { runners: 2 })
+              end
+            end
+
+            it 'adds pagination to the group runner list' do
+              stub_const('Projects::Settings::CiCdController::NUMBER_OF_RUNNERS_PER_PAGE', 1)
+
+              visit project_runners_path(project)
+
+              within '[data-testid="group-runners"]' do
+                expect(find('.pagination')).not_to be_nil
+              end
+            end
+          end
         end
       end
     end