fix: merge portfolio tokens w/ default token list in Currency Selector (#7479)

This commit is contained in:
eddie 2023-10-17 14:00:39 -07:00 committed by GitHub
parent ed6afb50de
commit 740db0fe16
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -1,7 +1,7 @@
// eslint-disable-next-line no-restricted-imports
import { t, Trans } from '@lingui/macro'
import { InterfaceEventName, InterfaceModalName } from '@uniswap/analytics-events'
import { Currency, Token } from '@uniswap/sdk-core'
import { ChainId, Currency, Token } from '@uniswap/sdk-core'
import { useWeb3React } from '@web3-react/core'
import { Trace } from 'analytics'
import { useCachedPortfolioBalancesQuery } from 'components/PrefetchBalancesWrapper/PrefetchBalancesWrapper'
@ -76,9 +76,6 @@ export function CurrencySearch({
const searchTokenIsAdded = useIsUserAddedToken(searchToken)
const defaultTokens = useDefaultActiveTokens(chainId)
const filteredTokens: Token[] = useMemo(() => {
return Object.values(defaultTokens).filter(getTokenFilter(debouncedQuery))
}, [defaultTokens, debouncedQuery])
const { data, loading: balancesAreLoading } = useCachedPortfolioBalancesQuery({ account })
const balances: TokenBalances = useMemo(() => {
@ -100,10 +97,33 @@ export function CurrencySearch({
)
}, [chainId, data?.portfolios])
const sortedTokens: Token[] = useMemo(
() =>
!balancesAreLoading
? filteredTokens
const sortedTokens: Token[] = useMemo(() => {
const portfolioTokens = data?.portfolios?.[0].tokenBalances
?.map((tokenBalance) => {
if (!tokenBalance?.token?.chain || !tokenBalance.token?.address || !tokenBalance.token?.decimals) {
return undefined
}
return new Token(
supportedChainIdFromGQLChain(tokenBalance.token?.chain) ?? ChainId.MAINNET,
tokenBalance.token?.address,
tokenBalance.token?.decimals,
tokenBalance.token?.symbol,
tokenBalance.token?.name
)
})
.filter((token) => !!token) as Token[]
const filteredTokens = Object.values(defaultTokens)
.filter(getTokenFilter(debouncedQuery))
// Filter out tokens with balances so they aren't duplicated when we merge below.
.filter((token) => !(token.address?.toLowerCase() in balances))
const mergedTokens = [...(portfolioTokens ?? []), ...filteredTokens]
if (balancesAreLoading) {
return mergedTokens
}
return mergedTokens
.filter((token) => {
if (onlyShowCurrenciesWithBalance) {
return balances[token.address?.toLowerCase()]?.usdValue > 0
@ -117,17 +137,17 @@ export function CurrencySearch({
return true
})
.sort(tokenComparator.bind(null, balances))
: filteredTokens,
[
}, [
data,
defaultTokens,
debouncedQuery,
balancesAreLoading,
filteredTokens,
balances,
onlyShowCurrenciesWithBalance,
debouncedQuery,
selectedCurrency,
otherSelectedCurrency,
]
)
])
const isLoading = Boolean(balancesAreLoading && !tokenLoaderTimerElapsed)
const filteredSortedTokens = useSortTokensByQuery(debouncedQuery, sortedTokens)
@ -205,7 +225,7 @@ export function CurrencySearch({
// if no results on main list, show option to expand into inactive
const filteredInactiveTokens = useSearchInactiveTokenLists(
!onlyShowCurrenciesWithBalance && (filteredTokens.length === 0 || (debouncedQuery.length > 2 && !isAddressSearch))
!onlyShowCurrenciesWithBalance && (sortedTokens.length === 0 || (debouncedQuery.length > 2 && !isAddressSearch))
? debouncedQuery
: undefined
)