Executive Dashboard
Overview of key financial metrics, inflow/outflow ratios, and wallet status.
CashFlow360 Documentation
Technical documentation for the SME Cash Flow Intelligence Platform
Architecture Overview
┌─────────────────────────────────────────────────────┐
│ Frontend Layer │
│ Next.js 14 App Router + TypeScript + PostHog Design │
│ │
│ ┌─────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
│ │Dashboard│ │Sankey Map│ │Treasury │ │ Runway │ │
│ │ (KPIs) │ │ (D3.js) │ │ Radar │ │Calculator│ │
│ └────┬────┘ └────┬─────┘ └────┬─────┘ └────┬─────┘ │
│ └────────────┴────────────┴────────────┘ │
│ │ │
│ RainbowKit + wagmi v2 │
│ (Wallet Connection Layer) │
└──────────────────────┬───────────────────────────────┘
│
▼
┌──────────────────────────────────────────────────────┐
│ Circle SDK Layer │
│ │
│ App Kit Send │ App Kit Bridge │ App Kit Swap │
│ (USDC xfer) │ (CCTP v2) │ (USDC↔EURC) │
│ │
│ Unified Balance │ User-Controlled Wallets │
│ (Multi-chain) │ (RainbowKit integration) │
└──────────────────────┬───────────────────────────────┘
│
▼
┌──────────────────────────────────────────────────────┐
│ Arc Testnet (Chain ID: 5042002) │
│ │
│ CashFlowVault.sol USDC (0x3600...0000) │
│ - deposit() EURC (0x89B5...D72a) │
│ - withdraw() │
│ - transfer() Events → On-chain Indexing │
│ - batchTransfer() → Real-time Dashboard │
│ - setAlertThreshold() │
└──────────────────────────────────────────────────────┘Technology Stack
| Layer | Technology | Purpose |
|---|---|---|
| Framework | Next.js 14 App Router | SSR + Client Components |
| Language | TypeScript (strict) | Type safety |
| Wallet | RainbowKit v2 + wagmi v2 | Multi-wallet connect |
| Chain | viem + Arc Testnet | On-chain interaction |
| Charts | Recharts + D3.js | Data visualization |
| Animation | Framer Motion | UI transitions |
| Design | PostHog Design System | Analytics-dense UI |
| Contracts | Solidity + Hardhat | Smart contract deployment |