Replace del btn with CInputConfirm

cortezaproject · Jul 6, 2023 · 76cf113 · 76cf113
1 parent 48793ef
commit 76cf113
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 14 deletions.
diff --git a/client/web/admin/src/components/CRolePicker.vue b/client/web/admin/src/components/CRolePicker.vue
@@ -32,13 +32,11 @@
       >
         <b-col>{{ getRoleLabel(role) }}</b-col>
         <b-col class="text-right">
-          <b-button
+          <c-input-confirm
             data-test-id="button-remove-role"
-            variant="link"
-            @click="removeRole(role)"
-          >
-            <font-awesome-icon :icon="['far', 'trash-alt']" />
-          </b-button>
+            no-prompt
+            @confirmed="removeRole(role)"
+          />
         </b-col>
       </b-row>
     </b-container>
@@ -48,14 +46,16 @@
 <script>
 import { debounce } from 'lodash'
 import { VueSelect } from 'vue-select'
-
+import { components } from '@cortezaproject/corteza-vue/'
+const { CInputConfirm } = components
 function roleSorter (a, b) {
   return `${a.name} ${a.handle} ${a.roleID}`.localeCompare(`${b.name} ${b.handle} ${b.roleID}`)
 }
 
 export default {
   components: {
     VueSelect,
+    CInputConfirm,
   },
 
   props: {

diff --git a/client/web/admin/src/components/Role/CRoleEditorMembers.vue b/client/web/admin/src/components/Role/CRoleEditorMembers.vue
@@ -36,14 +36,11 @@
             >
               <td>{{ getUserLabel(user) }}</td>
               <td class="text-right">
-                <b-button
+                <c-input-confirm
                   data-test-id="button-remove-member"
-                  variant="link"
-                  class="text-danger pr-0"
-                  @click="removeMember(user.userID)"
-                >
-                  {{ $t('remove') }}
-                </b-button>
+                  no-prompt
+                  @confirmed="removeMember(user.userID)"
+                />
               </td>
             </tr>
           </tbody>
@@ -72,6 +69,8 @@
 import { debounce } from 'lodash'
 import { VueSelect } from 'vue-select'
 import CSubmitButton from 'corteza-webapp-admin/src/components/CSubmitButton'
+import { components } from '@cortezaproject/corteza-vue/'
+const { CInputConfirm } = components
 
 export default {
   i18nOptions: {
@@ -82,6 +81,7 @@ export default {
   components: {
     CSubmitButton,
     VueSelect,
+    CInputConfirm,
   },
 
   props: {