Tycho indexes onchain liquidity - which helps DEXs get orderflow and Solvers find liquidity. Today, it's difficult to get a complete view of the onchain crypto market, at low latency, verifiablely and without trust in a data provider. Tycho wants to build a liquidity pool explorer that addresses these insufficiencies. The goal is to release it publicly for everyone's benefits and inspire the future users to build their own tools with Tycho after benefiting from using the pool explorer.

This document describes the implementation plan for first version of the Pool Explorer.

The latest spec is [here](https://github.com/propeller-heads/tycho-x/blob/a80caaf6c62d878c72b47bc652dbcb84f0b1740e/TAP-1.md#implementation).

# Requirements and user data exploration

Here are some previews into the most important requirements and the curve simulation! The text are the requirements or suggestion I made and the screenshots are the proof of concepts which would likely need some refining later.

## Graph View

1. Graph View Detail: Click on a node, see total TVL for the token, number of pools, top 5 pools sorted by TVL with TVL, protocol name, last trade timestamp.

1. Scale nodes by TVL: Scale node volume by TVL (or by log TVL).
Simulate on the pool: Simulate any swap you want on the pool: One direction or another (perhaps with flip switch), select any amount with a slider on a logarithmic scale from 0 to the pool limit (limit is available in protocol component).

1. Edge Coloring: Color the edges by the protocol they belong to (e.g. Uniswap v4).

1. Filter option: Let the user filter the graph by protocol (multiselect), minimum pool TVL, and tokens to include (multi select - with search field to find tokens).

1. Show latest update on graph: Highlight all edges (pools) that have been updated in the last block - by flashing them and making them fat until the next block update comes in.

1. Simulate trading curve in realtime: On a single pool (either in graph view and/or list view when you click on the pool) you allow the user to simulate 1.000 sample points (even log spacing between 0 and pool limit) in one click, in real-time. In front of the users eyes, dot-by-dot, the UI "draws out" the amount in / amount out curve as the simulations (with Tycho Simulation) run through sequentially. To illustrate the speed of the simulation.


## Pool info

1. Total number of pools indexed

1. Total number of contracts / protocols indexed

1. Total TVL indexed

1. Total number of pools in current filter view

1. Total TVL in current filter view


## User data exploration (suggestion)

It's conveinent for the users to be able to filter and aggregate data without doing the calculations themselves in a separate program. The best current proposal is to create data operation modal that empowers users to compute over the pool data. When the need arises, we can add more tabular operations here.


# Technical overview

The UI will be in React, taking in block update data over websocket. Self-hosted locally for low latency between block update and UI update. The React client will then construct the Pool Explorer's state in memory and keep it synced as new block update data arrives.

This has the benefits of simple operation and an ease for adding features in the future. It can be hosted locally or a public domain for everyone's benefits.


# Milestones

1. Implement the tabular view and hook up the web app to Tycho API.
1. Implement the graph view.
1. UI refinement including styling and layout.