How propeller-heads/tycho-explorer works
Tycho Explorer presents on-chain liquidity pools as searchable/filterable lists and token-protocol graphs, with pool inspection and swap simulation. The backend maintains simulation state from a Tycho processor and exposes health, simulation, and WebSocket routes; the frontend graph path is explicit in sampled source. Several data-loading and side-panel connections are unsampled, so those relationships are shown only where the tree or sampled code supports them.
Main entry points: GraphPipeline.jsx Graph orchestrator · DexScanContent.tsx DexScan content · useFilterManager.js Filter manager · main.rs Service startup
Components 23
Explorer frontend
- Application shell
frontend/src/App.tsx - DexScan content
frontend/src/components/dexscan/app/DexScanContent.tsx - Pool data context
frontend/src/components/dexscan/shared/PoolDataContext.tsx - Filter manager
frontend/src/components/dexscan/shared/hooks/useFilterManager.js - Pool list and metrics
frontend/src/components/dexscan/pools/ListView.tsx - Filter controls
frontend/src/components/dexscan/shared/filters/index.ts - Swap interface
frontend/src/components/dexscan/side-panel/SwapInterface.jsx - Swap simulation client
frontend/src/components/dexscan/side-panel/simulation.js
Graph visualization
- Graph view
frontend/src/components/dexscan/graph/GraphViewContent.jsx - Graph orchestrator
frontend/src/components/dexscan/graph/GraphPipeline.jsx - Pool transformation
frontend/src/components/dexscan/graph/pipelines/TransformPipeline.js - Graph enrichment
frontend/src/components/dexscan/graph/pipelines/EnrichPipeline.js - Network rendering
frontend/src/components/dexscan/graph/pipelines/RenderPipeline.js - Graph interactions
frontend/src/components/dexscan/graph/pipelines/InteractPipeline.js - Tooltip display
frontend/src/components/dexscan/graph/pipelines/DisplayPipeline.jsx
Simulation service
- Service startup
api/src/main.rs - HTTP and WS routes
api/src/api/routes.rs - WebSocket handler
api/src/api/ws.rs - Simulation processor
api/src/simulation/mod.rs - Simulation API
api/src/api/routes.rs
Pool state
- Simulation state
api/src/simulation/state.rs
Other components
- Explorer user
- Tycho service
Connections 26
- Explorer user → Application shell: opens explorer
- Application shell → DexScan content: renders route
- DexScan content → Pool data context: uses pool data
- DexScan content → Pool list and metrics: presents pools
- DexScan content → Graph view: offers graph view
- DexScan content → Swap interface: offers swap UI
- Filter controls → Filter manager: updates selections
- Filter manager → Pool data context: reads chain data
- Pool list and metrics → Filter manager: uses selections
- Graph view → Graph orchestrator: renders graph
- Graph orchestrator → Pool transformation: transforms pools
- Graph orchestrator → Graph enrichment: enriches graph
- Graph orchestrator → Network rendering: renders network
- Graph orchestrator → Graph interactions: handles interaction
- Graph orchestrator → Tooltip display: shows tooltips
- Graph orchestrator → Filter manager: filters pools
- Swap interface → Swap simulation client: requests simulation
- Swap simulation client → Simulation API: posts simulation
- Explorer user → Service startup: starts service
- Service startup → HTTP and WS routes: starts API
- Service startup → Simulation processor: starts processor
- Simulation processor → Tycho service: streams pool updates
- Simulation processor → Simulation state: updates state
- HTTP and WS routes → WebSocket handler: dispatches WebSocket
- HTTP and WS routes → Simulation API: dispatches simulation
- Simulation API → Simulation state: reads pool state