whisper-money/resources/js/components/transactions
Víctor Falcón 89174af4e6
feat(transactions): add delete button to the transaction edit modal (#697)
## Why

Until now the only way to delete a transaction was the row's three-dots
menu in the list. Many users click a transaction to open the edit modal
and look for a delete option there — but there wasn't one. This adds a
**Delete** button inside the edit modal, with the same confirmation
step.

## What

- Adds a destructive **Delete** button to the transaction edit modal
footer (`edit-transaction-dialog.tsx`), shown only in **edit** mode.
- Clicking it closes the modal and opens the **existing**
delete-confirmation dialog — the same `AlertDialog` (and manual-account
"update balance" checkbox) already used by the three-dots menu. No new
delete logic, confirmation UI, or copy was introduced.
- Wired via a new optional `onDelete` prop, passed as
`setDeleteTransaction` from the two parents that render the edit modal
(`transaction-list.tsx`, `pages/transactions/index.tsx`). Because
`transaction-list` also backs the Accounts and Budgets pages, the button
appears consistently everywhere the edit modal opens.

## Reviews applied

Ran technical + product reviews on the diff. Applied: added
`dark:hover:bg-destructive/20` to match the sibling delete button's
dark-mode hover. Dropped (with reason): premature shared-component
extraction, pre-existing cross-file duplication, and pre-existing "no
toast on delete failure" — all out of scope for this change.

## QA

Real browser QA (Playwright) against the running app on real data:

- Delete button appears in the edit modal (verified on an imported
transaction).
- Delete → confirmation dialog opens and the edit modal closes.
- **Cancel** returns to the list; page stays fully interactive (`body`
pointer-events `auto` — no stuck Radix scroll-lock).
- **Confirm** removes the row from the list and soft-deletes it in the
DB (verified `deleted_at` was set). Restored afterward.
- Page remains interactive after the stacked-dialog flow (reopened
another transaction cleanly).

Unit tests added in `edit-transaction-dialog.test.tsx` cover: click
delegates to `onDelete` + closes the modal; button hidden without a
handler; button hidden in create mode.

## Demo


https://github.com/user-attachments/assets/e13dad30-0779-46f2-8cc4-84ea70568741
2026-07-18 11:03:09 +00:00
..
ai-upsell-sample.test.ts AI auto-categorization: open to pro + consent, nudge free users (#561) 2026-06-19 14:08:40 +00:00
ai-upsell-sample.ts AI auto-categorization: open to pro + consent, nudge free users (#561) 2026-06-19 14:08:40 +00:00
bulk-actions-bar.tsx Fix label creation dropdown refresh (#363) 2026-05-07 10:26:43 +01:00
bulk-category-select.tsx feat: Spanish localization (#74) 2026-02-08 11:58:08 +01:00
bulk-label-select.tsx Fix label creation dropdown refresh (#363) 2026-05-07 10:26:43 +01:00
categorizer-card.tsx feat(categorize): show debtor and creditor names (#454) 2026-05-30 12:27:59 +02:00
categorizer-command.tsx feat: parent/child category tree (#474) 2026-06-03 19:30:12 +02:00
category-cell.tsx feat(ai): learn from category corrections so the AI stops repeating the same mistake (#608) 2026-06-29 19:12:15 +02:00
category-select.tsx feat(shared): Add CategoryCombobox component 2025-11-14 16:05:53 +01:00
edit-transaction-dialog.test.tsx feat(transactions): add delete button to the transaction edit modal (#697) 2026-07-18 11:03:09 +00:00
edit-transaction-dialog.tsx feat(transactions): add delete button to the transaction edit modal (#697) 2026-07-18 11:03:09 +00:00
import-step-account.test.tsx Fix transaction importer account preselect (#396) 2026-05-14 12:38:44 +02:00
import-step-account.tsx Fix transaction importer account preselect (#396) 2026-05-14 12:38:44 +02:00
import-step-mapping.tsx fix(balances): allow saving a zero balance (#664) 2026-07-10 15:02:38 +02:00
import-step-preview.tsx feat(transactions): serve import dedup and account ledger from the backend (#631) 2026-07-03 16:49:59 +02:00
import-step-upload.test.tsx Fix transaction importer account preselect (#396) 2026-05-14 12:38:44 +02:00
import-step-upload.tsx Fix transaction importer account preselect (#396) 2026-05-14 12:38:44 +02:00
import-transactions-button.tsx refactor(encryption): strip client-side transaction encryption (#514) 2026-06-20 16:13:26 +00:00
import-transactions-drawer.tsx feat(transactions): serve import dedup and account ledger from the backend (#631) 2026-07-03 16:49:59 +02:00
saved-filters.tsx fix(transactions): keep saved-filter delete button visible on touch and confirm before deleting (#648) 2026-07-06 09:37:38 +00:00
transaction-actions-menu.test.tsx feat(transactions): release transaction analysis to all users (#579) 2026-06-22 16:09:09 +02:00
transaction-actions-menu.tsx feat(transactions): release transaction analysis to all users (#579) 2026-06-22 16:09:09 +02:00
transaction-analysis-drawer.test.tsx feat(analysis): shared bar-list breakdowns in transaction drawer (#517) 2026-06-10 12:36:20 +02:00
transaction-analysis-drawer.tsx feat(analysis): shared bar-list breakdowns in transaction drawer (#517) 2026-06-10 12:36:20 +02:00
transaction-columns.test.tsx fix(transactions): pad Category column when Date column is hidden (#584) 2026-06-22 16:51:50 +00:00
transaction-columns.tsx fix(transactions): let date column size to its content (#610) 2026-06-29 15:51:51 +00:00
transaction-description.test.tsx refactor(encryption): strip client-side transaction encryption (#514) 2026-06-20 16:13:26 +00:00
transaction-description.tsx refactor(encryption): strip client-side transaction encryption (#514) 2026-06-20 16:13:26 +00:00
transaction-filters.test.tsx feat(transactions): reorder filters and switch accounts to a logo dropdown (#598) 2026-06-26 20:09:02 +02:00
transaction-filters.tsx feat(transactions): reorder filters and switch accounts to a logo dropdown (#598) 2026-06-26 20:09:02 +02:00
transaction-list.test.tsx fix(accounts): remove double-skeleton flash on account show (#634) 2026-07-03 15:56:49 +00:00
transaction-list.tsx feat(transactions): add delete button to the transaction edit modal (#697) 2026-07-18 11:03:09 +00:00