feat(settlements): partial settlement history timeline on invoice detail (#478)

[solomonadzape95]

Summary

Implements #478 — a partial-settlement history timeline on the invoice detail page. It lists every interim and final payment the issuer has made, with each entry's date, amount, running cumulative total and remaining balance, a repayment progress bar, and a Settled badge on the payment that closes the invoice.

Changes

• Timeline domain (lib/settlementTimeline.ts) — orders get_interim_payments rows oldest-first, computes the running cumulative and remaining balance, clamps overpayments, derives the repayment percentage, and identifies the final settlement entry (contract is_final flag, settled status, or a cleared balance).
• Contract read (lib/api/index.ts, hooks/useInterimPayments.ts) — fetchInterimPayments(invoiceId) for the read-only get_interim_payments query, exposed through a hook keyed by invoice id.
• SettlementTimeline (components/invoices/SettlementTimeline.tsx) — top progress bar (% repaid, paid-of-total, remaining), a vertical ledger of payments, a green Settled badge on the closing entry, plus loading / error / empty states. Entry metadata uses a 2-column grid that becomes 3 columns on larger screens so amounts stay readable on mobile.
• Placement (components/invoices/InvoiceDetailView.tsx) — rendered below the invoice financials (the stats card) for funded and settled invoices.

Acceptance criteria

• All payment entries display correct date, amount, and cumulative total
• Progress bar reflects accurate repayment percentage
• Final settlement entry correctly badged as 'Settled'
• Timeline shows empty state when no payments have been made
• Timeline responsive on mobile with readable entry layout

Testing

New coverage (22 tests):

• lib/__tests__/settlementTimeline.test.ts — ordering, cumulative/remaining maths, partial vs final settlement, overpayment clamping, zero/invalid inputs, formatting
• hooks/__tests__/useInterimPayments.test.tsx — fetch by invoice id, cache key, idle without an id, error propagation
• components/invoices/__tests__/SettlementTimeline.test.tsx — entries, progress, Settled badge, empty/loading/error states
• components/invoices/__tests__/InvoiceDetailView.settlementTimeline.test.tsx — shown for funded/settled, hidden for open

Targeted run: npx vitest run lib/__tests__/settlementTimeline.test.ts hooks/__tests__/useInterimPayments.test.tsx components/invoices/__tests__/SettlementTimeline.test.tsx components/invoices/__tests__/InvoiceDetailView.settlementTimeline.test.tsx → 22 passed (26 including the existing detail-view tests).

Also removed the duplicated CompareToggleButton import in components/marketplace/invoice-card.tsx, a syntax error already on dev that prevented the invoice-detail test files from even transforming.

Merge safety

Verified locally that merging #474 → #476 → #478 in order is conflict-free; the combined feature suites run green (100 tests).

Note: the tsc --noEmit job is red on dev itself (281–283 pre-existing errors from a bad lib/api merge) and is unrelated to this change. This branch adds no new type errors and clears 2 of the baseline errors.

Closes #478

[drips-wave]

@solomonadzape95 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! 🚀

Learn more about application limits