Connect accounts card
The live data hub, provider rows for open banking, FreeAgent and document uploads, fed computed connection state by the host.
Bring in your live numbers
Connect a source and your plan runs on real balances and transactions, not just what you told me. Do as much or as little as you like.
Your own accounts, via open banking
Your company accounts, synced
Drop a PDF, CSV or tax return into the message box below and I'll read it
Your company accounts, synced
You can always add more later.
<ConnectAccountsCardpersonalBanks={personalBanks}freeAgentConnections={freeAgents}onConnectBank={(target, businessId) => openBankDialog(target, businessId)}onConnectFreeAgent={() => startFreeAgent()}onEnter={() => enterProduct()}documentSlot={<ConnectAccountsUploadItem />}/>Usage
import { ConnectAccountsCard, ConnectAccountsUploadItem } from "@reva/ui";Rendered by the show_connect_accounts tool once the household is accepted. The card is a visual shell: the host reads live connection status, derives the mentioned-but-unconnected providers, and owns every flow the buttons launch. The statements row is injected through documentSlot so the upload and extraction transport stays with the host; ConnectAccountsUploadItem is the matching presentational row.
Examples
Connected sources
Each provider lists what it brought in as subordinate rows with their own health; a lapsed source shows Reconnect. Bank accounts are split into a personal section plus one section per business, so each Connect action already knows whose bank it is — a business bank never lands as personal spending. Mentioned providers the user has not linked get their own targeted Connect actions.
Bring in your live numbers
Connect a source and your plan runs on real balances and transactions, not just what you told me. Do as much or as little as you like.
Your own accounts, via open banking
Accounts you mentioned
Business bank accounts, via open banking
Business bank accounts, via open banking
Your company accounts, synced
Upload a PDF, CSV or tax return and I'll read it into your plan
Your company accounts, synced
You can always add more later.
<ConnectAccountsCardpersonalBanks={[ { id: "b1", name: "First Direct" }, { id: "b2", name: "Monzo", needsAttention: true },]}businesses={[ { id: "co1", name: "Whitfield Consulting Ltd", banks: [{ id: "bb1", name: "Starling Bank" }] }, { id: "co2", name: "Whitfield Studio Ltd", banks: [] },]}freeAgentConnections={[{ id: "fa1", name: "Whitfield Consulting Ltd" }]}mentionedProviders={mentioned}.../>Upload states
The upload row's busy and error states. Without onPickFiles it degrades to a drop-in-the-message-box nudge, as in the first example.
Upload a PDF, CSV or tax return and I'll read it into your plan
<ConnectAccountsUploadItem onPickFiles={pick} busy={busy} error={error} />