Complexity: High — 200 pts
Summary
SEP-24 is Stellar's standard for interactive fiat deposits and withdrawals via anchors. This issue integrates a SEP-24 flow so users (especially Nigerian users) can deposit NGN and receive USDC — or withdraw USDC back to NGN — directly within StellarFlow using a SEP-24 compatible anchor.
Files to Create/Modify
- Create:
src/lib/sep24.ts
- Create:
src/pages/OnrampPage.tsx
- Modify:
src/App.tsx — add /onramp route
- Modify:
src/pages/DashboardPage.tsx — add Buy/Sell quick action
Implementation Notes
sep24.ts
Three functions:
fetchAnchorToml(homeDomain) — fetch /.well-known/stellar.toml, regex out TRANSFER_SERVER_SEP0024 and WEB_AUTH_ENDPOINT
sep10Authenticate(authServer, address, signTx) — GET challenge transaction, sign with Freighter via the passed signTx callback, POST signed tx, return JWT
initiateDeposit(transferServer, jwt, assetCode) — POST to /transactions/deposit/interactive with Bearer auth, returns { url, id }
pollTransaction(transferServer, jwt, txId) — GET /transaction?id= to check status
OnrampPage
- Hardcode
testanchor.stellar.org for testnet
- Deposit tab + Withdraw tab, asset selector (USDC)
- "Start Deposit"/"Start Withdrawal" opens the anchor interactive URL (iframe or new window)
- Poll
/transaction?id= every 3 seconds, show status progression: pending_user_transfer_start → pending_anchor → completed
Acceptance Criteria
Screen Recording Requirements (using testanchor.stellar.org)
- Open Onramp page, click Start Deposit
- Anchor interactive iframe/modal opens
- Complete the deposit flow in the anchor UI
- Status updates: pending → completed
- USDC balance increases on the Dashboard
Complexity: High — 200 pts
Summary
SEP-24 is Stellar's standard for interactive fiat deposits and withdrawals via anchors. This issue integrates a SEP-24 flow so users (especially Nigerian users) can deposit NGN and receive USDC — or withdraw USDC back to NGN — directly within StellarFlow using a SEP-24 compatible anchor.
Files to Create/Modify
src/lib/sep24.tssrc/pages/OnrampPage.tsxsrc/App.tsx— add/onramproutesrc/pages/DashboardPage.tsx— add Buy/Sell quick actionImplementation Notes
sep24.tsThree functions:
fetchAnchorToml(homeDomain)— fetch/.well-known/stellar.toml, regex outTRANSFER_SERVER_SEP0024andWEB_AUTH_ENDPOINTsep10Authenticate(authServer, address, signTx)— GET challenge transaction, sign with Freighter via the passedsignTxcallback, POST signed tx, return JWTinitiateDeposit(transferServer, jwt, assetCode)— POST to/transactions/deposit/interactivewith Bearer auth, returns{ url, id }pollTransaction(transferServer, jwt, txId)— GET/transaction?id=to check statusOnrampPagetestanchor.stellar.orgfor testnet/transaction?id=every 3 seconds, show status progression:pending_user_transfer_start→pending_anchor→completedAcceptance Criteria
testanchor.stellar.orgon testnetScreen Recording Requirements (using testanchor.stellar.org)