Web
Development & Routing
App Router architecture, pages (/pools, /payments, /wallet), and component patterns.
Guide to extending routes, contract helpers, and components in splitpay-web.
App Router Routes
| Route Path | Purpose |
|---|---|
| /dashboard | Overview of owned pools, recent payouts, and quick actions |
| /pools | Browse and search existing pools |
| /pools/new | Interactive pool creation wizard with live 10,000 BPS balance validator |
| /pools/[id] | Inspect on-chain pool status, active members, and shares |
| /payments | Historical payment transactions and settlement audit logs |
| /payments/new | Payment initiator with real-time distribution calculation |
| /payments/[id] | Settlement receipt showing per-member disbursement details |
| /wallet | Keypair manager, Friendbot funder, and balance inspector |
| /settings | Contract ID override, RPC endpoint selector, and network details |
Blockchain Integration Layer
- lib/contract/splitpay.ts: Typed client (
SplitPayContractClient) with read simulations and invocation builders. - lib/stellar/rpc.ts: Horizon balance queries, RPC server initialization, and transaction status polling.
- lib/wallet/WalletContext.tsx: React context managing active signer address, Freighter connection, and keypair state.
- lib/validation/: 10,000 BPS checks, address format regexes, and integer amount sanity tests.
Vitest Testing Strategy
Run the automated frontend test suite:
npm test