Route Book #93

JasonMHasperhoven · 2024-10-11T16:49:25Z

Implements #64

With very basic UI (and without mid price)

grod220

Lots of comments, but feel free to merge after addressing

grod220 · 2024-10-15T09:26:23Z

src/app/api/book/[symbol1]/[symbol2]/[hops]/[limit]/route.ts

+interface Params {
+  symbol1: string;
+  symbol2: string;
+  hops: string;
+  limit: string;
+}


idea: not for this PR, but think trpc would be good for us to use

@grod220 @JasonMHasperhoven wouldn't it be easier to not use the api directory but a simple server-side fetch within a component? Like

export default async function Page() { let data = await fetch('https://api.vercel.app/blog') let posts = await data.json() return ( <ul> {posts.map((post) => ( <li key={post.id}>{post.title}</li> ))} </ul> ) }

Instead of the fetch from my example, we could write useAsksBids() from the API made by Jason. It would do all the server-side work while sharing the types eliminating the need in TRPC. Wdyt?

My previous comment about this: #75 (comment)

Let's discuss this in our next call, this is frankly new to me.

grod220 · 2024-10-15T09:28:20Z

src/app/api/book/[symbol1]/[symbol2]/[hops]/[limit]/route.ts

+  const hops = Number(hopsParam);
+  const limit = Number(limitParam);
+
+  const registry = await chainRegistryClient.remote.get(process.env['PENUMBRA_CHAIN_ID'] ?? '');


suggestion: if env vars are not correctly injected, think this will produce a strange error. Suggest:

const chainId = process.env['PENUMBRA_CHAIN_ID']; if (!chainId) { throw new Error('No chain id in env vars'); } const registry = await chainRegistryClient.remote.get(chainId);

grod220 · 2024-10-15T09:30:45Z

src/app/api/book/[symbol1]/[symbol2]/[hops]/[limit]/route.ts

+  const sellSidePair = new DirectedTradingPair({
+    start: metadata2?.penumbraAssetId,
+    end: metadata1?.penumbraAssetId,
+  });


suggestion: we should probably type guard for this too right (to prevent strange error downstream)?

if (!metadata1?.penumbraAssetId || !metadata2?.penumbraAssetId) { throw new Error(`no asset id for ${symbol1} or ${symbol2}`); }

grod220 · 2024-10-15T09:32:28Z

src/app/api/book/[symbol1]/[symbol2]/[hops]/[limit]/route.ts

+  const data = await Promise.all([
+    querier.liquidityPositionsByPrice(sellSidePair, hops),
+    querier.liquidityPositionsByPrice(buySidePair, hops),
+  ]).then(([asks, bids]) => ({
+    asks: asks?.slice(0, limit),
+    bids: bids?.slice(0, limit),
+  }));


suggestion: I find it more readable if we don't mix async/await & then()

const [asks, bids] = await Promise.all([ querier.liquidityPositionsByPrice(sellSidePair, hops), querier.liquidityPositionsByPrice(buySidePair, hops), ]); const data = { asks: asks?.slice(0, limit), bids: bids?.slice(0, limit), };

grod220 · 2024-10-15T09:37:29Z

src/components/route-book/index.tsx

