feat: AI Credits Widget — buy AI coding credits with G$ on Celo

[Copilot]

Full implementation of the AI Credits Widget, enabling users to buy AI coding credits with G$ on Celo.

Buyer Key (packages/ai-credits-widget)

• Real generatePrivateKey() + privateKeyToAccount() via viem/accounts; user retains private key for AntSeed authentication
• Private key hidden by default with explicit Reveal / Hide toggle and save-before-continue warning
• Action row: primary Generate New Key (full-width, blue) + smaller outline Paste Existing Key side-by-side
• Key rows: single-line truncation + flex: 1 keeps copy icon always visible; compact icon buttons with copied-state feedback
• Intro text at full body contrast (no secondary/faint styling)

Operator consent

• Combined into one flow: POST /v1/auth/nonce → payer wallet signs plain message → POST /v1/auth/api-keys → stores returned gd_live_… API key

Celo payment — single wallet confirmation via Multicall3

All Celo on-chain calls are batched into one Multicall3.aggregate3 transaction (one wallet popup, one tx):

• If streamAmountG > 0 (stream before deposit in aggregate3):
  1. G$.increaseAllowance(CFA, MAX_UINT256 - existing) — skipped if existing CFA allowance ≥ monthly stream budget
  2. host.callAgreement(CFA, createFlow/updateFlow calldata, userData=abi.encode(buyerKey)) — CFA resolved live from Superfluid host; uses updateFlow if a flow already exists
• If depositAmountG > 0:
  3. G$.transferAndCall(vault, depositWei, abi.encode(buyerKey)) — single sub-call, no separate approve

vaultAddress option added to UseAiCreditsAdapterOptions (from env/backend config; falls back to placeholder until vault is deployed).

Addresses (Celo mainnet, chainId 42220):

• Multicall3: 0xcA11bde05977b3631167028862bE2a173976CA11
• Superfluid host: 0xA4Ff07cF81C02CFD356184879D953970cA957585
• G$ SuperToken: 0x62B8B11039FcfE5aB0C56E502b1C372A3d2a9c7A

GoodID

• vault.isGoodIDVerified(address) read on-chain; drives the hero badge and 20% stream bonus in quotes

Stepper hierarchy (packages/ui)

• Active step: 3px left accent bar in the primary color
• Completed steps: $colorSoft text, font weight 600
• Pending steps: font weight 400

Tests

All 13 widget state Playwright tests pass with committed screenshots (tests/widgets/ai-credits-widget/test-results/).

[L03TJ3]

@copilot can you run the tests and commit the outputted screenshots of the widget?

[Copilot]

@copilot can you run the tests and commit the outputted screenshots of the widget?

Done — all 13 tests now pass and screenshots are committed to tests/widgets/ai-credits-widget/test-results/.

Two bugs were fixed along the way:

• Icon color tokens in aiCreditsComponents.tsx had a $ prefix ("$primary", "$success") which is not part of the IconColor type — this crashed 5 stories at render time. Fixed to "primary" / "success".
• Strict-mode violations in 3 test assertions (getByText('+20%'), getByText('Transaction submitted'), getByText('Transaction reverted')) each matched multiple elements. Fixed with exact/full text strings.

Screenshots: acw-01-disconnected.png … acw-13-unsupported-chain.png (commit fix: icon color tokens + test selectors; add Playwright screenshots for all 13 states).

[blueogin]

@copilot

Buyer key
now Random bytes truncated to a pseudo-address; private key discarded (adapter.ts ~373–381)
Real generatePrivateKey + privateKeyToAccount; user keeps private key for AntSeed

Operator consent
now Payer walletClient.signTypedData (~405–426)
Calls backend to get signature(eip712 style)

Consent submission
now Signature only updates local state
calls backend with signature

(We can combine Operator Consent and Consent Submission into 1 and also can use 1 backend api endpoint)

Celo payment
now G$.transfer to stub 0x00…01 (~556–565)
approve + CeloGdAntSeedVault.deposit(amount, data) (data ABI-encoded AntSeed buyer address: abi.encode(buyerAddress). Required.)

GoodID
isGoodIdVerified always false in live adapter; never read on-chain
Vault isGoodIDVerified → hero badge + 20% stream bonus in quotes

the backend repository: https://github.com/GoodDollar/antseed-integration

[Copilot]

@copilot

Buyer key...

All 5 corrections are in (commit fix: correct adapter per review — real buyer key, backend auth consent, vault deposit, on-chain GoodID):

1. Buyer key — switched from random-bytes pseudo-address to generatePrivateKey() + privateKeyToAccount() (viem/accounts). The private key is now shown once in BuyerKeyPanel with a save-warning; the derived address is ABI-encoded into the vault deposit data.

2 & 3. Operator consent + submission (combined into 1 handler) — removed walletClient.signTypedData against the stub operator address. New handleSignOperatorConsent calls POST /v1/auth/nonce → payer wallet signs the plain message → POST /v1/auth/api-keys → stores the returned gd_live_... API key in state as apiKey.

4. Celo payment — replaced G$.transfer(stub) with G$.approve(CELO_GD_ANTSEED_VAULT, amount) + CeloGdAntSeedVault.deposit(amount, abi.encode(buyerKeyAddress)). The vault address is a placeholder pending deployment; marked with a TODO comment.

5. GoodID — loadBalance now reads vault.isGoodIDVerified(address) on-chain alongside the G$ balance in the same Promise.all. The result feeds the hero badge and the 20% stream bonus calculation in bonusPercent.

Backend client updated to match the actual Worker API (/v1/auth/nonce, /v1/auth/api-keys, /v1/celo/events/record, /v1/accounts/{account}/credit). All 13 Playwright state tests pass with fresh screenshots.

[blueogin]

@copilot
As you can see in the screenshot, the Private key and Public Key is overflowed, it misses copy icon

For buttons, “Generate new key” and “Paste existing key” are the same size and color, giving them equal visual weight. The primary action (generate) should be emphasized.
The private key is shown in plain text by default. There is no masking (dots) or a controlled “reveal” toggle with a warning about exposing the secret.
Buttons use black as the primary color, while the wallet UI uses the green accent. This breaks brand consistency.

[blueogin]

@copilot
run tests and commit generated screenshots

[Copilot]

@copilot
run tests and commit generated screenshots

Done — all 13 tests pass and screenshots are refreshed in tests/widgets/ai-credits-widget/test-results/ (commit test: refresh Playwright screenshots + update lockfile (13/13 pass)). The lockfile was also updated to include the new @react-native-clipboard/clipboard peer dependency added to packages/ui.