From 90cb147938b6aab92829fa6be32272034a42150e Mon Sep 17 00:00:00 2001
From: Andy Lee <andy.lee@suse.com>
Date: Wed, 18 Jun 2025 15:03:57 +0800
Subject: [PATCH] Align settings page actionMenu style with other pages (#342)

* Align settings page actionMeun with other pages

Signed-off-by: Andy Lee <andy.lee@suse.com>

* update based on PR feedback

Signed-off-by: Andy Lee <andy.lee@suse.com>

---------

Signed-off-by: Andy Lee <andy.lee@suse.com>
---
 pkg/harvester/components/SettingList.vue | 26 ++++++++----------------
 1 file changed, 8 insertions(+), 18 deletions(-)

diff --git a/pkg/harvester/components/SettingList.vue b/pkg/harvester/components/SettingList.vue
index 54623eb9..ffb3c2cb 100644
--- a/pkg/harvester/components/SettingList.vue
+++ b/pkg/harvester/components/SettingList.vue
@@ -1,5 +1,6 @@
 <script>
 import { mapGetters } from 'vuex';
+import ActionMenu from '@shell/components/ActionMenuShell';
 import { Banner } from '@components/Banner';
 import AsyncButton from '@shell/components/AsyncButton';
 import { HCI_ALLOWED_SETTINGS, HCI_SETTING } from '../config/settings';
@@ -19,6 +20,7 @@ export default {
   components: {
     AsyncButton,
     Banner,
+    ActionMenu
   },
 
   props: {
@@ -151,15 +153,6 @@ export default {
       return id ? this.$store.getters['harvester-common/getFeatureEnabled'](id) : true;
     },
 
-    showActionMenu(e, setting) {
-      const actionElement = e.srcElement;
-
-      this.$store.commit(`action-menu/show`, {
-        resources: setting.data,
-        elem:      actionElement
-      });
-    },
-
     getSettingOption(id) {
       return HCI_ALLOWED_SETTINGS.find((setting) => setting.id === id);
     },
@@ -238,15 +231,12 @@ export default {
           :id="setting.id"
           class="action"
         >
-          <button
-            aria-haspopup="true"
-            aria-expanded="false"
-            type="button"
-            class="btn btn-sm role-multi-action actions"
-            @click="showActionMenu($event, setting)"
-          >
-            <i class="icon icon-actions" />
-          </button>
+          <ActionMenu
+            :resource="setting.data"
+            :button-aria-label="t('advancedSettings.edit.label')"
+            data-testid="action-button"
+            button-role="tertiary"
+          />
         </div>
       </div>
       <div value>