fix: toBignumber conversion error with high balance

app/components/UI/Stake/__mocks__/mockData.ts

@@ -67,6 +67,18 @@ export const MOCK_GET_POOLED_STAKES_API_RESPONSE: PooledStakes = {
   exchangeRate: '1.010906701603882254',
 };
 
+export const MOCK_GET_POOLED_STAKES_API_RESPONSE_HIGH_ASSETS_AMOUNT: PooledStakes = {
+  accounts: [
+    {
+      account: '0x0111111111abcdef2222222222abcdef33333333',
+      lifetimeRewards: '0',
+      assets: '99999999990000000000000',
+      exitRequests: [],
+    },
+  ],
+  exchangeRate: '1.010906701603882254',
+};
+
 export const MOCK_GET_VAULT_RESPONSE: VaultData = {
   apy: '2.853065141088762750393474836309926',
   capacity:

app/components/UI/Stake/hooks/useBalance.test.tsx

@@ -1,9 +1,11 @@
-import { MOCK_GET_POOLED_STAKES_API_RESPONSE } from '../__mocks__/mockData';
+import { MOCK_GET_POOLED_STAKES_API_RESPONSE, MOCK_GET_POOLED_STAKES_API_RESPONSE_HIGH_ASSETS_AMOUNT } from '../__mocks__/mockData';
 import { createMockAccountsControllerState } from '../../../../util/test/accountsControllerTestUtils';
 import { backgroundState } from '../../../../util/test/initial-root-state';
 import { renderHookWithProvider } from '../../../../util/test/renderWithProvider';
 import useBalance from './useBalance';
 import { toHex } from '@metamask/controller-utils';
+import usePooledStakes from './usePooledStakes';
+import { PooledStake } from '@metamask/stake-sdk';
 
 const MOCK_ADDRESS_1 = '0x0';
 
@@ -35,24 +37,21 @@ const initialState = {
   },
 };
 
-const mockPooledStakeData = MOCK_GET_POOLED_STAKES_API_RESPONSE.accounts[0];
-const mockExchangeRate = MOCK_GET_POOLED_STAKES_API_RESPONSE.exchangeRate;
-
-jest.mock('../hooks/usePooledStakes', () => ({
-  __esModule: true,
-  default: () => ({
-    pooledStakesData: mockPooledStakeData,
-    exchangeRate: mockExchangeRate,
-    loading: false,
+jest.mock('../hooks/usePooledStakes');
+const mockUsePooledStakes = (pooledStake: PooledStake, exchangeRate: string) => {
+  (usePooledStakes as jest.MockedFn<typeof usePooledStakes>).mockReturnValue({
+    pooledStakesData: pooledStake,
+    exchangeRate,
+    isLoadingPooledStakesData: false,
     error: null,
     refreshPooledStakes: jest.fn(),
     hasStakedPositions: true,
     hasEthToUnstake: true,
     hasNeverStaked: false,
     hasRewards: true,
     hasRewardsOnly: false,
-  }),
-}));
+  });
+};
 
 describe('useBalance', () => {
   afterEach(() => {
@@ -64,10 +63,12 @@ describe('useBalance', () => {
   });
 
   it('returns balance and fiat values based on account and pooled stake data', async () => {
+    mockUsePooledStakes(MOCK_GET_POOLED_STAKES_API_RESPONSE.accounts[0], MOCK_GET_POOLED_STAKES_API_RESPONSE.exchangeRate);
     const { result } = renderHookWithProvider(() => useBalance(), {
       state: initialState,
     });
 
+
     expect(result.current.balance).toBe('12345678.90988'); // ETH balance
     expect(result.current.balanceWei.toString()).toBe(
       '12345678909876543210000000',
@@ -81,6 +82,7 @@ describe('useBalance', () => {
   });
 
   it('returns default values when no selected address and no account data', async () => {
+    mockUsePooledStakes(MOCK_GET_POOLED_STAKES_API_RESPONSE.accounts[0], MOCK_GET_POOLED_STAKES_API_RESPONSE.exchangeRate);
     const { result } = renderHookWithProvider(() => useBalance(), {
       state: {
         ...initialState,
@@ -106,4 +108,23 @@ describe('useBalance', () => {
     expect(result.current.balanceFiat).toBe('$0.00'); // Fiat balance
     expect(result.current.balanceFiatNumber).toBe(0); // Fiat number balance
   });
+
+  it('returns correct stake amounts and fiat values based on account with high amount of assets', async () => {
+    mockUsePooledStakes(MOCK_GET_POOLED_STAKES_API_RESPONSE_HIGH_ASSETS_AMOUNT.accounts[0], MOCK_GET_POOLED_STAKES_API_RESPONSE_HIGH_ASSETS_AMOUNT.exchangeRate);
+    const { result } = renderHookWithProvider(() => useBalance(), {
+      state: initialState,
+    });
+
+    expect(result.current.balance).toBe('12345678.90988'); // ETH balance
+    expect(result.current.balanceWei.toString()).toBe(
+      '12345678909876543210000000',
+    );
+    expect(result.current.balanceFiat).toBe('$39506172511.60'); // Fiat balance
+    expect(result.current.balanceFiatNumber).toBe(39506172511.6); // Fiat number balance
+
+    expect(result.current.stakedBalanceWei).toBe('99999999990000000000000'); // No staked assets
+    expect(result.current.formattedStakedBalanceETH).toBe('99999.99999 ETH'); // Formatted ETH balance
+    expect(result.current.stakedBalanceFiatNumber).toBe(319999999.968); // Staked balance in fiat number
+    expect(result.current.formattedStakedBalanceFiat).toBe('$319999999.97'); //
+  });
 });

app/components/UI/Stake/hooks/useBalance.ts

@@ -50,8 +50,7 @@ const useBalance = () => {
   );
 
   const { pooledStakesData } = usePooledStakes();
-  const assets = pooledStakesData.assets ?? 0;
-
+  const assets = hexToBN(pooledStakesData.assets).toString('hex');
   const formattedStakedBalanceETH = useMemo(
     () => `${renderFromWei(assets)} ETH`,
     [assets],
@@ -72,7 +71,7 @@ const useBalance = () => {
     balanceFiat,
     balanceWei,
     balanceFiatNumber,
-    stakedBalanceWei: assets,
+    stakedBalanceWei: assets ?? '0',
     formattedStakedBalanceETH,
     stakedBalanceFiatNumber,
     formattedStakedBalanceFiat,