feat: Ask to confirm with name before inbox/team deletion (#2370)

app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue

@@ -106,14 +106,16 @@
       :inbox="selectedInbox"
     />
 
-    <woot-delete-modal
+    <woot-confirm-delete-modal
       :show.sync="showDeletePopup"
-      :on-close="closeDelete"
-      :on-confirm="confirmDeletion"
       :title="$t('INBOX_MGMT.DELETE.CONFIRM.TITLE')"
-      :message="deleteMessage"
+      :message="confirmDeleteMessage"
       :confirm-text="deleteConfirmText"
       :reject-text="deleteRejectText"
+      :confirm-value="selectedInbox.name"
+      :confirm-place-holder-text="confirmPlaceHolderText"
+      @on-confirm="confirmDeletion"
+      @on-close="closeDelete"
     />
   </div>
 </template>
@@ -153,11 +155,16 @@ export default {
         this.selectedInbox.name
       }`;
     },
-    deleteMessage() {
+    confirmDeleteMessage() {
       return `${this.$t('INBOX_MGMT.DELETE.CONFIRM.MESSAGE')} ${
         this.selectedInbox.name
       } ?`;
     },
+    confirmPlaceHolderText() {
+      return `${this.$t('INBOX_MGMT.DELETE.CONFIRM.PLACE_HOLDER', {
+        inboxName: this.selectedInbox.name,
+      })}`;
+    },
   },
   methods: {
     openSettings(inbox) {

app/javascript/dashboard/routes/dashboard/settings/teams/Index.vue

@@ -63,15 +63,16 @@
         />
       </div>
     </div>
-
-    <woot-delete-modal
+    <woot-confirm-delete-modal
       :show.sync="showDeletePopup"
-      :on-close="closeDelete"
-      :on-confirm="confirmDeletion"
-      :title="deleteTitle"
+      :title="confirmDeleteTitle"
       :message="$t('TEAMS_SETTINGS.DELETE.CONFIRM.MESSAGE')"
       :confirm-text="deleteConfirmText"
       :reject-text="deleteRejectText"
+      :confirm-value="selectedTeam.name"
+      :confirm-place-holder-text="confirmPlaceHolderText"
+      @on-confirm="confirmDeletion"
+      @on-close="closeDelete"
     />
   </div>
 </template>
@@ -105,11 +106,16 @@ export default {
     deleteRejectText() {
       return this.$t('TEAMS_SETTINGS.DELETE.CONFIRM.NO');
     },
-    deleteTitle() {
+    confirmDeleteTitle() {
       return this.$t('TEAMS_SETTINGS.DELETE.CONFIRM.TITLE', {
         teamName: this.selectedTeam.name,
       });
     },
+    confirmPlaceHolderText() {
+      return `${this.$t('TEAMS_SETTINGS.DELETE.CONFIRM.PLACE_HOLDER', {
+        teamName: this.selectedTeam.name,
+      })}`;
+    },
   },
   methods: {
     async deleteTeam({ id }) {