fix: small fixes before IBC denom handling fix (#518)

* fix: pool reserve data was not showing when pool ID is "0"

* fix: remove unneeded trigger button placed into Dialog

* feat: ignore local vite server optimized code

* refactor: add easier to use exports for handling indexer fetches

* fix: de-duplicate Keplr queries with useQuery:

    - previously multiple permission requests were being sent at the
      same time when the Bridge dialog opened

* fix: ensure IBC token strings are requested from indexer correctly

* fix: orderbook links require encoding for IBC denoms

.eslintignore

@@ -11,3 +11,6 @@
 
 # TradingView library
 /public/charting_library
+
+# ignore vite build files
+.vite

.gitignore

@@ -27,6 +27,9 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
+# Vite
+.vite
+
 #editors
 .idea
 .vscode

.prettierignore

@@ -12,5 +12,8 @@
 # ignore chart library dependency
 /public/charting_library
 
+# ignore vite build files
+.vite
+
 # ignore change log, it is auto-formatted by semantic release
 CHANGELOG.md

src/components/Dialog/Dialog.tsx

@@ -40,7 +40,6 @@ export default function Dialog({
   );
   return (
     <RadixDialog.Root open={isOpen} onOpenChange={setIsOpen}>
-      <RadixDialog.Trigger />
       <RadixDialog.Portal>
         <RadixDialog.Overlay
           className={['dialog-overlay', className].filter(Boolean).join(' ')}

src/lib/web3/hooks/useChains.ts

@@ -1,5 +1,5 @@
 import { Chain } from '@chain-registry/types';
-import { useMemo, useState } from 'react';
+import { useMemo } from 'react';
 import { ibc, router } from '@duality-labs/dualityjs';
 import { QueryParamsResponse as QueryRouterParams } from '@duality-labs/dualityjs/types/codegen/router/v1/query';
 import { QueryClientStatesResponse } from '@duality-labs/dualityjs/types/codegen/ibc/core/client/v1/query';
@@ -69,30 +69,17 @@ export function useChainAddress(chain?: Chain): {
   isValidating: boolean;
   error?: Error;
 } {
-  const chainId = chain?.chain_id;
-  const [{ data, isValidating, error }, setChainState] = useState<{
-    data?: string;
-    isValidating: boolean;
-    error?: Error;
-  }>({
-    isValidating: false,
+  const chainId = chain?.chain_id ?? '';
+  const { data, isFetching, error } = useQuery({
+    enabled: !!chainId,
+    queryKey: ['useChainAddress', chainId],
+    queryFn: async (): Promise<string> => {
+      return getChainInfo(chainId).then((chainInfo) => chainInfo.bech32Address);
+    },
+    // if the request was declined, don't keep re-requesting it
+    retry: false,
   });
-  useMemo(() => {
-    if (chainId) {
-      setChainState({ isValidating: true });
-      getChainInfo(chainId)
-        .then((chainInfo) => {
-          setChainState({
-            data: chainInfo.bech32Address,
-            isValidating: false,
-          });
-        })
-        .catch((error) => {
-          setChainState({ isValidating: false, error });
-        });
-    }
-  }, [chainId]);
-  return { data, isValidating, error };
+  return { data, isValidating: isFetching, error: error || undefined };
 }
 
 async function getIbcLcdClient(

src/lib/web3/hooks/useIndexer.ts

@@ -486,18 +486,18 @@ export function useIndexerStreamOfDualDataSet<
   ) as StaleWhileRevalidateState<[DataSet, DataSet]>;
 }
 
-// add higher-level function to fetch multiple pages of data as "one request"
-export async function fetchDataFromIndexer<DataRow extends BaseDataRow>(
+// add higher-level functions to fetch multiple pages of data as "one request"
+async function fetchDataFromIndexer<DataRow extends BaseDataRow>(
   baseURL: URL | string,
   IndexerClass: typeof IndexerStreamAccumulateSingleDataSet,
   opts?: AccumulatorOptions & StreamOptions
 ): Promise<BaseDataSet<DataRow>>;
-export async function fetchDataFromIndexer<DataRow extends BaseDataRow>(
+async function fetchDataFromIndexer<DataRow extends BaseDataRow>(
   baseURL: URL | string,
   IndexerClass: typeof IndexerStreamAccumulateDualDataSet,
   opts?: AccumulatorOptions & StreamOptions
 ): Promise<BaseDataSet<DataRow>[]>;
-export async function fetchDataFromIndexer<DataRow extends BaseDataRow>(
+async function fetchDataFromIndexer<DataRow extends BaseDataRow>(
   baseURL: URL | string,
   IndexerClass:
     | typeof IndexerStreamAccumulateSingleDataSet
@@ -526,3 +526,17 @@ export async function fetchDataFromIndexer<DataRow extends BaseDataRow>(
     stream.accumulateUpdates = accumulateUpdatesUsingMutation;
   });
 }
+
+export function fetchSingleDataSetFromIndexer<DataRow extends BaseDataRow>(
+  url: URL | string,
+  opts?: AccumulatorOptions & StreamOptions
+): Promise<BaseDataSet<DataRow>> {
+  return fetchDataFromIndexer(url, IndexerStreamAccumulateSingleDataSet, opts);
+}
+
+export function fetchDualDataSetFromIndexer<DataRow extends BaseDataRow>(
+  url: URL | string,
+  opts?: AccumulatorOptions & StreamOptions
+): Promise<BaseDataSet<DataRow>[]> {
+  return fetchDataFromIndexer(url, IndexerStreamAccumulateDualDataSet, opts);
+}

src/lib/web3/hooks/useTickLiquidity.ts

@@ -20,9 +20,11 @@ export function useTokenPairMapLiquidity([tokenIdA, tokenIdB]: [
   data?: [ReserveDataSet, ReserveDataSet];
   error?: unknown;
 } {
+  const encodedA = tokenIdA && encodeURIComponent(tokenIdA);
+  const encodedB = tokenIdB && encodeURIComponent(tokenIdB);
   // stream data from indexer
   return useIndexerStreamOfDualDataSet<ReserveDataRow>(
-    tokenIdA && tokenIdB && `/liquidity/pair/${tokenIdA}/${tokenIdB}`,
+    encodedA && encodedB && `/liquidity/pair/${encodedA}/${encodedB}`,
     {
       // remove entries of value 0 from the accumulated map, they are not used
       mapEntryRemovalValue: 0,

src/lib/web3/hooks/useUserReserves.ts

@@ -246,7 +246,7 @@ function useUserDepositsTotalShares(
     for (const userPoolTotalShare of userPoolTotalShares || []) {
       // make map here
       const poolID = getDexSharePoolID(userPoolTotalShare.balance);
-      if (poolID) {
+      if (poolID !== undefined) {
         totalSharesByPoolID.set(poolID, userPoolTotalShare);
       }
     }
@@ -281,7 +281,9 @@ function useUserDepositsTotalShares(
     return userDepositsWithPoolID?.map(({ deposit, metadata }) => {
       const poolID = metadata?.ID.toNumber();
       const totalShares =
-        totalSharesByPoolID.get(poolID || -1)?.totalShares ?? '0';
+        poolID !== undefined
+          ? totalSharesByPoolID.get(poolID)?.totalShares ?? '0'
+          : '0';
       return {
         deposit,
         totalShares,

src/pages/Orderbook/OrderbookChart.tsx

@@ -146,7 +146,9 @@ export default function OrderBookChart({
       searchParams?: PaginationRequestQuery & BlockRangeRequestQuery
     ) => {
       const url = new URL(
-        `${REACT_APP__INDEXER_API}/timeseries/price/${symbolA}/${symbolB}${
+        `${REACT_APP__INDEXER_API}/timeseries/price/${encodeURIComponent(
+          symbolA
+        )}/${encodeURIComponent(symbolB)}${
           resolutionMap[`${resolution}`]
             ? `/${resolutionMap[`${resolution}`]}`
             : ''