feat(modals): implement duplicate delete confirmation modal and enhance deletion workflow

static/js/components/DuplicatesManager.js

@@ -335,13 +335,28 @@ export class DuplicatesManager {
         }
         
         try {
-            // Show confirmation dialog
-            if (!confirm(`Are you sure you want to delete ${this.selectedForDeletion.size} selected recipes?`)) {
-                return;
+            // Show the delete confirmation modal instead of a simple confirm
+            const duplicateDeleteCount = document.getElementById('duplicateDeleteCount');
+            if (duplicateDeleteCount) {
+                duplicateDeleteCount.textContent = this.selectedForDeletion.size;
             }
             
+            // Use the modal manager to show the confirmation modal
+            modalManager.showModal('duplicateDeleteModal');
+        } catch (error) {
+            console.error('Error preparing delete:', error);
+            showToast('Error: ' + error.message, 'error');
+        }
+    }
+    
+    // Add new method to execute deletion after confirmation
+    async confirmDeleteDuplicates() {
+        try {
             document.body.classList.add('loading');
             
+            // Close the modal
+            modalManager.closeModal('duplicateDeleteModal');
+            
             // Prepare recipe IDs for deletion
             const recipeIds = Array.from(this.selectedForDeletion);
             

static/js/managers/ModalManager.js

@@ -158,6 +158,18 @@ export class ModalManager {
             });
         }
 
+        // Add duplicateDeleteModal registration
+        const duplicateDeleteModal = document.getElementById('duplicateDeleteModal');
+        if (duplicateDeleteModal) {
+            this.registerModal('duplicateDeleteModal', {
+                element: duplicateDeleteModal,
+                onClose: () => {
+                    this.getModal('duplicateDeleteModal').element.classList.remove('show');
+                    document.body.classList.remove('modal-open');
+                }
+            });
+        }
+        
         // Set up event listeners for modal toggles
         const supportToggle = document.getElementById('supportToggleBtn');
         if (supportToggle) {
@@ -221,7 +233,7 @@ export class ModalManager {
         // Store current scroll position before showing modal
         this.scrollPosition = window.scrollY;
 
-        if (id === 'deleteModal' || id === 'excludeModal') {
+        if (id === 'deleteModal' || id === 'excludeModal' || id === 'duplicateDeleteModal') {
             modal.element.classList.add('show');
         } else {
             modal.element.style.display = 'block';

static/js/recipes.js

@@ -390,6 +390,10 @@ class RecipeManager {
     deleteSelectedDuplicates() {
         this.duplicatesManager.deleteSelectedDuplicates();
     }
+
+    confirmDeleteDuplicates() {
+        this.duplicatesManager.confirmDeleteDuplicates();
+    }
     
     exitDuplicateMode() {
         this.duplicatesManager.exitDuplicateMode();