Merge pull request #267 from curvefi/task/add-native-wrapped-to-route…

…r-swap task: add native and wrapped native to router swap for all chains
curvefi · Jul 25, 2024 · d20ec6e · d20ec6e
2 parents 36df3bd + 4aa1756
commit d20ec6e
Show file tree

Hide file tree

Showing 15 changed files with 153 additions and 136 deletions.
diff --git a/apps/main/src/components/PagePoolList/components/TableCellTvl.tsx b/apps/main/src/components/PagePoolList/components/TableCellTvl.tsx
@@ -4,7 +4,7 @@ import { Chip } from '@/ui/Typography'
 
 type Props = {
   isHighLight: boolean
-  tvlCached: Tvl | undefined
+  tvlCached: { value: string } | undefined
   tvl: Tvl | undefined
 }
 

diff --git a/apps/main/src/components/PagePoolList/components/TableCellVolume.tsx b/apps/main/src/components/PagePoolList/components/TableCellVolume.tsx
@@ -4,7 +4,7 @@ import { Chip } from '@/ui/Typography'
 
 type Props = {
   isHighLight: boolean
-  volumeCached: Volume | undefined
+  volumeCached: { value: string } | undefined
   volume: Volume | undefined
 }
 

diff --git a/apps/main/src/components/PagePoolList/components/TableRow.tsx b/apps/main/src/components/PagePoolList/components/TableRow.tsx
@@ -33,9 +33,9 @@ export type TableRowProps = {
   showInPoolColumn: boolean
   tokensMapper: TokensMapper
   campaignRewardsMapper: CampaignRewardsMapper
-  tvlCached: Tvl | undefined
+  tvlCached: { value: string } | undefined
   tvl: Tvl | undefined
-  volumeCached: Volume | undefined
+  volumeCached: { value: string } | undefined
   volume: Volume | undefined
   handleCellClick(target: EventTarget, formType?: 'swap' | 'withdraw'): void
 }

