diff --git a/ui/pages/asset/components/asset-page.test.tsx b/ui/pages/asset/components/asset-page.test.tsx
index 60e322f8825e..28e232a0ba0b 100644
--- a/ui/pages/asset/components/asset-page.test.tsx
+++ b/ui/pages/asset/components/asset-page.test.tsx
@@ -45,6 +45,8 @@ jest.mock('../../../hooks/useMultiPolling', () => ({
   default: jest.fn(),
 }));
 
+const selectedAccountAddress = 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3';
+
 describe('AssetPage', () => {
   const mockStore = {
     localeMessages: {
@@ -52,13 +54,17 @@ describe('AssetPage', () => {
     },
     metamask: {
       tokenList: {},
-      tokenBalances: {},
+      tokenBalances: {
+        [selectedAccountAddress]: {
+          [CHAIN_IDS.MAINNET]: {},
+        },
+      },
       marketData: {},
       allTokens: {},
       accountsByChainId: {
         '0x1': {
-          'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3': {
-            address: 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3',
+          [selectedAccountAddress]: {
+            address: selectedAccountAddress,
             balance: '0x00',
           },
         },
@@ -80,9 +86,9 @@ describe('AssetPage', () => {
       preferences: {},
       internalAccounts: {
         accounts: {
-          'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3': {
-            address: 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3',
-            id: 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3',
+          [selectedAccountAddress]: {
+            address: selectedAccountAddress,
+            id: selectedAccountAddress,
             metadata: {
               name: 'Test Account',
               keyring: {
@@ -94,7 +100,7 @@ describe('AssetPage', () => {
             type: EthAccountType.Eoa,
           },
         },
-        selectedAccount: 'cf8dace4-9439-4bd4-b3a8-88c821c8fcb3',
+        selectedAccount: selectedAccountAddress,
       },
       keyrings: [
         {
diff --git a/ui/pages/asset/components/asset-page.tsx b/ui/pages/asset/components/asset-page.tsx
index 68d7f9d18e65..9100126d54fe 100644
--- a/ui/pages/asset/components/asset-page.tsx
+++ b/ui/pages/asset/components/asset-page.tsx
@@ -54,6 +54,7 @@ import { useTokenBalances } from '../../../hooks/useTokenBalances';
 import { useMultichainSelector } from '../../../hooks/useMultichainSelector';
 import { getMultichainShouldShowFiat } from '../../../selectors/multichain';
 import { getPortfolioUrl } from '../../../helpers/utils/portfolio';
+import { hexToDecimal } from '../../../../shared/modules/conversion.utils';
 import AssetChart from './chart/asset-chart';
 import TokenButtons from './token-buttons';
 
@@ -151,6 +152,9 @@ const AssetPage = ({
       ? toChecksumHexAddress(asset.address)
       : getNativeTokenAddress(chainId);
 
+  const tokenHexBalance =
+    selectedAccountTokenBalancesAcrossChains?.[chainId]?.[address as Hex];
+
   const balance = calculateTokenBalance({
     isNative: type === AssetType.native,
     chainId,
@@ -187,10 +191,10 @@ const AssetPage = ({
       tokenMarketDetails.allTimeHigh > 0 ||
       tokenMarketDetails.allTimeLow > 0);
 
-  // this is needed in order to assign the correct balances to TokenButtons before sending/swapping
-  // without this, the balances we be populated as zero until the user refreshes the screen: https://github.com/MetaMask/metamask-extension/issues/28509
+  // this is needed in order to assign the correct balances to TokenButtons before navigating to send/swap screens
+
   asset.balance = {
-    value: '', // decimal value not needed
+    value: hexToDecimal(tokenHexBalance),
     display: String(balance),
     fiat: String(tokenFiatAmount),
   };