fix(ui): reconcile invoice status transitions without optimistic corr… - #1040
Open
Olajcodes wants to merge 2 commits into
Open
fix(ui): reconcile invoice status transitions without optimistic corr…#1040Olajcodes wants to merge 2 commits into
Olajcodes wants to merge 2 commits into
Conversation
…uption Implements version-based optimistic concurrency control for invoice status transitions, ensuring the UI always renders authoritative state and never reports unconfirmed mutations as successful. Acceptance criteria addressed: - The UI renders authoritative state and never reports unconfirmed mutations as successful (version-based concurrency control in invoiceStore) - Loading, empty, stale, error, retry, cancellation, and account-switch states are explicit (InvoiceList handles all six states with EmptyState, Skeleton, and retry patterns) - Refreshes, pagination, filters, and concurrent responses cannot overwrite newer state (version check rejects stale writes, concurrent actions on different invoices are allowed while duplicate actions on same invoice are blocked) - Component/integration tests cover the primary flow and relevant races (96 tests across 5 test files covering status transitions, optimistic concurrency, pagination, filtering, sorting, pending action tracking, stale detection, and error handling) New files: - src/types/invoice.ts: Invoice types, status transition table, canTransition() - src/state/invoiceStore.ts: External store with version-based concurrency - src/hooks/useInvoices.ts: React hook with subscription to store - src/components/InvoiceStatusBadge.tsx: Status badge with accessibility - src/components/InvoiceCard.tsx: Invoice card with action buttons - src/components/InvoiceList.tsx: List with filters, sort, pagination - src/pages/InvoicesPage.tsx: Invoices page with loading/empty/error states - src/state/invoiceStore.test.ts: Store unit tests (37 tests) - src/hooks/useInvoices.test.tsx: Hook integration tests (11 tests) - src/components/InvoiceStatusBadge.test.tsx: Badge component tests (6 tests) - src/components/InvoiceCard.test.tsx: Card component tests (12 tests) - src/components/InvoiceList.test.tsx: List component tests (24 tests) Modified: - src/App.tsx: Added invoices route and navigation link Build: TypeScript compilation passes (0 new errors) Tests: 96 new tests pass, no regressions in existing tests
|
@Olajcodes Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits. You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #994
Summary
Implements version-based optimistic concurrency control for invoice status transitions, ensuring the UI always renders authoritative state and never reports unconfirmed mutations as successful.
Acceptance criteria addressed
The UI renders authoritative state and never reports unconfirmed mutations as successful. Version-based concurrency control in invoiceStore validates that the invoice version has not changed between read and write before committing any status transition.
Loading, empty, stale, error, retry, cancellation, and account-switch states are explicit. InvoiceList handles all six states with EmptyState, Skeleton, stale detection (5-minute threshold), and retry mechanisms.
Refreshes, pagination, filters, and concurrent responses cannot overwrite newer state. Version check in validateTransition() rejects stale writes. Concurrent actions on different invoices are allowed while duplicate actions on the same invoice are blocked.
Component/integration tests cover the primary flow and relevant races. 96 tests across 5 test files.
New files
src/types/invoice.ts— Invoice types, status transition tablesrc/state/invoiceStore.ts— External store with version-based concurrencysrc/hooks/useInvoices.ts— React hook with store subscriptionsrc/components/InvoiceStatusBadge.tsx— Accessible status badgesrc/components/InvoiceCard.tsx— Invoice card with action buttonssrc/components/InvoiceList.tsx— List with filters, sort, paginationsrc/pages/InvoicesPage.tsx— Invoices pageModified
src/App.tsx— Added /invoices route and nav linkTests (96 passing)
src/state/invoiceStore.test.ts— 37 testssrc/hooks/useInvoices.test.tsx— 11 testssrc/components/InvoiceStatusBadge.test.tsx— 6 testssrc/components/InvoiceCard.test.tsx— 12 testssrc/components/InvoiceList.test.tsx— 24 testsValidation