feat(web): add payments list screen on the live payments api - #294
Merged
Conversation
Add a payments screen to the sandbox dashboard, listing payments newest first on GET /v1/payments with pagination and the usual loading, empty and error states. It mirrors the accounts screen: a TanStack Query hook over the shared api client, a typed PaymentResponse matching the backend contract, a status pill, a formatted amount, and a sidebar entry. The amount is typed as a number to match the payments serialization. All data comes from the API. Closes #289
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
1 participant
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.
E-08 Sandbox UI #289b (F-08.7b) - closes #289. The payments dashboard screen on the GET /v1/payments list added in #289a.
What
A read-only paged payments list, mirroring the merged accounts screen:
features/payments/usePayments(TanStack Query, GET /v1/payments?page=&size= -> PageResponse),PaymentsTable(Payment ID / Reference / Amount / Status),PaymentStatusPill(exhaustive Record over the 6 PaymentStatus values).routes/Payments.tsxpaged like Accounts (Pagination noun=payments + loading/empty/error+retry).api/types.ts:PaymentStatusunion +PaymentResponse {id, reference, amount, currency, status}./payments+ Sidebar Payments entry. 6 vitest tests (loading / rows / empty+disabled-next / error-retry / paginate / nav-active).Source-verified contract
PaymentStatus= INITIATED/SCREENING/SUBMITTED/SETTLED/FAILED/CANCELLED (exact).amounttyped number: paymentsPaymentResponse.amount(BigDecimal) has noMoneyAmountSerializerand there is no global Jackson config, so it serializes as a JSON number (the ledger differs - it uses MoneyAmountSerializer -> string). Matched to the actual payments contract. Follow-up noted: payments money serialization is inconsistent with ledger; a small backend slice could add the serializer for cross-service consistency (out of scope for this UI slice).Gate chain
Web gates green: lint 0 errors, typecheck, vitest 56 passed (6 new), build.
Closes #289