@rango-dev/wallets-react 0.0.0-experimental-d44b759f-20260701 → 0.0.0-experimental-a84f27a7-20260921

package/src/hub/lastConnectedWallets.ts

@@ -1,11 +1,7 @@
 import type { Namespace } from '@hub3js/namespaces';
 
-import { Persistor } from '@rango-dev/wallets-core/legacy';
-
-import {
-  HUB_LAST_CONNECTED_WALLETS,
-  LEGACY_LAST_CONNECTED_WALLETS,
-} from './constants.js';
+import { HUB_LAST_CONNECTED_WALLETS } from './constants.js';
+import { Persistor } from './persistor.js';
 
 export interface NamespaceInput {
   namespace: Namespace;
@@ -16,11 +12,9 @@ export interface LastConnectedWalletsStorage {
   [providerId: string]: NamespaceInput[];
 }
 
-export type LegacyLastConnectedWalletsStorage = string[];
-
 /**
  * We are doing some certain actions on storage for `last-connected-wallets` key.
- * This class helps us to define them in one place and also it has support for both legacy and hub.
+ * This class helps us to define them in one place.
  */
 export class LastConnectedWalletsFromStorage {
   #storageKey: string;
@@ -32,24 +26,18 @@ export class LastConnectedWalletsFromStorage {
   addWallet(providerId: string, namespaces: NamespaceInput[]): void {
     if (this.#storageKey === HUB_LAST_CONNECTED_WALLETS) {
       return this.#addWalletToHub(providerId, namespaces);
-    } else if (this.#storageKey === LEGACY_LAST_CONNECTED_WALLETS) {
-      return this.#addWalletToLegacy(providerId);
     }
     throw new Error('Not implemented');
   }
   removeWallets(providerIds?: string[]): void {
     if (this.#storageKey === HUB_LAST_CONNECTED_WALLETS) {
       return this.#removeWalletsFromHub(providerIds);
-    } else if (this.#storageKey === LEGACY_LAST_CONNECTED_WALLETS) {
-      return this.#removeWalletsFromLegacy(providerIds);
     }
     throw new Error('Not implemented');
   }
   list(): LastConnectedWalletsStorage {
     if (this.#storageKey === HUB_LAST_CONNECTED_WALLETS) {
       return this.#listFromHub();
-    } else if (this.#storageKey === LEGACY_LAST_CONNECTED_WALLETS) {
-      return this.#listFromLegacy();
     }
     throw new Error('Not implemented');
   }
@@ -60,17 +48,6 @@ export class LastConnectedWalletsFromStorage {
     throw new Error('Not implemented');
   }
 
-  #listFromLegacy(): LastConnectedWalletsStorage {
-    const persistor = new Persistor<LegacyLastConnectedWalletsStorage>();
-    const lastConnectedWallets =
-      persistor.getItem(LEGACY_LAST_CONNECTED_WALLETS) || [];
-    const output: LastConnectedWalletsStorage = {};
-    lastConnectedWallets.forEach((provider) => {
-      // Setting empty namespaces
-      output[provider] = [];
-    });
-    return output;
-  }
   #listFromHub(): LastConnectedWalletsStorage {
     const persistor = new Persistor<LastConnectedWalletsStorage>();
     const lastConnectedWallets =
@@ -102,15 +79,6 @@ export class LastConnectedWalletsFromStorage {
       [providerId]: toBeAddedNamespaces,
     });
   }
-  #addWalletToLegacy(providerId: string): void {
-    const storage = new Persistor<LegacyLastConnectedWalletsStorage>();
-    const storageState = storage.getItem(this.#storageKey) || [];
-
-    storage.setItem(
-      LEGACY_LAST_CONNECTED_WALLETS,
-      storageState.concat(providerId)
-    );
-  }
   #removeWalletsFromHub(providerIds?: string[]): void {
     const persistor = new Persistor<LastConnectedWalletsStorage>();
     const storageState = persistor.getItem(this.#storageKey) || {};
@@ -147,20 +115,4 @@ export class LastConnectedWalletsFromStorage {
       this.#addWalletToHub(providerId, newProviderNamespaces);
     }
   }
