feat(delete): add undo toasts and harden delete modals

static/js/managers/BulkManager.js

@@ -1,5 +1,7 @@
 import { state, getCurrentPageState } from '../state/index.js';
-import { showToast, copyToClipboard, sendLoraToWorkflow, sendEmbeddingToWorkflow, buildLoraSyntax, getNSFWLevelName } from '../utils/uiHelpers.js';
+import { showToast, showActionToast, copyToClipboard, sendLoraToWorkflow, sendEmbeddingToWorkflow, buildLoraSyntax, getNSFWLevelName } from '../utils/uiHelpers.js';
+import { handleUndoDelete } from '../utils/undoHelpers.js';
+import { armDeleteButton } from '../utils/modalUtils.js';
 import { updateCardsForBulkMode } from '../components/shared/ModelCard.js';
 import { modalManager } from './ModalManager.js';
 import { getModelApiClient, resetAndReload } from '../api/modelApiFactory.js';
@@ -628,6 +630,7 @@ export class BulkManager {
         }
 
         modalManager.showModal('bulkDeleteModal');
+        armDeleteButton(document.getElementById('bulkDeleteModal'));
     }
 
     async confirmBulkDelete() {
@@ -649,10 +652,38 @@ export class BulkManager {
                 showToast('toast.api.operationCancelled', {}, 'info');
             } else if (result.success) {
                 const currentConfig = this.getCurrentDisplayConfig();
-                showToast('toast.models.deletedSuccessfully', {
-                    count: result.deleted_count,
-                    type: currentConfig.displayName.toLowerCase()
-                }, 'success');
+                const isRecipes = state.currentPageType === 'recipes';
+                const refreshFn = isRecipes
+                    ? () => window.recipeManager.loadRecipes(true)
+                    : () => resetAndReload(true);
+
+                if (result.batch_id || (result.batch_ids && result.batch_ids.length)) {
+                    // One undo action for the whole bulk action — the backend
+                    // merges staged per-file batches into a single batch, with
+                    // a batch_ids fallback array when the merge failed
+                    const onAction = result.batch_id
+                        ? () => handleUndoDelete(result.batch_id, refreshFn)
+                        : async () => {
+                            for (const id of result.batch_ids) {
+                                const succeeded = await handleUndoDelete(id, null, { showToast: false, refresh: false });
+                                if (!succeeded) {
+                                    showToast('toast.undo.failed', { error: '' }, 'error');
+                                    return;
+                                }
+                            }
+                            refreshFn();
+                            showToast('toast.undo.restored', {}, 'success');
+                        };
+                    showActionToast('toast.undo.deletedBulk', { count: result.deleted_count }, 'success', {
+                        actionText: translate('toast.undo.action'),
+                        onAction,
+                    });
+                } else {
+                    showToast('toast.models.deletedSuccessfully', {
+                        count: result.deleted_count,
+                        type: currentConfig.displayName.toLowerCase()
+                    }, 'success');
+                }
 
                 filePaths.forEach(path => {
                     state.virtualScroller.removeItemByFilePath(path);

static/js/managers/ModalManager.js

@@ -434,6 +434,22 @@ export class ModalManager {
         this.currentOpenModal = id; // Update currently open modal
         document.body.style.top = `-${this.scrollPosition}px`;
         document.body.classList.add('modal-open');
+
+        modal.restoreFocusTo = null;
+        if (this._isDeleteConfirmModal(modal.element)) {
+            const activeElement = document.activeElement;
+            modal.restoreFocusTo = activeElement && activeElement !== document.body
+                ? activeElement
+                : null;
+            modal.element.querySelector('.cancel-btn')?.focus();
+        }
+    }
+
+    // Several non-delete modals share the delete-modal styling class, so an
+    // actual .delete-btn is required before focus is moved to Cancel.
+    _isDeleteConfirmModal(element) {
+        return element.classList.contains('delete-modal') &&
+            Boolean(element.querySelector('.delete-btn'));
     }
 
     closeModal(id) {
@@ -463,6 +479,13 @@ export class ModalManager {
             modal.cleanupCallback();
             modal.cleanupCallback = null;
         }
+
+        if (modal.restoreFocusTo) {
+            if (modal.restoreFocusTo.isConnected) {
+                modal.restoreFocusTo.focus();
+            }
+            modal.restoreFocusTo = null;
+        }
     }
 
     handleEscape(e) {