Fix merge request approvals accordion

Other changes include:
- Refactor checkboxes to GitLab UI form builder
- Add anchors to accordions so they stay open after save

Changelog: fixed
EE: true

ee/app/views/admin/push_rules/_merge_request_approvals.html.haml

 - return unless License.feature_available?(:admin_merge_request_approvers_rules)
-%section.settings.merge-request-approval-settings.no-animate{ class: ('expanded' if expanded_by_default?) }
+%section.settings.no-animate#js-merge-request-approval-settings{ class: ('expanded' if expanded_by_default?), data: { testid: 'merge-request-approval-settings' } }
   .settings-header
     %h4
       = _('Merge request approvals')
@@ -8,7 +8,8 @@
     %p
       = _('Configure approvals by authors and committers on all projects.')
 
-    = form_for @application_setting, url: general_admin_application_settings_path(anchor: 'merge-request-approval-settings'), html: { class: 'fieldset-form' } do |f|
+  .settings-content
+    = gitlab_ui_form_for @application_setting, url: general_admin_application_settings_path(anchor: 'js-merge-request-approval-settings'), html: { class: 'fieldset-form' } do |f|
       = form_errors(@application_setting)
 
       = render 'merge_request_approvals_fields', f: f

ee/app/views/admin/push_rules/_merge_request_approvals_fields.html.haml

@@ -5,15 +5,11 @@
     = _("Define how approval rules are applied to merge requests.")
     = link_to _("Learn more."), help_page_path("user/admin_area/merge_requests_approvals.md"), target: '_blank', rel: 'noopener noreferrer'
   .gl-form-checkbox-group
-    .gl-form-checkbox.custom-control.custom-checkbox
-      = f.check_box :prevent_merge_requests_author_approval, class: 'custom-control-input'
-      = f.label :prevent_merge_requests_author_approval, class: 'custom-control-label' do
-        = s_('ApprovalSettings|Prevent approval by author.')
-    .gl-form-checkbox.custom-control.custom-checkbox
-      = f.check_box :prevent_merge_requests_committers_approval, class: 'custom-control-input'
-      = f.label :prevent_merge_requests_committers_approval, class: 'custom-control-label' do
-        = s_('ApprovalSettings|Prevent approvals by users who add commits.')
-    .gl-form-checkbox.custom-control.custom-checkbox
-      = f.check_box :disable_overriding_approvers_per_merge_request , class: 'custom-control-input'
-      = f.label :disable_overriding_approvers_per_merge_request , class: 'custom-control-label' do
-        = s_('ApprovalSettings|Prevent editing approval rules in projects and merge requests.')
+    = f.gitlab_ui_checkbox_component :prevent_merge_requests_author_approval,
+        s_('ApprovalSettings|Prevent approval by author.')
+
+    = f.gitlab_ui_checkbox_component :prevent_merge_requests_committers_approval,
+        s_('ApprovalSettings|Prevent approvals by users who add commits.')
+
+    = f.gitlab_ui_checkbox_component :disable_overriding_approvers_per_merge_request,
+        s_('ApprovalSettings|Prevent editing approval rules in projects and merge requests.')

ee/app/views/admin/push_rules/_push_rules.html.haml

-= form_for @push_rule, url: admin_push_rule_path, method: :put, html: { class: 'fieldset-form' } do |f|
+= form_for @push_rule, url: admin_push_rule_path(anchor: 'js-push-rule-settings'), method: :put, html: { class: 'fieldset-form' } do |f|
   - if @push_rule.errors.any?
     .gl-alert.gl-alert-danger
       - @push_rule.errors.full_messages.each do |msg|

ee/app/views/admin/push_rules/show.html.haml

@@ -2,7 +2,7 @@
 - page_title _("Push Rules")
 - @content_class = "limit-container-width" unless fluid_layout
 
-%section.settings.no-animate{ class: ('expanded' if expanded_by_default?) }
+%section.settings.no-animate#js-push-rule-settings{ class: ('expanded' if expanded_by_default?) }
   .settings-header
     %h4
       = _('Push Rules')

ee/spec/features/admin/admin_merge_requests_approvals_spec.rb

@@ -19,7 +19,7 @@ RSpec.describe 'Admin interacts with merge requests approvals settings' do
   end
 
   it 'updates instance-level merge request approval settings and enforces project-level ones', :js do
-    page.within('.merge-request-approval-settings') do
+    page.within('[data-testid="merge-request-approval-settings"]') do
       check 'Prevent approval by author.'
       check 'Prevent approvals by users who add commits.'
       check _('Prevent editing approval rules in projects and merge requests.')