diff --git a/apps/main/src/components/PagePoolList/index.tsx b/apps/main/src/components/PagePoolList/index.tsx
@@ -55,7 +55,6 @@ const PoolList = ({ rChainId, curve, searchParams, tableLabels, updatePath }: Pa
   const results = useStore((state) => state.poolList.result)
   const resultRewardsCrvCount = useStore((state) => state.poolList.resultRewardsCrvCount)
   const resultRewardsOtherCount = useStore((state) => state.poolList.resultRewardsOtherCount)
-  const rewardsApyMapperCached = useStore((state) => state.storeCache.rewardsApyMapper[rChainId])
   const rewardsApyMapper = useStore((state) => state.pools.rewardsApyMapper[rChainId])
   const showHideSmallPools = useStore((state) => state.poolList.showHideSmallPools)
   const tvlMapperCached = useStore((state) => state.storeCache.tvlMapper[rChainId])
@@ -79,20 +78,13 @@ const PoolList = ({ rChainId, curve, searchParams, tableLabels, updatePath }: Pa
   const poolDatasCached = getPoolDatasCached(poolDataMapperCached)
   const poolDatasCachedOrApi = poolDatas ?? poolDatasCached
   const poolDatasLength = (poolDatasCachedOrApi ?? []).length
-  const rewardsApyMapperCachedOrApi = useMemo(
-    () => rewardsApyMapper ?? rewardsApyMapperCached ?? {},
-    [rewardsApyMapper, rewardsApyMapperCached]
-  )
   const tvlMapperCachedOrApi = useMemo(() => tvlMapper ?? tvlMapperCached ?? {}, [tvlMapper, tvlMapperCached])
   const volumeMapperCachedOrApi = useMemo(
     () => volumeMapper ?? volumeMapperCached ?? {},
     [volumeMapper, volumeMapperCached]
   )
 
-  const rewardsApyMapperStr = useMemo(
-    () => getRewardsApyStr(rewardsApyMapper, rewardsApyMapperCached),
-    [rewardsApyMapper, rewardsApyMapperCached]
-  )
+  const rewardsApyMapperStr = useMemo(() => getRewardsApyStr(rewardsApyMapper, {}), [rewardsApyMapper])
 
   const userPoolListStr = useMemo(() => getUserPoolListStr(userPoolList), [userPoolList])
   const volumeMapperStr = useMemo(() => getVolumeTvlStr(volumeMapper), [volumeMapper])
@@ -122,7 +114,7 @@ const PoolList = ({ rChainId, curve, searchParams, tableLabels, updatePath }: Pa
         rChainId,
         searchParams,
         poolDatasCachedOrApi,
-        rewardsApyMapperCachedOrApi,
+        rewardsApyMapper,
         volumeMapperCachedOrApi,
         tvlMapperCachedOrApi,
         userPoolList,
@@ -132,7 +124,7 @@ const PoolList = ({ rChainId, curve, searchParams, tableLabels, updatePath }: Pa
     [
       rChainId,
       poolDatasCachedOrApi,
-      rewardsApyMapperCachedOrApi,
+      rewardsApyMapper,
       setFormValues,
       tvlMapperCachedOrApi,
       volumeMapperCachedOrApi,
@@ -292,7 +284,6 @@ const PoolList = ({ rChainId, curve, searchParams, tableLabels, updatePath }: Pa
             </tr>
           ) : Array.isArray(result) &&
             Object.keys(poolDataMapperCached ?? {}).length &&
-            Object.keys(volumeMapperCached ?? {}).length &&
             Object.keys(tvlMapperCached ?? {}).length ? (
             <>
               {result.map((poolId: string, index: number) => (

diff --git a/apps/main/src/hooks/useCampaignRewardsMapper.tsx b/apps/main/src/hooks/useCampaignRewardsMapper.tsx
@@ -1,12 +1,5 @@
-import { useMemo } from 'react'
-
 import useStore from '@/store/useStore'
 
-const useCampaignRewardsMapper = () => {
-  const cached = useStore((state) => state.storeCache.campaignRewardsMapper)
-  const api = useStore((state) => state.campaigns.campaignRewardsMapper)
-  const campaignRewardsMapper = useMemo(() => api ?? cached ?? {}, [api, cached])
-  return campaignRewardsMapper
-}
+const useCampaignRewardsMapper = () => useStore((state) => state.campaigns.campaignRewardsMapper)
 
 export default useCampaignRewardsMapper
diff --git a/apps/main/src/hooks/useTokensMapper.tsx b/apps/main/src/hooks/useTokensMapper.tsx
@@ -4,9 +4,7 @@ import { getTokensMapperStr } from '@/store/createTokensSlice'
 import useStore from '@/store/useStore'
 
 const useTokensMapper = (rChainId: ChainId | '') => {
-  const cached = useStore((state) => state.storeCache.tokensMapper[rChainId])
-  const api = useStore((state) => state.tokens.tokensMapper[rChainId])
-  const tokensMapper = useMemo(() => api ?? cached ?? {}, [api, cached])
+  const tokensMapper = useStore((state) => state.tokens.tokensMapper[rChainId] ?? {})
   const tokensMapperStr = useMemo(() => getTokensMapperStr(tokensMapper), [tokensMapper])
   return { tokensMapper, tokensMapperStr }
 }

diff --git a/apps/main/src/hooks/useTokensNameMapper.tsx b/apps/main/src/hooks/useTokensNameMapper.tsx
@@ -3,9 +3,7 @@ import { useMemo } from 'react'
 import useStore from '@/store/useStore'
 
 const useTokensNameMapper = (rChainId: ChainId | '') => {
-  const cached = useStore((state) => state.storeCache.tokensNameMapper[rChainId])
-  const api = useStore((state) => state.tokens.tokensNameMapper[rChainId])
-  const tokensNameMapper = useMemo(() => api ?? cached ?? {}, [api, cached])
+  const tokensNameMapper = useStore((state) => state.tokens.tokensNameMapper[rChainId] ?? {})
   const tokensNameMapperStr = useMemo(() => {
     return Object.keys(tokensNameMapper).reduce((str, address) => {
       str += address.charAt(5)

diff --git a/apps/main/src/layout/default/Header.tsx b/apps/main/src/layout/default/Header.tsx
@@ -43,11 +43,8 @@ const Header = () => {
   const isLgUp = useStore((state) => state.isLgUp)
   const locale = useStore((state) => state.locale)
   const pageWidth = useStore((state) => state.pageWidth)
-  const tvlTotalCached = useStore((state) => state.storeCache.tvlTotal?.[rChainId])
   const tvlTotal = useStore((state) => state.pools.tvlTotal)
-  const volumeTotalCached = useStore((state) => state.storeCache.volumeTotal?.[rChainId])
   const volumeTotal = useStore((state) => state.pools.volumeTotal)
-  const volumeCryptoShareCached = useStore((state) => state.storeCache.volumeCryptoShare?.[rChainId])
   const volumeCryptoShare = useStore((state) => state.pools.volumeCryptoShare)
   const themeType = useStore((state) => state.themeType)
   const setThemeType = useStore((state) => state.setThemeType)
@@ -69,9 +66,9 @@ const Header = () => {
 
   // prettier-ignore
   const appStats = [
-    { label: t`Total Deposits`, value: formatNumber(tvlTotal ?? tvlTotalCached, { currency: 'USD', showDecimalIfSmallNumberOnly: true }) },
-    { label: t`Daily Volume`, value: formatNumber(volumeTotal ?? volumeTotalCached, { currency: 'USD', showDecimalIfSmallNumberOnly: true }) },
-    { label: t`Crypto Volume Share`, value: formatNumber(volumeCryptoShare ?? volumeCryptoShareCached, FORMAT_OPTIONS.PERCENT) },
+    { label: t`Total Deposits`, value: formatNumber(tvlTotal, { currency: 'USD', showDecimalIfSmallNumberOnly: true }) },
+    { label: t`Daily Volume`, value: formatNumber(volumeTotal, { currency: 'USD', showDecimalIfSmallNumberOnly: true }) },
+    { label: t`Crypto Volume Share`, value: formatNumber(volumeCryptoShare, FORMAT_OPTIONS.PERCENT) },
   ]
 
   const pages: AppPage[] = useMemo(() => {

diff --git a/apps/main/src/networks.ts b/apps/main/src/networks.ts
@@ -1,5 +1,6 @@
 import sortBy from 'lodash/sortBy'
 
+import { NATIVE_TOKENS } from '@curvefi/api/lib/curve'
 import { ROUTE } from '@/constants'
 import { Chain } from '@/shared/curve-lib'
 import { baseNetworksConfig } from '@/ui/utils'
@@ -50,9 +51,10 @@ const NETWORK_CONFIG_DEFAULT = {
 }
 
 const networks: Record<ChainId, NetworkConfig> = {
-  1: {
+  [Chain.Ethereum]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['1'],
+    ...baseNetworksConfig[Chain.Ethereum],
+    nativeTokens: NATIVE_TOKENS[Chain.Ethereum],
     compensations: {
       crveth: true,
       'factory-v2-38': true, // alETH,
@@ -131,9 +133,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     hasFactory: true,
     pricesApi: true,
   },
-  10: {
+  [Chain.Optimism]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['10'],
+    ...baseNetworksConfig[Chain.Optimism],
+    nativeTokens: NATIVE_TOKENS[Chain.Optimism],
     poolFilters: ['all', 'usd', 'btc', 'eth', 'crypto', 'crvusd', 'tricrypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -161,9 +164,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     hasFactory: true,
     pricesApi: true,
   },
-  100: {
+  [Chain.Gnosis]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['100'],
+    ...baseNetworksConfig[Chain.Gnosis],
+    nativeTokens: NATIVE_TOKENS[Chain.Gnosis],
     poolFilters: ['all', 'usd', 'crypto', 'tricrypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -189,9 +193,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     hasFactory: true,
     pricesApi: true,
   },
-  1284: {
+  [Chain.Moonbeam]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['1284'],
+    ...baseNetworksConfig[Chain.Moonbeam],
+    nativeTokens: NATIVE_TOKENS[Chain.Moonbeam],
     poolFilters: ['all', 'usd', 'btc', 'crypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -205,9 +210,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     stableswapFactoryOld: true,
     hasFactory: true,
   },
-  137: {
+  [Chain.Polygon]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['137'],
+    ...baseNetworksConfig[Chain.Polygon],
+    nativeTokens: NATIVE_TOKENS[Chain.Polygon],
     poolFilters: ['all', 'usd', 'btc', 'crypto', 'tricrypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -240,9 +246,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     hasFactory: true,
     pricesApi: true,
   },
-  2222: {
+  [Chain.Kava]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['2222'],
+    ...baseNetworksConfig[Chain.Kava],
+    nativeTokens: NATIVE_TOKENS[Chain.Kava],
     poolFilters: ['all', 'usd', 'btc', 'kava', 'crypto', 'tricrypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -260,9 +267,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     tricryptoFactory: true,
     hasFactory: true,
   },
-  250: {
+  [Chain.Fantom]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['250'],
+    ...baseNetworksConfig[Chain.Fantom],
+    nativeTokens: NATIVE_TOKENS[Chain.Fantom],
     customPoolIds: {
       'factory-v2-137': true, // old eywa pool
       'factory-v2-140': true, // old eywa pool
@@ -290,9 +298,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     hasFactory: true,
     pricesApi: true,
   },
-  42161: {
+  [Chain.Arbitrum]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['42161'],
+    ...baseNetworksConfig[Chain.Arbitrum],
+    nativeTokens: NATIVE_TOKENS[Chain.Arbitrum],
     excludeGetUserBalancesTokens: ['0x3aef260cb6a5b469f970fae7a1e233dbd5939378'],
     poolFilters: ['all', 'usd', 'btc', 'eth', 'crypto', 'crvusd', 'tricrypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
@@ -321,9 +330,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     hasFactory: true,
     pricesApi: true,
   },
-  43114: {
+  [Chain.Avalanche]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['43114'],
+    ...baseNetworksConfig[Chain.Avalanche],
+    nativeTokens: NATIVE_TOKENS[Chain.Avalanche],
     poolFilters: ['all', 'usd', 'btc', 'crypto', 'tricrypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -340,9 +350,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     tricryptoFactory: true,
     hasFactory: true,
   },
-  42220: {
+  [Chain.Celo]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['42220'],
+    ...baseNetworksConfig[Chain.Celo],
+    nativeTokens: NATIVE_TOKENS[Chain.Celo],
     poolFilters: ['all', 'usd', 'btc', 'crypto', 'tricrypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -358,9 +369,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     tricryptoFactory: true,
     hasFactory: true,
   },
-  1313161554: {
+  [Chain.Aurora]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['1313161554'],
+    ...baseNetworksConfig[Chain.Aurora],
+    nativeTokens: NATIVE_TOKENS[Chain.Aurora],
     poolFilters: ['all', 'usd', 'btc', 'crypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -375,9 +387,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     twocryptoFactory: true,
     // hasFactory: true,
   },
-  324: {
+  [Chain.ZkSync]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['324'],
+    ...baseNetworksConfig[Chain.ZkSync],
+    nativeTokens: NATIVE_TOKENS[Chain.ZkSync],
     poolFilters: ['all', 'usd', 'btc', 'eth', 'crypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -387,9 +400,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     showInSelectNetwork: false,
     stableswapFactory: true,
   },
-  8453: {
+  [Chain.Base]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['8453'],
+    ...baseNetworksConfig[Chain.Base],
+    nativeTokens: NATIVE_TOKENS[Chain.Base],
     poolFilters: ['all', 'usd', 'btc', 'eth', 'crypto', 'tricrypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -418,9 +432,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     hasFactory: true,
     pricesApi: true,
   },
-  56: {
+  [Chain.Bsc]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['56'],
+    ...baseNetworksConfig[Chain.Bsc],
+    nativeTokens: NATIVE_TOKENS[Chain.Bsc],
     poolFilters: ['all', 'usd', 'btc', 'eth', 'crypto', 'tricrypto', 'stableng', 'others', 'user'],
     excludeRoutes: [ROUTE.PAGE_LOCKER],
     forms: NETWORK_CONFIG_DEFAULT.forms.filter((f) => {
@@ -445,9 +460,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     tricryptoFactory: true,
     hasFactory: true,
   },
-  252: {
+  [Chain.Fraxtal]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['252'],
+    ...baseNetworksConfig[Chain.Fraxtal],
+    nativeTokens: NATIVE_TOKENS[Chain.Fraxtal],
     poolFilters: ['all', 'usd', 'btc', 'eth', 'crypto', 'crvusd', 'tricrypto', 'others', 'stableng', 'user'],
     rpcUrl: isDevelopment ? process.env.NEXT_PUBLIC_FRAXTAL_DEV_RPC_URL! : `https://rpc.frax.com`,
     // TODO: use correct address once there is a pool
@@ -468,9 +484,10 @@ const networks: Record<ChainId, NetworkConfig> = {
     tricryptoFactory: true,
     hasFactory: true,
   },
-  196: {
+  [Chain.XLayer]: {
     ...NETWORK_CONFIG_DEFAULT,
-    ...baseNetworksConfig['196'],
+    ...baseNetworksConfig[Chain.XLayer],
+    nativeTokens: NATIVE_TOKENS[Chain.XLayer],
     poolFilters: ['all', 'usd', 'btc', 'eth', 'crypto', 'crvusd', 'tricrypto', 'stableng', 'others', 'user'],
     rpcUrl: isDevelopment ? process.env.NEXT_PUBLIC_XLAYER_DEV_RPC_URL! : `https://rpc.xlayer.tech`,
     swap: {
@@ -485,6 +502,7 @@ const networks: Record<ChainId, NetworkConfig> = {
   [Chain.Mantle]: {
     ...NETWORK_CONFIG_DEFAULT,
     ...baseNetworksConfig[Chain.Mantle],
+    nativeTokens: NATIVE_TOKENS[Chain.Mantle],
     poolFilters: ['all', 'usd', 'btc', 'eth', 'crypto', 'crvusd', 'tricrypto', 'stableng', 'others', 'user'],
     rpcUrl: isDevelopment ? process.env.NEXT_PUBLIC_MANTLE_DEV_RPC_URL! : `https://rpc.mantle.xyz`,
     swap: {