From 343312c833e5e126a3d288c307b71b4d323a0354 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nguy=E1=BB=85n=20Ho=C3=A0i=20Danh?=
<33005392+nguyenhoaidanh@users.noreply.github.com>
Date: Mon, 26 Jun 2023 09:54:51 +0700
Subject: [PATCH] update: remove hardcode native token in token search (#2007)
---
src/components/SearchModal/CurrencyList.tsx | 7 +++---
src/components/SearchModal/CurrencySearch.tsx | 22 ++++++++-----------
src/constants/index.ts | 2 +-
src/hooks/bridge/index.ts | 18 ++++++---------
src/state/wallet/hooks.ts | 1 +
src/utils/tokenInfo.ts | 3 ++-
6 files changed, 24 insertions(+), 29 deletions(-)
diff --git a/src/components/SearchModal/CurrencyList.tsx b/src/components/SearchModal/CurrencyList.tsx
index 025d1ce53d..f6a55b37f2 100644
--- a/src/components/SearchModal/CurrencyList.tsx
+++ b/src/components/SearchModal/CurrencyList.tsx
@@ -20,6 +20,7 @@ import { useUserAddedTokens, useUserFavoriteTokens } from 'state/user/hooks'
import { useCurrencyBalances } from 'state/wallet/hooks'
import { formattedNum } from 'utils'
import { useCurrencyConvertedToNative } from 'utils/dmm'
+import { isTokenNative } from 'utils/tokenInfo'
import ImportRow from './ImportRow'
@@ -83,7 +84,7 @@ const DescText = styled.div`
`
export const getDisplayTokenInfo = (currency: Currency) => {
return {
- symbol: currency.isNative ? currency.symbol : currency?.wrapped?.symbol || currency.symbol,
+ symbol: isTokenNative(currency, currency.chainId) ? currency.symbol : currency?.wrapped?.symbol || currency.symbol,
}
}
export function CurrencyRow({
@@ -135,7 +136,7 @@ export function CurrencyRow({
return false
}
- if (currency.isNative) {
+ if (isTokenNative(currency, currency.chainId)) {
return !!favoriteTokens.includeNativeToken
}
@@ -254,7 +255,7 @@ function CurrencyList({
token &&
!extendCurrency?.isWhitelisted &&
!tokenImports.find(importedToken => importedToken.address === token.address) &&
- !currency.isNative
+ !isTokenNative(currency, currency.chainId)
if (showImport && token && setImportToken) {
return
diff --git a/src/components/SearchModal/CurrencySearch.tsx b/src/components/SearchModal/CurrencySearch.tsx
index 6a6d6da47f..d7529a1f03 100644
--- a/src/components/SearchModal/CurrencySearch.tsx
+++ b/src/components/SearchModal/CurrencySearch.tsx
@@ -33,7 +33,7 @@ import { useRemoveUserAddedToken, useUserAddedTokens, useUserFavoriteTokens } fr
import { ButtonText, CloseIcon, TYPE } from 'theme'
import { filterTruthy, isAddress } from 'utils'
import { filterTokens } from 'utils/filtering'
-import { importTokensToKsSettings } from 'utils/tokenInfo'
+import { importTokensToKsSettings, isTokenNative } from 'utils/tokenInfo'
import CommonBases from './CommonBases'
import CurrencyList from './CurrencyList'
@@ -181,9 +181,9 @@ export function CurrencySearch({
const filterWrapFunc = useCallback(
(token: Currency | undefined) => {
if (filterWrap && otherSelectedCurrency?.equals(WETH[chainId])) {
- return !token?.isNative
+ return !isTokenNative(token, token?.chainId)
}
- if (filterWrap && otherSelectedCurrency?.isNative) {
+ if (filterWrap && otherSelectedCurrency && isTokenNative(otherSelectedCurrency, otherSelectedCurrency?.chainId)) {
return !token?.equals(WETH[chainId])
}
return true
@@ -196,20 +196,16 @@ export function CurrencySearch({
}, [commonTokens, debouncedQuery, chainId, filterWrapFunc])
const filteredSortedTokens: Token[] = useMemo(() => {
- const nativeToken = NativeCurrencies[chainId]
- const tokensWithNative = [nativeToken, ...fetchedTokens] as Token[]
if (!debouncedQuery) {
// whitelist token
- return tokensWithNative.sort(tokenComparator).filter(filterWrapFunc)
+ return fetchedTokens.sort(tokenComparator).filter(filterWrapFunc)
}
-
- const isMatchNative = nativeToken?.symbol?.toLowerCase().startsWith(debouncedQuery.toLowerCase().trim())
- return (isMatchNative ? tokensWithNative : fetchedTokens).filter(filterWrapFunc)
- }, [fetchedTokens, debouncedQuery, tokenComparator, filterWrapFunc, chainId])
+ return fetchedTokens.filter(filterWrapFunc)
+ }, [fetchedTokens, debouncedQuery, tokenComparator, filterWrapFunc])
const handleCurrencySelect = useCallback(
(currency: Currency) => {
- onCurrencySelect(currency)
+ onCurrencySelect(isTokenNative(currency, currency.chainId) ? NativeCurrencies[currency.chainId] : currency)
onDismiss()
},
[onDismiss, onCurrencySelect],
@@ -263,14 +259,14 @@ export function CurrencySearch({
if (!address) return
const currentList = favoriteTokens?.addresses || []
- const isAddFavorite = currency.isNative
+ const isAddFavorite = isTokenNative(currency, currency.chainId)
? !favoriteTokens?.includeNativeToken
: !currentList.find(el => el === address) // else remove favorite
const curTotal =
currentList.filter(address => !!defaultTokens[address]).length + (favoriteTokens?.includeNativeToken ? 1 : 0)
if (isAddFavorite && curTotal === MAX_FAVORITE_PAIR) return
- if (currency.isNative) {
+ if (isTokenNative(currency, currency.chainId)) {
toggleFavoriteToken({
chainId,
isNative: true,
diff --git a/src/constants/index.ts b/src/constants/index.ts
index 8278455248..5960916962 100644
--- a/src/constants/index.ts
+++ b/src/constants/index.ts
@@ -142,7 +142,7 @@ export const COINGECKO_API_URL = 'https://api.coingecko.com/api/v3'
export const KNC_COINGECKO_ID = 'kyber-network-crystal'
export const ETHER_ADDRESS = '0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE'
-export const ETHER_ADDRESS_SOLANA = 'eeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee'
+export const ETHER_ADDRESS_SOLANA = 'So11111111111111111111111111111111111111111'
export const KYBER_NETWORK_DISCORD_URL = 'https://discord.com/invite/NB3vc8J9uv'
export const KYBER_NETWORK_TWITTER_URL = 'https://twitter.com/KyberNetwork'
diff --git a/src/hooks/bridge/index.ts b/src/hooks/bridge/index.ts
index 2e3a8981ba..b566cc47cf 100644
--- a/src/hooks/bridge/index.ts
+++ b/src/hooks/bridge/index.ts
@@ -1,13 +1,13 @@
import { ChainId, Currency, CurrencyAmount } from '@kyberswap/ks-sdk-core'
import JSBI from 'jsbi'
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import { useCallback, useEffect, useMemo, useState } from 'react'
import ERC20_INTERFACE from 'constants/abis/erc20'
import { NativeCurrencies } from 'constants/tokens'
import { useActiveWeb3React } from 'hooks'
import { useMulticallContract } from 'hooks/useContract'
import useInterval from 'hooks/useInterval'
-import { useBlockNumber, useKyberSwapConfig } from 'state/application/hooks'
+import { useKyberSwapConfig } from 'state/application/hooks'
import { WrappedTokenInfo } from 'state/lists/wrappedTokenInfo'
import { fetchChunk } from 'state/multicall/updater'
import { TokenAmountLoading } from 'state/wallet/hooks'
@@ -59,17 +59,10 @@ export const useTokensBalanceOfAnotherChain = (
const multicallContract = useMulticallContract(chainId)
const [loading, setLoading] = useState(false)
- const refBlockNumber = useRef()
- const blockNumber = useBlockNumber()
- useEffect(() => {
- if (!refBlockNumber.current) refBlockNumber.current = blockNumber
- }, [blockNumber])
-
const getBalance = useCallback(async () => {
try {
setBalances(EMPTY_ARRAY)
- const blockNumber = refBlockNumber.current
- if (!chainId || !account || !tokens.length || !multicallContract || !blockNumber) {
+ if (!chainId || !account || !tokens.length || !multicallContract) {
return
}
setLoading(true)
@@ -79,11 +72,13 @@ export const useTokensBalanceOfAnotherChain = (
fragment: 'balanceOf',
key: token.wrapped.address,
}))
+
const { results } = await fetchChunk(
multicallContract,
calls.map(e => ({ address: e.target, callData: e.callData })),
- blockNumber,
+ undefined as any,
)
+
const result = formatResult(results, calls)
const balances = tokens.map(token => {
const balance = result[token.wrapped.address]
@@ -92,6 +87,7 @@ export const useTokensBalanceOfAnotherChain = (
setBalances(balances as TokenAmountLoading[])
return
} catch (error) {
+ console.error('get balance chain err', { chainId, error })
} finally {
setLoading(false)
}
diff --git a/src/state/wallet/hooks.ts b/src/state/wallet/hooks.ts
index 57198b8b42..4e34e0e433 100644
--- a/src/state/wallet/hooks.ts
+++ b/src/state/wallet/hooks.ts
@@ -212,6 +212,7 @@ export const useTokensHasBalance = (includesImportToken = false) => {
if (!loadingBalance && ethBalance) {
// call once per chain
const list: Currency[] = currencies.filter(currency => {
+ if (isTokenNative(currency, currency.chainId)) return false
const hasBalance = !currencyBalances[currency.wrapped.address]?.equalTo(
CurrencyAmount.fromRawAmount(currency, '0'),
)
diff --git a/src/utils/tokenInfo.ts b/src/utils/tokenInfo.ts
index 7019566004..ff98ac2495 100644
--- a/src/utils/tokenInfo.ts
+++ b/src/utils/tokenInfo.ts
@@ -59,7 +59,8 @@ export const isTokenNative = (
currency: Currency | WrappedTokenInfo | undefined,
chainId: ChainId | undefined,
): currency is NativeCurrency => {
- if (currency?.isNative || currency?.address === ETHER_ADDRESS) return true
+ if (currency?.isNative || currency?.address === ETHER_ADDRESS || currency?.address === ETHER_ADDRESS_SOLANA)
+ return true
// case multichain token
return chainId
? WETH[chainId]?.address === currency?.address &&