fix: farm stale data

src/pages/ElasticSwap/hooks/index.ts

@@ -371,7 +371,7 @@ function useElasticAllRoutes(
   const { chainId } = useActiveWeb3React()
   const { pools, loading: poolsLoading } = useProAmmSwapPools(currencyIn, currencyOut)
   return useMemo(() => {
-    if (poolsLoading || !chainId || !pools || !currencyIn || !currencyOut) return { loading: true, routes: [] }
+    if (poolsLoading || !pools || !currencyIn || !currencyOut) return { loading: true, routes: [] }
 
     const routes = computeAllRoutes(currencyIn, currencyOut, pools, chainId, [], [], currencyIn, 1)
 
@@ -592,13 +592,13 @@ function useSwapCallArguments(
   trade: Trade<Currency, Currency, TradeType> | undefined,
   allowedSlippage = INITIAL_ALLOWED_SLIPPAGE,
 ): SwapCall[] {
-  const { account, chainId, networkInfo } = useActiveWeb3React()
+  const { account, networkInfo } = useActiveWeb3React()
   const { library } = useWeb3React()
 
   const deadline = useTransactionDeadline()
 
   return useMemo(() => {
-    if (!trade || !account || !library || !account || !chainId || !deadline) return []
+    if (!trade || !account || !library || !account || !deadline) return []
 
     const routerProAmmContract: Contract | null = getContract(
       (networkInfo as EVMNetworkInfo).elastic.routers,
@@ -621,5 +621,5 @@ function useSwapCallArguments(
         value,
       },
     ]
-  }, [networkInfo, allowedSlippage, chainId, deadline, library, account, trade])
+  }, [networkInfo, allowedSlippage, deadline, library, account, trade])
 }

src/pages/RemoveLiquidityProAmm/index.tsx

@@ -341,7 +341,6 @@ function Remove({ tokenId }: { tokenId: BigNumber }) {
       !liquidityValue1 ||
       !deadline ||
       !account ||
-      !chainId ||
       !feeValue0 ||
       !feeValue1 ||
       !positionSDK ||

src/state/farms/elastic/hooks.ts

@@ -10,7 +10,6 @@ import { useSearchParams } from 'react-router-dom'
 import ELASTIC_FARM_ABI from 'constants/abis/v2/farm.json'
 import { ELASTIC_FARM_TYPE, FARM_TAB } from 'constants/index'
 import { CONTRACT_NOT_FOUND_MSG } from 'constants/messages'
-import { isEVM as isEVMNetwork } from 'constants/networks'
 import { EVMNetworkInfo } from 'constants/networks/type'
 import { useActiveWeb3React } from 'hooks'
 import { useTokens } from 'hooks/Tokens'
@@ -36,9 +35,8 @@ export { default as FarmUpdater } from './updaters'
 
 export const useElasticFarms = () => {
   const { chainId } = useActiveWeb3React()
-  const isEVM = isEVMNetwork(chainId)
-  const elasticFarm = useAppSelector(state => state.elasticFarm[chainId])
-  return useMemo(() => (isEVM ? elasticFarm || defaultChainData : defaultChainData), [isEVM, elasticFarm])
+  const elasticFarm = useAppSelector(state => state.elasticFarm[chainId] || defaultChainData)
+  return elasticFarm
 }
 
 export const useFilteredFarms = () => {

src/state/farms/elastic/updaters/v1.tsx

@@ -142,7 +142,7 @@ const defaultChainData = {
 const FarmUpdaterV1: React.FC<CommonProps> = ({ interval }) => {
   const dispatch = useAppDispatch()
   const { chainId } = useActiveWeb3React()
-  const elasticFarm = useAppSelector(state => state.elasticFarm)[chainId || 1] || defaultChainData
+  const elasticFarm = useAppSelector(state => state.elasticFarm[chainId] || defaultChainData)
   const { elasticClient } = useKyberSwapConfig()
 
   const [getElasticFarms, { data, error }] = useLazyQuery(ELASTIC_FARM_QUERY, {
@@ -179,8 +179,9 @@ const FarmUpdaterV1: React.FC<CommonProps> = ({ interval }) => {
     }
   }, [error, dispatch, chainId])
 
+  const hasFarm = !!elasticFarm?.farms?.length
   useEffect(() => {
-    if (data?.farms && chainId && !elasticFarm?.farms?.length) {
+    if (data?.farms && chainId && !hasFarm) {
       // transform farm data
       const formattedData: ElasticFarm[] = data.farms.map((farm: SubgraphFarm) => {
         return {
@@ -268,7 +269,7 @@ const FarmUpdaterV1: React.FC<CommonProps> = ({ interval }) => {
       })
       dispatch(setFarms({ chainId, farms: formattedData }))
     }
-  }, [data, dispatch, chainId, elasticFarm])
+  }, [data, dispatch, chainId, hasFarm])
 
   return null
 }

src/state/farms/elasticv2/updater.tsx

@@ -6,7 +6,7 @@ import { CurrencyAmount, Token, WETH } from '@kyberswap/ks-sdk-core'
 import { FeeAmount, Pool, Position } from '@kyberswap/ks-sdk-elastic'
 import { BigNumber } from 'ethers'
 import { Interface } from 'ethers/lib/utils'
-import { useEffect, useMemo, useRef } from 'react'
+import { useEffect, useRef } from 'react'
 import { useLazyGetFarmV2Query } from 'services/knprotocol'
 
 import FarmV2QuoterABI from 'constants/abis/farmv2Quoter.json'
@@ -17,11 +17,12 @@ import { NativeCurrencies } from 'constants/tokens'
 import { useActiveWeb3React } from 'hooks'
 import { useContract, useMulticallContract } from 'hooks/useContract'
 import { useKyberSwapConfig } from 'state/application/hooks'
-import { useAppDispatch, useAppSelector } from 'state/hooks'
+import { useAppDispatch } from 'state/hooks'
 import { useTokenPricesWithLoading } from 'state/tokenPrices/hooks'
 import { isAddressString } from 'utils'
+import { timeout } from 'utils/retry'
 
-import { defaultChainData, setFarms, setLoading, setUserFarmInfo } from '.'
+import { setFarms, setLoading, setUserFarmInfo } from '.'
 import { ElasticFarmV2, SubgraphFarmV2, SubgraphToken, UserFarmV2Info } from './types'
 
 const positionManagerInterface = new Interface(NFTPositionManagerABI.abi)
@@ -106,7 +107,6 @@ const queryFarms = gql`
 export default function ElasticFarmV2Updater({ interval = true }: { interval?: boolean }) {
   const dispatch = useAppDispatch()
   const { networkInfo, isEVM, chainId, account } = useActiveWeb3React()
-  const elasticFarm = useAppSelector(state => state.elasticFarmV2[chainId] || defaultChainData)
   const { elasticClient, isEnableKNProtocol } = useKyberSwapConfig()
 
   const multicallContract = useMulticallContract()
@@ -115,82 +115,56 @@ export default function ElasticFarmV2Updater({ interval = true }: { interval?: b
     FarmV2QuoterABI,
   )
 
-  const [getElasticFarmV2, { data: subgraphData, error: subgraphError }] = useLazyQuery(queryFarms, {
+  const [getElasticFarmV2] = useLazyQuery<{ farmV2S: SubgraphFarmV2[] }>(queryFarms, {
     client: elasticClient,
     fetchPolicy: 'network-only',
   })
 
-  const [getElasticFarmV2FromKnProtocol, { data: knProtocolData, error: knProtocolError }] = useLazyGetFarmV2Query()
+  const [getElasticFarmV2FromKnProtocol] = useLazyGetFarmV2Query()
 
-  const latestKnProtocolData = useRef(knProtocolData)
-
-  const data = useMemo(() => {
-    if (isEnableKNProtocol) {
-      return {
-        farmV2S: knProtocolData?.data?.data || latestKnProtocolData.current?.data?.data || [],
-      }
-    } else return subgraphData
-  }, [isEnableKNProtocol, knProtocolData, subgraphData])
-
-  const error = useMemo(() => {
-    if (isEnableKNProtocol) return knProtocolError
-    return subgraphError
-  }, [isEnableKNProtocol, subgraphError, knProtocolError])
-  const isLoadingElasticFarm = useRef(elasticFarm.loading)
-  isLoadingElasticFarm.current = elasticFarm.loading
+  const { fetchPrices } = useTokenPricesWithLoading([])
+  const tokensRef = useRef<string[]>([])
+  const pricesRef = useRef<{ [key: string]: number | undefined }>({})
 
   useEffect(() => {
-    if (isEVM && !elasticFarm?.farms && !isLoadingElasticFarm.current) {
-      dispatch(setLoading({ chainId, loading: true }))
-      if (isEnableKNProtocol) {
-        getElasticFarmV2FromKnProtocol(chainId).finally(() => {
-          dispatch(setLoading({ chainId, loading: false }))
-        })
-      } else
-        getElasticFarmV2().finally(() => {
-          dispatch(setLoading({ chainId, loading: false }))
-        })
+    const controller = new AbortController()
+    const fetchData = async (): Promise<{ farmV2S: SubgraphFarmV2[]; error?: Error }> => {
+      if (isEVM) {
+        if (isEnableKNProtocol) {
+          try {
+            return { farmV2S: (await getElasticFarmV2FromKnProtocol(chainId))?.data?.data?.data || [] }
+          } catch (error) {
+            return { farmV2S: [], error }
+          }
+        } else {
+          try {
+            // Somehow, getElasticFarmV2() doesn't resolve nor reject so we might got an infinity await here
+            // Hence, we have to add an additional timeout to handle case it won't resolved
+            const result = (await timeout(getElasticFarmV2(), 5000)).data
+            return {
+              farmV2S: result?.farmV2S || [],
+            }
+          } catch (error) {
+            return { farmV2S: [], error }
+          }
+        }
+      }
+      return { farmV2S: [] }
     }
-  }, [
-    isEVM,
-    chainId,
-    dispatch,
-    getElasticFarmV2,
-    elasticFarm?.farms,
-    getElasticFarmV2FromKnProtocol,
-    isEnableKNProtocol,
-  ])
 
-  useEffect(() => {
-    const i = interval
-      ? setInterval(() => {
-          if (isEnableKNProtocol) getElasticFarmV2FromKnProtocol(chainId)
-          else getElasticFarmV2()
-        }, 10_000)
-      : undefined
-    return () => {
-      i && clearInterval(i)
-    }
-  }, [interval, chainId, dispatch, getElasticFarmV2, getElasticFarmV2FromKnProtocol, isEnableKNProtocol])
+    const run = async () => {
+      dispatch(setLoading({ chainId, loading: true }))
+      const { farmV2S, error } = await fetchData()
 
-  useEffect(() => {
-    if (error && chainId) {
-      dispatch(setFarms({ chainId, farms: [] }))
+      if (controller.signal.aborted) return
       dispatch(setLoading({ chainId, loading: false }))
-    }
-  }, [error, dispatch, chainId])
-
-  const { fetchPrices } = useTokenPricesWithLoading([])
-
-  const tokensRef = useRef<string[]>([])
-  const pricesRef = useRef<{ [key: string]: number | undefined }>({})
 
-  useEffect(() => {
-    const getData = async () => {
-      if (data?.farmV2S.length && chainId) {
+      if (error) {
+        dispatch(setFarms({ chainId, farms: [] }))
+      } else if (farmV2S.length) {
         const tokens = [
           ...new Set(
-            data.farmV2S
+            farmV2S
               .map((item: SubgraphFarmV2) => [
                 item.pool.token0.id,
                 item.pool.token1.id,
@@ -211,7 +185,7 @@ export default function ElasticFarmV2Updater({ interval = true }: { interval?: b
           pricesRef.current = prices
         }
 
-        const formattedData: ElasticFarmV2[] = data.farmV2S.map((farm: SubgraphFarmV2) => {
+        const formattedData: ElasticFarmV2[] = farmV2S.map((farm: SubgraphFarmV2) => {
           const getToken = (t: SubgraphToken, keepWrapped = false) => {
             const address = isAddressString(chainId, t.id)
             return (keepWrapped ? false : address === WETH[chainId].address) || address === ZERO_ADDRESS
@@ -322,6 +296,7 @@ export default function ElasticFarmV2Updater({ interval = true }: { interval?: b
           }
         })
 
+        if (controller.signal.aborted) return
         dispatch(setFarms({ chainId, farms: formattedData }))
 
         const farmAddresses = [...new Set(formattedData.map(item => item.farmAddress))]
@@ -463,15 +438,39 @@ export default function ElasticFarmV2Updater({ interval = true }: { interval?: b
             }),
           )
 
+          if (controller.signal.aborted) return
           dispatch(setUserFarmInfo({ chainId, userInfo: userFarmInfos.flat() }))
         } else {
+          if (controller.signal.aborted) return
           dispatch(setUserFarmInfo({ chainId, userInfo: [] }))
         }
+      } else {
+        dispatch(setFarms({ chainId, farms: [] }))
+        dispatch(setUserFarmInfo({ chainId, userInfo: [] }))
       }
     }
 
-    getData()
-  }, [fetchPrices, networkInfo, chainId, dispatch, data, account, farmv2QuoterContract, multicallContract])
+    run()
+    const i = interval ? setInterval(run, 10_000) : undefined
+
+    return () => {
+      controller.abort()
+      i && clearInterval(i)
+    }
+  }, [
+    account,
+    chainId,
+    dispatch,
+    farmv2QuoterContract,
+    fetchPrices,
+    getElasticFarmV2,
+    getElasticFarmV2FromKnProtocol,
+    interval,
+    isEVM,
+    isEnableKNProtocol,
+    multicallContract,
+    networkInfo,
+  ])
 
   return null
 }

src/utils/retry.ts

@@ -75,3 +75,7 @@ export const timeoutReject = (ms: number, msg = 'timeout') => {
     }, ms)
   })
 }
+
+export const timeout = <T>(promise: Promise<T>, ms: number): Promise<T> => {
+  return Promise.race([promise, timeoutReject(ms)]) as Promise<T>
+}