Query xyk balances from sdk

src/api/provider.ts

@@ -260,13 +260,12 @@ export const useProviderData = () => {
         PoolType.XYK,
         PoolType.LBP,
       ]
+      await poolService.syncRegistry(externalTokens[dataEnv])
 
       const tradeRouter = new TradeRouter(poolService, {
         includeOnly: traderRoutes,
       })
 
-      await poolService.syncRegistry(externalTokens[dataEnv])
-
       const [isDispatchPermitEnabled] = await Promise.all([
         api.tx.multiTransactionPayment.dispatchPermit,
         tradeRouter.getPools(),

src/api/xyk.ts

@@ -29,7 +29,7 @@ export const useAllXykPools = () => {
   })
 }
 
-export const useXYKPools = () => {
+export const useXYKSDKPools = () => {
   return useQuery<PoolBase[]>(QUERY_KEYS.xykPools, {
     enabled: false,
     staleTime: Infinity,

src/components/Layout/Header/DegenMode/DegenMode.utils.ts

@@ -8,6 +8,8 @@ import {
 } from "sections/wallet/addToken/AddToken.utils"
 import { useSettingsStore } from "state/store"
 import { useAssets } from "providers/assets"
+import { useQueryClient } from "@tanstack/react-query"
+import { QUERY_KEYS } from "utils/queryKeys"
 
 export const useDegenModeSubscription = () => {
   const { external, externalInvalid } = useAssets()
@@ -16,6 +18,7 @@ export const useDegenModeSubscription = () => {
   const { getDataEnv } = useProviderRpcUrlStore()
   const refetchProvider = useRefetchProviderData()
   const { isLoaded, poolService } = useRpcProvider()
+  const queryClient = useQueryClient()
 
   const hasInitializedDegenMode = useRef(false)
 
@@ -67,8 +70,17 @@ export const useDegenModeSubscription = () => {
       poolService.syncRegistry(data)
       hasInitializedDegenMode.current = true
       refetchProvider()
+      queryClient.invalidateQueries(QUERY_KEYS.pools)
     }
-  }, [degenMode, data, getDataEnv, isSuccess, refetchProvider, poolService])
+  }, [
+    degenMode,
+    data,
+    getDataEnv,
+    isSuccess,
+    refetchProvider,
+    poolService,
+    queryClient,
+  ])
 
   // Subscribe to degenMode change to update ExternalAssetCursor
   useEffect(() => {

src/sections/pools/PoolsPage.utils.ts

@@ -325,7 +325,7 @@ export const useXYKPools = () => {
         const tvlDisplay =
           shareTokenIssuance?.totalShare
             ?.shiftedBy(-shareToken.decimals)
-            ?.multipliedBy(shareTokenSpotPrice?.spotPrice ?? 1) ?? BN_0
+            ?.multipliedBy(shareTokenSpotPrice?.spotPrice ?? BN_NAN) ?? BN_NAN
 
         const volume = volumes?.find(
           (volume) => volume.poolAddress === poolAddress,
@@ -372,6 +372,9 @@ export const useXYKPools = () => {
         if (a.isInvalid) return 1
         if (b.isInvalid) return -1
 
+        if (a.tvlDisplay.isNaN()) return 1
+        if (b.tvlDisplay.isNaN()) return -1
+
         return b.tvlDisplay.minus(a.tvlDisplay).toNumber()
       })
   }, [

src/sections/pools/farms/position/FarmingPosition.utils.tsx

@@ -7,7 +7,7 @@ import { useDisplayShareTokenPrice } from "utils/displayAsset"
 import { TShareToken, useAssets } from "providers/assets"
 import { scaleHuman } from "utils/balance"
 import { useTotalIssuances } from "api/totalIssuance"
-import { useXYKPools } from "api/xyk"
+import { useXYKSDKPools } from "api/xyk"
 
 type TokenAmount = {
   id: string
@@ -89,7 +89,7 @@ export const useAllXYKDeposits = (address?: string) => {
 
   const issuances = useTotalIssuances()
   const shareTokeSpotPrices = useDisplayShareTokenPrice(uniqAssetIds)
-  const { data: xykPools, isLoading: isXykPoolsLoading } = useXYKPools()
+  const { data: xykPools, isLoading: isXykPoolsLoading } = useXYKSDKPools()
 
   const isLoading =
     isXykPoolsLoading ||

src/sections/pools/modals/CreateXYKPool/CreateXYKPool.tsx

@@ -1,4 +1,4 @@
-import { useXYKPools } from "api/xyk"
+import { useXYKSDKPools } from "api/xyk"
 import { useMemo, useState } from "react"
 import { AssetsModalContent } from "sections/assets/AssetsModal"
 import { CreateXYKPoolForm } from "./CreateXYKPoolForm"
@@ -44,7 +44,7 @@ export const CreateXYKPool = ({
   onAssetSelectClose,
   children,
 }: CreateXYKPoolProps) => {
-  const { data: xykPools } = useXYKPools()
+  const { data: xykPools } = useXYKSDKPools()
 
   const allowedAssets = useAllowedXYKPoolAssets()
   const allowedAssetIds = allowedAssets.map(({ id }) => id)

src/sections/pools/pool/details/PoolDetails.utils.ts

@@ -3,6 +3,7 @@ import { useMemo } from "react"
 import { useDisplayPrices } from "utils/displayAsset"
 import { TShareToken, useAssets } from "providers/assets"
 import BN from "bignumber.js"
+import { BN_NAN } from "utils/constants"
 
 export const useXYKPoolTradeVolumes = (shareTokens: TShareToken[]) => {
   const { getAssetWithFallback } = useAssets()
@@ -11,7 +12,6 @@ export const useXYKPoolTradeVolumes = (shareTokens: TShareToken[]) => {
     useXYKSquidVolumes(shareTokens.map((shareToken) => shareToken.poolAddress))
 
   const allAssetsInPools = [...new Set(volumes.map((volume) => volume.assetId))]
-
   const spotPrices = useDisplayPrices(allAssetsInPools)
   const isLoading = spotPrices.isInitialLoading || isVolumesLoading
 
@@ -26,7 +26,7 @@ export const useXYKPoolTradeVolumes = (shareTokens: TShareToken[]) => {
 
       const volume = BN(value.volume)
         .shiftedBy(-assetMeta.decimals)
-        .multipliedBy(spotPrice ?? 1)
+        .multipliedBy(spotPrice ?? BN_NAN)
         .toFixed(3)
 
       return { volume, poolAddress: value.poolId, assetMeta }

src/sections/pools/sections/AllPools.tsx

@@ -17,6 +17,7 @@ import { PoolSkeleton } from "sections/pools/pool/PoolSkeleton"
 import { EmptySearchState } from "components/EmptySearchState/EmptySearchState"
 import { TableLabel } from "sections/pools/components/TableLabel"
 import { CreateXYKPoolModalButton } from "sections/pools/modals/CreateXYKPool/CreateXYKPoolModalButton"
+import BigNumber from "bignumber.js"
 
 export const AllPools = () => {
   const { t } = useTranslation()
@@ -111,7 +112,11 @@ const AllPoolsData = () => {
             acc.tvl = acc.tvl.plus(
               !xykPool.tvlDisplay.isNaN() ? xykPool.tvlDisplay : BN_0,
             )
-            acc.volume = acc.volume.plus(xykPool.volume ?? 0)
+            acc.volume = acc.volume.plus(
+              xykPool.volume && !BigNumber(xykPool.volume).isNaN()
+                ? xykPool.volume
+                : 0,
+            )
           }
 
           return acc

src/sections/wallet/assets/hydraPositions/data/WalletAssetsHydraPositionsData.utils.tsx

@@ -1,14 +1,14 @@
 import { useMemo } from "react"
 import { arraySearch } from "utils/helpers"
 import { TLPData, useLiquidityPositionData } from "utils/omnipool"
-import { useAccountsBalances } from "api/accountBalances"
 import { useDisplayShareTokenPrice } from "utils/displayAsset"
 import { BN_NAN } from "utils/constants"
 import { useAssets } from "providers/assets"
 import { useAccountAssets } from "api/deposits"
 import { useAccount } from "sections/web3-connect/Web3Connect.utils"
 import { useTotalIssuances } from "api/totalIssuance"
 import BigNumber from "bignumber.js"
+import { useXYKSDKPools } from "api/xyk"
 
 export const useOmnipoolPositionsData = ({
   search,
@@ -44,7 +44,7 @@ export const useOmnipoolPositionsData = ({
 }
 
 export const useXykPositionsData = ({ search }: { search?: string } = {}) => {
-  const { native, isShareToken } = useAssets()
+  const { isShareToken } = useAssets()
   const { account } = useAccount()
   const { data: accountAssets } = useAccountAssets(account?.address)
 
@@ -65,41 +65,29 @@ export const useXykPositionsData = ({ search }: { search?: string } = {}) => {
   }, [accountAssets, isShareToken])
 
   const shareTokensId = accountShareTokens.map((pool) => pool.asset.id)
-  const shareTokensAddresses = accountShareTokens.map(
-    (pool) => pool.asset.poolAddress,
-  )
 
-  const totalIssuances = useTotalIssuances()
-  const poolBalances = useAccountsBalances(shareTokensAddresses)
+  const { data: xykPools, isLoading: isXykPoolsLoading } = useXYKSDKPools()
+  const { data: totalIssuances, isLoading: isIssuancesLoading } =
+    useTotalIssuances()
   const spotPrices = useDisplayShareTokenPrice(shareTokensId)
 
   const isLoading =
-    totalIssuances.isInitialLoading ||
-    poolBalances.isInitialLoading ||
-    spotPrices.isInitialLoading
+    isIssuancesLoading || isXykPoolsLoading || spotPrices.isInitialLoading
 
   const data = useMemo(() => {
-    if (
-      !accountShareTokens.length ||
-      !totalIssuances.data ||
-      !poolBalances.data
-    )
-      return []
+    if (!accountShareTokens.length || !totalIssuances || !xykPools) return []
 
     const rows = accountShareTokens.map((myPool) => {
-      const totalIssuance = totalIssuances.data.get(myPool.asset.id)
+      const totalIssuance = totalIssuances.get(myPool.asset.id)
+
+      const poolTokens = xykPools.find(
+        (xykPool) => xykPool.address === myPool.asset.poolAddress,
+      )?.tokens
 
-      const poolBalance = poolBalances.data?.find(
-        (poolBalance) =>
-          poolBalance.accountId.toString() === myPool.asset.poolAddress,
-      )
       const balances = myPool.asset.assets.map((asset) => {
-        const balance =
-          asset.id === native.id
-            ? poolBalance?.native.freeBalance
-            : poolBalance?.balances.find(
-                (balance) => balance.assetId === asset.id,
-              )?.freeBalance
+        const balance = poolTokens?.find(
+          (token) => token.id === asset.id,
+        )?.balance
 
         const myShare = BigNumber(myPool.balance.total).div(totalIssuance ?? 1)
 
@@ -135,14 +123,7 @@ export const useXykPositionsData = ({ search }: { search?: string } = {}) => {
     })
 
     return search ? arraySearch(rows, search, ["symbol", "name"]) : rows
-  }, [
-    accountShareTokens,
-    native.id,
-    poolBalances.data,
-    search,
-    spotPrices.data,
-    totalIssuances,
-  ])
+  }, [accountShareTokens, search, spotPrices.data, totalIssuances, xykPools])
 
   return { data, isLoading }
 }

src/utils/displayAsset.ts

@@ -7,10 +7,10 @@ import { create } from "zustand"
 import { persist } from "zustand/middleware"
 import { STABLECOIN_SYMBOL } from "./constants"
 import { QUERY_KEYS } from "./queryKeys"
-import { useAccountsBalances } from "api/accountBalances"
 import { isNotNil } from "./helpers"
 import { TShareToken, useAssets } from "providers/assets"
 import { useTotalIssuances } from "api/totalIssuance"
+import { useXYKSDKPools } from "api/xyk"
 
 type Props = { id: string; amount: BigNumber }
 
@@ -59,66 +59,60 @@ export const useDisplayPrice = (id: string | u32 | undefined) => {
 //TODO: mb create a hook for a single share token
 export const useDisplayShareTokenPrice = (ids: string[]) => {
   const { getShareTokens, getAssetWithFallback } = useAssets()
-
   const pools = getShareTokens(ids) as TShareToken[]
-  const poolsAddress = pools.map((pool) => pool?.poolAddress) ?? []
 
-  const poolBalances = useAccountsBalances(poolsAddress)
-  const issuances = useTotalIssuances()
+  const { data: xykPools = [], isLoading: isPoolsLoading } = useXYKSDKPools()
+  const { data: issuances, isLoading: isIssuanceLoading } = useTotalIssuances()
 
   const shareTokensTvl = useMemo(() => {
-    return !pools
-      ? []
-      : pools
-          .map((shareToken) => {
-            const { poolAddress } = shareToken ?? {}
+    return pools
+      .map((shareToken) => {
+        const { poolAddress } = shareToken ?? {}
 
-            if (!poolAddress) return undefined
+        if (!poolAddress) return undefined
 
-            const poolBalance = poolBalances.data?.find(
-              (poolBalance) => poolBalance.accountId === poolAddress,
-            )
+        const pool = xykPools.find((pool) => poolAddress === pool.address)
 
-            const assetA = poolBalance?.balances.find((balance) =>
-              shareToken.assets.some((asset) => asset.id === balance.assetId),
-            )
+        if (!pool) return undefined
 
-            if (!assetA) return undefined
+        const { tokens } = pool
+        const [assetA] = tokens
 
-            const assetABalance = BigNumber(assetA.freeBalance).shiftedBy(
-              -getAssetWithFallback(assetA.assetId).decimals,
-            )
+        if (!assetA) return undefined
+        const { balance, decimals, id } = assetA
 
-            const tvl = assetABalance.multipliedBy(2)
+        const assetABalance = BigNumber(balance).shiftedBy(-decimals)
 
-            return {
-              spotPriceId: assetA.assetId,
-              tvl,
-              shareTokenId: shareToken.id,
-            }
-          })
-          .filter(isNotNil)
-  }, [pools, poolBalances.data, getAssetWithFallback])
+        const tvl = assetABalance.multipliedBy(2)
 
-  const spotPrices = useDisplayPrices(
-    shareTokensTvl.map((shareTokenTvl) => shareTokenTvl.spotPriceId),
-  )
+        return {
+          spotPriceId: id,
+          tvl,
+          shareTokenId: shareToken.id,
+        }
+      })
+      .filter(isNotNil)
+  }, [pools, xykPools])
+
+  const { data: spotPrices, isInitialLoading: isSpotPriceLoading } =
+    useDisplayPrices(
+      shareTokensTvl.map((shareTokenTvl) => shareTokenTvl.spotPriceId),
+    )
 
-  const queries = [issuances, poolBalances, spotPrices]
-  const isLoading = queries.some((q) => q.isInitialLoading)
+  const isLoading = isIssuanceLoading || isPoolsLoading || isSpotPriceLoading
 
   const data = useMemo(() => {
     return shareTokensTvl
       .map((shareTokenTvl) => {
-        const spotPrice = spotPrices.data?.find(
+        const spotPrice = spotPrices?.find(
           (spotPrice) => spotPrice?.tokenIn === shareTokenTvl.spotPriceId,
         )
 
         const tvlDisplay = shareTokenTvl.tvl.multipliedBy(
           spotPrice?.spotPrice ?? 1,
         )
 
-        const totalIssuance = issuances.data?.get(shareTokenTvl.shareTokenId)
+        const totalIssuance = issuances?.get(shareTokenTvl.shareTokenId)
 
         const shareTokenMeta = getAssetWithFallback(shareTokenTvl.shareTokenId)
 
@@ -135,7 +129,7 @@ export const useDisplayShareTokenPrice = (ids: string[]) => {
         }
       })
       .filter(isNotNil)
-  }, [getAssetWithFallback, issuances.data, shareTokensTvl, spotPrices.data])
+  }, [getAssetWithFallback, issuances, shareTokensTvl, spotPrices])
 
   return { data, isLoading, isInitialLoading: isLoading }
 }