@rango-dev/widget-embedded 0.17.1-next.25 → 0.17.1-next.26

package/dist/pages/Home.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Home.d.ts","sourceRoot":"","sources":["../../src/pages/Home.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAgD3D,wBAAgB,IAAI,sBAkPnB"}
+{"version":3,"file":"Home.d.ts","sourceRoot":"","sources":["../../src/pages/Home.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AA8C3D,wBAAgB,IAAI,sBA4NnB"}

package/dist/pages/SelectSwapItemsPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectSwapItemsPage.d.ts","sourceRoot":"","sources":["../../src/pages/SelectSwapItemsPage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAcxC,UAAU,SAAS;IACjB,IAAI,EAAE,QAAQ,GAAG,aAAa,CAAC;CAChC;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,SAAS,qBA8FnD"}
+{"version":3,"file":"SelectSwapItemsPage.d.ts","sourceRoot":"","sources":["../../src/pages/SelectSwapItemsPage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAcxC,UAAU,SAAS;IACjB,IAAI,EAAE,QAAQ,GAAG,aAAa,CAAC;CAChC;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,SAAS,qBA2FnD"}

package/dist/store/quote.d.ts

@@ -1,4 +1,3 @@
-import type { TokenWithBalance } from '../components/TokenList';
 import type { Wallet } from '../types';
 import type { PendingSwap } from '@rango-dev/queue-manager-rango-preset/dist/shared';
 import type { BestRouteResponse, BlockchainMeta, MetaResponse, Token } from 'rango-sdk';
@@ -18,8 +17,8 @@ export interface QuoteState {
     inputUsdValue: BigNumber | null;
     outputAmount: BigNumber | null;
     outputUsdValue: BigNumber | null;
-    fromToken: TokenWithBalance | null;
-    toToken: TokenWithBalance | null;
+    fromToken: Token | null;
+    toToken: Token | null;
     quoteWalletsConfirmed: boolean;
     selectedWallets: Wallet[];
     quoteWarningsConfirmed: boolean;
@@ -62,8 +61,8 @@ export declare const useQuoteStore: {
         inputUsdValue: () => BigNumber | null;
         outputAmount: () => BigNumber | null;
         outputUsdValue: () => BigNumber | null;
-        fromToken: () => TokenWithBalance | null;
-        toToken: () => TokenWithBalance | null;
+        fromToken: () => Token | null;
+        toToken: () => Token | null;
         quoteWalletsConfirmed: () => boolean;
         selectedWallets: () => Wallet[];
         quoteWarningsConfirmed: () => boolean;

package/dist/store/quote.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"quote.d.ts","sourceRoot":"","sources":["../../src/store/quote.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"quote.d.ts","sourceRoot":"","sources":["../../src/store/quote.ts"],"names":[],"mappings":"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"}

package/dist/store/wallets.d.ts

@@ -1,4 +1,4 @@
-import type { Wallet } from '../types';
+import type { Balance, TokensBalance, Wallet } from '../types';
 import type { WalletType } from '@rango-dev/wallets-shared';
 import type { Token } from 'rango-sdk';
 export type TokenBalance = {
@@ -21,6 +21,7 @@ export interface ConnectedWallet extends Wallet {
 }
 interface WalletsStore {
     connectedWallets: ConnectedWallet[];
+    balances: TokensBalance;
     customDestination: string;
     loading: boolean;
     connectWallet: (accounts: Wallet[], tokens: Token[]) => void;
@@ -31,6 +32,7 @@ interface WalletsStore {
     }[]) => void;
     clearConnectedWallet: () => void;
     getWalletsDetails: (accounts: Wallet[], tokens: Token[], shouldRetry?: boolean) => void;
+    getBalanceFor: (token: Token) => Balance | null;
 }
 export declare const useWalletsStore: {
     (): WalletsStore;
@@ -47,6 +49,7 @@ export declare const useWalletsStore: {
 } & {
     use: {
         connectedWallets: () => ConnectedWallet[];
+        balances: () => TokensBalance;
         customDestination: () => string;
         loading: () => boolean;
         connectWallet: () => (accounts: Wallet[], tokens: Token[]) => void;
@@ -57,8 +60,8 @@ export declare const useWalletsStore: {
         }[]) => void;
         clearConnectedWallet: () => () => void;
         getWalletsDetails: () => (accounts: Wallet[], tokens: Token[], shouldRetry?: boolean) => void;
+        getBalanceFor: () => (token: Token) => Balance | null;
     };
 };
-export declare const fetchingBalanceSelector: (state: WalletsStore) => boolean;
 export {};
 //# sourceMappingURL=wallets.d.ts.map

package/dist/store/wallets.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/store/wallets.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAcvC,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB,CAAC;AAEF,MAAM,WAAW,eAAgB,SAAQ,MAAM;IAC7C,QAAQ,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC;IAChC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;CAChB;AAED,UAAU,YAAY;IACpB,gBAAgB,EAAE,eAAe,EAAE,CAAC;IACpC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IAC7D,gBAAgB,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IACnD,aAAa,EAAE,CAAC,OAAO,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,KAAK,IAAI,CAAC;IAC1E,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,iBAAiB,EAAE,CACjB,QAAQ,EAAE,MAAM,EAAE,EAClB,MAAM,EAAE,KAAK,EAAE,EACf,WAAW,CAAC,EAAE,OAAO,KAClB,IAAI,CAAC;CACX;AAED,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;wCAXA,MAAM,EAAE,UAAU,KAAK,EAAE,KAAK,IAAI;6CAC7B,UAAU,KAAK,IAAI;uCACzB;YAAE,UAAU,EAAE,MAAM,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,EAAE,KAAK,IAAI;0CAC7C,IAAI;4CAEpB,MAAM,EAAE,UACV,KAAK,EAAE,gBACD,OAAO,KAClB,IAAI;;CAoKV,CAAC;AAEF,eAAO,MAAM,uBAAuB,UAAW,YAAY,YACA,CAAC"}
+{"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/store/wallets.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAC/D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAgBvC,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB,CAAC;AAEF,MAAM,WAAW,eAAgB,SAAQ,MAAM;IAC7C,QAAQ,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC;IAChC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;CAChB;AACD,UAAU,YAAY;IACpB,gBAAgB,EAAE,eAAe,EAAE,CAAC;IACpC,QAAQ,EAAE,aAAa,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,aAAa,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IAC7D,gBAAgB,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,IAAI,CAAC;IACnD,aAAa,EAAE,CAAC,OAAO,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,KAAK,IAAI,CAAC;IAC1E,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,iBAAiB,EAAE,CACjB,QAAQ,EAAE,MAAM,EAAE,EAClB,MAAM,EAAE,KAAK,EAAE,EACf,WAAW,CAAC,EAAE,OAAO,KAClB,IAAI,CAAC;IACV,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,OAAO,GAAG,IAAI,CAAC;CACjD;AAED,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;wCAZA,MAAM,EAAE,UAAU,KAAK,EAAE,KAAK,IAAI;6CAC7B,UAAU,KAAK,IAAI;uCACzB;YAAE,UAAU,EAAE,MAAM,CAAC;YAAC,KAAK,EAAE,MAAM,CAAA;SAAE,EAAE,KAAK,IAAI;0CAC7C,IAAI;4CAEpB,MAAM,EAAE,UACV,KAAK,EAAE,gBACD,OAAO,KAClB,IAAI;qCACc,KAAK,KAAK,OAAO,GAAG,IAAI;;CA+LhD,CAAC"}

package/dist/types/wallets.d.ts

@@ -1,7 +1,21 @@
-import { WalletType } from '@rango-dev/wallets-shared';
+import type { WalletType } from '@rango-dev/wallets-shared';
 export interface Wallet {
     chain: string;
     address: string;
     walletType: WalletType;
 }
+export type Balance = {
+    amount: string;
+    decimals: number;
+    usdValue: string;
+};
+type Blockchain = string;
+type TokenSymbol = string;
+type Address = string;
+/** `blockchain-symbol-Address` */
+export type TokenHash = `${Blockchain}-${TokenSymbol}-${Address}`;
+export type TokensBalance = {
+    [key: TokenHash]: Balance;
+};
+export {};
 //# sourceMappingURL=wallets.d.ts.map

package/dist/types/wallets.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/types/wallets.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAEvD,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,UAAU,CAAC;CACxB"}
+{"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/types/wallets.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAE5D,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,UAAU,CAAC;CACxB;AAED,MAAM,MAAM,OAAO,GAAG;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,KAAK,UAAU,GAAG,MAAM,CAAC;AACzB,KAAK,WAAW,GAAG,MAAM,CAAC;AAC1B,KAAK,OAAO,GAAG,MAAM,CAAC;AAEtB,kCAAkC;AAClC,MAAM,MAAM,SAAS,GAAG,GAAG,UAAU,IAAI,WAAW,IAAI,OAAO,EAAE,CAAC;AAElE,MAAM,MAAM,aAAa,GAAG;IAC1B,CAAC,GAAG,EAAE,SAAS,GAAG,OAAO,CAAC;CAC3B,CAAC"}

package/dist/utils/wallets.d.ts

@@ -1,8 +1,7 @@
-import type { TokenWithBalance } from '../components/TokenList';
 import type { ConnectedWallet, TokenBalance } from '../store/wallets';
-import type { Wallet } from '../types';
+import type { Balance, TokenHash, TokensBalance, Wallet } from '../types';
 import type { WalletInfo as ModalWalletInfo } from '@rango-dev/ui';
-import type { Network, WalletInfo, WalletState, WalletType } from '@rango-dev/wallets-shared';
+import type { Asset, Network, WalletInfo, WalletState, WalletType } from '@rango-dev/wallets-shared';
 import type { BestRouteResponse, BlockchainMeta, Token, WalletDetail } from 'rango-sdk';
 import { WalletState as WalletStatus } from '@rango-dev/ui';
 export declare function mapStatusToWalletState(state: WalletState): WalletStatus;
@@ -10,18 +9,15 @@ export declare function mapWalletTypesToWalletInfo(getState: (type: WalletType)
 export declare function walletAndSupportedChainsNames(supportedBlockchains: BlockchainMeta[]): Network[] | null;
 export declare function prepareAccountsForWalletStore(wallet: WalletType, accounts: string[], evmBasedChains: string[], supportedChainNames: Network[] | null, isContractWallet: boolean): Wallet[];
 export declare function getRequiredChains(quote: BestRouteResponse | null): string[];
-export declare function getBalanceFromWallet(connectedWallets: ConnectedWallet[], chain: string, symbol: string, address: string | null): TokenBalance | null;
 export declare function isAccountAndWalletMatched(account: Wallet, connectedWallet: ConnectedWallet): boolean;
 export declare function makeBalanceFor(retrievedBalance: WalletDetail, tokens: Token[]): TokenBalance[];
 export declare function resetConnectedWalletState(connectedWallet: ConnectedWallet): ConnectedWallet;
 export declare const calculateWalletUsdValue: (connectedWallet: ConnectedWallet[]) => string;
-export declare const sortTokens: (tokens: TokenWithBalance[]) => TokenWithBalance[];
 export declare const getUsdPrice: (blockchain: string, symbol: string, address: string | null, allTokens: Token[]) => number | null;
 export declare const isExperimentalChain: (blockchains: BlockchainMeta[], wallet: string) => boolean;
 export declare const getKeplrCompatibleConnectedWallets: (selectableWallets: Wallet[]) => WalletType[];
-export declare function getTokensWithBalance(tokens: TokenWithBalance[], connectedWallets: ConnectedWallet[]): TokenWithBalance[];
-export declare function getTokensBalanceFromWalletAndSort(tokens: TokenWithBalance[], connectedWallets: ConnectedWallet[]): TokenWithBalance[];
-export declare function getSortedTokens(chain: BlockchainMeta | null, tokens: Token[], connectedWallets: ConnectedWallet[], otherChainTokens: TokenWithBalance[]): TokenWithBalance[];
+export declare function formatBalance(balance: Balance | null): Balance | null;
+export declare function sortTokensByBalance(tokens: Token[], getBalanceFor: (token: Token) => Balance | null): Token[];
 export declare function tokensAreEqual(tokenA: Pick<Token, 'blockchain' | 'symbol' | 'address'> | null, tokenB: Pick<Token, 'blockchain' | 'symbol' | 'address'> | null): boolean;
 export declare function sortWalletsBasedOnConnectionState(wallets: ModalWalletInfo[]): ModalWalletInfo[];
 export declare function getConciseAddress(address: string, maxChars?: number, ellipsisLength?: number): string;
@@ -30,4 +26,6 @@ export declare function getAddress({ chain, connectedWallets, walletType, }: {
     walletType: string;
     chain: string;
 }): string | undefined;
+export declare function createTokenHash(token: Asset): TokenHash;
+export declare function makeTokensBalance(connectedWallets: ConnectedWallet[]): TokensBalance;
 //# sourceMappingURL=wallets.d.ts.map

package/dist/utils/wallets.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/utils/wallets.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/utils/wallets.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/widget-embedded",
-  "version": "0.17.1-next.25",
+  "version": "0.17.1-next.26",
   "license": "MIT",
   "type": "module",
   "source": "./src/index.ts",
@@ -23,9 +23,9 @@
     "@lingui/react": "4.2.1",
     "@rango-dev/provider-all": "^0.22.1-next.7",
     "@rango-dev/queue-manager-core": "^0.22.1-next.3",
-    "@rango-dev/queue-manager-rango-preset": "^0.22.1-next.9",
+    "@rango-dev/queue-manager-rango-preset": "^0.22.1-next.10",
     "@rango-dev/queue-manager-react": "^0.22.1-next.3",
-    "@rango-dev/ui": "^0.22.1-next.14",
+    "@rango-dev/ui": "^0.22.1-next.15",
     "@rango-dev/wallets-react": "^0.8.1-next.5",
     "@rango-dev/wallets-shared": "^0.21.1-next.5",
     "bignumber.js": "^9.1.1",

package/src/components/TokenList/TokenList.helpers.ts

@@ -1,8 +1,8 @@
-import type { TokenWithBalance } from './TokenList.types';
+import type { Token } from 'rango-sdk';
 
 import { containsText } from '../../utils/common';
 
-export const filterTokens = (list: TokenWithBalance[], searchedFor: string) =>
+export const filterTokens = (list: Token[], searchedFor: string) =>
   list.filter(
     (token) =>
       containsText(token.symbol, searchedFor) ||

package/src/components/TokenList/TokenList.tsx

@@ -1,9 +1,6 @@
 /* eslint-disable @typescript-eslint/no-magic-numbers */
-import type {
-  PropTypes,
-  RenderDescProps,
-  TokenWithBalance,
-} from './TokenList.types';
+import type { PropTypes, RenderDescProps } from './TokenList.types';
+import type { Token } from 'rango-sdk';
 import type { CommonProps } from 'react-window';
 
 import { i18n } from '@lingui/core';
@@ -24,6 +21,7 @@ import React, { forwardRef, useEffect, useState } from 'react';
 import { useAppStore } from '../../store/AppStore';
 import { useWalletsStore } from '../../store/wallets';
 import { generateRangeColors } from '../../utils/colors';
+import { formatBalance } from '../../utils/wallets';
 
 import { LoadingTokenList } from './LoadingTokenList';
 import {
@@ -85,11 +83,11 @@ const renderDesc = (props: RenderDescProps) => {
 export function TokenList(props: PropTypes) {
   const { list, searchedFor = '', onChange, selectedBlockchain } = props;
 
-  const [tokens, setTokens] = useState<TokenWithBalance[]>(list);
+  const [tokens, setTokens] = useState<Token[]>(list);
   const fetchStatus = useAppStore().fetchStatus;
   const blockchains = useAppStore().blockchains();
   const [hasNextPage, setHasNextPage] = useState<boolean>(true);
-  const loadingWallet = useWalletsStore.use.loading();
+  const { getBalanceFor, loading: loadingWallet } = useWalletsStore();
   const { isTokenPinned } = useAppStore();
 
   // eslint-disable-next-line react/display-name
@@ -134,7 +132,7 @@ export function TokenList(props: PropTypes) {
       <VirtualizedList
         Item={({ index, style }) => {
           const token = tokens[index];
-
+          const tokenBalance = formatBalance(getBalanceFor(token));
           const address = token.address || '';
           const blockchain = blockchains.find(
             (blockchain) => blockchain.name === token.blockchain
@@ -229,18 +227,18 @@ export function TokenList(props: PropTypes) {
                       <Skeleton variant="text" size="medium" width={50} />
                     </End>
                   ) : (
-                    tokens[index]?.balance && (
+                    tokenBalance && (
                       <BalanceContainer>
                         <Typography variant="title" size="small">
-                          {token.balance?.amount}
+                          {tokenBalance.amount}
                         </Typography>
                         <div />
-                        {token.balance?.usdValue && (
+                        {tokenBalance.usdValue && (
                           <Typography
                             variant="body"
                             className="usd-value"
                             size="xsmall">
-                            {`$${token.balance?.usdValue}`}
+                            {`$${tokenBalance.usdValue}`}
                           </Typography>
                         )}
                       </BalanceContainer>

package/src/components/TokenList/TokenList.types.ts

@@ -1,16 +1,9 @@
 import type { Token } from 'rango-sdk';
 
-export interface TokenWithBalance extends Token {
-  balance?: {
-    amount: string;
-    usdValue: string;
-  };
-}
-
 export interface PropTypes {
-  list: TokenWithBalance[];
+  list: Token[];
   searchedFor?: string;
-  onChange: (token: TokenWithBalance) => void;
+  onChange: (token: Token) => void;
   selectedBlockchain?: string;
 }
 
@@ -22,7 +15,7 @@ export interface RenderDescProps {
   name?: string | null;
   address: string;
   url: string;
-  token: TokenWithBalance;
+  token: Token;
   customCssForTag: TagCSS;
   customCssForTagTitle: TitleCSS;
 }

package/src/components/TokenList/index.ts

@@ -1,2 +1 @@
 export { TokenList } from './TokenList';
-export type { TokenWithBalance } from './TokenList.types';

package/src/containers/Wallets/Wallets.tsx

@@ -28,15 +28,14 @@ export const WidgetContext = createContext<WidgetContextInterface>({
 });
 
 function Main(props: PropsWithChildren<PropTypes>) {
-  const updateConfig = useAppStore().updateConfig;
+  const { updateConfig } = useAppStore();
   const blockchains = useAppStore().blockchains();
   const tokens = useAppStore().tokens();
   const walletOptions: ProvidersOptions = {
     walletConnectProjectId: props.config?.walletConnectProjectId,
   };
   const { providers } = useWalletProviders(props.config.wallets, walletOptions);
-  const disconnectWallet = useWalletsStore.use.disconnectWallet();
-  const connectWallet = useWalletsStore.use.connectWallet();
+  const { connectWallet, disconnectWallet } = useWalletsStore();
   const onConnectWalletHandler = useRef<OnConnectHandler>();
   useSyncStoresWithConfig();
 

package/src/pages/Home.tsx

@@ -9,8 +9,6 @@ import { SwitchFromAndToButton } from '../components/SwitchFromAndTo';
 import { errorMessages } from '../constants/errors';
 import { navigationRoutes } from '../constants/navigationRoutes';
 import {
-  BALANCE_MAX_DECIMALS,
-  BALANCE_MIN_DECIMALS,
   PERCENTAGE_CHANGE_MAX_DECIMALS,
   PERCENTAGE_CHANGE_MIN_DECIMALS,
   TOKEN_AMOUNT_MAX_DECIMALS,
@@ -27,7 +25,7 @@ import { useWalletsStore } from '../store/wallets';
 import { numberToString } from '../utils/numbers';
 import { getPriceImpact, getPriceImpactLevel } from '../utils/quote';
 import { canComputePriceImpact, getSwapButtonState } from '../utils/swap';
-import { getBalanceFromWallet } from '../utils/wallets';
+import { formatBalance } from '../utils/wallets';
 
 const Container = styled('div', {
   display: 'flex',
@@ -73,7 +71,7 @@ export function Home() {
 
   const fetchMetaStatus = useAppStore().fetchStatus;
 
-  const connectedWallets = useWalletsStore.use.connectedWallets();
+  const { connectedWallets, getBalanceFor } = useWalletsStore();
   const setCurrentPage = useUiStore.use.setCurrentPage();
   const [showQuoteWarningModal, setShowQuoteWarningModal] = useState(false);
   const layoutRef = useRef<HTMLDivElement>(null);
@@ -103,36 +101,14 @@ export function Home() {
     needsToWarnEthOnPath,
   });
 
-  const tokenBalance =
-    !!fromBlockchain && !!fromToken
-      ? numberToString(
-          getBalanceFromWallet(
-            connectedWallets,
-            fromBlockchain?.name,
-            fromToken?.symbol,
-            fromToken?.address
-          )?.amount || '0',
-          BALANCE_MIN_DECIMALS,
-          BALANCE_MAX_DECIMALS
-        )
-      : '0';
+  const fromTokenBalance = fromToken ? getBalanceFor(fromToken) : null;
+
+  const fromTokenFormattedBalance =
+    formatBalance(fromTokenBalance)?.amount ?? '0';
 
   const tokenBalanceReal =
     !!fromBlockchain && !!fromToken
-      ? numberToString(
-          getBalanceFromWallet(
-            connectedWallets,
-            fromBlockchain?.name,
-            fromToken?.symbol,
-            fromToken?.address
-          )?.amount || '0',
-          getBalanceFromWallet(
-            connectedWallets,
-            fromBlockchain?.name,
-            fromToken?.symbol,
-            fromToken?.address
-          )?.decimal
-        )
+      ? numberToString(fromTokenBalance?.amount, fromTokenBalance?.decimals)
       : '0';
 
   useEffect(() => {
@@ -194,7 +170,7 @@ export function Home() {
               label={i18n.t('From')}
               mode="From"
               onInputChange={setInputAmount}
-              balance={tokenBalance}
+              balance={fromTokenFormattedBalance}
               chain={{
                 displayName: fromBlockchain?.displayName || '',
                 image: fromBlockchain?.logo || '',
@@ -220,7 +196,7 @@ export function Home() {
               disabled={fetchMetaStatus === 'failed'}
               loading={fetchMetaStatus === 'loading'}
               onSelectMaxBalance={() => {
-                if (tokenBalance !== '0') {
+                if (fromTokenFormattedBalance !== '0') {
                   setInputAmount(tokenBalanceReal.split(',').join(''));
                 }
               }}

package/src/pages/SelectSwapItemsPage.tsx

@@ -14,7 +14,7 @@ import { useNavigateBack } from '../hooks/useNavigateBack';
 import { useAppStore } from '../store/AppStore';
 import { useQuoteStore } from '../store/quote';
 import { useWalletsStore } from '../store/wallets';
-import { getTokensBalanceFromWalletAndSort } from '../utils/wallets';
+import { sortTokensByBalance } from '../utils/wallets';
 
 interface PropTypes {
   type: 'source' | 'destination';
@@ -32,7 +32,7 @@ export function SelectSwapItemsPage(props: PropTypes) {
     setFromBlockchain,
     setToBlockchain,
   } = useQuoteStore();
-  const { connectedWallets } = useWalletsStore();
+  const getBalanceFor = useWalletsStore.use.getBalanceFor();
   const [searchedFor, setSearchedFor] = useState<string>('');
 
   const selectedBlockchain = type === 'source' ? fromBlockchain : toBlockchain;
@@ -47,10 +47,7 @@ export function SelectSwapItemsPage(props: PropTypes) {
     blockchain: selectedBlockchainName,
     searchFor: searchedFor,
   });
-  const tokensList = getTokensBalanceFromWalletAndSort(
-    tokens,
-    connectedWallets
-  );
+  const tokensList = sortTokensByBalance(tokens, getBalanceFor);
 
   // Actions
   const updateBlockchain = (blockchain: BlockchainMeta) => {

package/src/store/quote.ts

@@ -1,4 +1,3 @@
-import type { TokenWithBalance } from '../components/TokenList';
 import type { Wallet } from '../types';
 import type { PendingSwap } from '@rango-dev/queue-manager-rango-preset/dist/shared';
 import type {
@@ -38,8 +37,8 @@ export interface QuoteState {
   inputUsdValue: BigNumber | null;
   outputAmount: BigNumber | null;
   outputUsdValue: BigNumber | null;
-  fromToken: TokenWithBalance | null;
-  toToken: TokenWithBalance | null;
+  fromToken: Token | null;
+  toToken: Token | null;
   quoteWalletsConfirmed: boolean;
   selectedWallets: Wallet[];
   quoteWarningsConfirmed: boolean;

package/src/store/wallets.ts

@@ -1,4 +1,4 @@
-import type { Wallet } from '../types';
+import type { Balance, TokensBalance, Wallet } from '../types';
 import type { WalletType } from '@rango-dev/wallets-shared';
 import type { Token } from 'rango-sdk';
 
@@ -7,8 +7,10 @@ import { subscribeWithSelector } from 'zustand/middleware';
 
 import { httpService } from '../services/httpService';
 import {
+  createTokenHash,
   isAccountAndWalletMatched,
   makeBalanceFor,
+  makeTokensBalance,
   resetConnectedWalletState,
 } from '../utils/wallets';
 
@@ -33,9 +35,9 @@ export interface ConnectedWallet extends Wallet {
   loading: boolean;
   error: boolean;
 }
-
 interface WalletsStore {
   connectedWallets: ConnectedWallet[];
+  balances: TokensBalance;
   customDestination: string;
   loading: boolean;
   connectWallet: (accounts: Wallet[], tokens: Token[]) => void;
@@ -47,12 +49,14 @@ interface WalletsStore {
     tokens: Token[],
     shouldRetry?: boolean
   ) => void;
+  getBalanceFor: (token: Token) => Balance | null;
 }
 
 export const useWalletsStore = createSelectors(
   create<WalletsStore>()(
     subscribeWithSelector((set, get) => ({
       connectedWallets: [],
+      balances: {},
       customDestination: '',
       loading: false,
       connectWallet: (accounts, tokens) => {
@@ -92,21 +96,27 @@ export const useWalletsStore = createSelectors(
                 connectedWallet.walletType !== walletType
             )
             .map((selectedWallet) => selectedWallet.chain);
+
+          const connectedWallets = state.connectedWallets
+            .filter(
+              (connectedWallet) => connectedWallet.walletType !== walletType
+            )
+            .map((connectedWallet) => {
+              const anyWalletSelectedForBlockchain = selectedWallets.includes(
+                connectedWallet.chain
+              );
+              if (anyWalletSelectedForBlockchain) {
+                return connectedWallet;
+              }
+              selectedWallets.push(connectedWallet.chain);
+              return { ...connectedWallet, selected: true };
+            });
+
+          const balances = makeTokensBalance(connectedWallets);
+
           return {
-            connectedWallets: state.connectedWallets
-              .filter(
-                (connectedWallet) => connectedWallet.walletType !== walletType
-              )
-              .map((connectedWallet) => {
-                const anyWalletSelectedForBlockchain = selectedWallets.includes(
-                  connectedWallet.chain
-                );
-                if (anyWalletSelectedForBlockchain) {
-                  return connectedWallet;
-                }
-                selectedWallets.push(connectedWallet.chain);
-                return { ...connectedWallet, selected: true };
-              }),
+            balances,
+            connectedWallets,
           };
         });
       },
@@ -159,9 +169,8 @@ export const useWalletsStore = createSelectors(
           const response = await httpService().getWalletsDetails(data);
           const retrievedBalance = response.wallets;
           if (retrievedBalance) {
-            set((state) => ({
-              loading: false,
-              connectedWallets: state.connectedWallets.map(
+            set((state) => {
+              const connectedWallets = state.connectedWallets.map(
                 (connectedWallet) => {
                   const matchedAccount = accounts.find((account) =>
                     isAccountAndWalletMatched(account, connectedWallet)
@@ -190,27 +199,45 @@ export const useWalletsStore = createSelectors(
                       }
                     : connectedWallet;
                 }
-              ),
-            }));
+              );
+
+              const balances = makeTokensBalance(connectedWallets);
+
+              return {
+                loading: false,
+                balances,
+                connectedWallets,
+              };
+            });
           } else {
             throw new Error('Wallet not found');
           }
         } catch (error) {
-          set((state) => ({
-            loading: false,
-            connectedWallets: state.connectedWallets.map((balance) => {
+          set((state) => {
+            const connectedWallets = state.connectedWallets.map((balance) => {
               return accounts.find((account) =>
                 isAccountAndWalletMatched(account, balance)
               )
                 ? resetConnectedWalletState(balance)
                 : balance;
-            }),
-          }));
+            });
+
+            const balances = makeTokensBalance(connectedWallets);
+
+            return {
+              loading: false,
+              balances,
+              connectedWallets,
+            };
+          });
         }
       },
+      getBalanceFor: (token) => {
+        const { balances } = get();
+        const tokenHash = createTokenHash(token);
+        const balance = balances[tokenHash];
+        return balance ?? null;
+      },
     }))
   )
 );
-
-export const fetchingBalanceSelector = (state: WalletsStore) =>
-  !!state.connectedWallets.find((wallet) => wallet.loading);

package/src/types/wallets.ts

@@ -1,7 +1,24 @@
-import { WalletType } from '@rango-dev/wallets-shared';
+import type { WalletType } from '@rango-dev/wallets-shared';
 
 export interface Wallet {
   chain: string;
   address: string;
   walletType: WalletType;
 }
+
+export type Balance = {
+  amount: string;
+  decimals: number;
+  usdValue: string;
+};
+
+type Blockchain = string;
+type TokenSymbol = string;
+type Address = string;
+
+/** `blockchain-symbol-Address` */
+export type TokenHash = `${Blockchain}-${TokenSymbol}-${Address}`;
+
+export type TokensBalance = {
+  [key: TokenHash]: Balance;
+};