 Jeff Emmett
|
8e43f9e383
|
Rebuild with n8n-style node-based interface
Clean, modern interface using React Flow:
- SourceNode: Blue header, shows balance and flow rate
- ThresholdNode: Purple header with min/max slider controls
- RecipientNode: Shows funding progress with visual bar
- Animated edges showing flow direction
- Light theme matching n8n aesthetic
- Simulation toggle (pause/play)
- Legend panel explaining node types
- Zustand for state management
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
|
2026-01-29 18:30:34 +00:00 |
|
Jeff Emmett
|
2ffeb9120a
|
Remove unused React Flow components, simplify for funnel viz
- Remove FlowCanvas, node components, edge components
- Remove @xyflow/react and d3 dependencies
- Clean up CSS (remove React Flow styles)
- Leaner build focused on FundingFunnel component
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
|
2026-01-29 18:10:51 +00:00 |
|
Jeff Emmett
|
14ebf0853d
|
Add flow visualization components and design spec
- DESIGN.md: Complete visual design specification for TBFF
- FlowCanvas: Main React Flow canvas with interactive demo
- SourceNode: Treasury/funding source visualization
- RecipientNode: Project recipient with threshold progress
- ThresholdGate: Visual gate showing open/locked state
- AnimatedFlowEdge: Animated particles showing fund flow
- Real-time flow simulation (balances update live)
Visual features:
- Particle animation along flow paths
- Threshold progress bars with color states
- Dark theme optimized for data visualization
- Mini-map and zoom controls
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
|
2026-01-29 18:01:38 +00:00 |