perf: Use callback on aptos query select

apps/aptos/components/Farms/components/FarmCard/ApyButton.tsx

@@ -5,7 +5,7 @@ import { BIG_ZERO } from '@pancakeswap/utils/bigNumber'
 import { FarmWidget } from '@pancakeswap/widgets-internal'
 import BigNumber from 'bignumber.js'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
-import { useMemo } from 'react'
+import { useCallback, useMemo } from 'react'
 import { useFarmUserInfoCache } from 'state/farms/hook'
 import { FARM_DEFAULT_DECIMALS } from '../../constants'
 
@@ -55,7 +55,7 @@ const ApyButton: React.FC<React.PropsWithChildren<ApyButtonProps>> = ({
     watch: true,
     address: account,
     coin: lpAddress,
-    select: (d) => new BigNumber(d.value),
+    select: useCallback((d) => new BigNumber(d.value), []),
   })
 
   let userBalanceInFarm = BIG_ZERO

apps/aptos/components/Farms/components/FarmTable/Actions/StakedAction.tsx

@@ -16,7 +16,7 @@ import useActiveWeb3React from 'hooks/useActiveWeb3React'
 import useCatchTxError from 'hooks/useCatchTxError'
 import { usePriceCakeUsdc } from 'hooks/useStablePrice'
 import { useRouter } from 'next/router'
-import { useMemo } from 'react'
+import { useCallback, useMemo } from 'react'
 import { logGTMClickStakeFarmEvent, logGTMClickUnStakeFarmEvent } from 'utils/customGTMEventTracking'
 import getLiquidityUrlPathParts from 'utils/getLiquidityUrlPathParts'
 import useStakeFarms from '../../../hooks/useStakeFarms'
