diff --git a/src/contexts/BalancesProvider.tsx b/src/contexts/BalancesProvider.tsx index 4afdc11d..a1aff4db 100644 --- a/src/contexts/BalancesProvider.tsx +++ b/src/contexts/BalancesProvider.tsx @@ -87,7 +87,10 @@ const BalancesContext = createContext<{ tokenId: string ): Promise; getTokenPrice(addressOrSymbol: string): number | undefined; - updateBalanceOnAllNetworks: (accounts: Account[]) => Promise; + updateBalanceOnNetworks: ( + accounts: Account[], + chainIds?: number[] + ) => Promise; registerSubscriber: (tokenTypes: TokenType[]) => void; unregisterSubscriber: (tokenTypes: TokenType[]) => void; isTokensCached: boolean; @@ -104,7 +107,7 @@ const BalancesContext = createContext<{ return undefined; }, async refreshNftMetadata() {}, // eslint-disable-line @typescript-eslint/no-empty-function - async updateBalanceOnAllNetworks() {}, // eslint-disable-line @typescript-eslint/no-empty-function + async updateBalanceOnNetworks() {}, // eslint-disable-line @typescript-eslint/no-empty-function registerSubscriber() {}, // eslint-disable-line @typescript-eslint/no-empty-function unregisterSubscriber() {}, // eslint-disable-line @typescript-eslint/no-empty-function isTokensCached: true, @@ -268,15 +271,15 @@ export function BalancesProvider({ children }: { children: any }) { setIsPolling(Object.values(subscribers).some((count) => count > 0)); }, [subscribers]); - const updateBalanceOnAllNetworks = useCallback( - async (accounts: Account[]) => { - if (!network) { + const updateBalanceOnNetworks = useCallback( + async (accounts: Account[], chainIds?: number[]) => { + if (!network && !chainIds?.length) { return; } const updatedBalances = await request({ method: ExtensionRequest.NETWORK_BALANCES_UPDATE, - params: [accounts], + params: [accounts, chainIds], }); dispatch({ @@ -352,7 +355,7 @@ export function BalancesProvider({ children }: { children: any }) { balances, getTokenPrice, refreshNftMetadata, - updateBalanceOnAllNetworks, + updateBalanceOnNetworks, registerSubscriber, unregisterSubscriber, isTokensCached: balances.cached ?? true, diff --git a/src/pages/Accounts/AddWalletWithSeedPhrase.tsx b/src/pages/Accounts/AddWalletWithSeedPhrase.tsx index a730bbf9..e00d574d 100644 --- a/src/pages/Accounts/AddWalletWithSeedPhrase.tsx +++ b/src/pages/Accounts/AddWalletWithSeedPhrase.tsx @@ -60,7 +60,7 @@ export function AddWalletWithSeedPhrase() { const { capture } = useAnalyticsContext(); const getErrorMessage = useErrorMessage(); const formatCurrency = useConvertedCurrencyFormatter(); - const { updateBalanceOnAllNetworks, getTotalBalance } = useBalancesContext(); + const { updateBalanceOnNetworks, getTotalBalance } = useBalancesContext(); const { isImporting, importSeedphrase } = useImportSeedphrase(); @@ -96,13 +96,13 @@ export function AddWalletWithSeedPhrase() { setIsKnownPhrase(false); setIsBalanceLoading(true); - await updateBalanceOnAllNetworks( + await updateBalanceOnNetworks( addies.map((addressC) => ({ addressC })) as Account[] ); setIsBalanceLoading(false); setAddresses(addies); }, - [allAccounts, updateBalanceOnAllNetworks] + [allAccounts, updateBalanceOnNetworks] ); const onContinue = useCallback(() => { diff --git a/src/pages/Accounts/components/AccountItem.tsx b/src/pages/Accounts/components/AccountItem.tsx index 4b3581de..1577bb5b 100644 --- a/src/pages/Accounts/components/AccountItem.tsx +++ b/src/pages/Accounts/components/AccountItem.tsx @@ -61,7 +61,7 @@ export const AccountItem = forwardRef( const history = useHistory(); const { capture } = useAnalyticsContext(); const { network } = useNetworkContext(); - const { updateBalanceOnAllNetworks } = useBalancesContext(); + const { updateBalanceOnNetworks } = useBalancesContext(); const [isBalanceLoading, setIsBalanceLoading] = useState(false); const isActive = isActiveAccount(account.id); @@ -141,9 +141,9 @@ export const AccountItem = forwardRef( const getBalance = useCallback(async () => { setIsBalanceLoading(true); - await updateBalanceOnAllNetworks([account]); + await updateBalanceOnNetworks([account]); setIsBalanceLoading(false); - }, [account, updateBalanceOnAllNetworks]); + }, [account, updateBalanceOnNetworks]); return ( { if (data?.type === RpcMethod.BITCOIN_SEND_TRANSACTION) { @@ -38,6 +40,10 @@ export const useFeeCustomizer = ({ network?: NetworkWithCaipId; }) => { const { action } = useApproveAction(actionId); + const { + accounts: { active: activeAccount }, + } = useAccountsContext(); + const { updateBalanceOnNetworks } = useBalancesContext(); const { request } = useConnectionContext(); const [networkFee, setNetworkFee] = useState(); @@ -133,6 +139,15 @@ export const useFeeCustomizer = ({ return nativeToken.balance > need; }, [getFeeInfo, nativeToken?.balance, signingData]); + // Make sure we have gas token balances for the transaction's chain + useEffect(() => { + if (!activeAccount || !network?.chainId) { + return; + } + + updateBalanceOnNetworks([activeAccount], [network.chainId]); + }, [activeAccount, network?.chainId, updateBalanceOnNetworks]); + useEffect(() => { const nativeBalance = nativeToken?.balance; diff --git a/src/pages/ImportPrivateKey/ImportPrivateKey.tsx b/src/pages/ImportPrivateKey/ImportPrivateKey.tsx index 052b694b..7149d705 100644 --- a/src/pages/ImportPrivateKey/ImportPrivateKey.tsx +++ b/src/pages/ImportPrivateKey/ImportPrivateKey.tsx @@ -36,7 +36,7 @@ type DerivedAddresses = { export function ImportPrivateKey() { const { currency, currencyFormatter } = useSettingsContext(); - const { updateBalanceOnAllNetworks } = useBalancesContext(); + const { updateBalanceOnNetworks } = useBalancesContext(); const { network } = useNetworkContext(); const { capture } = useAnalyticsContext(); const theme = useTheme(); @@ -97,13 +97,13 @@ export function ImportPrivateKey() { }, [network?.isTestnet, privateKey]); useEffect(() => { - if (derivedAddresses && updateBalanceOnAllNetworks) { + if (derivedAddresses && updateBalanceOnNetworks) { setIsBalanceLoading(true); - updateBalanceOnAllNetworks([derivedAddresses as Account]).finally(() => + updateBalanceOnNetworks([derivedAddresses as Account]).finally(() => setIsBalanceLoading(false) ); } - }, [derivedAddresses, updateBalanceOnAllNetworks]); + }, [derivedAddresses, updateBalanceOnNetworks]); return ( { const getBalance = async () => { setIsBalanceLoading(true); - await updateBalanceOnAllNetworks?.(selectedAccount); + await updateBalanceOnNetworks?.(selectedAccount); setIsBalanceLoading(false); }; @@ -69,7 +69,7 @@ export const AccountsDropdown = ({ } getBalance(); - }, [activeAccount, selectedAccount, updateBalanceOnAllNetworks]); + }, [activeAccount, selectedAccount, updateBalanceOnNetworks]); // Update balance & notify parent component about changes when account is selected useEffect(() => {