Contract-freeze · UX approval

Billing — Invoice history · Approval Frames

These frames demonstrate the InvoiceHistoryPanel UX before any feature UI is implemented. Approving them freezes the visual contract that the implementation and frontend-test-engineer's Playwright pre-production checks are verified against. Built in the fuse-seam design system (tokens only). No vendor name appears anywhere in the UI — invoice ids, status and amount come from FuzeFront's own store.

Frame (a)

🧾 Invoice history

Populated list on the Billing page: date · number · amount · status pill · download. "Load more" cursor pagination.

Frame (b)

◔ States

Loading skeleton, empty state, error+retry, and the paid/open/void/uncollectible status variants.

● Awaiting approval

Design system: @fuzefront/design-system (fuse-seam) · Contract: services/billing-service/openapi.yaml → @fuzefront/billing-client · Component: @fuzefront/billing-ui → InvoiceHistoryPanel · Flag: fuzefront.billing.invoice-history (default OFF).
Approve by setting approved: true (+ approver + date) in manifest.json, or reply @claude approve / @claude reject: <reason>.