Create autodevops settings sections

app/presenters/project_presenter.rb

@@ -260,7 +260,7 @@ class ProjectPresenter < Gitlab::View::Presenter::Delegated
     if current_user && can?(current_user, :admin_pipeline, project) && repository.gitlab_ci_yml.blank? && !show_auto_devops_callout
       OpenStruct.new(enabled: auto_devops_enabled?,
                      label: auto_devops_enabled? ? _('Auto DevOps enabled') : _('Enable Auto DevOps'),
-                     link: project_settings_ci_cd_path(project, anchor: 'js-general-pipeline-settings'))
+                     link: project_settings_ci_cd_path(project, anchor: 'js-autodevops-settings'))
     elsif auto_devops_enabled?
       OpenStruct.new(enabled: true,
                      label: _('Auto DevOps enabled'),

app/views/projects/empty.html.haml

@@ -22,7 +22,7 @@
       %hr
       %p
-        - link_to_auto_devops_settings = link_to(s_('AutoDevOps|enable Auto DevOps (Beta)'), project_settings_ci_cd_path(@project, anchor: 'js-general-pipeline-settings'))
+        - link_to_auto_devops_settings = link_to(s_('AutoDevOps|enable Auto DevOps (Beta)'), project_settings_ci_cd_path(@project, anchor: 'js-autodevops-settings'))
         - link_to_add_kubernetes_cluster = link_to(s_('AutoDevOps|add a Kubernetes cluster'), new_project_cluster_path(@project))
         = s_('AutoDevOps|You can automatically build and test your application if you %{link_to_auto_devops_settings} for this project. You can automatically deploy it as well, if you %{link_to_add_kubernetes_cluster}.').html_safe % { link_to_auto_devops_settings: link_to_auto_devops_settings, link_to_add_kubernetes_cluster: link_to_add_kubernetes_cluster }

app/views/projects/settings/ci_cd/_autodevops_form.html.haml

+.row.prepend-top-default
+  .col-lg-12
+    = form_for @project, url: project_settings_ci_cd_path(@project) do |f|
+      = form_errors(@project)
+      %fieldset.builds-feature
+        .form-group
+          - message = auto_devops_warning_message(@project)
+          - if message
+            %p.settings-message.text-center
+              = message.html_safe
+          = f.fields_for :auto_devops_attributes, @auto_devops do |form|
+            .radio
+              = form.label :enabled_true do
+                = form.radio_button :enabled, 'true'
+                %strong Enable Auto DevOps
+                %br
+                %span.descr
+                  The Auto DevOps pipeline configuration will be used when there is no <code>.gitlab-ci.yml</code> in the project.
+
+            .radio
+              = form.label :enabled_false do
+                = form.radio_button :enabled, 'false'
+                %strong Disable Auto DevOps
+                %br
+                %span.descr
+                  An explicit <code>.gitlab-ci.yml</code> needs to be specified before you can begin using Continuous Integration and Delivery.
+
+            .radio
+              = form.label :enabled_ do
+                = form.radio_button :enabled, ''
+                %strong Instance default (#{Gitlab::CurrentSettings.auto_devops_enabled? ? 'enabled' : 'disabled'})
+                %br
+                %span.descr
+                  Follow the instance default to either have Auto DevOps enabled or disabled when there is no project specific <code>.gitlab-ci.yml</code>.
+
+              %p.prepend-top-10.append-bottom-10
+                You need to specify a domain if you want to use Auto Review Apps and Auto Deploy stages.
+              = form.text_field :domain, class: 'form-control', placeholder: 'domain.com'
+
+          = f.submit 'Save changes', class: "btn btn-save prepend-top-15"

app/views/projects/settings/ci_cd/_form.html.haml

@@ -3,44 +3,6 @@
     = form_for @project, url: project_settings_ci_cd_path(@project) do |f|
       = form_errors(@project)
       %fieldset.builds-feature
-        .form-group
-          %h5 Auto DevOps (Beta)
-          %p
-            Auto DevOps will automatically build, test, and deploy your application based on a predefined Continuous Integration and Delivery configuration.
-            = link_to 'Learn more about Auto DevOps', help_page_path('topics/autodevops/index.md')
-            - message = auto_devops_warning_message(@project)
-            - if message
-              %p.settings-message.text-center
-                = message.html_safe
-          = f.fields_for :auto_devops_attributes, @auto_devops do |form|
-            .radio
-              = form.label :enabled_true do
-                = form.radio_button :enabled, 'true'
-                %strong Enable Auto DevOps
-                %br
-                %span.descr
-                  The Auto DevOps pipeline configuration will be used when there is no <code>.gitlab-ci.yml</code> in the project.
-
-            .radio
-              = form.label :enabled_false do
-                = form.radio_button :enabled, 'false'
-                %strong Disable Auto DevOps
-                %br
-                %span.descr
-                  An explicit <code>.gitlab-ci.yml</code> needs to be specified before you can begin using Continuous Integration and Delivery.
-
-            .radio
-              = form.label :enabled_ do
-                = form.radio_button :enabled, ''
-                %strong Instance default (#{Gitlab::CurrentSettings.auto_devops_enabled? ? 'enabled' : 'disabled'})
-                %br
-                %span.descr
-                  Follow the instance default to either have Auto DevOps enabled or disabled when there is no project specific <code>.gitlab-ci.yml</code>.
-            %p
-              You need to specify a domain if you want to use Auto Review Apps and Auto Deploy stages.
-            = form.text_field :domain, class: 'form-control', placeholder: 'domain.com'
-
-        %hr
         .form-group.append-bottom-default.js-secret-runner-token
           = f.label :runners_token, "Runner token", class: 'label-light'
           .form-control.js-secret-value-placeholder

app/views/projects/settings/ci_cd/show.html.haml

@@ -5,17 +5,29 @@
 - expanded = Rails.env.test?
 - general_expanded = @project.errors.empty? ? expanded : true
-%section.settings#js-general-pipeline-settings.no-animate{ class: ('expanded' if general_expanded) }
+%section.settings.general-ci-settings.no-animate{ class: ('expanded' if general_expanded) }
   .settings-header
     %h4
       General pipelines settings
     %button.btn.js-settings-toggle{ type: 'button' }
       = expanded ? 'Collapse' : 'Expand'
     %p
-      Update your CI/CD configuration, like job timeout or Auto DevOps.
+      Access your runner token, customize your pipeline configuration, and view your pipeline status and coverage report.
   .settings-content
     = render 'form'
+%section.settings#js-autodevops-settings.autodevops-settings.no-animate{ class: ('expanded' if expanded) }
+  .settings-header
+    %h4
+      Auto DevOps (Beta)
+    %button.btn.js-settings-toggle{ type: 'button' }
+      = expanded ? 'Collapse' : 'Expand'
+    %p
+      Auto DevOps will automatically build, test, and deploy your application based on a predefined Continuous Integration and Delivery configuration.
+      = link_to 'Learn more about Auto DevOps', help_page_path('topics/autodevops/index.md')
+  .settings-content
+    = render 'autodevops_form'
+
 %section.settings.no-animate{ class: ('expanded' if expanded) }
   .settings-header
     %h4

app/views/shared/_auto_devops_callout.html.haml

@@ -9,7 +9,7 @@
       - link = link_to(s_('AutoDevOps|Auto DevOps documentation'), help_page_path('topics/autodevops/index.md'), target: '_blank', rel: 'noopener noreferrer')
       = s_('AutoDevOps|Learn more in the %{link_to_documentation}').html_safe % { link_to_documentation: link }
     .banner-buttons
-      = link_to s_('AutoDevOps|Enable in settings'), project_settings_ci_cd_path(@project, anchor: 'js-general-pipeline-settings'), class: 'btn js-close-callout'
+      = link_to s_('AutoDevOps|Enable in settings'), project_settings_ci_cd_path(@project, anchor: 'js-autodevops-settings'), class: 'btn js-close-callout'
   %button.btn-transparent.banner-close.close.js-close-callout{ type: 'button',
   'aria-label' => 'Dismiss Auto DevOps box' }

changelogs/unreleased/43466-make-auto-devops-settings-first-class.yml

+---
+title: Create settings section for autodevops
+merge_request: 18321
+author:
+type: changed

spec/features/projects/settings/pipelines_settings_spec.rb

@@ -27,10 +27,14 @@ describe "Projects > Settings > Pipelines settings" do
       visit project_settings_ci_cd_path(project)
       fill_in('Test coverage parsing', with: 'coverage_regex')
-      click_on 'Save changes'
+      page.within '.general-ci-settings' do
+        click_on 'Save changes'
+      end
       expect(page.status_code).to eq(200)
-      expect(page).to have_button('Save changes', disabled: false)
+      page.within '.general-ci-settings' do
+        expect(page).to have_button('Save changes', disabled: false)
+      end
       expect(page).to have_field('Test coverage parsing', with: 'coverage_regex')
     end
@@ -38,10 +42,14 @@ describe "Projects > Settings > Pipelines settings" do
       visit project_settings_ci_cd_path(project)
       page.check('Auto-cancel redundant, pending pipelines')
-      click_on 'Save changes'
+      page.within '.general-ci-settings' do
+        click_on 'Save changes'
+      end
       expect(page.status_code).to eq(200)
-      expect(page).to have_button('Save changes', disabled: false)
+      page.within '.general-ci-settings' do
+        expect(page).to have_button('Save changes', disabled: false)
+      end
       checkbox = find_field('project_auto_cancel_pending_pipelines')
       expect(checkbox).to be_checked
@@ -51,9 +59,11 @@ describe "Projects > Settings > Pipelines settings" do
       it 'update auto devops settings' do
         visit project_settings_ci_cd_path(project)
-        fill_in('project_auto_devops_attributes_domain', with: 'test.com')
-        page.choose('project_auto_devops_attributes_enabled_false')
-        click_on 'Save changes'
+        page.within '.autodevops-settings' do
+          fill_in('project_auto_devops_attributes_domain', with: 'test.com')
+          page.choose('project_auto_devops_attributes_enabled_false')
+          click_on 'Save changes'
+        end
         expect(page.status_code).to eq(200)
         expect(project.auto_devops).to be_present

spec/features/projects/show/user_sees_setup_shortcut_buttons_spec.rb

@@ -65,7 +65,7 @@ describe 'Projects > Show > User sees setup shortcut buttons' do
       describe 'Auto DevOps button' do
         it '"Enable Auto DevOps" button linked to settings page' do
           page.within('.project-stats') do
-            expect(page).to have_link('Enable Auto DevOps', href: project_settings_ci_cd_path(project, anchor: 'js-general-pipeline-settings'))
+            expect(page).to have_link('Enable Auto DevOps', href: project_settings_ci_cd_path(project, anchor: 'js-autodevops-settings'))
           end
         end
@@ -75,7 +75,7 @@ describe 'Projects > Show > User sees setup shortcut buttons' do
           visit project_path(project)
           page.within('.project-stats') do
-            expect(page).to have_link('Auto DevOps enabled', href: project_settings_ci_cd_path(project, anchor: 'js-general-pipeline-settings'))
+            expect(page).to have_link('Auto DevOps enabled', href: project_settings_ci_cd_path(project, anchor: 'js-autodevops-settings'))
           end
         end
       end
@@ -212,7 +212,7 @@ describe 'Projects > Show > User sees setup shortcut buttons' do
       describe 'Auto DevOps button' do
         it '"Enable Auto DevOps" button linked to settings page' do
           page.within('.project-stats') do
-            expect(page).to have_link('Enable Auto DevOps', href: project_settings_ci_cd_path(project, anchor: 'js-general-pipeline-settings'))
+            expect(page).to have_link('Enable Auto DevOps', href: project_settings_ci_cd_path(project, anchor: 'js-autodevops-settings'))
           end
         end
@@ -222,7 +222,7 @@ describe 'Projects > Show > User sees setup shortcut buttons' do
           visit project_path(project)
           page.within('.project-stats') do
-            expect(page).to have_link('Auto DevOps enabled', href: project_settings_ci_cd_path(project, anchor: 'js-general-pipeline-settings'))
+            expect(page).to have_link('Auto DevOps enabled', href: project_settings_ci_cd_path(project, anchor: 'js-autodevops-settings'))
           end
         end

spec/javascripts/settings_panels_spec.js

@@ -13,9 +13,9 @@ describe('Settings Panels', () => {
     });
     it('should expand linked hash fragment panel', () => {
-      location.hash = '#js-general-pipeline-settings';
-      const pipelineSettingsPanel = document.querySelector('#js-general-pipeline-settings');
+      location.hash = '#js-autodevops-settings';
+      const pipelineSettingsPanel = document.querySelector('#js-autodevops-settings');
       // Our test environment automatically expands everything so we need to clear that out first
       pipelineSettingsPanel.classList.remove('expanded');

spec/presenters/project_presenter_spec.rb

@@ -321,7 +321,7 @@ describe ProjectPresenter do
           expect(presenter.autodevops_anchor_data).to eq(OpenStruct.new(enabled: false,
                                                                         label: 'Enable Auto DevOps',
-                                                                        link: presenter.project_settings_ci_cd_path(project, anchor: 'js-general-pipeline-settings')))
+                                                                        link: presenter.project_settings_ci_cd_path(project, anchor: 'js-autodevops-settings')))
         end
       end
     end

spec/views/projects/settings/ci_cd/_form.html.haml_spec.rb → spec/views/projects/settings/ci_cd/_autodevops_form.html.haml_spec.rb

 require 'spec_helper'
-describe 'projects/settings/ci_cd/_form' do
+describe 'projects/settings/ci_cd/_autodevops_form' do
   let(:project) { create(:project, :repository) }
   before do