-  #removeWalletsFromLegacy(providerIds?: string[]): void {
-    const persistor = new Persistor<LegacyLastConnectedWalletsStorage>();
-    const storageState = persistor.getItem(this.#storageKey) || [];
-
-    // Remove all wallets
-    if (!providerIds) {
-      persistor.setItem(this.#storageKey, []);
-      return;
-    }
-
-    // Remove some of the wallets
-    persistor.setItem(
-      LEGACY_LAST_CONNECTED_WALLETS,
-      storageState.filter((wallet) => !providerIds.includes(wallet))
-    );
-  }
 }

package/src/hub/mod.ts

@@ -1,6 +1,2 @@
-export {
-  separateLegacyAndHubProviders,
-  getAllLegacyProviders,
-  findProviderByType,
-} from './utils.js';
+export { getHubProviders, findProviderByType } from './utils.js';
 export { useHubAdapter } from './useHubAdapter.js';

package/src/hub/persistor.ts

@@ -0,0 +1,19 @@
+export interface PersistStorage<T> {
+  getItem: (name: string) => T | null;
+  setItem: (name: string, value: T) => void;
+  removeItem: (name: string) => void;
+}
+
+export class Persistor<T> implements PersistStorage<T> {
+  getItem(name: string) {
+    const item = localStorage.getItem(name);
+    const parsedItem = item ? (JSON.parse(item) as T) : null;
+    return parsedItem;
+  }
+  setItem(name: string, value: T) {
+    localStorage.setItem(name, JSON.stringify(value));
+  }
+  removeItem(name: string) {
+    localStorage.removeItem(name);
+  }
+}

package/src/{legacy → hub}/useAutoConnect.ts

@@ -1,8 +1,8 @@
-import type { ProviderProps } from './types.js';
+import type { ProviderProps } from '../types.js';
 
 import { useEffect, useRef } from 'react';
 
