whisper-money/resources/js/components
Víctor Falcón 4b5d65ba03
feat: add transaction labels feature (#24)
## Summary

Add a labeling system for transactions that differs from categories in
that labels are ephemeral and created on-the-fly when assigned (no
pre-creation required). A transaction can have multiple labels
(many-to-many relationship), and labels can be used for filtering in the
transaction table and as actions in automation rules.

<img width="1372" height="484" alt="image"
src="https://github.com/user-attachments/assets/fd342b11-dafb-44ed-b818-578e1ea856e6"
/>
<img width="1373" height="613" alt="image"
src="https://github.com/user-attachments/assets/aa5cfb8b-50b7-4101-a872-54904924f234"
/>
<img width="1035" height="594" alt="image"
src="https://github.com/user-attachments/assets/ffa946b2-b01f-496b-8cb8-ab55ab5b79ed"
/>


## Changes

### Backend (Laravel)

- Add `labels` table with user_id, name, color, and soft deletes
- Add `label_transaction` pivot table for transaction-label many-to-many
- Add `automation_rule_labels` pivot table for automation rule-label
many-to-many
- Create Label model with relationships to User, Transaction, and
AutomationRule
- Add LabelController for CRUD operations (returns JSON for on-the-fly
creation)
- Add LabelSyncController for frontend sync
- Add LabelPolicy for authorization
- Update TransactionController to handle bulk label updates
- Update AutomationRuleController to handle label actions
- Add validation for label_ids in transactions and automation rules

### Frontend (React/TypeScript)

- Add Label type and color utilities
- Add labels table to IndexedDB (Dexie version 6)
- Create label-sync service with findOrCreate functionality
- Create LabelCombobox component with multi-select and create-on-type
- Add labels column to transactions table
- Add labels filter to transaction filters
- Add bulk label assignment in bulk actions bar
- Add labels action in create automation rule dialog
- Update rule engine to include labels in evaluation results

## Testing

- 11 feature tests for label CRUD
- 3 tests for label sync
- All 241 feature tests pass

## Screenshots

N/A - UI changes can be reviewed in browser
2025-12-13 13:02:19 +01:00
..
accounts Add transaction selection to import preview (#25) 2025-12-13 12:41:18 +01:00
automation-rules feat: add transaction labels feature (#24) 2025-12-13 13:02:19 +01:00
categories Add category type field support (#2) 2025-12-01 20:19:47 +01:00
dashboard Add tooltipSide prop to trend indicators to prevent overlap with balance button 2025-12-10 13:11:22 +01:00
icons Subscriptions (#15) 2025-12-06 19:09:56 +01:00
labels feat: add transaction labels feature (#24) 2025-12-13 13:02:19 +01:00
onboarding feat: add transaction labels feature (#24) 2025-12-13 13:02:19 +01:00
partials Improve header responsive behavior and refactor class names with cn utility 2025-12-06 20:44:37 +01:00
shared feat: add transaction labels feature (#24) 2025-12-13 13:02:19 +01:00
transactions feat: add transaction labels feature (#24) 2025-12-13 13:02:19 +01:00
ui Refactor transaction UI components for better responsive layout and consistency 2025-12-10 13:28:45 +01:00
alert-error.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
app-content.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
app-logo-icon.tsx Add animated logo icon that transitions based on encryption key state 2025-12-12 11:24:42 +01:00
app-logo.tsx Add animated logo icon that transitions based on encryption key state 2025-12-12 11:24:42 +01:00
app-mobile-nav.tsx Mobile design (#17) 2025-12-08 15:43:09 +01:00
app-shell.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
app-sidebar-header.tsx Format + Open transactions on row click 2025-12-08 15:58:50 +01:00
app-sidebar.tsx Format + Open transactions on row click 2025-12-08 15:58:50 +01:00
appearance-dropdown.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
appearance-tabs.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
breadcrumbs.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
delete-user.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
encrypted-text.tsx fix: make encryption key storage SSR-safe to prevent 502 errors 2025-12-08 17:13:45 +01:00
encryption-key-button.tsx feat: Update encryption key button icon based on state 2025-11-07 20:20:09 +00:00
heading-small.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
heading.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
icon.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
input-error.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
nav-footer.tsx Subscriptions (#15) 2025-12-06 19:09:56 +01:00
nav-main.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
nav-user.tsx Format + Open transactions on row click 2025-12-08 15:58:50 +01:00
pending-operations-dialog.tsx Add pending operations dialog and improve sync status UI (#16) 2025-12-06 21:54:11 +01:00
sync-status-button.tsx Add pending operations dialog and improve sync status UI (#16) 2025-12-06 21:54:11 +01:00
text-link.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
two-factor-recovery-codes.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
two-factor-setup-modal.tsx Set up a fresh Laravel app 2025-11-07 12:01:36 +00:00
unlock-message-dialog.tsx Add encryption key management features 2025-11-07 16:10:56 +00:00
user-info.tsx Format + Open transactions on row click 2025-12-08 15:58:50 +01:00
user-menu-content.tsx Accounts: Allow users to create custom banks with his own logo, and name (#12) 2025-12-04 15:24:04 +01:00