From a53d6c8d65a329212e54729efaaac57660b76705 Mon Sep 17 00:00:00 2001 From: Albina Nikiforova Date: Mon, 2 Dec 2024 17:43:57 +0100 Subject: [PATCH] fixup! feat(suite): nft section --- packages/blockchain-link-types/src/common.ts | 5 ++ .../components/wallet/TokenIconSetWrapper.tsx | 7 +- .../AccountsMenu/AccountSection.tsx | 12 ++- packages/suite/src/utils/wallet/nftUtils.ts | 59 --------------- packages/suite/src/utils/wallet/tokenUtils.ts | 75 +++++++++++++++---- .../dashboard/AssetsView/assetsViewUtils.ts | 8 +- .../src/views/wallet/nfts/HiddenNfts.tsx | 32 ++++---- .../src/views/wallet/nfts/NftsNavigation.tsx | 16 ++-- .../views/wallet/nfts/NftsTable/NftsRow.tsx | 37 +++++---- .../views/wallet/nfts/NftsTable/NftsTable.tsx | 28 ++----- .../suite/src/views/wallet/nfts/ShownNfts.tsx | 28 +++---- .../views/wallet/tokens/TokensNavigation.tsx | 10 +-- .../views/wallet/tokens/coins/CoinsTable.tsx | 7 +- .../hidden-tokens/HiddenTokensTable.tsx | 13 +++- suite-common/wallet-utils/src/accountUtils.ts | 3 +- .../wallet-utils/src/transactionUtils.ts | 4 - 16 files changed, 173 insertions(+), 171 deletions(-) diff --git a/packages/blockchain-link-types/src/common.ts b/packages/blockchain-link-types/src/common.ts index 75004777e2cf..68254bde47fa 100644 --- a/packages/blockchain-link-types/src/common.ts +++ b/packages/blockchain-link-types/src/common.ts @@ -5,6 +5,7 @@ import type { AddressAlias, TokenTransfer as BlockbookTokenTransfer, ContractInfo, + MultiTokenValue, StakingPool, } from './blockbook-api'; @@ -188,6 +189,10 @@ export interface TokenInfo { accounts?: TokenAccount[]; // token accounts for solana policyId?: string; // Cardano policy id fingerprint?: string; // Cardano starting with "asset" + multiTokenValues?: MultiTokenValue[]; + ids?: string[]; + totalReceived?: string; + totalSent?: string; // transfers: number, // total transactions? } diff --git a/packages/suite/src/components/wallet/TokenIconSetWrapper.tsx b/packages/suite/src/components/wallet/TokenIconSetWrapper.tsx index e4f97bb0fbc1..834af3bdf408 100644 --- a/packages/suite/src/components/wallet/TokenIconSetWrapper.tsx +++ b/packages/suite/src/components/wallet/TokenIconSetWrapper.tsx @@ -30,8 +30,11 @@ export const TokenIconSetWrapper = ({ accounts, symbol }: TokenIconSetWrapperPro if (!allTokensWithRates.length) return null; - const tokens = getTokens(allTokensWithRates, symbol, coinDefinitions) - .shownWithBalance as TokensWithRates[]; + const tokens = getTokens({ + tokens: allTokensWithRates, + symbol: symbol, + tokenDefinitions: coinDefinitions, + })?.shownWithBalance as TokensWithRates[]; const aggregatedTokens = Object.values( tokens.reduce((acc: Record, token) => { diff --git a/packages/suite/src/components/wallet/WalletLayout/AccountsMenu/AccountSection.tsx b/packages/suite/src/components/wallet/WalletLayout/AccountsMenu/AccountSection.tsx index 06dc023a1d5c..add8171ed94c 100644 --- a/packages/suite/src/components/wallet/WalletLayout/AccountsMenu/AccountSection.tsx +++ b/packages/suite/src/components/wallet/WalletLayout/AccountsMenu/AccountSection.tsx @@ -39,18 +39,22 @@ export const AccountSection = ({ const showGroup = ['ethereum', 'solana', 'cardano'].includes(networkType); - const tokens = getTokens(accountTokens, account.symbol, coinDefinitions); + const tokens = getTokens({ + tokens: accountTokens, + symbol: account.symbol, + tokenDefinitions: coinDefinitions, + }); const dataTestKey = `@account-menu/${symbol}/${accountType}/${index}`; - return showGroup && (isStakeShown || tokens.shownWithBalance.length) ? ( + return showGroup && (isStakeShown || tokens?.shownWithBalance?.length) ? ( ) : ( @@ -62,7 +66,7 @@ export const AccountSection = ({ onClick={onItemClick} accountLabel={accountLabel} formattedBalance={formattedBalance} - tokens={tokens.shownWithBalance} + tokens={tokens?.shownWithBalance} dataTestKey={dataTestKey} /> ); diff --git a/packages/suite/src/utils/wallet/nftUtils.ts b/packages/suite/src/utils/wallet/nftUtils.ts index d5a56325d1e4..0edc81292b4c 100644 --- a/packages/suite/src/utils/wallet/nftUtils.ts +++ b/packages/suite/src/utils/wallet/nftUtils.ts @@ -1,60 +1 @@ -import { isTokenDefinitionKnown, TokenDefinition } from '@suite-common/token-definitions'; -import { isNftMatchesSearch, filterNftTokens } from '@suite-common/wallet-utils'; -import { NetworkSymbol, getNetworkFeatures } from '@suite-common/wallet-config'; -import { Token } from '@trezor/blockchain-link-types/src/blockbook-api'; - -type GetNfts = { - tokens: Token[]; - symbol: NetworkSymbol; - nftDefinitions?: TokenDefinition; - searchQuery?: string; -}; - export type NftType = 'ERC721' | 'ERC1155'; - -export const getNfts = ({ tokens, symbol, nftDefinitions, searchQuery }: GetNfts) => { - // filter out NFT tokens until we implement them - const nfts = filterNftTokens(tokens); - - const hasNftDefinitions = getNetworkFeatures(symbol).includes('nft-definitions'); - - const shownVerified: Token[] = []; - const shownUnverified: Token[] = []; - const hiddenVerified: Token[] = []; - const hiddenUnverified: Token[] = []; - - nfts.forEach(token => { - const isKnown = isTokenDefinitionKnown(nftDefinitions?.data, symbol, token.contract || ''); - const isHidden = nftDefinitions?.hide.includes(token.contract || ''); - const isShown = nftDefinitions?.show.includes(token.contract || ''); - - const query = searchQuery ? searchQuery.trim().toLowerCase() : ''; - - if (searchQuery && !isNftMatchesSearch(token, query)) return; - - const pushToArray = (arrayVerified: Token[], arrayUnverified: Token[]) => { - if (isKnown) { - arrayVerified.push(token); - } else { - arrayUnverified.push(token); - } - }; - - if (isShown) { - pushToArray(shownVerified, shownUnverified); - } else if (hasNftDefinitions && !isKnown) { - pushToArray(hiddenVerified, hiddenUnverified); - } else if (isHidden) { - pushToArray(hiddenVerified, hiddenUnverified); - } else { - pushToArray(shownVerified, shownUnverified); - } - }); - - return { - shownVerified, - shownUnverified, - hiddenVerified, - hiddenUnverified, - }; -}; diff --git a/packages/suite/src/utils/wallet/tokenUtils.ts b/packages/suite/src/utils/wallet/tokenUtils.ts index 137411668bff..fe598c8da800 100644 --- a/packages/suite/src/utils/wallet/tokenUtils.ts +++ b/packages/suite/src/utils/wallet/tokenUtils.ts @@ -1,7 +1,12 @@ import { BigNumber } from '@trezor/utils/src/bigNumber'; import { Account, Rate, TokenAddress, RatesByKey } from '@suite-common/wallet-types'; import { TokenInfo } from '@trezor/connect'; -import { getFiatRateKey, isNftToken, isTokenMatchesSearch } from '@suite-common/wallet-utils'; +import { + getFiatRateKey, + isNftMatchesSearch, + isNftToken, + isTokenMatchesSearch, +} from '@suite-common/wallet-utils'; import { NetworkSymbol, getNetworkFeatures } from '@suite-common/wallet-config'; import { FiatCurrencyCode } from '@suite-common/suite-config'; import { @@ -9,6 +14,7 @@ import { TokenDefinition, isTokenDefinitionKnown, } from '@suite-common/token-definitions'; +import { Token } from '@trezor/blockchain-link-types/src/blockbook-api'; export interface TokensWithRates extends TokenInfo { fiatValue: BigNumber; @@ -65,16 +71,46 @@ export const formatTokenSymbol = (symbol: string) => { return isTokenSymbolLong ? `${upperCasedSymbol.slice(0, 7)}...` : upperCasedSymbol; }; -export const getTokens = ( - tokens: EnhancedTokenInfo[] | TokenInfo[], - symbol: NetworkSymbol, - coinDefinitions?: TokenDefinition, - searchQuery?: string, -) => { +type GetTokens = { + tokens: EnhancedTokenInfo[] | TokenInfo[]; + symbol: NetworkSymbol; + tokenDefinitions?: TokenDefinition; + searchQuery?: string; + isNft?: boolean; +}; + +export type TokensResult = { + shownWithBalance: EnhancedTokenInfo[]; + shownWithoutBalance: EnhancedTokenInfo[]; + hiddenWithBalance: EnhancedTokenInfo[]; + hiddenWithoutBalance: EnhancedTokenInfo[]; + unverifiedWithBalance: EnhancedTokenInfo[]; + unverifiedWithoutBalance: EnhancedTokenInfo[]; +}; + +// export type NftTokensResult = { +// shownVerified: EnhancedTokenInfo[]; +// shownUnverified: EnhancedTokenInfo[]; +// hiddenVerified: EnhancedTokenInfo[]; +// hiddenUnverified: EnhancedTokenInfo[]; +// }; + +export const getTokens = ({ + tokens = [], + symbol, + tokenDefinitions, + searchQuery, + isNft = false, +}: GetTokens): TokensResult => { // filter out NFT tokens until we implement them - const tokensWithoutNFTs = tokens.filter(token => !isNftToken(token)); - const hasCoinDefinitions = getNetworkFeatures(symbol).includes('coin-definitions'); + const filteredTokens = isNft + ? tokens.filter(token => isNftToken(token)) + : tokens.filter(token => !isNftToken(token)); + + const hasDefinitions = getNetworkFeatures(symbol).includes( + isNft ? 'nft-definitions' : 'coin-definitions', + ); const shownWithBalance: EnhancedTokenInfo[] = []; const shownWithoutBalance: EnhancedTokenInfo[] = []; @@ -83,16 +119,23 @@ export const getTokens = ( const unverifiedWithBalance: EnhancedTokenInfo[] = []; const unverifiedWithoutBalance: EnhancedTokenInfo[] = []; - tokensWithoutNFTs.forEach(token => { - const isKnown = isTokenDefinitionKnown(coinDefinitions?.data, symbol, token.contract); - const isHidden = coinDefinitions?.hide.includes(token.contract); - const isShown = coinDefinitions?.show.includes(token.contract); + filteredTokens.forEach(token => { + const isKnown = isTokenDefinitionKnown(tokenDefinitions?.data, symbol, token.contract); + const isHidden = tokenDefinitions?.hide.includes(token.contract); + const isShown = tokenDefinitions?.show.includes(token.contract); const query = searchQuery ? searchQuery.trim().toLowerCase() : ''; - if (searchQuery && !isTokenMatchesSearch(token, query)) return; + if ( + searchQuery && + (!isTokenMatchesSearch(token, query) || + (isNft && isNftMatchesSearch(token as Token, query))) + ) + return; - const hasBalance = new BigNumber(token?.balance || '0').gt(0); + const hasBalance = + new BigNumber(token?.balance || '0').gt(0) || + (isNft && (token?.multiTokenValues?.length || 0) > 0); const pushToArray = ( arrayWithBalance: EnhancedTokenInfo[], @@ -107,7 +150,7 @@ export const getTokens = ( if (isShown) { pushToArray(shownWithBalance, shownWithoutBalance); - } else if (hasCoinDefinitions && !isKnown) { + } else if (hasDefinitions && !isKnown) { pushToArray(unverifiedWithBalance, unverifiedWithoutBalance); } else if (isHidden) { pushToArray(hiddenWithBalance, hiddenWithoutBalance); diff --git a/packages/suite/src/views/dashboard/AssetsView/assetsViewUtils.ts b/packages/suite/src/views/dashboard/AssetsView/assetsViewUtils.ts index 3dae8884a231..79f0949bbba5 100644 --- a/packages/suite/src/views/dashboard/AssetsView/assetsViewUtils.ts +++ b/packages/suite/src/views/dashboard/AssetsView/assetsViewUtils.ts @@ -23,9 +23,13 @@ export const handleTokensAndStakingData = ( const assetStakingBalance = accountsThatStaked.reduce((total, account) => { return total.plus(getAccountTotalStakingBalance(account)); }, new BigNumber(0)); - const tokens = getTokens(assetTokens ?? [], symbol, coinDefinitions); + const tokens = getTokens({ + tokens: assetTokens ?? [], + symbol, + tokenDefinitions: coinDefinitions, + }); const tokensWithRates = enhanceTokensWithRates( - tokens.shownWithBalance ?? [], + tokens?.shownWithBalance ?? [], localCurrency, symbol, currentFiatRates, diff --git a/packages/suite/src/views/wallet/nfts/HiddenNfts.tsx b/packages/suite/src/views/wallet/nfts/HiddenNfts.tsx index 94fe60320529..a33b3ce085e7 100644 --- a/packages/suite/src/views/wallet/nfts/HiddenNfts.tsx +++ b/packages/suite/src/views/wallet/nfts/HiddenNfts.tsx @@ -1,12 +1,12 @@ import { Banner, Column, H3 } from '@trezor/components'; import { SelectedAccountLoaded } from '@suite-common/wallet-types'; -import NftsTable from './NftsTable/NftsTable'; +import { selectNftDefinitions } from '@suite-common/token-definitions'; + import { Translation } from 'src/components/suite'; -import { Token } from '@trezor/blockchain-link-types/src/blockbook-api'; import { useSelector } from 'src/hooks/suite'; -import { getNfts } from 'src/utils/wallet/nftUtils'; -import { selectNftDefinitions } from '@suite-common/token-definitions'; -import { filterNftTokens } from '@suite-common/wallet-utils'; +import { getTokens } from 'src/utils/wallet/tokenUtils'; + +import NftsTable from './NftsTable/NftsTable'; import { NoTokens } from '../tokens/common/NoTokens'; type NftsTableProps = { @@ -15,21 +15,26 @@ type NftsTableProps = { }; const HiddenNfts = ({ selectedAccount, searchQuery }: NftsTableProps) => { - const filteredTokens = filterNftTokens(selectedAccount.account.tokens || []); + // const filteredTokens = filterNftTokens(selectedAccount.account.tokens || []); const nftDefinitions = useSelector(state => selectNftDefinitions(state, selectedAccount.account.symbol), ); - const nfts = getNfts({ - tokens: filteredTokens as Token[], + const nfts = getTokens({ + tokens: selectedAccount.account.tokens ?? [], symbol: selectedAccount.account.symbol, - nftDefinitions, + tokenDefinitions: nftDefinitions, + isNft: true, + searchQuery, }); - return nfts.hiddenVerified.length > 0 || nfts.hiddenUnverified.length > 0 ? ( + return nfts && + (nfts.hiddenWithBalance.length > 0 || + nfts.hiddenWithoutBalance.length > 0 || + nfts.unverifiedWithBalance.length > 0 || + nfts.unverifiedWithoutBalance.length > 0) ? ( { /> { { /> { /> ) : ( - } /> + } /> ); }; diff --git a/packages/suite/src/views/wallet/nfts/NftsNavigation.tsx b/packages/suite/src/views/wallet/nfts/NftsNavigation.tsx index dbbad4ff1611..9e452cd6955e 100644 --- a/packages/suite/src/views/wallet/nfts/NftsNavigation.tsx +++ b/packages/suite/src/views/wallet/nfts/NftsNavigation.tsx @@ -7,10 +7,9 @@ import { Row } from '@trezor/components'; import { useSelector } from 'src/hooks/suite'; import { NavigationItem } from 'src/components/suite/layouts/SuiteLayout/Sidebar/NavigationItem'; -import { getNfts } from 'src/utils/wallet/nftUtils'; import { selectRouteName } from 'src/reducers/suite/routerReducer'; import { SearchAction } from 'src/components/wallet/SearchAction'; -import { filterNftTokens } from '@suite-common/wallet-utils'; +import { getTokens } from 'src/utils/wallet/tokenUtils'; interface NftsNavigationProps { selectedAccount: SelectedAccountLoaded; @@ -33,9 +32,14 @@ export const NftsNavigation = ({ selectNftDefinitions(state, selectedAccount.account.symbol), ); - const filteredTokens = filterNftTokens(account.tokens || []); + // const filteredTokens = filterNftTokens(account.tokens || []); - const nfts = getNfts({ tokens: filteredTokens, symbol: account.symbol, nftDefinitions }); + const nfts = getTokens({ + tokens: account.tokens || [], + symbol: account.symbol, + tokenDefinitions: nftDefinitions, + isNft: true, + }); useEffect(() => { setSearchQuery(''); @@ -52,9 +56,7 @@ export const NftsNavigation = ({ goToRoute="wallet-nfts" preserveParams iconSize="mediumLarge" - itemsCount={ - nfts.shownVerified.length + nfts.shownUnverified.length || undefined - } + itemsCount={nfts?.shownWithBalance.length || undefined} isRounded typographyStyle="hint" /> diff --git a/packages/suite/src/views/wallet/nfts/NftsTable/NftsRow.tsx b/packages/suite/src/views/wallet/nfts/NftsTable/NftsRow.tsx index 9e954c5d2cc4..bf53fd5763d8 100644 --- a/packages/suite/src/views/wallet/nfts/NftsTable/NftsRow.tsx +++ b/packages/suite/src/views/wallet/nfts/NftsTable/NftsRow.tsx @@ -1,7 +1,12 @@ +import styled from 'styled-components'; + import { Network } from '@suite-common/wallet-config'; -import { DefinitionType, tokenDefinitionsActions } from '@suite-common/token-definitions'; -import { TokenManagementAction } from '@suite-common/token-definitions'; -import { Token } from '@trezor/blockchain-link-types/src/blockbook-api'; +import { + DefinitionType, + tokenDefinitionsActions, + TokenManagementAction, + EnhancedTokenInfo, +} from '@suite-common/token-definitions'; import { Button, Column, @@ -13,24 +18,20 @@ import { Table, TruncateWithTooltip, } from '@trezor/components'; -import { Translation } from 'src/components/suite'; +import { spacingsPx } from '@trezor/theme'; +import { copyToClipboard } from '@trezor/dom-utils'; +import { notificationsActions } from '@suite-common/toast-notifications'; +import { AddressType } from '@suite-common/wallet-types'; +import { Translation } from 'src/components/suite'; import { NftType } from 'src/utils/wallet/nftUtils'; - -import { useDispatch, useSelector } from 'src/hooks/suite'; +import { useDispatch, useSelector, useTranslation } from 'src/hooks/suite'; import { SUITE } from 'src/actions/suite/constants'; - -import { useTranslation } from 'src/hooks/suite'; -import styled from 'styled-components'; -import { spacingsPx } from '@trezor/theme'; import { selectIsCopyAddressModalShown } from 'src/reducers/suite/suiteReducer'; import { openModal } from 'src/actions/suite/modalActions'; -import { copyToClipboard } from '@trezor/dom-utils'; -import { notificationsActions } from '@suite-common/toast-notifications'; -import { AddressType } from '@suite-common/wallet-types'; type NftsRowProps = { - nft: Token; + nft: EnhancedTokenInfo; type: NftType; network: Network; shown?: boolean; @@ -54,7 +55,7 @@ const NftsRow = ({ nft, type, network, shown }: NftsRowProps) => { const { translationString } = useTranslation(); const shouldShowCopyAddressModal = useSelector(selectIsCopyAddressModalShown); - const getNftContractExplorerUrl = (network: Network, nft: Token) => { + const getNftContractExplorerUrl = (network: Network, nft: EnhancedTokenInfo) => { const explorerUrl = network.explorer.account; const contractAddress = nft.contract; const queryString = network.explorer.queryString ?? ''; @@ -62,7 +63,7 @@ const NftsRow = ({ nft, type, network, shown }: NftsRowProps) => { return `${explorerUrl}${contractAddress}${queryString}`; }; - const getNftExplorerUrl = (network: Network, nft: Token, id?: string) => { + const getNftExplorerUrl = (network: Network, nft: EnhancedTokenInfo, id?: string) => { const explorerUrl = network.explorer.nft; const contractAddressWithId = nft.contract + `/${id}`; @@ -86,12 +87,10 @@ const NftsRow = ({ nft, type, network, shown }: NftsRowProps) => { } }; - const name = nft.name.length > 15 ? `${nft.name.slice(0, 15)}...` : nft.name; - return ( - {name} + {nft.name} {type === 'ERC1155' && ( <> diff --git a/packages/suite/src/views/wallet/nfts/NftsTable/NftsTable.tsx b/packages/suite/src/views/wallet/nfts/NftsTable/NftsTable.tsx index caf926b8db6d..5920111534cd 100644 --- a/packages/suite/src/views/wallet/nfts/NftsTable/NftsTable.tsx +++ b/packages/suite/src/views/wallet/nfts/NftsTable/NftsTable.tsx @@ -1,47 +1,35 @@ import { SelectedAccountLoaded } from '@suite-common/wallet-types'; import { Card, Column, Table, H3 } from '@trezor/components'; +import { getNetwork } from '@suite-common/wallet-config'; +import { EnhancedTokenInfo } from '@suite-common/token-definitions'; +import { TokensResult } from 'src/utils/wallet/tokenUtils'; import { Translation } from 'src/components/suite/Translation'; import NftsRow from './NftsRow'; -import { Token } from '@trezor/blockchain-link-types/src/blockbook-api'; -import { getNetwork } from '@suite-common/wallet-config'; type NftsTableProps = { selectedAccount: SelectedAccountLoaded; - searchQuery: string; type: 'ERC721' | 'ERC1155'; shown?: boolean; verified?: boolean; - nfts: { - shownVerified: Token[]; - shownUnverified: Token[]; - hiddenVerified: Token[]; - hiddenUnverified: Token[]; - }; + nfts: TokensResult; }; -const NftsTable = ({ - selectedAccount, - searchQuery, - type, - shown, - verified, - nfts, -}: NftsTableProps) => { +const NftsTable = ({ selectedAccount, type, shown, verified, nfts }: NftsTableProps) => { const { account } = selectedAccount; const network = getNetwork(account.symbol); - const filterNftsByType = (nfts: Token[]) => { + const filterNftsByType = (nfts: EnhancedTokenInfo[]) => { return nfts.filter(nft => nft.type === type); }; const getNftsToShow = () => { if (shown) { - return [...nfts.shownVerified, ...nfts.shownUnverified]; + return [...nfts.shownWithBalance, ...nfts.shownWithoutBalance]; } - return verified ? nfts.hiddenVerified : nfts.hiddenUnverified; + return verified ? nfts.hiddenWithBalance : nfts.hiddenWithoutBalance; }; const nftsToShow = getNftsToShow(); diff --git a/packages/suite/src/views/wallet/nfts/ShownNfts.tsx b/packages/suite/src/views/wallet/nfts/ShownNfts.tsx index 90160e90efc2..687bfa99ae87 100644 --- a/packages/suite/src/views/wallet/nfts/ShownNfts.tsx +++ b/packages/suite/src/views/wallet/nfts/ShownNfts.tsx @@ -1,14 +1,13 @@ import { Column } from '@trezor/components'; import { SelectedAccountLoaded } from '@suite-common/wallet-types'; +import { selectNftDefinitions } from '@suite-common/token-definitions'; -import NftsTable from './NftsTable/NftsTable'; -import { NoTokens } from '../tokens/common/NoTokens'; import { Translation } from 'src/components/suite'; -import { filterNftTokens } from '@suite-common/wallet-utils'; -import { Token } from '@trezor/blockchain-link-types/src/blockbook-api'; -import { getNfts } from 'src/utils/wallet/nftUtils'; import { useSelector } from 'src/hooks/suite'; -import { selectNftDefinitions } from '@suite-common/token-definitions'; +import { getTokens } from 'src/utils/wallet/tokenUtils'; + +import { NoTokens } from '../tokens/common/NoTokens'; +import NftsTable from './NftsTable/NftsTable'; type ShownNftsProps = { selectedAccount: SelectedAccountLoaded; @@ -16,21 +15,23 @@ type ShownNftsProps = { }; const ShownNfts = ({ selectedAccount, searchQuery }: ShownNftsProps) => { - const filteredTokens = filterNftTokens(selectedAccount.account.tokens || []); const nftDefinitions = useSelector(state => selectNftDefinitions(state, selectedAccount.account.symbol), ); - const nfts = getNfts({ - tokens: filteredTokens as Token[], + const nfts = getTokens({ + tokens: selectedAccount.account.tokens || [], symbol: selectedAccount.account.symbol, - nftDefinitions, + tokenDefinitions: nftDefinitions, + isNft: true, + searchQuery, }); - return nfts.shownUnverified.length > 0 || nfts.shownVerified.length > 0 ? ( + console.log('nfts', nfts); + + return nfts?.shownWithBalance.length || nfts?.shownWithoutBalance.length ? ( { /> { title={ 0 || nfts.hiddenVerified.length > 0 + nfts?.hiddenWithBalance.length || nfts?.hiddenWithoutBalance.length ? 'TR_TOKENS_EMPTY_CHECK_HIDDEN' : 'TR_TOKENS_EMPTY' } diff --git a/packages/suite/src/views/wallet/tokens/TokensNavigation.tsx b/packages/suite/src/views/wallet/tokens/TokensNavigation.tsx index 8bb4cac4bc57..777609494134 100644 --- a/packages/suite/src/views/wallet/tokens/TokensNavigation.tsx +++ b/packages/suite/src/views/wallet/tokens/TokensNavigation.tsx @@ -37,11 +37,11 @@ export const TokensNavigation = ({ const isDebug = useSelector(selectIsDebugModeActive); const dispatch = useDispatch(); - const tokens = getTokens( - selectedAccount.account.tokens || [], - selectedAccount.account.symbol, - coinDefinitions, - ); + const tokens = getTokens({ + tokens: selectedAccount.account.tokens || [], + symbol: selectedAccount.account.symbol, + tokenDefinitions: coinDefinitions, + }); const showAddToken = ['ethereum'].includes(account.networkType) && isDebug; const handleAddToken = () => { diff --git a/packages/suite/src/views/wallet/tokens/coins/CoinsTable.tsx b/packages/suite/src/views/wallet/tokens/coins/CoinsTable.tsx index 225145af6b36..560b77042c89 100644 --- a/packages/suite/src/views/wallet/tokens/coins/CoinsTable.tsx +++ b/packages/suite/src/views/wallet/tokens/coins/CoinsTable.tsx @@ -36,7 +36,12 @@ export const CoinsTable = ({ selectedAccount, searchQuery }: CoinsTableProps) => ); const sortedTokens = tokensWithRates.sort(sortTokensWithRates); - const tokens = getTokens(sortedTokens, account.symbol, coinDefinitions, searchQuery); + const tokens = getTokens({ + tokens: sortedTokens, + symbol: account.symbol, + tokenDefinitions: coinDefinitions, + searchQuery, + }); const hiddenTokensCount = tokens.unverifiedWithBalance.length + tokens.hiddenWithBalance.length + diff --git a/packages/suite/src/views/wallet/tokens/hidden-tokens/HiddenTokensTable.tsx b/packages/suite/src/views/wallet/tokens/hidden-tokens/HiddenTokensTable.tsx index 6fcc6f21e559..2251bd3bb97e 100644 --- a/packages/suite/src/views/wallet/tokens/hidden-tokens/HiddenTokensTable.tsx +++ b/packages/suite/src/views/wallet/tokens/hidden-tokens/HiddenTokensTable.tsx @@ -27,8 +27,17 @@ export const HiddenTokensTable = ({ selectedAccount, searchQuery }: HiddenTokens ) : []; - const filteredTokens = getTokens(sortedTokens, account.symbol, coinDefinitions, searchQuery); - const tokens = getTokens(sortedTokens, account.symbol, coinDefinitions); + const filteredTokens = getTokens({ + tokens: sortedTokens, + symbol: account.symbol, + tokenDefinitions: coinDefinitions, + searchQuery, + }); + const tokens = getTokens({ + tokens: sortedTokens, + symbol: account.symbol, + tokenDefinitions: coinDefinitions, + }); const hiddenTokensCount = tokens.hiddenWithBalance.length + tokens.hiddenWithoutBalance.length; const unverifiedTokensCount = diff --git a/suite-common/wallet-utils/src/accountUtils.ts b/suite-common/wallet-utils/src/accountUtils.ts index 66ce2ac1db93..9794734799a4 100644 --- a/suite-common/wallet-utils/src/accountUtils.ts +++ b/suite-common/wallet-utils/src/accountUtils.ts @@ -1192,6 +1192,7 @@ export const isNftMatchesSearch = (token: Token, search: string) => { token.ids ?.map(id => id.toString()) .join(', ') - .includes(search) + .includes(search) || + token.multiTokenValues?.some(value => value.id?.includes(search)) ); }; diff --git a/suite-common/wallet-utils/src/transactionUtils.ts b/suite-common/wallet-utils/src/transactionUtils.ts index 2820c8f3cb97..e0b781d89460 100644 --- a/suite-common/wallet-utils/src/transactionUtils.ts +++ b/suite-common/wallet-utils/src/transactionUtils.ts @@ -30,7 +30,6 @@ import { FiatCurrencyCode } from '@suite-common/suite-config'; import { formatAmount, formatNetworkAmount, isTokenMatchesSearch } from './accountUtils'; import { toFiatCurrency } from '../src/fiatConverterUtils'; import { getFiatRateKey, roundTimestampToNearestPastHour } from './fiatRatesUtils'; -import { Token } from '@trezor/blockchain-link-types/src/blockbook-api'; export const sortByBlockHeight = (a: { blockHeight?: number }, b: { blockHeight?: number }) => { // if both are missing the blockHeight don't change their order @@ -492,9 +491,6 @@ export const getNftTokenId = (transfer: TokenTransfer) => ? transfer.multiTokenValues[0].id : transfer.amount; -export const filterNftTokens = (tokens: Token[] | TokenInfo[]) => - tokens.filter(token => isNftToken(token as TokenInfo)) as TokenInfo[]; - export const getTxIcon = (txType: WalletAccountTransaction['type']) => { switch (txType) { case 'recv':