diff --git a/resources/js/components/transactions/bulk-actions-bar.tsx b/resources/js/components/transactions/bulk-actions-bar.tsx index 94501eb6..1db5c138 100644 --- a/resources/js/components/transactions/bulk-actions-bar.tsx +++ b/resources/js/components/transactions/bulk-actions-bar.tsx @@ -15,7 +15,6 @@ import { TooltipProvider, TooltipTrigger, } from '@/components/ui/tooltip'; -import { isAdmin } from '@/hooks/use-admin'; import { type Category } from '@/types/category'; import { type Label } from '@/types/label'; import { __ } from '@/utils/i18n'; @@ -60,8 +59,6 @@ export function BulkActionsBar({ return null; } - const isDeleteEnabled = isAdmin(); - const displayCount = isSelectingAll ? totalFilteredCount : selectedCount; const canSelectAll = !isSelectingAll && @@ -149,15 +146,13 @@ export function BulkActionsBar({ {__('Re-evaluate rules')} - {isDeleteEnabled && ( - - - {__('Delete')} - - )} + + + {__('Delete')} + diff --git a/resources/js/pages/transactions/index.tsx b/resources/js/pages/transactions/index.tsx index fb5756d1..1e00f2c3 100644 --- a/resources/js/pages/transactions/index.tsx +++ b/resources/js/pages/transactions/index.tsx @@ -47,6 +47,15 @@ import { import { DataTable } from '@/components/ui/data-table'; import { DataTablePagination } from '@/components/ui/data-table-pagination'; import { DataTableViewOptions } from '@/components/ui/data-table-view-options'; +import { + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle, +} from '@/components/ui/dialog'; +import { Input } from '@/components/ui/input'; import { Skeleton } from '@/components/ui/skeleton'; import { Spinner } from '@/components/ui/spinner'; import { TableCell, TableRow } from '@/components/ui/table'; @@ -393,6 +402,7 @@ export default function Transactions({ const [deleteTransaction, setDeleteTransaction] = useState(null); const [isBulkDeleteMode, setIsBulkDeleteMode] = useState(false); + const [bulkDeleteConfirmation, setBulkDeleteConfirmation] = useState(''); const [isDeleting, setIsDeleting] = useState(false); const [isBulkDeleting, setIsBulkDeleting] = useState(false); const [isBulkUpdating, setIsBulkUpdating] = useState(false); @@ -1466,6 +1476,7 @@ export default function Transactions({ ); setDeleteTransaction(null); setIsBulkDeleteMode(false); + setBulkDeleteConfirmation(''); setRowSelection({}); setRefreshKey((prev) => prev + 1); @@ -1771,11 +1782,10 @@ export default function Transactions({ /> { if (!open) { setDeleteTransaction(null); - setIsBulkDeleteMode(false); } }} > @@ -1783,38 +1793,86 @@ export default function Transactions({ {__('Delete Transaction')} - - {isBulkDeleteMode ? 's' : ''} - {isBulkDeleteMode - ? `Are you sure you want to delete ${selectedCount} transactions? This action cannot be undone.` - : 'Are you sure you want to delete this transaction? This action cannot be undone.'} + {__( + 'Are you sure you want to delete this transaction? This action cannot be undone.', + )} - + {__('Cancel')} - {isDeleting || isBulkDeleting - ? 'Deleting...' - : 'Delete'} + {isDeleting ? __('Deleting...') : __('Delete')} + { + if (!open) { + setDeleteTransaction(null); + setIsBulkDeleteMode(false); + setBulkDeleteConfirmation(''); + } + }} + > + + + {__('Delete Transactions')} + + {__( + 'This action cannot be undone. To confirm, type', + )}{' '} + + delete {selectedCount} transactions + + + + + setBulkDeleteConfirmation(e.target.value) + } + placeholder={`delete ${selectedCount} transactions`} + disabled={isBulkDeleting} + autoFocus + /> + + + + + + +