@talismn/balances-react 0.0.0-pr660-20230327112704 → 0.0.0-pr660-20230328111733

package/CHANGELOG.md

@@ -1,6 +1,6 @@
 # @talismn/balances-react
 
-## 0.0.0-pr660-20230327112704
+## 0.0.0-pr660-20230328111733
 
 ### Minor Changes
 
@@ -17,13 +17,13 @@
 - Updated dependencies [79f6ccf6]
 - Updated dependencies [6643a4e4]
 - Updated dependencies [c24dc1fb]
-  - @talismn/chain-connector@0.0.0-pr660-20230327112704
-  - @talismn/connection-meta@0.0.0-pr660-20230327112704
-  - @talismn/balances@0.0.0-pr660-20230327112704
-  - @talismn/token-rates@0.0.0-pr660-20230327112704
-  - @talismn/chaindata-provider-extension@0.0.0-pr660-20230327112704
-  - @talismn/chaindata-provider@0.0.0-pr660-20230327112704
-  - @talismn/chain-connector-evm@0.0.0-pr660-20230327112704
+  - @talismn/chain-connector@0.0.0-pr660-20230328111733
+  - @talismn/connection-meta@0.0.0-pr660-20230328111733
+  - @talismn/balances@0.0.0-pr660-20230328111733
+  - @talismn/token-rates@0.0.0-pr660-20230328111733
+  - @talismn/chaindata-provider-extension@0.0.0-pr660-20230328111733
+  - @talismn/chaindata-provider@0.0.0-pr660-20230328111733
+  - @talismn/chain-connector-evm@0.0.0-pr660-20230328111733
 
 ## 0.3.3
 

package/dist/declarations/src/hooks/useDbCache.d.ts

@@ -17,6 +17,9 @@ type DbCache = {
     tokensWithoutTestnetsMap: Record<TokenId, Token>;
     tokenRatesMap: Record<TokenId, TokenRates>;
     balances: BalanceJson[];
+    balancesMeta: {
+        subscriptionId: string | undefined;
+    };
 };
 export declare const DbCacheProvider: import("react").FC<{
     children?: import("react").ReactNode;

package/dist/talismn-balances-react.cjs.dev.js

@@ -117,9 +117,12 @@ const DEFAULT_VALUE = {
   tokensWithTestnetsMap: {},
   tokensWithoutTestnetsMap: {},
   tokenRatesMap: {},
-  balances: []
+  balances: [],
+  balancesMeta: {
+    subscriptionId: undefined
+  }
 };
-const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, allBalances) => {
+const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, allBalances, meta) => {
   if (!chainsMap || !evmNetworksMap || !tokensMap || !tokenRates || !allBalances) return DEFAULT_VALUE;
 
   // BEGIN: temp hack to indicate that
@@ -155,6 +158,11 @@ const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, al
 
   // return only balances for which we have a token
   const balances = allBalances.filter(b => tokensWithTestnetsMap[b.tokenId]);
+  const balancesMeta = {
+    subscriptionId: meta?.find(({
+      id
+    }) => id === "subscriptionId")?.value
+  };
   return {
     chainsWithTestnets,
     chainsWithoutTestnets,
@@ -169,7 +177,8 @@ const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, al
     tokensWithTestnetsMap,
     tokensWithoutTestnetsMap,
     tokenRatesMap,
-    balances
+    balances,
+    balancesMeta
   };
 };
 const useDbCacheProvider = () => {
@@ -179,28 +188,29 @@ const useDbCacheProvider = () => {
   const tokenList = dexieReactHooks.useLiveQuery(() => chaindataProvider?.tokens(), [chaindataProvider]);
   const tokenRates$1 = dexieReactHooks.useLiveQuery(() => tokenRates.db.tokenRates.toArray(), []);
   const rawBalances = dexieReactHooks.useLiveQuery(() => balances.db.balances.toArray(), []);
+  const meta = dexieReactHooks.useLiveQuery(() => balances.db.meta.toArray(), []);
   const [dbData, setDbData] = react.useState(DEFAULT_VALUE);
 
   // debounce every 500ms to prevent hammering UI with updates
   reactUse.useDebounce(() => {
-    setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances));
-  }, 500, [chainList, evmNetworkList, tokenList, rawBalances, tokenRates$1]);
+    setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances, meta));
+  }, 500, [chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances, meta]);
   const refInitialized = react.useRef(false);
 
   // force an update as soon as all datasources are fetched, so UI can display data ASAP
   react.useEffect(() => {
-    if (!refInitialized.current && chainList && evmNetworkList && tokenList && tokenRates$1 && rawBalances) {
-      setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances));
+    if (!refInitialized.current && chainList && evmNetworkList && tokenList && tokenRates$1 && rawBalances && meta) {
+      setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances, meta));
       refInitialized.current = true;
     }
