Replace native confirm dialogs with Ladill modal for file deletes.

Use the existing ladillConfirm store on the Files page and x-confirm-dialog on transfer delete so confirmations match the rest of Transfer.

Co-authored-by: Cursor <cursoragent@cursor.com>

resources/js/app.js

@@ -686,9 +686,15 @@ Alpine.data('filesManager', (config = {}) => ({
             this.showToast('Delete files individually. Folder delete is not supported yet.');
             return;
         }
-        if (! confirm(`Delete ${this.selectedFileIds.length} file${this.selectedFileIds.length === 1 ? '' : 's'}? This cannot be undone.`)) {
+        const count = this.selectedFileIds.length;
-            return;
+        const confirmed = await Alpine.store('ladillConfirm').ask({
-        }
+            title: count === 1 ? 'Delete file?' : `Delete ${count} files?`,
+            message: 'This cannot be undone.',
+            confirmLabel: 'Delete',
+            cancelLabel: 'Cancel',
+            variant: 'danger',
+        });
+        if (!confirmed) return;
         this.submitAction(this.routes.bulkDelete);
     },
 

resources/views/transfer/transfers/show.blade.php

@@ -24,11 +24,18 @@
                     · {{ $fmtBytes($transfer->storage_bytes) }} stored · GHS {{ number_format($transfer->monthlyCostGhs(), 2) }}/mo
                 </p>
             </div>
-            <form method="post" action="{{ route('transfer.transfers.destroy', $transfer) }}" onsubmit="return confirm('Delete this transfer and its files?')">
+            <x-confirm-dialog
-                @csrf
+                :name="'delete-transfer-'.$transfer->id"
-                @method('DELETE')
+                title="Delete transfer?"
-                <button type="submit" class="rounded-xl border border-red-200 px-4 py-2 text-sm font-medium text-red-700 hover:bg-red-50">Delete</button>
+                message="Delete this transfer and its files? This cannot be undone."
-            </form>
+                :action="route('transfer.transfers.destroy', $transfer)"
+                method="DELETE"
+                confirm-label="Delete"
+            >
+                <x-slot:trigger>
+                    <button type="button" class="rounded-xl border border-red-200 px-4 py-2 text-sm font-medium text-red-700 hover:bg-red-50">Delete</button>
+                </x-slot:trigger>
+            </x-confirm-dialog>
         </div>
 
         @if(session('success'))