-import { shouldTryAutoConnect } from './utils.js';
+import { shouldTryAutoConnect } from './helpers.js';
 
 export function useAutoConnect(
   props: Pick<ProviderProps, 'allBlockChains' | 'autoConnect'> & {

package/src/hub/useHubAdapter.ts

@@ -1,30 +1,34 @@
 import type { AllProxiedNamespaces, ExtensionLink } from './types.js';
-import type { ProviderContext } from '../index.js';
-import type { Provider } from '@hub3js/core';
-import type { VersionedProviders } from '@hub3js/core/utils';
+import type {
+  ConnectResult,
+  NamespaceInputForConnect,
+  WalletInfo,
+} from '../legacy/mod.js';
+import type { ProviderContext, ProviderProps } from '../types.js';
+import type { Provider, WalletType } from '@hub3js/core';
 import type { Accounts, AccountsWithActiveChain } from '@hub3js/std/types';
-import type { LegacyNamespaceInputForConnect } from '@rango-dev/wallets-core/legacy';
 
-import { utils } from '@hub3js/evm';
-import { type WalletInfo, type WalletType } from '@rango-dev/wallets-shared';
+import { isUserRejectionError, WalletConnectionError } from '@hub3js/std/utils';
+import {
+  getSupportedChainsFromNamespace,
+  getSupportedChainsFromProvider,
+} from '@rango-dev/internal-blockchains';
 import { useEffect, useRef, useState } from 'react';
 import { Ok, Result } from 'ts-results';
 
-import {
-  type ConnectResult,
-  HUB_LAST_CONNECTED_WALLETS,
-  type ProviderProps,
-} from '../legacy/mod.js';
-import { useAutoConnect } from '../legacy/useAutoConnect.js';
+import { withErrorLoggingApi } from '../helpers.js';
 
 import { autoConnect } from './autoConnect.js';
+import { HUB_LAST_CONNECTED_WALLETS } from './constants.js';
 import { createQueue, fromAccountIdToLegacyAddressFormat } from './helpers.js';
 import { LastConnectedWalletsFromStorage } from './lastConnectedWallets.js';
+import { useAutoConnect } from './useAutoConnect.js';
 import { useHubRefs } from './useHubRefs.js';
 import {
-  getSupportedChainsFromProvider,
+  findProviderByType,
   isEvmNamespace,
   isSolanaNamespace,
+  isUtxoNamespace,
   mapHubEventsToLegacy,
   transformHubResultToLegacyResult,
   tryConvertNamespaceNetworkToChainInfo,
@@ -32,8 +36,6 @@ import {
 
 export type UseAdapterParams = Omit<ProviderProps, 'providers'> & {
   providers: Provider[];
-  /** This is only will be used to access some parts of the legacy provider that doesn't exists in Hub. */
-  allVersionedProviders: VersionedProviders[];
 };
 
 export function useHubAdapter(params: UseAdapterParams): ProviderContext {
@@ -42,28 +44,31 @@ export function useHubAdapter(params: UseAdapterParams): ProviderContext {
   // useEffect will run `subscribe` once, so we need a reference and mutate the value if it's changes.
   const dataRef = useRef({
     onUpdateState: params.onUpdateState,
-    allVersionedProviders: params.allVersionedProviders,
     allBlockChains: params.allBlockChains,
   });
+  const hubInitiated = useRef(false);
 
   /*
    * Params of each connection attempt for each wallet type are stored here.
    * Derivation path from params is used in `mapHubEventsToLegacy` to be added to the payload of connect events.
    */
   const lastConnectAttemptParamsRef = useRef<{
-    [type: WalletType]: LegacyNamespaceInputForConnect[];
+    [type: WalletType]: NamespaceInputForConnect[];
   }>({});
 
   const updateLastConnectAttemptParams = (
     type: WalletType,
-    namespaces: LegacyNamespaceInputForConnect[] | undefined
+    namespaces: NamespaceInputForConnect[] | undefined
   ) => {
     lastConnectAttemptParamsRef.current[type] = namespaces || [];
   };
 
   const queueTask = createQueue({
     onError: (error, actions) => {
-      if (utils.isUserRejectionError(error)) {
+      // A connection failure carries the wallet's own error, and so its code, as its cause.
+      const walletError =
+        error instanceof WalletConnectionError ? error.cause : error;
+      if (isUserRejectionError(walletError)) {
         actions.removeCurrentKeyFromQueue();
       }
     },
@@ -72,43 +77,11 @@ export function useHubAdapter(params: UseAdapterParams): ProviderContext {
   useEffect(() => {
     dataRef.current = {
       onUpdateState: params.onUpdateState,
-      allVersionedProviders: params.allVersionedProviders,
       allBlockChains: params.allBlockChains,
     };
   }, [params]);
 
-  // Initialize instances
   useEffect(() => {
-    const runOnInit = () => {
-      getHub().init(params.configs?.walletOptions);
-
-      rerender((currentRender) => currentRender + 1);
-    };
-
-    // Then will call init whenever page is ready.
-    const initHubWhenPageIsReady = (event: Event) => {
-      // Then will call init whenever page is ready.
-      if (
-        event.target &&
-        (event.target as Document).readyState === 'complete'
-      ) {
-        runOnInit();
-        document.removeEventListener(
-          'readystatechange',
-          initHubWhenPageIsReady
-        );
-      }
-    };
-
-    // Try to run, maybe it's ready.
-    runOnInit();
-
-    /*
-     * Try again when the page has been completely loaded.
-     * Some of wallets, take some time to be fully injected and loaded.
-     */
-    document.addEventListener('readystatechange', initHubWhenPageIsReady);
-
     getStore()
       .subscribe((event) => {
         if (dataRef.current.onUpdateState) {
@@ -131,6 +104,17 @@ export function useHubAdapter(params: UseAdapterParams): ProviderContext {
       .flushEvents();
   }, []);
 
+  // Initialize hub only after blockchain meta is available (e.g. WalletConnect needs it at init).
+  useEffect(() => {
+    if (hubInitiated.current || !params.allBlockChains?.length) {
+      return;
+    }
+
+    getHub().init(params.configs?.walletOptions);
+    rerender((currentRender) => currentRender + 1);
+    hubInitiated.current = true;
+  }, [params.allBlockChains, params.configs?.walletOptions]);
+
   useAutoConnect({
     autoConnect: params.autoConnect,
     allBlockChains: params.allBlockChains,
@@ -152,9 +136,8 @@ export function useHubAdapter(params: UseAdapterParams): ProviderContext {
       const provider = getHub().get(type);
 
       if (!provider) {
-        throw new Error(
-          `You should add ${type} to provider first then call 'canSwitchNetworkTo'.`
-        );
+        // TODO: should throw an error
+        return false;
       }
 
       if (!namespace) {
@@ -181,21 +164,25 @@ export function useHubAdapter(params: UseAdapterParams): ProviderContext {
       if (!dataRef.current.allBlockChains) {
         throw new Error(`Blockchains are not available`);
       }
-      const providerSupportedChainsOfNamespace = namespacesProperty?.value.data
-        .find(
-          (providerNamespace) => providerNamespace.value === namespace.namespace
-        )
-        ?.getSupportedChains(dataRef.current.allBlockChains);
 
-      if (!providerSupportedChainsOfNamespace) {
+      const namespaceMeta = namespacesProperty?.value.data.find(
+        (providerNamespace) => providerNamespace.value === namespace.namespace
+      );
+
+      if (!namespaceMeta) {
         throw new Error(
           `NamespaceMeta is not defined for requested namespace: ${namespace.namespace}`
         );
       }
 
+      const supportedChains = getSupportedChainsFromNamespace(
+        namespaceMeta,
+        dataRef.current.allBlockChains
+      );
+
       return proxiedNamespace.canSwitchNetwork({
         network,
-        supportedChains: providerSupportedChainsOfNamespace,
+        supportedChains,
       });
     },
     async connect(type, namespaces) {
@@ -214,7 +201,7 @@ export function useHubAdapter(params: UseAdapterParams): ProviderContext {
 
       // Check `namespace` and look into hub to see how it can match given namespace to hub namespace.
       const targetNamespaces: [
-        LegacyNamespaceInputForConnect,
+        NamespaceInputForConnect,
         AllProxiedNamespaces
       ][] = [];
       namespaces.forEach((namespace) => {
@@ -252,6 +239,11 @@ export function useHubAdapter(params: UseAdapterParams): ProviderContext {
               namespace.connect(network, {
                 derivationPath: namespaceInput.derivationPath,
               });
+          } else if (isUtxoNamespace(namespace)) {
+            connectNamespacePromise = async () =>
+              namespace.connect({
+                derivationPath: namespaceInput.derivationPath,
+              });
           } else {
             connectNamespacePromise = async () => namespace.connect();
           }
@@ -439,18 +431,22 @@ export function useHubAdapter(params: UseAdapterParams): ProviderContext {
         properties: metadata.properties,
       };
     },
-    providers() {
-      throw new Error('This method is not available on hub providers.');
-    },
     state(type) {
       const hubState = getHub().state();
       const wallet = getHub().get(type);
       const walletState = hubState[type];
 
       if (!walletState || !wallet) {
-        throw new Error(
-          `It seems your requested provider doesn't exist in hub. Provider Id: ${type}`
-        );
+        // TODO: should throw an error
+        return {
+          connected: false,
+          connecting: false,
+          installed: false,
+          reachable: false,
+          accounts: null,
+          network: null,
+          namespaces: new Map(),
+        };
       }
 
       const accounts = walletState.namespaces
@@ -504,12 +500,18 @@ export function useHubAdapter(params: UseAdapterParams): ProviderContext {
         `Suggest has not been implemented for given chain: ${namespace.network}`
       );
     },
-    hubProvider() {
-      throw new Error(
-        'Unreachable code. the method has been implemented in main adapter instance.'
-      );
+    hubProvider(type) {
+      const provider = findProviderByType(params.providers, type);
+
+      if (!provider) {
+        throw new Error(
+          `You're trying to access ${type} provider which is not found in hub providers. it may not be registered yet.`
+        );
+      }
+
+      return provider;
     },
   };
 
-  return api;
+  return withErrorLoggingApi(api);
 }

package/src/hub/utils.ts

@@ -1,36 +1,32 @@
 import type { AllProxiedNamespaces } from './types.js';
-import type { Hub, Provider, ProxiedNamespace } from '@hub3js/core';
+import type {
+  ConnectResult,
+  NamespaceInputForConnect,
+  EventHandler as WalletEventHandler,
+} from '../legacy/mod.js';
+import type { ProviderProps } from '../types.js';
+import type { UtxoActions } from '@hub3js/bip122';
+import type { Hub, Provider, ProxiedNamespace, WalletType } from '@hub3js/core';
 import type { Event } from '@hub3js/core/store';
-import type { EvmActions } from '@hub3js/evm';
-import type { SolanaActions } from '@hub3js/solana';
 import type {
-  LegacyNamespaceInputForConnect,
-  LegacyProviderInterface,
-  LegacyEventHandler as WalletEventHandler,
-} from '@rango-dev/wallets-core/legacy';
-import type { SuiActions } from '@rango-dev/wallets-core/namespaces/sui';
-import type { UtxoActions } from '@rango-dev/wallets-core/namespaces/utxo';
+  Chain as AddEthereumChainParameter,
+  EvmActions,
+} from '@hub3js/evm';
+import type { SolanaActions } from '@hub3js/solana';
 
 import { pickVersion, type VersionedProviders } from '@hub3js/core/utils';
 import {
-  LegacyEvents as Events,
-  legacyFormatAddressWithNetwork as formatAddressWithNetwork,
-} from '@rango-dev/wallets-core/legacy';
-import {
-  type AddEthereumChainParameter,
   convertEvmBlockchainMetaToEvmChainInfo,
+  formatAddressWithNetwork,
   getBlockChainNameFromId,
-  type WalletType,
-} from '@rango-dev/wallets-shared';
+  getSupportedChainsFromProvider,
+} from '@rango-dev/internal-blockchains';
 import { AccountId } from 'caip';
 import { type BlockchainMeta, isEvmBlockchain } from 'rango-types';
 
-import {
-  type ConnectResult,
-  HUB_LAST_CONNECTED_WALLETS,
-  type ProviderProps,
-} from '../legacy/mod.js';
+import { Events } from '../legacy/mod.js';
 
+import { HUB_LAST_CONNECTED_WALLETS } from './constants.js';
 import {
   fromAccountIdToLegacyAddressFormat,
   isConnectResultEvm,
@@ -38,27 +34,16 @@ import {
 } from './helpers.js';
 import { LastConnectedWalletsFromStorage } from './lastConnectedWallets.js';
 
-/* Gets a list of hub and legacy providers and returns a tuple which separates them. */
-export function separateLegacyAndHubProviders(
-  providers: VersionedProviders[]
-): [LegacyProviderInterface[], Provider[]] {
-  const LEGACY_VERSION = '0.0.0';
-  const HUB_VERSION = '1.0.0';
-
-  const legacyProviders: LegacyProviderInterface[] = [];
-  const hubProviders: Provider[] = [];
-
-  providers.forEach((provider) => {
+export function getHubProviders(providers: VersionedProviders[]): Provider[] {
+  return providers.map((provider) => {
     try {
-      const target = pickVersion(provider, HUB_VERSION);
-      hubProviders.push(target[1]);
+      return pickVersion(provider, '1.0.0')[1] as Provider;
     } catch {
-      const target = pickVersion(provider, LEGACY_VERSION);
-      legacyProviders.push(target[1]);
+      throw new Error(
+        "Legacy providers aren't supported anymore. Expected a provider with version '1.0.0'."
+      );
     }
   });
-
-  return [legacyProviders, hubProviders];
 }
 
 export function findProviderByType(
@@ -77,22 +62,6 @@ const lastConnectedWalletsFromStorage = new LastConnectedWalletsFromStorage(
   HUB_LAST_CONNECTED_WALLETS
 );
 
-export function getSupportedChainsFromProvider(
-  provider: Provider,
-  allBlockChains: ProviderProps['allBlockChains']
-) {
-  const namespacesProperty = provider
-    .info()
-    ?.metadata.properties?.find((property) => property.name === 'namespaces');
-
-  const supportedChains =
-    namespacesProperty?.value.data.flatMap((namespace) =>
-      namespace.getSupportedChains(allBlockChains || [])
-    ) || [];
-
-  return supportedChains;
-}
-
 export function mapHubEventsToLegacy(
   hub: Hub,
   event: Event,
@@ -100,7 +69,7 @@ export function mapHubEventsToLegacy(
   metadata: {
     allBlockChains: ProviderProps['allBlockChains'];
     lastConnectAttemptParams: {
-      [type: WalletType]: LegacyNamespaceInputForConnect[];
+      [type: WalletType]: NamespaceInputForConnect[];
     };
   }
 ): void {
@@ -286,29 +255,14 @@ export function mapHubEventsToLegacy(
   }
 }
 
-export function getAllLegacyProviders(
-  allProviders: VersionedProviders[]
-): LegacyProviderInterface[] {
-  const LEGACY_VERSION = '0.0.0';
-
-  const legacyProviders: LegacyProviderInterface[] = [];
-
-  allProviders.forEach((provider) => {
-    const target = pickVersion(provider, LEGACY_VERSION);
-    legacyProviders.push(target[1]);
-  });
-
-  return legacyProviders;
-}
-
 /**
  * In legacy mode, for those who have switch network functionality (like evm), we are using an enum for network names
  * this enum only has meaning for us, and when we are going to connect an instance (e.g. window.ethereum) we should pass chain id.
  */
 export function convertNamespaceNetworkToEvmChainId(
-  namespace: LegacyNamespaceInputForConnect,
+  namespace: NamespaceInputForConnect,
   meta: BlockchainMeta[]
-) {
+): AddEthereumChainParameter | undefined {
   if (!namespace.network) {
     return undefined;
   }
@@ -324,7 +278,7 @@ export function convertNamespaceNetworkToEvmChainId(
  * This function will help us to map these strings to proper hex ids.
  */
 export function tryConvertNamespaceNetworkToChainInfo(
-  namespace: LegacyNamespaceInputForConnect,
+  namespace: NamespaceInputForConnect,
   meta: BlockchainMeta[]
 ): string | AddEthereumChainParameter | undefined {
   // `undefined` means it's not evm or we couldn't find it in meta.
@@ -341,20 +295,17 @@ export function transformHubResultToLegacyResult(
     return {
       accounts: res.accounts,
       network: res.network,
-      provider: undefined,
     };
   } else if (isConnectResultSolana(res)) {
     return {
       accounts: res,
       network: null,
-      provider: undefined,
     };
   }
 
   return {
     accounts: [res],
     network: null,
-    provider: undefined,
   };
 }
 
@@ -392,12 +343,20 @@ export function synchronizeHubWithConfigProviders(
 }
 
 export function isSolanaNamespace(
-  ns: ProxiedNamespace<EvmActions | SolanaActions | SuiActions | UtxoActions>
-): ns is ProxiedNamespace<SolanaActions> & { namespaceId: 'Solana' } {
+  ns: AllProxiedNamespaces
+): ns is AllProxiedNamespaces &
+  ProxiedNamespace<SolanaActions> & { namespaceId: 'Solana' } {
   return ns.namespaceId === 'Solana';
 }
 export function isEvmNamespace(
-  ns: ProxiedNamespace<EvmActions | SolanaActions | SuiActions | UtxoActions>
-): ns is ProxiedNamespace<EvmActions> & { namespaceId: 'EVM' } {
+  ns: AllProxiedNamespaces
+): ns is AllProxiedNamespaces &
+  ProxiedNamespace<EvmActions> & { namespaceId: 'EVM' } {
   return ns.namespaceId === 'EVM';
 }
+export function isUtxoNamespace(
+  ns: AllProxiedNamespaces
+): ns is AllProxiedNamespaces &
+  ProxiedNamespace<UtxoActions> & { namespaceId: 'UTXO' } {
+  return ns.namespaceId === 'UTXO';
+}

package/src/index.ts

@@ -1,4 +1,4 @@
-export * from './legacy/helpers.js';
 export { default as Provider } from './provider.js';
-export { useWallets } from './legacy/hooks.js';
+export { useWallets } from './hooks.js';
+export type * from './types.js';
 export * from './legacy/types.js';

package/src/legacy/mod.ts

@@ -1,13 +1,10 @@
 export type {
-  ProviderProps,
-  ProviderContext,
   ConnectResult,
+  EventHandler,
+  EventInfo,
   ExtendedWalletInfo,
+  NamespaceInputForConnect,
+  WalletInfo,
+  WalletState,
 } from './types.js';
-export {
-  LEGACY_LAST_CONNECTED_WALLETS,
-  HUB_LAST_CONNECTED_WALLETS,
-} from '../hub/constants.js';
-
-export { WalletContext } from './context.js';
-export { useLegacyProviders } from './useLegacyProviders.js';
+export { Events } from './types.js';