-  }, [chainList, evmNetworkList, rawBalances, tokenList, tokenRates$1]);
+  }, [chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances, meta]);
   return dbData;
 };
 const [DbCacheProvider, useDbCache] = provideContext(useDbCacheProvider);
 
 var packageJson = {
 	name: "@talismn/balances-react",
-	version: "0.0.0-pr660-20230327112704",
+	version: "0.0.0-pr660-20230328111733",
 	author: "Talisman",
 	homepage: "https://talisman.xyz",
 	license: "UNLICENSED",
@@ -503,10 +513,29 @@ const subscribeBalances = (tokens, addresses, balanceModules) => {
     id
   }) => id);
   const addressesByToken = Object.fromEntries(tokenIds.map(tokenId => [tokenId, addresses]));
+  const subscriptionId = Date.now().toString();
+  balances.db.meta.put({
+    id: "subscriptionId",
+    value: subscriptionId
+  });
+
+  // TODO: Create subscriptions in a service worker, where we can detect page closes
+  // and therefore reliably delete the subscriptionId when the user closes our dapp
+  //
+  // For more information, check out https://developer.chrome.com/blog/page-lifecycle-api/#faqs
+  // and scroll down to:
+  // - `What is the back/forward cache?`, and
+  // - `If I can't run asynchronous APIs in the frozen or terminated states, how can I save data to IndexedDB?
+  //
+  // For now, we'll just last-ditch remove the subscriptionId (it works surprisingly well!) in the beforeunload event
+  window.onbeforeunload = () => {
+    balances.db.meta.delete("subscriptionId");
+  };
   const updateDb = balances$1 => {
     const putBalances = Object.entries(balances$1.toJSON()).map(([id, balance]) => ({
       id,
-      ...balance
+      ...balance,
+      status: balances.BalanceStatusLive(subscriptionId)
     }));
     balances.db.transaction("rw", balances.db.balances, async () => await balances.db.balances.bulkPut(putBalances));
   };
