From d173febd0f2c03e2191038e5c786a9474f84bb65 Mon Sep 17 00:00:00 2001
From: Sascha Eggenberger <seggenberger@gitlab.com>
Date: Thu, 18 Jul 2024 15:14:02 +0200
Subject: [PATCH] Add approval rule: Move action buttons to content

Changelog: changed
---
 .../components/rule_drawer/create_rule.vue    | 31 ++++++++++---------
 .../rule_drawer/create_rule_spec.js           |  5 ++-
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/ee/app/assets/javascripts/approvals/components/rule_drawer/create_rule.vue b/ee/app/assets/javascripts/approvals/components/rule_drawer/create_rule.vue
index 5890c5c396400b63..b407f5253a7afa20 100644
--- a/ee/app/assets/javascripts/approvals/components/rule_drawer/create_rule.vue
+++ b/ee/app/assets/javascripts/approvals/components/rule_drawer/create_rule.vue
@@ -77,20 +77,7 @@ export default {
       <h2 class="gl-mt-0 gl-text-size-h2">{{ title }}</h2>
     </template>
 
-    <template #header>
-      <gl-button
-        variant="confirm"
-        data-testid="save-approval-rule-button"
-        :loading="isLoading"
-        @click="submit"
-      >
-        {{ $options.I18N.saveChanges }}
-      </gl-button>
-      <gl-button variant="confirm" category="secondary" @click="$emit('close')">
-        {{ $options.I18N.cancel }}
-      </gl-button>
-    </template>
-    <template #default>
+    <div>
       <rule-form
         ref="form"
         :init-rule="rule"
@@ -99,6 +86,20 @@ export default {
         :default-rule-name="defaultRuleName"
         v-on="$listeners"
       />
-    </template>
+
+      <div class="gl-flex gl-gap-3">
+        <gl-button
+          variant="confirm"
+          data-testid="save-approval-rule-button"
+          :loading="isLoading"
+          @click="submit"
+        >
+          {{ $options.I18N.saveChanges }}
+        </gl-button>
+        <gl-button variant="confirm" category="secondary" @click="$emit('close')">
+          {{ $options.I18N.cancel }}
+        </gl-button>
+      </div>
+    </div>
   </gl-drawer>
 </template>
diff --git a/ee/spec/frontend/approvals/components/rule_drawer/create_rule_spec.js b/ee/spec/frontend/approvals/components/rule_drawer/create_rule_spec.js
index b9141ef5c8c7a4d5..7bbc70f5f0234dae 100644
--- a/ee/spec/frontend/approvals/components/rule_drawer/create_rule_spec.js
+++ b/ee/spec/frontend/approvals/components/rule_drawer/create_rule_spec.js
@@ -36,7 +36,10 @@ describe('Approvals DrawerRuleCreate', () => {
 
     wrapper = shallowMountExtended(DrawerRuleCreate, {
       store: new Vuex.Store(store),
-      stubs: { RuleForm: RuleFormStub },
+      stubs: {
+        RuleForm: RuleFormStub,
+        GlDrawer,
+      },
       propsData,
     });
   };
-- 
GitLab