@txnlab/use-wallet 1.3.1 → 2.0.0-alpha.0

package/dist/esm/index.js

@@ -1,4 +1,5 @@
 import require$$0, { useDebugValue, useState, useEffect, createContext, useContext, useMemo } from 'react';
+import { getSdkError } from '@walletconnect/utils';
 import algosdk from 'algosdk';
 
 var PROVIDER_ID;
@@ -965,12 +966,14 @@ const isIOS = getIsIOS();
 class BaseClient {
     algosdk;
     algodClient;
+    clientOptions;
     keepWCAlive;
     metadata;
     static metadata;
-    constructor(metadata, algosdk, algodClient) {
+    constructor(metadata, algosdk, algodClient, clientOptions) {
         this.algosdk = algosdk;
         this.algodClient = algodClient;
+        this.clientOptions = clientOptions;
         this.keepWCAlive = new Audio();
         this.metadata = metadata;
     }
@@ -1083,10 +1086,12 @@ const ICON$8 = 'data:image/svg+xml;base64,' +
 
 class PeraWalletClient extends BaseClient {
     #client;
+    clientOptions;
     network;
-    constructor({ metadata, client, algosdk, algodClient, network }) {
+    constructor({ metadata, client, clientOptions, algosdk, algodClient, network }) {
         super(metadata, algosdk, algodClient);
         this.#client = client;
+        this.clientOptions = clientOptions;
         this.network = network;
         this.metadata = PeraWalletClient.metadata;
     }
@@ -1102,11 +1107,12 @@ class PeraWalletClient extends BaseClient {
             const algosdk = algosdkStatic || (await Algod.init(algodOptions)).algosdk;
             const algodClient = getAlgodClient(algosdk, algodOptions);
             const peraWallet = new PeraWalletConnect({
-                ...(clientOptions ? clientOptions : { shouldShowSignTxnToast: false })
+                ...(clientOptions && clientOptions)
             });
             return new PeraWalletClient({
                 metadata: PeraWalletClient.metadata,
                 client: peraWallet,
+                clientOptions,
                 algosdk,
                 algodClient,
                 network
@@ -1227,10 +1233,12 @@ const ICON$7 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIACAYAAAD0eN
 
 class DaffiWalletClient extends BaseClient {
     #client;
+    clientOptions;
     network;
-    constructor({ metadata, client, algosdk, algodClient, network }) {
+    constructor({ metadata, client, clientOptions, algosdk, algodClient, network }) {
         super(metadata, algosdk, algodClient);
         this.#client = client;
+        this.clientOptions = clientOptions;
         this.network = network;
         this.metadata = DaffiWalletClient.metadata;
     }
@@ -1251,6 +1259,7 @@ class DaffiWalletClient extends BaseClient {
             return new DaffiWalletClient({
                 metadata: DaffiWalletClient.metadata,
                 client: daffiWallet,
+                clientOptions,
                 algosdk,
                 algodClient,
                 network
@@ -1376,10 +1385,12 @@ const ICON$6 = 'data:image/svg+xml;base64,' +
  */
 class MyAlgoWalletClient extends BaseClient {
     #client;
+    clientOptions;
     network;
-    constructor({ metadata, client, algosdk, algodClient, network }) {
+    constructor({ metadata, client, clientOptions, algosdk, algodClient, network }) {
         super(metadata, algosdk, algodClient);
         this.#client = client;
+        this.clientOptions = clientOptions;
         this.network = network;
         this.metadata = MyAlgoWalletClient.metadata;
     }
@@ -1400,6 +1411,7 @@ class MyAlgoWalletClient extends BaseClient {
             return new MyAlgoWalletClient({
                 metadata: MyAlgoWalletClient.metadata,
                 client: myAlgo,
+                clientOptions,
                 algosdk: algosdk,
                 algodClient: algodClient,
                 network
@@ -1475,10 +1487,12 @@ const ICON$5 = 'data:image/svg+xml;base64,' +
 
 class DeflyWalletClient extends BaseClient {
     #client;
+    clientOptions;
     network;
-    constructor({ metadata, client, algosdk, algodClient, network }) {
+    constructor({ metadata, client, clientOptions, algosdk, algodClient, network }) {
         super(metadata, algosdk, algodClient);
         this.#client = client;
+        this.clientOptions = clientOptions;
         this.network = network;
         this.metadata = DeflyWalletClient.metadata;
     }
@@ -1494,7 +1508,7 @@ class DeflyWalletClient extends BaseClient {
             const algosdk = algosdkStatic || (await Algod.init(algodOptions)).algosdk;
             const algodClient = getAlgodClient(algosdk, algodOptions);
             const deflyWallet = new DeflyWalletConnect({
-                ...(clientOptions ? clientOptions : { shouldShowSignTxnToast: false })
+                ...(clientOptions && clientOptions)
             });
             return new DeflyWalletClient({
                 metadata: DeflyWalletClient.metadata,
@@ -1619,12 +1633,12 @@ const ICON$4 = 'data:image/svg+xml;base64,' +
 
 class ExodusClient extends BaseClient {
     #client;
-    #onlyIfTrusted;
+    clientOptions;
     network;
-    constructor({ metadata, client, algosdk, algodClient, onlyIfTrusted, network }) {
+    constructor({ metadata, client, clientOptions, algosdk, algodClient, network }) {
         super(metadata, algosdk, algodClient);
         this.#client = client;
-        this.#onlyIfTrusted = onlyIfTrusted;
+        this.clientOptions = clientOptions;
         this.network = network;
         this.metadata = ExodusClient.metadata;
     }
@@ -1644,11 +1658,10 @@ class ExodusClient extends BaseClient {
             const exodus = window.exodus.algorand;
             return new ExodusClient({
                 metadata: ExodusClient.metadata,
-                id: PROVIDER_ID.EXODUS,
                 client: exodus,
                 algosdk: algosdk,
                 algodClient: algodClient,
-                onlyIfTrusted: clientOptions?.onlyIfTrusted || false,
+                clientOptions: clientOptions || { onlyIfTrusted: false },
                 network
             });
         }
@@ -1660,7 +1673,7 @@ class ExodusClient extends BaseClient {
     }
     async connect() {
         const { address } = await this.#client.connect({
-            onlyIfTrusted: this.#onlyIfTrusted
+            onlyIfTrusted: this.clientOptions.onlyIfTrusted
         });
         if (!address) {
             throw new Error(`No accounts found for ${ExodusClient.metadata.id}`);
@@ -1763,7 +1776,6 @@ class AlgoSignerClient extends BaseClient {
             const algosigner = window.algorand;
             return new AlgoSignerClient({
                 metadata: AlgoSignerClient.metadata,
-                id: PROVIDER_ID.ALGOSIGNER,
                 client: algosigner,
                 algosdk: algosdk,
                 algodClient: algodClient,
@@ -1880,17 +1892,47 @@ class AlgoSignerClient extends BaseClient {
     }
 }
 
+const getPayloadId = () => {
+    const date = Date.now() * Math.pow(10, 3);
+    const extra = Math.floor(Math.random() * Math.pow(10, 3));
+    return date + extra;
+};
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const formatJsonRpcRequest = (method, params) => {
+    return {
+        id: getPayloadId(),
+        jsonrpc: '2.0',
+        method,
+        params
+    };
+};
+
+const isPublicNetwork = (network) => {
+    return network === 'betanet' || network === 'testnet' || network === 'mainnet';
+};
+
 const ICON$2 = 'data:image/svg+xml;base64,' +
     'PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIKCSB2aWV3Qm94PSIwIDAgNDgwIDQ4MCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDgwIDQ4MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiMzMzk2RkY7fQo8L3N0eWxlPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTI2LjYsMTY4YzYyLjYtNjEuMywxNjQuMi02MS4zLDIyNi44LDBsNy41LDcuNGMzLjEsMy4xLDMuMSw4LDAsMTEuMWwtMjUuOCwyNS4yYy0xLjYsMS41LTQuMSwxLjUtNS43LDAKCWwtMTAuNC0xMC4yYy00My43LTQyLjgtMTE0LjUtNDIuOC0xNTguMiwwbC0xMS4xLDEwLjljLTEuNiwxLjUtNC4xLDEuNS01LjcsMGwtMjUuOC0yNS4yYy0zLjEtMy4xLTMuMS04LDAtMTEuMUwxMjYuNiwxNjh6CgkgTTQwNi43LDIyMC4ybDIyLjksMjIuNWMzLjEsMy4xLDMuMSw4LDAsMTEuMUwzMjYuMiwzNTUuMWMtMy4xLDMuMS04LjIsMy4xLTExLjMsMGwtNzMuNC03MS45Yy0wLjgtMC44LTIuMS0wLjgtMi44LDBsLTczLjQsNzEuOQoJYy0zLjEsMy4xLTguMiwzLjEtMTEuMywwTDUwLjMsMjUzLjhjLTMuMS0zLjEtMy4xLTgsMC0xMS4xbDIyLjktMjIuNWMzLjEtMy4xLDguMi0zLjEsMTEuMywwbDczLjQsNzEuOWMwLjgsMC44LDIuMSwwLjgsMi44LDAKCWw3My40LTcxLjljMy4xLTMuMSw4LjItMy4xLDExLjMsMGw3My40LDcxLjljMC44LDAuOCwyLjEsMC44LDIuOCwwbDczLjQtNzEuOUMzOTguNSwyMTcuMSw0MDMuNiwyMTcuMSw0MDYuNywyMjAuMkw0MDYuNywyMjAuMnoiLz4KPC9zdmc+Cg==';
-const DEFAULT_NETWORK = 'mainnet';
+const DEFAULT_NETWORK = 'mainnet';
+const ALGORAND_CHAINS = {
+    mainnet: 'algorand:wGHE2Pwdvd7S12BL5FaOP20EGYesN73k',
+    testnet: 'algorand:SGO1GKSzyE7IEPItTxCByw9x8FmnrCDe',
+    betanet: 'algorand:mFgazF-2uRS1tMiL9dsj01hJGySEmPN2'
+};
 
 class WalletConnectClient extends BaseClient {
     #client;
+    clientOptions;
+    #modal;
     network;
-    constructor({ metadata, client, algosdk, algodClient, network }) {
+    chain;
+    constructor({ metadata, client, clientOptions, modal, algosdk, algodClient, network, chain }) {
         super(metadata, algosdk, algodClient);
         this.#client = client;
+        this.clientOptions = clientOptions;
+        this.#modal = modal;
         this.network = network;
+        this.chain = chain;
         this.metadata = WalletConnectClient.metadata;
     }
     static metadata = {
@@ -1899,98 +1941,120 @@ class WalletConnectClient extends BaseClient {
         icon: ICON$2,
         isWalletConnect: true
     };
-    static async init({ clientOptions, algodOptions, clientStatic, modalStatic, algosdkStatic, network = DEFAULT_NETWORK }) {
+    static async init({ clientOptions, algodOptions, clientStatic, modalStatic, modalOptions, algosdkStatic, network = DEFAULT_NETWORK }) {
         try {
-            const WalletConnect = clientStatic || (await import('@walletconnect/client')).default;
-            const QRCodeModal = modalStatic || (await import('algorand-walletconnect-qrcode-modal')).default;
-            const walletConnect = new WalletConnect({
-                bridge: 'https://bridge.walletconnect.org',
-                qrcodeModal: QRCodeModal,
-                storageId: 'walletconnect-generic',
-                ...(clientOptions || {})
+            if (!isPublicNetwork(network)) {
+                throw new Error(`WalletConnect only supports Algorand mainnet, testnet, and betanet. "${network}" is not supported.`);
+            }
+            const chain = ALGORAND_CHAINS[network];
+            // Initialize sign client
+            const Client = clientStatic || (await import('@walletconnect/sign-client')).default;
+            const client = await Client.init(clientOptions);
+            // Initialize web3modal
+            const modalModule = modalStatic
+                ? { WalletConnectModal: modalStatic }
+                : await import('@walletconnect/modal');
+            const Web3Modal = modalModule.WalletConnectModal;
+            const modal = new Web3Modal({
+                explorerExcludedWalletIds: 'ALL',
+                ...modalOptions,
+                projectId: clientOptions?.projectId || '',
+                walletConnectVersion: 2
             });
+            // Initialize algod client
             const algosdk = algosdkStatic || (await Algod.init(algodOptions)).algosdk;
             const algodClient = getAlgodClient(algosdk, algodOptions);
-            const initWallet = {
+            // Initialize wallet client
+            const walletClient = new WalletConnectClient({
                 metadata: WalletConnectClient.metadata,
-                client: walletConnect,
-                algosdk: algosdk,
-                algodClient: algodClient,
-                network
-            };
-            return new WalletConnectClient(initWallet);
+                client,
+                clientOptions,
+                modal,
+                algosdk,
+                algodClient,
+                network,
+                chain
+            });
+            walletClient.#subscribeToEvents();
+            return walletClient;
         }
-        catch (e) {
-            console.error('Error initializing...', e);
+        catch (error) {
+            console.error('Error initializing', error);
             return null;
         }
     }
     async connect() {
-        let chainId = 416001;
-        if (this.network === 'betanet') {
-            chainId = 416003;
-        }
-        else if (this.network === 'testnet') {
-            chainId = 416002;
-        }
-        if (!this.#client.connected) {
-            await this.#client.createSession({ chainId });
+        const requiredNamespaces = {
+            algorand: {
+                chains: [this.chain],
+                methods: ['algo_signTxn'],
+                events: []
+            }
+        };
+        const { uri, approval } = await this.#client.connect({ requiredNamespaces });
+        if (uri) {
+            await this.#modal.openModal({ uri, standaloneChains: [this.chain] });
         }
         return new Promise((resolve, reject) => {
-            this.#client.on('connect', (error, payload) => {
-                if (error) {
-                    reject(error);
+            const unsubscribeModal = this.#modal.subscribeModal((state) => {
+                if (!state.open) {
+                    unsubscribeModal();
+                    reject(new Error('Modal closed'));
                 }
-                const { accounts } = payload.params[0];
-                resolve({
-                    ...WalletConnectClient.metadata,
-                    accounts: accounts.map((address, index) => ({
-                        name: `Wallet Connect ${index + 1}`,
-                        address,
-                        providerId: WalletConnectClient.metadata.id
-                    }))
-                });
             });
-            this.#client.on('session_update', (error, payload) => {
-                if (error) {
-                    reject(error);
-                }
-                const { accounts } = payload.params[0];
+            approval()
+                .then((session) => {
+                const { accounts } = session.namespaces.algorand;
                 resolve({
                     ...WalletConnectClient.metadata,
-                    accounts: accounts.map((address, index) => ({
-                        name: `Wallet Connect ${index + 1}`,
-                        address,
+                    accounts: accounts.map((accountStr, index) => ({
+                        name: `WalletConnect ${index + 1}`,
+                        address: accountStr.split(':').pop(),
                         providerId: WalletConnectClient.metadata.id
                     }))
                 });
+            })
+                .catch((error) => {
+                reject(error);
+            })
+                .finally(() => {
+                unsubscribeModal();
+                this.#modal.closeModal();
             });
         });
     }
     // eslint-disable-next-line @typescript-eslint/require-await
     async reconnect() {
-        const accounts = this.#client.accounts;
-        if (!accounts) {
+        const session = this.#getSession();
+        if (typeof session === 'undefined') {
             return null;
         }
+        const { accounts } = session.namespaces.algorand;
         return {
             ...WalletConnectClient.metadata,
-            accounts: accounts.map((address, index) => ({
-                name: `Wallet Connect ${index + 1}`,
-                address,
+            accounts: accounts.map((accountStr, index) => ({
+                name: `WalletConnect ${index + 1}`,
+                address: accountStr.split(':').pop(),
                 providerId: WalletConnectClient.metadata.id
             }))
         };
     }
-    check() {
-        return this.#client.connected;
-    }
     async disconnect() {
         try {
-            await this.#client.killSession();
+            if (typeof this.#client === 'undefined') {
+                throw new Error('WalletConnect is not initialized');
+            }
+            const session = this.#getSession();
+            if (typeof session === 'undefined') {
+                throw new Error('Session is not connected');
+            }
+            await this.#client.disconnect({
+                topic: session.topic,
+                reason: getSdkError('USER_DISCONNECTED')
+            });
         }
-        catch (e) {
-            console.error('Error disconnecting', e);
+        catch (error) {
+            console.error('Error disconnecting', error);
         }
     }
     async signTransactions(connectedAccounts, txnGroups, indexesToSign, returnGroup = true) {
@@ -2029,21 +2093,26 @@ class WalletConnectClient extends BaseClient {
             }
             return acc;
         }, []);
-        const { formatJsonRpcRequest } = await import('@json-rpc-tools/utils');
-        const requestParams = [txnsToSign];
-        const request = formatJsonRpcRequest('algo_signTxn', requestParams);
+        const session = this.#getSession();
+        if (typeof session === 'undefined') {
+            throw new Error('Session is not connected');
+        }
+        const request = formatJsonRpcRequest('algo_signTxn', [txnsToSign]);
         // Play an audio file to keep Wallet Connect's web socket open on iOS
         // when the user goes into background mode.
-        await this.keepWCAliveStart();
-        // Sign them with the client.
-        const result = await this.#client.sendCustomRequest(request);
-        this.keepWCAliveStop();
+        // await this.keepWCAliveStart()
+        const response = await this.#client.request({
+            chainId: this.chain,
+            topic: session.topic,
+            request
+        });
+        // this.keepWCAliveStop()
         // Check if the result is the same length as the transactions
-        const lengthsMatch = result.length === transactions.length;
+        const lengthsMatch = response.length === transactions.length;
         // Join the newly signed transactions with the original group of transactions.
         const signedTxns = transactions.reduce((acc, txn, i) => {
             if (signedIndexes.includes(i)) {
-                const signedByUser = lengthsMatch ? result[i] : result.shift();
+                const signedByUser = lengthsMatch ? response[i] : response.shift();
                 signedByUser && acc.push(new Uint8Array(Buffer.from(signedByUser, 'base64')));
             }
             else if (returnGroup) {
@@ -2053,6 +2122,23 @@ class WalletConnectClient extends BaseClient {
         }, []);
         return signedTxns;
     }
+    #subscribeToEvents() {
+        if (typeof this.#client === 'undefined') {
+            throw new Error('WalletConnect is not initialized');
+        }
+        this.#client.on('session_event', (args) => {
+            console.log('EVENT', 'session_event', args);
+        });
+        this.#client.on('session_update', ({ topic, params }) => {
+            console.log('EVENT', 'session_update', { topic, params });
+        });
+        this.#client.on('session_delete', () => {
+            console.log('EVENT', 'session_delete');
+        });
+    }
+    #getSession() {
+        return this.#client.session.getAll().at(-1);
+    }
 }
 
 const ICON$1 = 'data:image/svg+xml;base64,' +
@@ -2063,14 +2149,12 @@ class KMDWalletClient extends BaseClient {
     #wallet;
     #password;
     walletId;
-    id;
     network;
-    constructor({ metadata, client, id, wallet, password, algosdk, algodClient, network }) {
+    constructor({ metadata, client, wallet, password, algosdk, algodClient, network }) {
         super(metadata, algosdk, algodClient);
         this.#client = client;
         this.#wallet = wallet;
         this.#password = password;
-        this.id = id;
         this.walletId = '';
         this.network = network;
         this.metadata = KMDWalletClient.metadata;
@@ -2089,7 +2173,6 @@ class KMDWalletClient extends BaseClient {
             const kmdClient = new algosdk.Kmd(token, host, port);
             return new KMDWalletClient({
                 metadata: KMDWalletClient.metadata,
-                id: PROVIDER_ID.KMD,
                 password,
                 wallet,
                 client: kmdClient,
@@ -2227,11 +2310,9 @@ const ICON = "data:image/svg+xml,%3c%3fxml version='1.0' encoding='UTF-8'%3f%3e
 
 class MnemonicWalletClient extends BaseClient {
     #client;
-    id;
     network;
-    constructor({ metadata, id, algosdk, algodClient, network }) {
+    constructor({ metadata, algosdk, algodClient, network }) {
         super(metadata, algosdk, algodClient);
-        this.id = id;
         this.network = network;
         this.metadata = MnemonicWalletClient.metadata;
     }
@@ -2245,10 +2326,8 @@ class MnemonicWalletClient extends BaseClient {
         try {
             const algosdk = algosdkStatic || (await Algod.init(algodOptions)).algosdk;
             const algodClient = getAlgodClient(algosdk, algodOptions);
-            console.log(network, algodClient);
             return new MnemonicWalletClient({
                 metadata: MnemonicWalletClient.metadata,
-                id: PROVIDER_ID.MNEMONIC,
                 algosdk: algosdk,
                 algodClient: algodClient,
                 network
@@ -2362,9 +2441,8 @@ var allClients = {
     [MnemonicWalletClient.metadata.id]: MnemonicWalletClient
 };
 
-const clearActiveAccount = useWalletStore.getState().clearActiveAccount;
-const removeAccounts = useWalletStore.getState().removeAccounts;
 const clearAccounts = (id) => {
+    const { clearActiveAccount, removeAccounts } = useWalletStore.getState();
     clearActiveAccount(id);
     removeAccounts(id);
 };
@@ -2417,13 +2495,13 @@ function useWallet() {
         }));
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [clients, connectedAccounts, connectedActiveAccounts, activeAccount]);
-    const getClient = async (id) => {
+    const getClient = (id) => {
         if (!id)
             throw new Error('Provier ID is missing.');
-        const client = await clients?.[id];
-        if (!client)
+        const walletClient = clients?.[id];
+        if (!walletClient)
             throw new Error('Client not found for ID');
-        return client;
+        return walletClient;
     };
     const status = useMemo(() => {
         if (activeAccount === undefined) {
@@ -2460,7 +2538,7 @@ function useWallet() {
     };
     const connect = async (id) => {
         try {
-            const walletClient = await getClient(id);
+            const walletClient = getClient(id);
             const walletInfo = await walletClient?.connect(() => clearAccounts(id));
             if (!walletInfo || !walletInfo.accounts.length) {
                 throw new Error('Failed to connect ' + id);
@@ -2474,7 +2552,7 @@ function useWallet() {
     };
     const reconnect = async (id) => {
         try {
-            const walletClient = await getClient(id);
+            const walletClient = getClient(id);
             const walletInfo = await walletClient?.reconnect(() => clearAccounts(id));
             if (walletInfo && walletInfo.accounts.length) {
                 addAccounts(walletInfo.accounts);
@@ -2487,7 +2565,7 @@ function useWallet() {
     };
     const disconnect = async (id) => {
         try {
-            const walletClient = await getClient(id);
+            const walletClient = getClient(id);
             await walletClient?.disconnect();
         }
         catch (e) {
@@ -2507,7 +2585,7 @@ function useWallet() {
         }
     };
     const signTransactions = async (transactions, indexesToSign, returnGroup = true) => {
-        const walletClient = await getClient(activeAccount?.providerId);
+        const walletClient = getClient(activeAccount?.providerId);
         if (!walletClient || !activeAccount?.address) {
             throw new Error('No wallet found.');
         }
@@ -2515,7 +2593,7 @@ function useWallet() {
         return signedTransactions;
     };
     const sendTransactions = async (transactions, waitRoundsToConfirm) => {
-        const walletClient = await getClient(activeAccount?.providerId);
+        const walletClient = getClient(activeAccount?.providerId);
         const result = await walletClient?.sendRawTransactions(transactions, waitRoundsToConfirm);
         return result;
     };
@@ -2527,7 +2605,7 @@ function useWallet() {
     const getAccountInfo = async () => {
         if (!activeAccount)
             throw new Error('No selected account.');
-        const walletClient = await getClient(activeAccount.providerId);
+        const walletClient = getClient(activeAccount.providerId);
         const accountInfo = await walletClient?.getAccountInfo(activeAccount.address);
         return accountInfo;
     };
@@ -2537,11 +2615,11 @@ function useWallet() {
     const getAssets = async () => {
         if (!activeAccount)
             throw new Error('No selected account.');
-        const walletClient = await getClient(activeAccount.providerId);
+        const walletClient = getClient(activeAccount.providerId);
         return await walletClient?.getAssets(activeAccount.address);
     };
-    const groupTransactionsBySender = async (transactions) => {
-        const walletClient = await getClient(activeAccount?.providerId);
+    const groupTransactionsBySender = (transactions) => {
+        const walletClient = getClient(activeAccount?.providerId);
         return walletClient?.groupTransactionsBySender(transactions);
     };
     return {
@@ -2564,32 +2642,35 @@ function useWallet() {
     };
 }
 
-const initializeProviders = (providers, nodeConfig, algosdkStatic) => {
+const initializeProviders = async (providers, nodeConfig, algosdkStatic) => {
     const initializedProviders = {};
     if (typeof window === 'undefined') {
+        // @todo add `debug: Boolean` option to enable/disable console logs
         console.warn('Window object is not available, skipping initialization.');
         return initializedProviders;
     }
     const { network = DEFAULT_NETWORK$1, nodeServer = DEFAULT_NODE_BASEURL, nodePort = DEFAULT_NODE_PORT, nodeToken = DEFAULT_NODE_TOKEN } = nodeConfig || {};
-    if (!providers || providers.length === 0)
-        for (const [id, client] of Object.entries(allClients)) {
-            if (id === 'kmd' || id === 'mnemonic') {
-                continue;
-            }
-            initializedProviders[id] = client.init({
-                network,
-                algodOptions: [nodeToken, nodeServer, nodePort],
-                algosdkStatic: algosdkStatic
-            });
-        }
-    if (providers) {
-        for (const id of providers) {
-            initializedProviders[id] = allClients[id].init({
-                network,
-                algodOptions: [nodeToken, nodeServer, nodePort],
-                algosdkStatic: algosdkStatic
-            });
-        }
+    const initClient = async (provider) => {
+        const { id, ...providerConfig } = typeof provider === 'string' ? { id: provider } : provider;
+        const initParams = {
+            network,
+            algodOptions: [nodeToken, nodeServer, nodePort],
+            algosdkStatic,
+            ...providerConfig
+        };
+        const client = await allClients[id].init(initParams);
+        initializedProviders[id] = client;
+    };
+    // Initialize default providers if `providers` is undefined or empty
+    if (!providers || providers.length === 0) {
+        const initPromises = Object.keys(allClients)
+            .filter((id) => id !== PROVIDER_ID.KMD && id !== PROVIDER_ID.MNEMONIC && id !== PROVIDER_ID.WALLETCONNECT)
+            .map((id) => initClient(id));
+        await Promise.all(initPromises);
+    }
+    else {
+        const initPromises = providers.map((provider) => initClient(provider));
+        await Promise.all(initPromises);
     }
     return initializedProviders;
 };
@@ -2607,11 +2688,10 @@ const reconnectProviders = async (providers) => {
     try {
         const clients = Object.values(providers);
         for (const client of clients) {
-            const c = await client;
-            const id = c?.metadata.id;
+            const id = client?.metadata.id;
             // Only reconnect to active providers
             if (id && isActiveProvider(id)) {
-                await c.reconnect(() => clearAccounts(id));
+                await client.reconnect(() => clearAccounts(id));
             }
         }
     }
@@ -2626,4 +2706,25 @@ function encodeNFDTransactionsArray(transactionsArray) {
     });
 }
 
-export { DEFAULT_NETWORK$1 as DEFAULT_NETWORK, DEFAULT_NODE_BASEURL, DEFAULT_NODE_PORT, DEFAULT_NODE_TOKEN, PROVIDER_ID, clientStore as WalletProvider, AlgoSignerClient as algosigner, DeflyWalletClient as defly, encodeNFDTransactionsArray, ExodusClient as exodus, initializeProviders, KMDWalletClient as kmd, MnemonicWalletClient as mnemonic, MyAlgoWalletClient as myalgo, PeraWalletClient as pera, reconnectProviders, useWallet, WalletConnectClient as walletconnect };
+function useInitializeProviders({ providers, nodeConfig, algosdkStatic } = {}) {
+    const [walletProviders, setWalletProviders] = useState(null);
+    useEffect(() => {
+        async function initializeAndConnect() {
+            try {
+                // Initialize with provided or default configuration
+                const initializedProviders = await initializeProviders(providers, nodeConfig, algosdkStatic);
+                setWalletProviders(initializedProviders);
+                // Reconnect the session when the user returns to the app
+                await reconnectProviders(initializedProviders);
+            }
+            catch (error) {
+                console.error('Error initializing wallet providers:', error);
+            }
+        }
+        void initializeAndConnect();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    return walletProviders;
+}
+
+export { DEFAULT_NETWORK$1 as DEFAULT_NETWORK, DEFAULT_NODE_BASEURL, DEFAULT_NODE_PORT, DEFAULT_NODE_TOKEN, PROVIDER_ID, clientStore as WalletProvider, AlgoSignerClient as algosigner, DeflyWalletClient as defly, encodeNFDTransactionsArray, ExodusClient as exodus, initializeProviders, KMDWalletClient as kmd, MnemonicWalletClient as mnemonic, MyAlgoWalletClient as myalgo, PeraWalletClient as pera, reconnectProviders, useInitializeProviders, useWallet, WalletConnectClient as walletconnect };