@rango-dev/widget-embedded 0.39.1-next.12 → 0.39.1-next.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/widget-embedded",
-  "version": "0.39.1-next.12",
+  "version": "0.39.1-next.14",
   "license": "MIT",
   "type": "module",
   "source": "./src/index.ts",

package/src/constants/wallets.ts

@@ -1,3 +1,5 @@
 import { WalletTypes } from '@rango-dev/wallets-shared';
 
+export const BALANCE_SEPARATOR = '$$';
+
 export const EXCLUDED_WALLETS = [WalletTypes.LEAP];

package/src/store/slices/wallets.ts

@@ -6,6 +6,7 @@ import type { StateCreator } from 'zustand';
 import BigNumber from 'bignumber.js';
 
 import { ZERO } from '../../constants/numbers';
+import { BALANCE_SEPARATOR } from '../../constants/wallets';
 import { eventEmitter } from '../../services/eventEmitter';
 import { httpService } from '../../services/httpService';
 import {
@@ -28,11 +29,12 @@ type WalletAddress = string;
 type TokenAddress = string;
 type TokenSymbol = string;
 type BlockchainId = string;
-/** format: `BlockchainId-TokenAddress-TokenSymbol` */
-export type AssetKey = `${BlockchainId}-${TokenAddress}-${TokenSymbol}`;
-/** format: `BlockchainId-TokenAddress-TokenSymbol-WalletAddress` */
+/** format: `BlockchainId${BALANCE_SEPARATOR}TokenAddress${BALANCE_SEPARATOR}TokenSymbol` */
+export type AssetKey =
+  `${BlockchainId}${typeof BALANCE_SEPARATOR}${TokenAddress}${typeof BALANCE_SEPARATOR}${TokenSymbol}`;
+/** format: `BlockchainId${BALANCE_SEPARATOR}TokenAddress${BALANCE_SEPARATOR}TokenSymbol${BALANCE_SEPARATOR}WalletAddress` */
 export type BalanceKey =
-  `${BlockchainId}-${TokenAddress}-${TokenSymbol}-${WalletAddress}`;
+  `${BlockchainId}${typeof BALANCE_SEPARATOR}${TokenAddress}${typeof BALANCE_SEPARATOR}${TokenSymbol}${typeof BALANCE_SEPARATOR}${WalletAddress}`;
 
 export type BalanceState = {
   [key: BalanceKey]: Balance;
@@ -485,6 +487,21 @@ export const createWalletsSlice: StateCreator<
           chains: [wallet.blockChain],
         });
 
+        /*
+         * Check if after fetching balance for an account, the account still exists.
+         * (It might get disconnected while fetching balances is pending)
+         */
+        if (
+          !get().connectedWallets.find(
+            (connectedWallet) =>
+              connectedWallet.walletType === walletType &&
+              connectedWallet.address === wallet.address &&
+              connectedWallet.chain === wallet.blockChain
+          )
+        ) {
+          return;
+        }
+
         const balancesForWallet = createBalanceStateForNewAccount(wallet, get);
 
         nextAggregatedBalances = updateAggregatedBalanceStateForNewAccount(
@@ -560,7 +577,8 @@ export const createWalletsSlice: StateCreator<
       (output, balanceKey) => {
         const balance = balances[balanceKey];
 
-        const [, , , balanceWalletAddreess] = balanceKey.split('-');
+        const [, , , balanceWalletAddreess] =
+          balanceKey.split(BALANCE_SEPARATOR);
         if (balanceWalletAddreess === address) {
           output[balanceKey] = balance;
         }

package/src/store/utils/wallets.ts

@@ -1,38 +1,39 @@
 import type { Balance } from '../../types';
 import type { AppStoreState } from '../app';
-import type {
-  AggregatedBalanceState,
-  AssetKey,
-  BalanceKey,
-  BalanceState,
-} from '../slices/wallets';
 import type { Asset, WalletDetail } from 'rango-types';
 
 import BigNumber from 'bignumber.js';
 
 import { ZERO } from '../../constants/numbers';
+import { BALANCE_SEPARATOR } from '../../constants/wallets';
+import {
+  type AggregatedBalanceState,
+  type AssetKey,
+  type BalanceKey,
+  type BalanceState,
+} from '../slices/wallets';
 
 /**
  * Note: We need to use `symbol` as well since native coins and cosmos blockchains don't have `address`
- * output format: BlockchainId-TokenAddress-TokenSymbol
+ * output format: BlockchainId${BALANCE_SEPARATOR}TokenAddress${BALANCE_SEPARATOR}TokenSymbol
  */
 export function createAssetKey(asset: Asset): AssetKey {
-  return `${asset.blockchain}-${asset.address}-${asset.symbol}`;
+  return `${asset.blockchain}${BALANCE_SEPARATOR}${asset.address}${BALANCE_SEPARATOR}${asset.symbol}`;
 }
 
 /**
- * output format: BlockchainId-TokenAddress-TokenSymbol-WalletAddress
+ * output format: BlockchainId${BALANCE_SEPARATOR}TokenAddress${BALANCE_SEPARATOR}TokenSymbol${BALANCE_SEPARATOR}WalletAddress
  */
 export function createBalanceKey(
   accountAddress: string,
   asset: Asset
 ): BalanceKey {
   const assetKey = createAssetKey(asset);
-  return `${assetKey}-${accountAddress}`;
+  return `${assetKey}${BALANCE_SEPARATOR}${accountAddress}`;
 }
 
 export function extractAssetFromBalanceKey(key: BalanceKey): Asset {
-  const [assetChain, assetAddress, assetSymbol] = key.split('-');
+  const [assetChain, assetAddress, assetSymbol] = key.split(BALANCE_SEPARATOR);
 
   // null will be serialized to 'null', we need to make it back to a null type
   const address = assetAddress === 'null' ? null : assetAddress;