1 files changed, 10 insertions, 9 deletions
diff --git a/app/assets/javascripts/admin/users/components/actions/unban.vue b/app/assets/javascripts/admin/users/components/actions/unban.vue
index 8083e26177e..beede2d37d7 100644
--- a/app/assets/javascripts/admin/users/components/actions/unban.vue
+++ b/app/assets/javascripts/admin/users/components/actions/unban.vue
@@ -1,6 +1,7 @@
 <script>
 import { GlDropdownItem } from '@gitlab/ui';
 import { sprintf, s__, __ } from '~/locale';
+import eventHub, { EVENT_OPEN_CONFIRM_MODAL } from '~/vue_shared/components/confirm_modal_eventhub';
 import { I18N_USER_ACTIONS } from '../../constants';
 
 // TODO: To be replaced with <template> content in https://gitlab.com/gitlab-org/gitlab/-/issues/320922
@@ -22,12 +23,12 @@ export default {
       required: true,
     },
   },
-  computed: {
-    modalAttributes() {
-      return {
-        'data-path': this.path,
-        'data-method': 'put',
-        'data-modal-attributes': JSON.stringify({
+  methods: {
+    onClick() {
+      eventHub.$emit(EVENT_OPEN_CONFIRM_MODAL, {
+        path: this.path,
+        method: 'put',
+        modalAttributes: {
           title: sprintf(s__('AdminUsers|Unban user %{username}?'), {
             username: this.username,
           }),
@@ -39,15 +40,15 @@ export default {
             attributes: [{ variant: 'confirm' }],
           },
           messageHtml,
-        }),
-      };
+        },
+      });
     },
   },
 };
 </script>
 
 <template>
-  <gl-dropdown-item button-class="js-confirm-modal-button" v-bind="{ ...modalAttributes }">
+  <gl-dropdown-item @click="onClick">
     <slot></slot>
   </gl-dropdown-item>
 </template>