+    data.reduce((displayData: Record<string, RouteWithTotal>, route: Route) => {
+      const key = route.price;
+      return {
+        ...displayData,


thought: I wonder if this spread, creating a new object on every loop, can be inefficient on large data sets. Maybe not a concern. If so though, can do something like const displayData = new Map<number, RouteWithTotal>(); with a normal for loop.

grod220 · 2024-10-15T09:50:48Z

src/fetchers/book.ts

+export const useBook = (
+  symbol1: string | undefined,
+  symbol2: string | undefined,
+  hops: number | undefined,
+  limit: number | undefined,
+) => {


idea: Not critical to this PR, but starting to realize we'll want to include block height in the query key with nearly all our queries (as they'll get invalidated every block and refetched). Maybe something for later.

grod220 · 2024-10-15T09:52:57Z

src/fetchers/book.ts

+        };
+      }
+      const res = await fetch(`/api/book/${symbol1}/${symbol2}/${hops}/${limit}`);
+      return (await res.json()) as BookResponse;


thought: This is where trpc would be helpful

src/shared/round.ts

grod220 · 2024-10-15T09:55:08Z

src/shared/useComputePositionId.ts

+
+  useEffect(() => {
+    const set = async () => {
+      // cant import directly without breaking the build cmd


question: why does that happen I wonder. Is it because the wasm file is made for web and not nodejs?

I don't know the reason tbh..

src/shared/useComputePositionId.ts

grod220

Some final suggestions, but feel free to merge after

grod220 · 2024-10-16T12:32:28Z

src/components/route-book/index.tsx

+    fromBaseUnit(BigInt(property?.lo ?? 0), BigInt(property?.hi ?? 0), exponent);
+
+  const routes = data
+    // .filter(position => position.state?.state.toLocaleString() === 'POSITION_STATE_ENUM_OPENED')


nit: remove

grod220 · 2024-10-16T12:35:00Z

src/components/route-book/index.tsx

+    // .filter(position => position.state?.state.toLocaleString() === 'POSITION_STATE_ENUM_OPENED')
+    .filter(position => position.state?.state === PositionState_PositionStateEnum.OPENED)
+    .map(position => {
+      const direction = position.phi?.pair?.asset2?.equals(asset1.penumbraAssetId) ? -1 : 1;


question: does -1 and 1 have any inherent meaning within trade routing? If not, think it would be easier to make this a string label like primary and secondary or something.

grod220 · 2024-10-16T12:38:24Z

src/components/route-book/index.tsx

+  const asset1Exponent = asset1 ? getDisplayDenomExponent(asset1) : 0;
+  const asset2Exponent = asset2 ? getDisplayDenomExponent(asset2) : 0;
+  const { data: computePositionId } = useComputePositionId();
+  const { data } = useBook(asset1?.symbol, asset2?.symbol, 100, 50);


suggestion: related to my other comment, but I think we should consider:

if (!asset1?.symbol || !asset2?.symbol) { return <div>No asset selected</div> }

Note that this comes before useBook(), and given the rule of hooks, you'd have to create another component after the if clause.

I see your point, if you don't mind I will address this in the next update (separate pr).

grod220 · 2024-10-16T12:38:41Z

src/fetchers/book.ts

+  symbol1: string | undefined,
+  symbol2: string | undefined,


suggestion: think these should be required fields

grod220 · 2024-10-16T12:39:24Z

src/fetchers/book.ts

+  return useQuery({
+    queryKey: ['book', symbol1, symbol2, hops, limit],
+    queryFn: async (): Promise<BookResponse> => {
+      if (!symbol1 || !symbol2 || !limit) {


question: limit is a required field too? If so, think we should change the type signature of the hook.

VanishMax · 2024-10-18T08:31:13Z

src/components/route-book/index.tsx

+  const asset1 = assets?.find(asset => asset.symbol === 'UM');
+  const asset2 = assets?.find(asset => asset.symbol === 'GM');


suggestion: use pair MobX state (src/shared/state/pair.ts) to get the asset info. You may also fill this state initially, so from and to won't be undefined

This doesn't seem to work for me, the asset selector doesn't seem to fire on click?

That's weird, it works fine for me... Would love if you can make the reproduction

select.mp4

JasonMHasperhoven marked this pull request as ready for review October 14, 2024 14:20

JasonMHasperhoven requested a review from a team October 14, 2024 14:21

grod220 reviewed Oct 15, 2024

View reviewed changes

JasonMHasperhoven requested review from a team and grod220 October 16, 2024 12:26

grod220 approved these changes Oct 16, 2024

View reviewed changes

VanishMax reviewed Oct 18, 2024

View reviewed changes

JasonMHasperhoven added 14 commits October 18, 2024 19:39

Add RouteBook component and book routes

676a777

Add Metadata for symbol1 & 2

1a2ce42

Return Position[] from book route

3b07cab

Add getDisplayData

42d3e51

Get display data with totals

68463c4

Fix types for route book component

2e3f606

Refactor Route type

233b47a

Add sort for buy side routes with totals

9c37f3d

Fix types

6ee65ab

Moved import compute position id to a hook

44d691f

Fix import & type

5400605

Address PR comments

51ff3c5

fix build

986a09c

Remove unused filter line

d122e13

JasonMHasperhoven force-pushed the route-book branch from bb2cf1a to d122e13 Compare October 18, 2024 15:41

JasonMHasperhoven added 2 commits October 18, 2024 19:46

fix pnpm lock file

ecfe832

Applied prettier

361246b

JasonMHasperhoven merged commit 967d0c1 into main Oct 18, 2024
2 checks passed

JasonMHasperhoven deleted the route-book branch October 18, 2024 15:52

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Route Book #93

Route Book #93

JasonMHasperhoven commented Oct 11, 2024

grod220 left a comment

grod220 Oct 15, 2024

VanishMax Oct 18, 2024 •

edited

Loading

JasonMHasperhoven Oct 18, 2024

grod220 Oct 15, 2024

grod220 Oct 15, 2024

grod220 Oct 15, 2024

grod220 Oct 15, 2024

grod220 Oct 15, 2024

grod220 Oct 15, 2024

grod220 Oct 15, 2024

JasonMHasperhoven Oct 16, 2024

grod220 left a comment

grod220 Oct 16, 2024

grod220 Oct 16, 2024

grod220 Oct 16, 2024

JasonMHasperhoven Oct 18, 2024

grod220 Oct 16, 2024

grod220 Oct 16, 2024

VanishMax Oct 18, 2024

JasonMHasperhoven Oct 18, 2024

VanishMax Oct 18, 2024

		const asset1 = assets?.find(asset => asset.symbol === 'UM');
		const asset2 = assets?.find(asset => asset.symbol === 'GM');

Route Book #93

Route Book #93

Conversation

JasonMHasperhoven commented Oct 11, 2024

grod220 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

VanishMax Oct 18, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

grod220 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

VanishMax Oct 18, 2024 •

edited

Loading