diff --git a/components/brave_wallet_ui/common/async/handlers.ts b/components/brave_wallet_ui/common/async/handlers.ts index cf03ef5b8a11..cfff04e71e0d 100644 --- a/components/brave_wallet_ui/common/async/handlers.ts +++ b/components/brave_wallet_ui/common/async/handlers.ts @@ -302,10 +302,17 @@ handler.on( WalletActions.setUserAssetVisible.type, async (store: Store, payload: SetUserAssetVisiblePayloadType) => { const { braveWalletService } = getAPIProxy() - await braveWalletService.setUserAssetVisible( + + const { success } = await braveWalletService.setUserAssetVisible( payload.token, payload.isVisible ) + + if (!success) { + // token is probably not in the core-side assets list + // try adding it to the user tokens list + store.dispatch(WalletActions.addUserAsset(payload.token)) + } } ) diff --git a/components/brave_wallet_ui/common/async/lib.ts b/components/brave_wallet_ui/common/async/lib.ts index 7ef39b6df62e..3fe4778787ac 100644 --- a/components/brave_wallet_ui/common/async/lib.ts +++ b/components/brave_wallet_ui/common/async/lib.ts @@ -194,8 +194,6 @@ export function refreshVisibleTokenInfo( const networkList = await getVisibleNetworksList(api) async function inner(network: BraveWallet.NetworkInfo) { - const nativeAsset = makeNetworkAsset(network) - // Get a list of user tokens for each coinType and network. const getTokenList = await braveWalletService.getUserAssets( network.chainId, @@ -207,7 +205,16 @@ export function refreshVisibleTokenInfo( ...token, logo: `chrome://erc-token-images/${token.logo}` })) as BraveWallet.BlockchainToken[] - return tokenList.length === 0 ? [nativeAsset] : tokenList + + if (tokenList.length === 0) { + // user has hidden all tokens for the network + // we should still include the native asset, but as hidden + const nativeAsset = makeNetworkAsset(network) + nativeAsset.visible = false + return [nativeAsset] + } + + return tokenList } const visibleAssets = targetNetwork diff --git a/components/brave_wallet_ui/common/hooks/assets-management.ts b/components/brave_wallet_ui/common/hooks/assets-management.ts index db964a4a2975..7ccfd6224509 100644 --- a/components/brave_wallet_ui/common/hooks/assets-management.ts +++ b/components/brave_wallet_ui/common/hooks/assets-management.ts @@ -79,6 +79,11 @@ export function useAssetManagement() { const addOrRemoveTokenInLocalStorage = React.useCallback( (token: BraveWallet.BlockchainToken, addOrRemove: 'add' | 'remove') => { + if (token.contractAddress === '') { + // prevent permanently removing native tokens + return + } + const assetId = getAssetIdKey(token) const isNFT = token.isNft || token.isErc1155 || token.isErc721 const removedList = isNFT diff --git a/components/brave_wallet_ui/common/slices/endpoints/token.endpoints.ts b/components/brave_wallet_ui/common/slices/endpoints/token.endpoints.ts index 17c86ebeb846..c185e9ebc468 100644 --- a/components/brave_wallet_ui/common/slices/endpoints/token.endpoints.ts +++ b/components/brave_wallet_ui/common/slices/endpoints/token.endpoints.ts @@ -292,6 +292,20 @@ export const tokenEndpoints = ({ token, isVisible ) + + if (!success) { + // token is probably not in the core-side assets list, + // try adding it to the list + const { success: addTokenSuccess } = await addUserToken({ + braveWalletService, + cache, + tokenArg: token + }) + if (!addTokenSuccess) { + throw new Error('Token could not be updated or added') + } + } + return { data: success } } catch (error) { return handleEndpointError( diff --git a/components/brave_wallet_ui/components/desktop/account-list-item/index.tsx b/components/brave_wallet_ui/components/desktop/account-list-item/index.tsx index e390c44a81ad..3108920d58f9 100644 --- a/components/brave_wallet_ui/components/desktop/account-list-item/index.tsx +++ b/components/brave_wallet_ui/components/desktop/account-list-item/index.tsx @@ -261,7 +261,7 @@ export const AccountListItem = ({ const reducedAmounts = amounts.reduce(function (a, b) { return a.plus(b) - }) + }, Amount.empty()) return !reducedAmounts.isUndefined() ? reducedAmounts : Amount.empty() }, [ diff --git a/components/brave_wallet_ui/components/desktop/popup-modals/edit-visible-assets-modal/index.tsx b/components/brave_wallet_ui/components/desktop/popup-modals/edit-visible-assets-modal/index.tsx index 51c4d1ccbb38..c776c00b8b84 100644 --- a/components/brave_wallet_ui/components/desktop/popup-modals/edit-visible-assets-modal/index.tsx +++ b/components/brave_wallet_ui/components/desktop/popup-modals/edit-visible-assets-modal/index.tsx @@ -212,14 +212,15 @@ export const EditVisibleAssetsModal = ({ onClose }: Props) => { // Filtered token list based on user removed tokens const filteredOutRemovedTokens = React.useMemo(() => { - return tokenList.filter( - (token) => - !removedTokensList.some( - (t) => - t.contractAddress.toLowerCase() === - token.contractAddress.toLowerCase() && t.tokenId === token.tokenId - ) - ) + return tokenList.filter((token) => { + const tokenContractLower = token.contractAddress.toLowerCase() + return !removedTokensList.some( + (t) => + t.chainId === token.chainId && + t.contractAddress.toLowerCase() === tokenContractLower && + t.tokenId === token.tokenId + ) + }) }, [tokenList, removedTokensList]) // Filtered token list based on search value @@ -331,10 +332,12 @@ export const EditVisibleAssetsModal = ({ onClose }: Props) => { const onRemoveAsset = React.useCallback( (token: BraveWallet.BlockchainToken) => { + const tokenContractLower = token.contractAddress.toLowerCase() const filterFn = (t: BraveWallet.BlockchainToken) => !( - t.contractAddress.toLowerCase() === - token.contractAddress.toLowerCase() && t.tokenId === token.tokenId + t.chainId === token.chainId && + t.contractAddress.toLowerCase() === tokenContractLower && + t.tokenId === token.tokenId ) const newUserList = updatedTokensList.filter(filterFn) setUpdatedTokensList(newUserList)