advance

XLabs · Sep 5, 2023 · 89e74e2 · 89e74e2
1 parent d140917
commit 89e74e2
Show file tree

Hide file tree

Showing 2 changed files with 114 additions and 94 deletions.
diff --git a/docs/docs/faqs/_components/LiquidityMarkets.tsx b/docs/docs/faqs/_components/LiquidityMarkets.tsx
@@ -1,135 +1,155 @@
-import * as React from 'react';
+import * as React from "react";
 import Tabs from "@theme/Tabs";
 import TabItem from "@theme/TabItem";
-
+import { CHAIN_ID_TO_SYMBOL } from "@site/src/utils/const";
+/*import {
+  coalesceChainName
+ } from "@certusone/wormhole-sdk";
+*/
 function useLiquidityMarkets(): any {
-    const [json, setJson] = React.useState('');
-    React.useEffect(() => {
-        const controller = new AbortController();
-        async function getLiquidityMarkets() {
-            try {
-                const response = await fetch('https://raw.githubusercontent.com/certusone/wormhole-token-list/main/src/markets.json', { signal: controller.signal });
-                const data = await response.json();
-                setJson(data);    
-            } catch(err) {
-                console.log(err);
-            }
-        };
-        getLiquidityMarkets();
-        return () => controller.abort()
-    }, []);
-
-    return json;
-}
+  const [json, setJson] = React.useState("");
+  React.useEffect(() => {
+    const controller = new AbortController();
+    async function getLiquidityMarkets() {
+      try {
+        const response = await fetch(
+          "https://raw.githubusercontent.com/certusone/wormhole-token-list/main/src/markets.json",
+          { signal: controller.signal }
+        );
+        const data = await response.json();
+        setJson(data);
+      } catch (err) {
+        console.log(err);
+      }
+    }
+    getLiquidityMarkets();
+    return () => controller.abort();
+  }, []);
 
+  return json;
+}
 
 interface LiquidityMarketProps {
-    source: string
-
+  source: string;
 }
 
 function LiquidityMarket(props: LiquidityMarketProps) {}
 
 interface LiquidityMarketTableProps {
-    source: string
-    targets: Array<{
-        target: string
-        contract: string
-        markets: Array<{
-            name: string
-            href: string
-        }>
-    }>
+  source: string;
+  targets: Array<{
+    target: string;
+    contract: string;
+    markets: Array<{
+      name: string;
+      href: string;
+    }>;
+  }>;
 }
 
 function AssetTable(props: { target: any }) {
-    return <>{JSON.stringify(props.target)}</>
+  return <>{JSON.stringify(props.target)}</>;
 }
 
-function LiquidityMarketTable({ source, targets }: LiquidityMarketTableProps) {
-    return (
-        <>
-            ## Target chain: {source}
-            <Tabs>
-                {targets.map((target, idx) => (
-                    <TabItem value={`${source} -> ${target}`} label={`${source} -> ${target}`} default={idx === 0}>
-                       a
-                    </TabItem>))}
-            </Tabs>
-        </>
-        )
+function LiquidityMarketTable({ source, sourceId }) {
+  console.log("source", sourceId);
+
+  //const sourceName = coalesceChainName(sourceId);
+  return (
+    <>
+      ## Target chain: {CHAIN_ID_TO_SYMBOL[sourceId]}
+      {/*<Tabs>
+         {source.map((target, idx) => {
+          const targetName = coalesceChainName(target);
+          return (
+          <TabItem value={`${sourceName} -> ${targetName}`} label={`${sourceName} -> ${targetName}`} default={idx === 0}>
+            sdfsdf
+          </TabItem>)
+        })} 
+      </Tabs>*/}
+    </>
+  );
 }
 
 interface Market {
-    name: string
-    href: string
+  name: string;
+  href: string;
 }
 
 interface Asset {
-    name: string
-    contract: string
-    markets: Array<Market>
+  name: string;
+  contract: string;
+  markets: Array<Market>;
 }
 
 interface Target {
-    target: string
-    assets: Array<Asset>
+  target: string;
+  assets: Array<Asset>;
 }
 
 interface Source {
-    source: string
-    targets: Array<Target>
+  source: string;
+  targets: Array<Target>;
 }
 
 interface Entry {
-    source: string
-    target: string
-    asset: string
-    contract: string
-    markets: Array<Market>
+  source: string;
+  target: string;
+  asset: string;
+  contract: string;
+  markets: Array<Market>;
 }
 
 interface MarketTableProps {
-    source: string
-    tabs: Array<Entry>
+  source: string;
+  tabs: Array<Entry>;
 }
 
 const sample2 = [
-    {
-        source: 'Solana',
-        target: 'Ethereum',
-        asset: 'USDC',
-        contract: '0x1234',
-        markets: Array<Market>
-    }
-]
+  {
+    source: "Solana",
+    target: "Ethereum",
+    asset: "USDC",
+    contract: "0x1234",
+    markets: Array<Market>,
+  },
+];
 
 const sample = [
-    {
-        source: 'Solana',
-        targets: [
-            {
-                target: 'Ethereum',
-                assets: [{
-                    name: 'USDC',
-                    contract: '0x1234',
-                    markets: [{
-                        name: 'USDC/USDT',
-                        href: 'https://app.sushi.com/add/0x6b175474e89094c44da98b954eedeac495271d0f/0xdac17f958d2ee523a2206206994597c13d831ec7'
-                    }]
-                }]
-            }
-        ]
-    }
-]
+  {
+    source: "Solana",
+    targets: [
+      {
+        target: "Ethereum",
+        assets: [
+          {
+            name: "USDC",
+            contract: "0x1234",
+            markets: [
+              {
+                name: "USDC/USDT",
+                href: "https://app.sushi.com/add/0x6b175474e89094c44da98b954eedeac495271d0f/0xdac17f958d2ee523a2206206994597c13d831ec7",
+              },
+            ],
+          },
+        ],
+      },
+    ],
+  },
+];
 
 export default function LiquidityMarkets() {
-    const { tokenMarkets, markets, tokens } = useLiquidityMarkets();
-    return (
+  const { tokenMarkets, markets, tokens } = useLiquidityMarkets();
+
+  return (
+    <>
+      {tokenMarkets && markets && tokens && (
         <>
-        {
-            JSON.stringify(tokenMarkets)
-        }
+          {Object.keys(tokenMarkets).map((key: any) => (
+            <LiquidityMarketTable source={tokenMarkets[key]} sourceId={key} />
+          ))}
         </>
-    );
-}
+      )}
+    </>
+  );
+}
diff --git a/docs/docs/faqs/liquid-markets.mdx b/docs/docs/faqs/liquid-markets.mdx
@@ -78,7 +78,7 @@ Check out the [Wormhole Token list](https://github.com/certusone/wormhole-token-
 
 <LiquidityMarkets />
 
-## Target chain: Solana
+{/* ## Target chain: Solana
 
 <Tabs>
   <TabItem value="ETH -> SOL" label="ETH -> SOL" default>
@@ -246,4 +246,4 @@ Check out the [Wormhole Token list](https://github.com/certusone/wormhole-token-
   <TabItem value="SOL -> SUI" label="SOL -> SUI" default>
     <SolSui />
   </TabItem>
-</Tabs>
+</Tabs> */}