Bulk deletion of Transaction not working.

[Izhan-07]

I tried deleting multiple transactions by selecting them and using "Delete Selected". The system shows the message "Transactions deleted successfully", but the transactions are not actually removed. i have double checked it on the Supabase transactions table. However, when I delete a transaction individually, it works correctly.

I cloned your repository, so this issue shouldn’t be from my side. I also checked your tutorial video, and the same problem happens there as well — the success message appears, but the selected transactions are not deleted. Could you please look into this?

[VISHALGUPTA100803]

just use this it will work
const [deletedIdsForToast, setDeletedIdsForToast] = useState([]);
const {
data: deleted,
loading: deleteLoading,
fn: deleteFn,
error: deleteError,
} = useFetch(bulkDeleteTransaction);

const handleBulkDelete = async () => {
if (
!window.confirm(
Are you sure you want to delete ${selectedIds.length} transactions?
)
) {
return;
}
setDeletedIdsForToast(selectedIds); // only for toast
deleteFn(selectedIds);
};

useEffect(() => {
if (!deleteLoading && deleted && deletedIdsForToast.length > 0) {
toast.success(
deletedIdsForToast.length === 1
? "Transaction deleted successfully"
: ${deletedIdsForToast.length} transactions deleted successfully
);
setDeletedIdsForToast([]); // reset after showing toast

  // Remove deleted IDs from selectedIds 
  setSelectedIds((current) =>
    current.filter((id) => !deletedIdsForToast.includes(id))
  );
}

if (!deleteLoading && deleteError) {
  toast.error(deleteError.message || "Failed to delete transaction(s)");
}

}, [deleted, deleteLoading, deleteError, deletedIdsForToast]);

for delete button of dropdown on click should be
onClick={async () => {
setDeletedIdsForToast([transaction.id]);
deleteFn([transaction.id]);
}}