From b0bddc48c59efc71aff2a5c8838b2576438e8c03 Mon Sep 17 00:00:00 2001 From: alecdwm Date: Tue, 24 Dec 2024 01:50:37 +0000 Subject: [PATCH 1/3] fix: use tokenId instead of symbol for send funds lookup where possible prevents a bug when the same symbol is used by multiple tokens on one network e.g. USDC vs USDC.e vs whUSDC (which is also just USDC in the contract) on polygon --- .../AssetDetails/DashboardAssetDetails.tsx | 2 +- .../AssetDetails/PopupAssetDetails.tsx | 2 +- .../AssetDetails/SendFundsIconButton.tsx | 23 +++++++++++++------ 3 files changed, 18 insertions(+), 9 deletions(-) diff --git a/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx b/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx index c3bfd996ce..20d4fbf65d 100644 --- a/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx +++ b/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx @@ -102,7 +102,7 @@ const TokenBalances: FC<{ tokenId: TokenId; balances: Balances }> = ({ tokenId, {chainOrNetwork.name} }> - + {tokenId && ( = ({ tokenId, {chainOrNetwork.name} }> - + diff --git a/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx b/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx index 9a01450937..dca1c14378 100644 --- a/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx +++ b/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx @@ -10,23 +10,32 @@ import { isTransferableToken } from "@ui/util/isTransferableToken" import { usePortfolioNavigation } from "../usePortfolioNavigation" export const SendFundsButton = ({ - symbol, networkId, shouldClose, + ...tokenLookup }: { - symbol: string networkId: ChainId | EvmNetworkId shouldClose?: boolean -}) => { +} & ({ tokenId: string } | { symbol: string })) => { + const tokenId = "tokenId" in tokenLookup ? tokenLookup.tokenId : undefined + const symbol = "symbol" in tokenLookup ? tokenLookup.symbol : undefined + const { selectedAccount } = usePortfolioNavigation() const [includeTestnets] = useSetting("useTestnets") const tokens = useTokens({ activeOnly: true, includeTestnets }) const token = tokens?.find( - (t) => - t.symbol === symbol && - isTransferableToken(t) && - (("evmNetwork" in t && t.evmNetwork?.id === networkId) || t.chain?.id === networkId), + typeof tokenId === "string" + ? // search by tokenId + (t) => + t.id === tokenId && + isTransferableToken(t) && + (("evmNetwork" in t && t.evmNetwork?.id === networkId) || t.chain?.id === networkId) + : // search by token symbol + (t) => + t.symbol === symbol && + isTransferableToken(t) && + (("evmNetwork" in t && t.evmNetwork?.id === networkId) || t.chain?.id === networkId), ) const { canSendFunds, cannotSendFundsReason, openSendFundsPopup } = useSendFundsPopup( From 00cc67c8a6aabc1247845c8aa2dc606fddaffbca Mon Sep 17 00:00:00 2001 From: alecdwm Date: Tue, 24 Dec 2024 02:18:32 +0000 Subject: [PATCH 2/3] fix: remove unused symbol prop from `SendFundsIconButton` --- .../AssetDetails/DashboardAssetDetails.tsx | 2 +- .../AssetDetails/PopupAssetDetails.tsx | 2 +- .../AssetDetails/SendFundsIconButton.tsx | 31 +++++-------------- 3 files changed, 9 insertions(+), 26 deletions(-) diff --git a/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx b/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx index 20d4fbf65d..505a715750 100644 --- a/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx +++ b/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx @@ -102,7 +102,7 @@ const TokenBalances: FC<{ tokenId: TokenId; balances: Balances }> = ({ tokenId, {chainOrNetwork.name} }> - + {tokenId && ( = ({ tokenId, {chainOrNetwork.name} }> - + diff --git a/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx b/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx index dca1c14378..a9b1d8c0f6 100644 --- a/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx +++ b/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx @@ -1,42 +1,25 @@ -import { ChainId, EvmNetworkId } from "@talismn/chaindata-provider" +import { TokenId } from "@talismn/chaindata-provider" import { SendIcon } from "@talismn/icons" import { useCallback } from "react" import { Tooltip, TooltipContent, TooltipTrigger } from "talisman-ui" import { useSendFundsPopup } from "@ui/hooks/useSendFundsPopup" -import { useSetting, useTokens } from "@ui/state" +import { useSetting, useTokensMap } from "@ui/state" import { isTransferableToken } from "@ui/util/isTransferableToken" import { usePortfolioNavigation } from "../usePortfolioNavigation" export const SendFundsButton = ({ - networkId, + tokenId, shouldClose, - ...tokenLookup }: { - networkId: ChainId | EvmNetworkId + tokenId: TokenId shouldClose?: boolean -} & ({ tokenId: string } | { symbol: string })) => { - const tokenId = "tokenId" in tokenLookup ? tokenLookup.tokenId : undefined - const symbol = "symbol" in tokenLookup ? tokenLookup.symbol : undefined - +}) => { const { selectedAccount } = usePortfolioNavigation() const [includeTestnets] = useSetting("useTestnets") - const tokens = useTokens({ activeOnly: true, includeTestnets }) - - const token = tokens?.find( - typeof tokenId === "string" - ? // search by tokenId - (t) => - t.id === tokenId && - isTransferableToken(t) && - (("evmNetwork" in t && t.evmNetwork?.id === networkId) || t.chain?.id === networkId) - : // search by token symbol - (t) => - t.symbol === symbol && - isTransferableToken(t) && - (("evmNetwork" in t && t.evmNetwork?.id === networkId) || t.chain?.id === networkId), - ) + const tokensMap = useTokensMap({ activeOnly: true, includeTestnets }) + const token = isTransferableToken(tokensMap[tokenId]) ? tokensMap[tokenId] : undefined const { canSendFunds, cannotSendFundsReason, openSendFundsPopup } = useSendFundsPopup( selectedAccount, From 06ad0c93ccf2bf7371794f8d68797511bd250cd9 Mon Sep 17 00:00:00 2001 From: Chid Gilovitz Date: Tue, 24 Dec 2024 12:35:47 +0800 Subject: [PATCH 3/3] chore: rename components --- .../domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx | 4 ++-- .../ui/domains/Portfolio/AssetDetails/PopupAssetDetails.tsx | 4 ++-- .../{SendFundsIconButton.tsx => SendFundsTokenIconButton.tsx} | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) rename apps/extension/src/ui/domains/Portfolio/AssetDetails/{SendFundsIconButton.tsx => SendFundsTokenIconButton.tsx} (97%) diff --git a/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx b/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx index 505a715750..30b65359a5 100644 --- a/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx +++ b/apps/extension/src/ui/domains/Portfolio/AssetDetails/DashboardAssetDetails.tsx @@ -24,7 +24,7 @@ import { StaleBalancesIcon } from "../StaleBalancesIcon" import { usePortfolioNavigation } from "../usePortfolioNavigation" import { CopyAddressButton } from "./CopyAddressIconButton" import { PortfolioAccount } from "./PortfolioAccount" -import { SendFundsButton } from "./SendFundsIconButton" +import { SendFundsTokenButton } from "./SendFundsTokenIconButton" import { TokenContextMenu } from "./TokenContextMenu" import { useAssetDetails } from "./useAssetDetails" import { BalanceDetailRow, useTokenBalances } from "./useTokenBalances" @@ -102,7 +102,7 @@ const TokenBalances: FC<{ tokenId: TokenId; balances: Balances }> = ({ tokenId, {chainOrNetwork.name} }> - + {tokenId && ( = ({ tokenId, {chainOrNetwork.name} }> - + diff --git a/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx b/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsTokenIconButton.tsx similarity index 97% rename from apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx rename to apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsTokenIconButton.tsx index a9b1d8c0f6..fb263e5d55 100644 --- a/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsIconButton.tsx +++ b/apps/extension/src/ui/domains/Portfolio/AssetDetails/SendFundsTokenIconButton.tsx @@ -9,7 +9,7 @@ import { isTransferableToken } from "@ui/util/isTransferableToken" import { usePortfolioNavigation } from "../usePortfolioNavigation" -export const SendFundsButton = ({ +export const SendFundsTokenButton = ({ tokenId, shouldClose, }: {