@@ -49,7 +49,7 @@ export const StakedContainer = ({ children, ...props }) => {
     watch: true,
     address: account,
     coin: props.lpAddress,
-    select: (d) => new BigNumber(d.value),
+    select: useCallback((d) => new BigNumber(d.value), []),
   })
 
   const userData = useMemo(

apps/aptos/components/Liquidity/hooks/useLPPairsHaveBalance.ts

@@ -1,9 +1,10 @@
 import { Pair, PAIR_LP_TYPE_TAG, PAIR_RESERVE_TYPE_TAG } from '@pancakeswap/aptos-swap-sdk'
 import { useAccount, useAccountBalances } from '@pancakeswap/awgmi'
 import { unwrapTypeFromString } from '@pancakeswap/awgmi/core'
-import { useMemo } from 'react'
+import { useCallback, useMemo } from 'react'
 
 import { PairState, usePairsFromAddresses } from 'hooks/usePairs'
+import { UseAccountBalancesResult } from '@pancakeswap/awgmi/src/hooks/useAccountBalances'
 
 function filterPair(v2Pairs): Pair[] {
   return v2Pairs?.length
@@ -22,7 +23,11 @@ export default function useLPPairsHaveBalance(): LPPairsResponse {
   const balances = useAccountBalances({
     watch: true,
     address: account?.address,
-    select: (balance) => (balance.address.includes(PAIR_LP_TYPE_TAG) && balance.value !== '0' ? balance : null),
+    select: useCallback(
+      (balance: UseAccountBalancesResult) =>
+        balance.address.includes(PAIR_LP_TYPE_TAG) && balance.value !== '0' ? balance : null,
+      [],
+    ),
   })
   const isPending = useMemo(() => balances.some((b) => b.isPending), [balances])
   const mmV2PairsBalances = useMemo(

apps/aptos/components/Pools/hooks/usePoolsList.ts

@@ -15,6 +15,7 @@ import { Coin, Pair, PAIR_LP_TYPE_TAG } from '@pancakeswap/aptos-swap-sdk'
 import { CAKE_PID } from 'config/constants'
 import { useInterval, useLastUpdated } from '@pancakeswap/hooks'
 
+import { FetchAccountResourcesResult } from '@pancakeswap/awgmi/core'
 import { PoolResource } from '../types'
 import transformCakePool from '../transformers/transformCakePool'
 import transformPool from '../transformers/transformPool'
@@ -35,20 +36,17 @@ export const usePoolsList = () => {
   const { data: pools } = useAccountResources({
     networkName,
     address: SMARTCHEF_ADDRESS,
-    select: (resources) => {
+    select: useCallback((resources: FetchAccountResourcesResult) => {
       return resources.filter(
         // ignore LP Token Type for now
         (resource) => resource.type.includes(SMARTCHEF_POOL_INFO_TYPE_TAG) && !resource.type.includes(PAIR_LP_TYPE_TAG),
       )
-    },
+    }, []),
     staleTime: POOL_RESOURCE_STALE_TIME,
   })
 
   const { data: balances } = useAccountResources({
     address: account,
-    select: (resources) => {
-      return resources
-    },
     staleTime: POOL_RESOURCE_STALE_TIME,
   })
 

apps/aptos/components/SearchModal/CurrencyList.tsx

@@ -75,9 +75,12 @@ function CurrencyRow({
     address: account,
     coin: key,
     watch: true,
-    select: (d) => {
-      return CurrencyAmount.fromRawAmount(currency, d.value)
-    },
+    select: useCallback(
+      (d) => {
+        return CurrencyAmount.fromRawAmount(currency, d.value)
+      },
+      [currency],
+    ),
   })
 
   // only show add or remove buttons if not on selected list

apps/aptos/hooks/Tokens.ts

@@ -1,7 +1,12 @@
 /* eslint-disable no-param-reassign */
 import { Coin, Currency, CurrencyAmount, Token } from '@pancakeswap/aptos-swap-sdk'
 import { APTOS_COIN, useAccount, useAccountResources, useCoin, useCoins as useCoins_ } from '@pancakeswap/awgmi'
-import { coinStoreResourcesFilter, unwrapTypeFromString } from '@pancakeswap/awgmi/core'
+import {
+  coinStoreResourcesFilter,
+  FetchAccountResourcesResult,
+  FetchCoinResult,
+  unwrapTypeFromString,
+} from '@pancakeswap/awgmi/core'
 import { useAtomValue } from 'jotai'
 import fromPairs from 'lodash/fromPairs'
 import { useCallback, useMemo } from 'react'
@@ -34,12 +39,15 @@ export function useToken(coinId?: string) {
           symbol: token.symbol,
         }
       : undefined,
-    select: (d) => {
-      const { decimals, symbol, name } = d
-      if (token) return token
-      if (!coinId) return undefined
-      return new Coin(chainId, coinId, decimals, symbol, name)
-    },
+    select: useCallback(
+      (d: FetchCoinResult) => {
+        const { decimals, symbol, name } = d
+        if (token) return token
+        if (!coinId) return undefined
+        return new Coin(chainId, coinId, decimals, symbol, name)
+      },
+      [chainId, coinId, token],
+    ),
   })
 
   return coin
@@ -124,22 +132,25 @@ export function useAllTokenBalances() {
   const accountResources = useAccountResources({
     address: useAccount()?.account?.address,
     watch: true,
-    select: (data) => {
-      const coinStore = data
-        .filter(coinStoreResourcesFilter)
-        .map((coin) => {
-          const address = unwrapTypeFromString(coin.type)
-
-          if (address && allTokens[address]) {
-            return [address, CurrencyAmount.fromRawAmount(allTokens[address], (coin.data as any).coin.value)]
-          }
-          return null
-        })
-        .filter(Boolean) as [string, CurrencyAmount<Coin>][]
-
-      const pairs = fromPairs(coinStore)
-      return pairs
-    },
+    select: useCallback(
+      (data: FetchAccountResourcesResult) => {
+        const coinStore = data
+          .filter(coinStoreResourcesFilter)
+          .map((coin) => {
+            const address = unwrapTypeFromString(coin.type)
+
+            if (address && allTokens[address]) {
+              return [address, CurrencyAmount.fromRawAmount(allTokens[address], (coin.data as any).coin.value)]
+            }
+            return null
+          })
+          .filter(Boolean) as [string, CurrencyAmount<Coin>][]
+
+        const pairs = fromPairs(coinStore)
+        return pairs
+      },
+      [allTokens],
+    ),
   })
 
   return accountResources.data

apps/aptos/views/Ifos/hooks/useIfoResources.ts

@@ -12,6 +12,8 @@ import { RootObject as IFOPoolStore } from 'views/Ifos/generated/IFOPoolStore'
 import { RootObject as VestingMetadata } from 'views/Ifos/generated/VestingMetadata'
 import { Ifo } from 'config/constants/types'
 import useActiveWeb3React from 'hooks/useActiveWeb3React'
+import { useCallback } from 'react'
+import { FetchAccountResourcesResult } from '@pancakeswap/awgmi/core'
 
 interface ResourceType {
   [IFO_RESOURCE_ACCOUNT_TYPE_METADATA]?: IFOMetadata
@@ -27,45 +29,48 @@ export const useIfoResourcesListByUserInfoType = (userInfoTypes?: string[]) => {
     enabled: Boolean(userInfoTypes?.length),
     address: IFO_ADDRESS,
     watch: true,
-    select: (data) => {
-      let resourcesList = {}
+    select: useCallback(
+      (data: FetchAccountResourcesResult) => {
+        let resourcesList = {}
 
-      for (const it of data) {
-        const res: ResourceType = {}
-        const [raisingCoin, offeringCoin, uid] = splitTypeTag(it.type)
+        for (const it of data) {
+          const res: ResourceType = {}
+          const [raisingCoin, offeringCoin, uid] = splitTypeTag(it.type)
 
-        const foundType = userInfoTypes?.find((type) => {
-          const [userRaisingCoin, userOfferingCoin, userUid] = splitTypeTag(type)
+          const foundType = userInfoTypes?.find((type) => {
+            const [userRaisingCoin, userOfferingCoin, userUid] = splitTypeTag(type)
 
-          if (raisingCoin === userRaisingCoin && offeringCoin === userOfferingCoin) {
-            if (uid && uid !== userUid) return false
+            if (raisingCoin === userRaisingCoin && offeringCoin === userOfferingCoin) {
+              if (uid && uid !== userUid) return false
 
-            return true
-          }
+              return true
+            }
 
-          return false
-        })
+            return false
+          })
 
-        if (foundType) {
-          const parsedTypeTag = parseTypeTag(it.type)
-          if (parsedTypeTag.isStruct()) {
-            const key = parsedTypeTag.value.name.identifier
+          if (foundType) {
+            const parsedTypeTag = parseTypeTag(it.type)
+            if (parsedTypeTag.isStruct()) {
+              const key = parsedTypeTag.value.name.identifier
 
-            res[key] = it
+              res[key] = it
 
-            resourcesList = {
-              ...resourcesList,
-              [foundType]: {
-                ...resourcesList[foundType],
-                [key]: it,
-              },
+              resourcesList = {
+                ...resourcesList,
+                [foundType]: {
+                  ...resourcesList[foundType],
+                  [key]: it,
+                },
+              }
             }
           }
         }
-      }
 
-      return resourcesList
-    },
+        return resourcesList
+      },
+      [userInfoTypes],
+    ),
   })
 }
 
@@ -79,28 +84,31 @@ export const useIfoResources = (ifo: Ifo | undefined) => {
     networkName,
     address: IFO_ADDRESS,
     watch: true,
-    select: (data) => {
-      const res: {
-        [IFO_RESOURCE_ACCOUNT_TYPE_METADATA]?: IFOMetadata
-        [IFO_RESOURCE_ACCOUNT_TYPE_POOL_STORE]?: IFOPoolStore
-        [IFO_RESOURCE_ACCOUNT_TYPE_VESTING_METADATA]?: VestingMetadata
-      } = {}
+    select: useCallback(
+      (data: FetchAccountResourcesResult) => {
+        const res: {
+          [IFO_RESOURCE_ACCOUNT_TYPE_METADATA]?: IFOMetadata
+          [IFO_RESOURCE_ACCOUNT_TYPE_POOL_STORE]?: IFOPoolStore
+          [IFO_RESOURCE_ACCOUNT_TYPE_VESTING_METADATA]?: VestingMetadata
+        } = {}
 
-      for (const it of data) {
-        const [raisingCoin, offeringCoin, uid] = splitTypeTag(it.type)
+        for (const it of data) {
+          const [raisingCoin, offeringCoin, uid] = splitTypeTag(it.type)
 
-        if (ifoRaisingCoin === raisingCoin && ifoOfferingCoin === offeringCoin) {
-          if (uid && uid !== ifoUid) break
+          if (ifoRaisingCoin === raisingCoin && ifoOfferingCoin === offeringCoin) {
+            if (uid && uid !== ifoUid) break
 
-          const parsedTypeTag = parseTypeTag(it.type)
+            const parsedTypeTag = parseTypeTag(it.type)
 
-          if (parsedTypeTag.isStruct()) {
-            res[parsedTypeTag.value.name.identifier] = it
+            if (parsedTypeTag.isStruct()) {
+              res[parsedTypeTag.value.name.identifier] = it
+            }
           }
         }
-      }
 
-      return res
-    },
+        return res
+      },
+      [ifoOfferingCoin, ifoOfferingCoin, ifoUid],
+    ),
   })
 }

apps/aptos/views/Ifos/hooks/useIfoUserInfo.ts

@@ -2,6 +2,8 @@ import { useAccount, useAccountResources } from '@pancakeswap/awgmi'
 import { ifos } from 'config/constants/ifo'
 import { RootObject as UserInfo } from 'views/Ifos/generated/UserInfo'
 import { IFO_RESOURCE_ACCOUNT_TYPE_POOL_STORE, USER_IFO_POOL_TAG, IFO_TYPE_USER_INFO } from 'views/Ifos/constants'
+import { useCallback } from 'react'
+import { FetchAccountResourcesResult } from '@pancakeswap/awgmi/core'
 
 export const useIfoUserInfoList = () => {
   const { account } = useAccount()
@@ -10,11 +12,11 @@ export const useIfoUserInfoList = () => {
     enabled: !!account,
     address: account?.address,
     watch: true,
-    select: (resources) => {
+    select: useCallback((resources: FetchAccountResourcesResult) => {
       return resources.filter((resource) => {
         return resource.type.includes(USER_IFO_POOL_TAG)
       }) as UserInfo[]
-    },
+    }, []),
   })
 }
 
@@ -25,10 +27,13 @@ export const useIfoUserInfo = (poolType) => {
     enabled: !!account && !!ifos[0],
     address: account?.address,
     watch: true,
-    select: (data) => {
-      return data.find((it) => {
-        return it.type === poolType?.replace(IFO_RESOURCE_ACCOUNT_TYPE_POOL_STORE, IFO_TYPE_USER_INFO)
-      }) as UserInfo | undefined
-    },
+    select: useCallback(
+      (data: FetchAccountResourcesResult) => {
+        return data.find((it) => {
+          return it.type === poolType?.replace(IFO_RESOURCE_ACCOUNT_TYPE_POOL_STORE, IFO_TYPE_USER_INFO)
+        }) as UserInfo | undefined
+      },
+      [poolType],
+    ),
   })
 }