@@ -525,7 +554,7 @@ const subscribeBalances = (tokens, addresses, balanceModules) => {
     const unsub = balances.balances(balanceModule, addressesByModuleToken, (error, balances$1) => {
       // log errors
       if (error) {
-        if (error?.type === "STALE_RPC_ERROR") return balances.db.balances.where({
+        if (error?.type === "STALE_RPC_ERROR" || error?.type === "WEBSOCKET_ALLOCATION_EXHAUSTED_ERROR") return balances.db.balances.where({
           source: balanceModule.type,
           chainId: error.chainId
         }).filter(balance => {
@@ -548,15 +577,7 @@ const subscribeBalances = (tokens, addresses, balanceModules) => {
       unsub.then(unsubscribe => {
         setTimeout(unsubscribe, 2_000);
       });
-      balances.db.balances.where({
-        source: balanceModule.type
-      }).filter(balance => {
-        if (!Object.keys(addressesByModuleToken).includes(balance.tokenId)) return false;
-        if (!addressesByModuleToken[balance.tokenId].includes(balance.address)) return false;
-        return true;
-      }).modify({
-        status: "cache"
-      });
+      balances.db.meta.delete("subscriptionId");
     };
   });
   const unsubscribeAll = () => {
@@ -642,10 +663,11 @@ function useBalances(addressesByToken) {
   useDbCacheBalancesSubscription();
   const balanceModules = useBalanceModules();
   const {
-    balances: balances$1
+    balances: balances$1,
+    balancesMeta
   } = useDbCache();
   const hydrate = useBalancesHydrate();
-  return react.useMemo(() => new balances.Balances(balances$1.filter(balance => {
+  return react.useMemo(() => new balances.Balances(balances.deriveStatuses(balancesMeta.subscriptionId, balances$1.filter(balance => {
     // check that this balance is included in our queried balance modules
     if (!balanceModules.map(({
       type
@@ -662,9 +684,9 @@ function useBalances(addressesByToken) {
 
     // keep this balance
     return true;
-  }),
+  })),
   // hydrate balance chains, evmNetworks, tokens and tokenRates
-  hydrate), [balances$1, hydrate, balanceModules, addressesByToken]);
+  hydrate), [balancesMeta.subscriptionId, balances$1, hydrate, balanceModules, addressesByToken]);
 }
 
 /**

package/dist/talismn-balances-react.cjs.prod.js

@@ -117,9 +117,12 @@ const DEFAULT_VALUE = {
   tokensWithTestnetsMap: {},
   tokensWithoutTestnetsMap: {},
   tokenRatesMap: {},
-  balances: []
+  balances: [],
+  balancesMeta: {
+    subscriptionId: undefined
+  }
 };
-const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, allBalances) => {
+const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, allBalances, meta) => {
   if (!chainsMap || !evmNetworksMap || !tokensMap || !tokenRates || !allBalances) return DEFAULT_VALUE;
 
   // BEGIN: temp hack to indicate that
@@ -155,6 +158,11 @@ const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, al
 
   // return only balances for which we have a token
   const balances = allBalances.filter(b => tokensWithTestnetsMap[b.tokenId]);
+  const balancesMeta = {
+    subscriptionId: meta?.find(({
+      id
+    }) => id === "subscriptionId")?.value
+  };
   return {
     chainsWithTestnets,
     chainsWithoutTestnets,
@@ -169,7 +177,8 @@ const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, al
     tokensWithTestnetsMap,
     tokensWithoutTestnetsMap,
     tokenRatesMap,
-    balances
+    balances,
+    balancesMeta
   };
 };
 const useDbCacheProvider = () => {
@@ -179,28 +188,29 @@ const useDbCacheProvider = () => {
   const tokenList = dexieReactHooks.useLiveQuery(() => chaindataProvider?.tokens(), [chaindataProvider]);
   const tokenRates$1 = dexieReactHooks.useLiveQuery(() => tokenRates.db.tokenRates.toArray(), []);
   const rawBalances = dexieReactHooks.useLiveQuery(() => balances.db.balances.toArray(), []);
+  const meta = dexieReactHooks.useLiveQuery(() => balances.db.meta.toArray(), []);
   const [dbData, setDbData] = react.useState(DEFAULT_VALUE);
 
   // debounce every 500ms to prevent hammering UI with updates
   reactUse.useDebounce(() => {
-    setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances));
-  }, 500, [chainList, evmNetworkList, tokenList, rawBalances, tokenRates$1]);
+    setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances, meta));
+  }, 500, [chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances, meta]);
   const refInitialized = react.useRef(false);
 
   // force an update as soon as all datasources are fetched, so UI can display data ASAP
   react.useEffect(() => {
-    if (!refInitialized.current && chainList && evmNetworkList && tokenList && tokenRates$1 && rawBalances) {
-      setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances));
+    if (!refInitialized.current && chainList && evmNetworkList && tokenList && tokenRates$1 && rawBalances && meta) {
+      setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances, meta));
       refInitialized.current = true;
     }
-  }, [chainList, evmNetworkList, rawBalances, tokenList, tokenRates$1]);
+  }, [chainList, evmNetworkList, tokenList, tokenRates$1, rawBalances, meta]);
   return dbData;
 };
 const [DbCacheProvider, useDbCache] = provideContext(useDbCacheProvider);
 
 var packageJson = {
 	name: "@talismn/balances-react",
-	version: "0.0.0-pr660-20230327112704",
+	version: "0.0.0-pr660-20230328111733",
 	author: "Talisman",
 	homepage: "https://talisman.xyz",
 	license: "UNLICENSED",
@@ -503,10 +513,29 @@ const subscribeBalances = (tokens, addresses, balanceModules) => {
     id
   }) => id);
   const addressesByToken = Object.fromEntries(tokenIds.map(tokenId => [tokenId, addresses]));
+  const subscriptionId = Date.now().toString();
+  balances.db.meta.put({
+    id: "subscriptionId",
+    value: subscriptionId
+  });
+
+  // TODO: Create subscriptions in a service worker, where we can detect page closes
+  // and therefore reliably delete the subscriptionId when the user closes our dapp
+  //
+  // For more information, check out https://developer.chrome.com/blog/page-lifecycle-api/#faqs
+  // and scroll down to:
+  // - `What is the back/forward cache?`, and
+  // - `If I can't run asynchronous APIs in the frozen or terminated states, how can I save data to IndexedDB?
+  //
+  // For now, we'll just last-ditch remove the subscriptionId (it works surprisingly well!) in the beforeunload event
+  window.onbeforeunload = () => {
+    balances.db.meta.delete("subscriptionId");
+  };
   const updateDb = balances$1 => {
     const putBalances = Object.entries(balances$1.toJSON()).map(([id, balance]) => ({
       id,
-      ...balance
+      ...balance,
+      status: balances.BalanceStatusLive(subscriptionId)
     }));
     balances.db.transaction("rw", balances.db.balances, async () => await balances.db.balances.bulkPut(putBalances));
   };
@@ -525,7 +554,7 @@ const subscribeBalances = (tokens, addresses, balanceModules) => {
     const unsub = balances.balances(balanceModule, addressesByModuleToken, (error, balances$1) => {
       // log errors
       if (error) {
-        if (error?.type === "STALE_RPC_ERROR") return balances.db.balances.where({
+        if (error?.type === "STALE_RPC_ERROR" || error?.type === "WEBSOCKET_ALLOCATION_EXHAUSTED_ERROR") return balances.db.balances.where({
           source: balanceModule.type,
           chainId: error.chainId
         }).filter(balance => {
@@ -548,15 +577,7 @@ const subscribeBalances = (tokens, addresses, balanceModules) => {
       unsub.then(unsubscribe => {
         setTimeout(unsubscribe, 2_000);
       });
-      balances.db.balances.where({
-        source: balanceModule.type
-      }).filter(balance => {
-        if (!Object.keys(addressesByModuleToken).includes(balance.tokenId)) return false;
-        if (!addressesByModuleToken[balance.tokenId].includes(balance.address)) return false;
-        return true;
-      }).modify({
-        status: "cache"
-      });
+      balances.db.meta.delete("subscriptionId");
     };
   });
   const unsubscribeAll = () => {
@@ -642,10 +663,11 @@ function useBalances(addressesByToken) {
   useDbCacheBalancesSubscription();
   const balanceModules = useBalanceModules();
   const {
-    balances: balances$1
+    balances: balances$1,
+    balancesMeta
   } = useDbCache();
   const hydrate = useBalancesHydrate();
-  return react.useMemo(() => new balances.Balances(balances$1.filter(balance => {
+  return react.useMemo(() => new balances.Balances(balances.deriveStatuses(balancesMeta.subscriptionId, balances$1.filter(balance => {
     // check that this balance is included in our queried balance modules
     if (!balanceModules.map(({
       type
@@ -662,9 +684,9 @@ function useBalances(addressesByToken) {
 
     // keep this balance
     return true;
-  }),
+  })),
   // hydrate balance chains, evmNetworks, tokens and tokenRates
-  hydrate), [balances$1, hydrate, balanceModules, addressesByToken]);
+  hydrate), [balancesMeta.subscriptionId, balances$1, hydrate, balanceModules, addressesByToken]);
 }
 
 /**

package/dist/talismn-balances-react.esm.js

@@ -4,7 +4,7 @@ import { ChainConnector } from '@talismn/chain-connector';
 import { ChainConnectorEvm } from '@talismn/chain-connector-evm';
 import { connectionMetaDb } from '@talismn/connection-meta';
 import { ChaindataProviderExtension } from '@talismn/chaindata-provider-extension';
-import { db as db$1, balances, Balances } from '@talismn/balances';
+import { db as db$1, balances, BalanceStatusLive, Balances, deriveStatuses } from '@talismn/balances';
 import { db, fetchTokenRates } from '@talismn/token-rates';
 import { useLiveQuery } from 'dexie-react-hooks';
 import { useDebounce } from 'react-use';
@@ -108,9 +108,12 @@ const DEFAULT_VALUE = {
   tokensWithTestnetsMap: {},
   tokensWithoutTestnetsMap: {},
   tokenRatesMap: {},
-  balances: []
+  balances: [],
+  balancesMeta: {
+    subscriptionId: undefined
+  }
 };
-const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, allBalances) => {
+const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, allBalances, meta) => {
   if (!chainsMap || !evmNetworksMap || !tokensMap || !tokenRates || !allBalances) return DEFAULT_VALUE;
 
   // BEGIN: temp hack to indicate that
@@ -146,6 +149,11 @@ const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, al
 
   // return only balances for which we have a token
   const balances = allBalances.filter(b => tokensWithTestnetsMap[b.tokenId]);
+  const balancesMeta = {
+    subscriptionId: meta?.find(({
+      id
+    }) => id === "subscriptionId")?.value
+  };
   return {
     chainsWithTestnets,
     chainsWithoutTestnets,
@@ -160,7 +168,8 @@ const consolidateDbCache = (chainsMap, evmNetworksMap, tokensMap, tokenRates, al
     tokensWithTestnetsMap,
     tokensWithoutTestnetsMap,
     tokenRatesMap,
-    balances
+    balances,
+    balancesMeta
   };
 };
 const useDbCacheProvider = () => {
@@ -170,28 +179,29 @@ const useDbCacheProvider = () => {
   const tokenList = useLiveQuery(() => chaindataProvider?.tokens(), [chaindataProvider]);
   const tokenRates = useLiveQuery(() => db.tokenRates.toArray(), []);
   const rawBalances = useLiveQuery(() => db$1.balances.toArray(), []);
+  const meta = useLiveQuery(() => db$1.meta.toArray(), []);
   const [dbData, setDbData] = useState(DEFAULT_VALUE);
 
   // debounce every 500ms to prevent hammering UI with updates
   useDebounce(() => {
-    setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates, rawBalances));
-  }, 500, [chainList, evmNetworkList, tokenList, rawBalances, tokenRates]);
+    setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates, rawBalances, meta));
+  }, 500, [chainList, evmNetworkList, tokenList, tokenRates, rawBalances, meta]);
   const refInitialized = useRef(false);
 
   // force an update as soon as all datasources are fetched, so UI can display data ASAP
   useEffect(() => {
-    if (!refInitialized.current && chainList && evmNetworkList && tokenList && tokenRates && rawBalances) {
-      setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates, rawBalances));
+    if (!refInitialized.current && chainList && evmNetworkList && tokenList && tokenRates && rawBalances && meta) {
+      setDbData(consolidateDbCache(chainList, evmNetworkList, tokenList, tokenRates, rawBalances, meta));
       refInitialized.current = true;
     }
-  }, [chainList, evmNetworkList, rawBalances, tokenList, tokenRates]);
+  }, [chainList, evmNetworkList, tokenList, tokenRates, rawBalances, meta]);
   return dbData;
 };
 const [DbCacheProvider, useDbCache] = provideContext(useDbCacheProvider);
 
 var packageJson = {
 	name: "@talismn/balances-react",
-	version: "0.0.0-pr660-20230327112704",
+	version: "0.0.0-pr660-20230328111733",
 	author: "Talisman",
 	homepage: "https://talisman.xyz",
 	license: "UNLICENSED",
@@ -494,10 +504,29 @@ const subscribeBalances = (tokens, addresses, balanceModules) => {
     id
   }) => id);
   const addressesByToken = Object.fromEntries(tokenIds.map(tokenId => [tokenId, addresses]));
+  const subscriptionId = Date.now().toString();
+  db$1.meta.put({
+    id: "subscriptionId",
+    value: subscriptionId
+  });
+
+  // TODO: Create subscriptions in a service worker, where we can detect page closes
+  // and therefore reliably delete the subscriptionId when the user closes our dapp
+  //
+  // For more information, check out https://developer.chrome.com/blog/page-lifecycle-api/#faqs
+  // and scroll down to:
+  // - `What is the back/forward cache?`, and
+  // - `If I can't run asynchronous APIs in the frozen or terminated states, how can I save data to IndexedDB?
+  //
+  // For now, we'll just last-ditch remove the subscriptionId (it works surprisingly well!) in the beforeunload event
+  window.onbeforeunload = () => {
+    db$1.meta.delete("subscriptionId");
+  };
   const updateDb = balances => {
     const putBalances = Object.entries(balances.toJSON()).map(([id, balance]) => ({
       id,
-      ...balance
+      ...balance,
+      status: BalanceStatusLive(subscriptionId)
     }));
     db$1.transaction("rw", db$1.balances, async () => await db$1.balances.bulkPut(putBalances));
   };
@@ -516,7 +545,7 @@ const subscribeBalances = (tokens, addresses, balanceModules) => {
     const unsub = balances(balanceModule, addressesByModuleToken, (error, balances) => {
       // log errors
       if (error) {
-        if (error?.type === "STALE_RPC_ERROR") return db$1.balances.where({
+        if (error?.type === "STALE_RPC_ERROR" || error?.type === "WEBSOCKET_ALLOCATION_EXHAUSTED_ERROR") return db$1.balances.where({
           source: balanceModule.type,
           chainId: error.chainId
         }).filter(balance => {
@@ -539,15 +568,7 @@ const subscribeBalances = (tokens, addresses, balanceModules) => {
       unsub.then(unsubscribe => {
         setTimeout(unsubscribe, 2_000);
       });
-      db$1.balances.where({
-        source: balanceModule.type
-      }).filter(balance => {
-        if (!Object.keys(addressesByModuleToken).includes(balance.tokenId)) return false;
-        if (!addressesByModuleToken[balance.tokenId].includes(balance.address)) return false;
-        return true;
-      }).modify({
-        status: "cache"
-      });
+      db$1.meta.delete("subscriptionId");
     };
   });
   const unsubscribeAll = () => {
@@ -633,10 +654,11 @@ function useBalances(addressesByToken) {
   useDbCacheBalancesSubscription();
   const balanceModules = useBalanceModules();
   const {
-    balances
+    balances,
+    balancesMeta
   } = useDbCache();
   const hydrate = useBalancesHydrate();
-  return useMemo(() => new Balances(balances.filter(balance => {
+  return useMemo(() => new Balances(deriveStatuses(balancesMeta.subscriptionId, balances.filter(balance => {
     // check that this balance is included in our queried balance modules
     if (!balanceModules.map(({
       type
@@ -653,9 +675,9 @@ function useBalances(addressesByToken) {
 
     // keep this balance
     return true;
-  }),
+  })),
   // hydrate balance chains, evmNetworks, tokens and tokenRates
-  hydrate), [balances, hydrate, balanceModules, addressesByToken]);
+  hydrate), [balancesMeta.subscriptionId, balances, hydrate, balanceModules, addressesByToken]);
 }
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@talismn/balances-react",
-  "version": "0.0.0-pr660-20230327112704",
+  "version": "0.0.0-pr660-20230328111733",
   "author": "Talisman",
   "homepage": "https://talisman.xyz",
   "license": "UNLICENSED",
@@ -26,13 +26,13 @@
     "clean": "rm -rf dist && rm -rf .turbo rm -rf node_modules"
   },
   "dependencies": {
-    "@talismn/balances": "^0.0.0-pr660-20230327112704",
-    "@talismn/chain-connector": "^0.0.0-pr660-20230327112704",
-    "@talismn/chain-connector-evm": "^0.0.0-pr660-20230327112704",
-    "@talismn/chaindata-provider": "^0.0.0-pr660-20230327112704",
-    "@talismn/chaindata-provider-extension": "^0.0.0-pr660-20230327112704",
-    "@talismn/connection-meta": "^0.0.0-pr660-20230327112704",
-    "@talismn/token-rates": "^0.0.0-pr660-20230327112704",
+    "@talismn/balances": "^0.0.0-pr660-20230328111733",
+    "@talismn/chain-connector": "^0.0.0-pr660-20230328111733",
+    "@talismn/chain-connector-evm": "^0.0.0-pr660-20230328111733",
+    "@talismn/chaindata-provider": "^0.0.0-pr660-20230328111733",
+    "@talismn/chaindata-provider-extension": "^0.0.0-pr660-20230328111733",
+    "@talismn/connection-meta": "^0.0.0-pr660-20230328111733",
+    "@talismn/token-rates": "^0.0.0-pr660-20230328111733",
     "anylogger": "^1.0.11",
     "blueimp-md5": "2.19.0",
     "dexie": "^3.2.3",