@dynamic-labs/sdk-react-core 0.18.0-beta.29 → 0.18.100-viem.0

package/src/lib/utils/hooks/useClearWalletConnectSessions/useClearWalletConnectSessions.d.ts

@@ -1,9 +1,9 @@
-import type { WalletConnector } from '@dynamic-labs/wallet-connector-core';
-type Args = {
-    connectors: WalletConnector[];
-};
-export declare const useClearWalletConnectSessions: ({ connectors }: Args) => {
-    clearAllWalletConnectSessions: () => void;
-    clearOphanedWalletConnectSessions: () => void;
-};
-export {};
+import type { WalletConnector } from '@dynamic-labs/wallet-connector-core';
+type Args = {
+    connectors: WalletConnector[];
+};
+export declare const useClearWalletConnectSessions: ({ connectors }: Args) => {
+    clearAllWalletConnectSessions: () => void;
+    clearOphanedWalletConnectSessions: () => void;
+};
+export {};

package/src/lib/utils/hooks/useClearWalletConnectSessions/useClearWalletConnectSessions.js

@@ -9,35 +9,35 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../constants/colors.js';
 import { LocalStorage } from '../../../shared/utils/classes/storage/localStorage.js';
-import 'ethers';
+import 'viem';
 import '../../../shared/consts/index.js';
 
-const useClearWalletConnectSessions = ({ connectors }) => {
-    const clearOphanedWalletConnectSessions = useCallback(() => {
-        if (typeof window === 'undefined')
-            return;
-        if (connectors.length === 0)
-            return;
-        const names = new Set(connectors.map((connector) => normalizeWalletName(connector.name)));
-        for (const key of LocalStorage.getKeys()) {
-            if (key.startsWith('walletconnect') &&
-                !names.has(key.replace('walletconnect-', ''))) {
-                localStorage.removeItem(key);
-            }
-        }
-    }, [connectors]);
-    const clearAllWalletConnectSessions = () => {
-        if (typeof window === 'undefined')
-            return;
-        for (const key of LocalStorage.getKeys()) {
-            if (key.startsWith('walletconnect') ||
-                key.startsWith('walletlink') ||
-                key.startsWith('wc@2')) {
-                localStorage.removeItem(key);
-            }
-        }
-    };
-    return { clearAllWalletConnectSessions, clearOphanedWalletConnectSessions };
+const useClearWalletConnectSessions = ({ connectors }) => {
+    const clearOphanedWalletConnectSessions = useCallback(() => {
+        if (typeof window === 'undefined')
+            return;
+        if (connectors.length === 0)
+            return;
+        const names = new Set(connectors.map((connector) => normalizeWalletName(connector.name)));
+        for (const key of LocalStorage.getKeys()) {
+            if (key.startsWith('walletconnect') &&
+                !names.has(key.replace('walletconnect-', ''))) {
+                localStorage.removeItem(key);
+            }
+        }
+    }, [connectors]);
+    const clearAllWalletConnectSessions = () => {
+        if (typeof window === 'undefined')
+            return;
+        for (const key of LocalStorage.getKeys()) {
+            if (key.startsWith('walletconnect') ||
+                key.startsWith('walletlink') ||
+                key.startsWith('wc@2')) {
+                localStorage.removeItem(key);
+            }
+        }
+    };
+    return { clearAllWalletConnectSessions, clearOphanedWalletConnectSessions };
 };
 
 export { useClearWalletConnectSessions };

package/src/lib/utils/hooks/useColorSchemePreference/index.d.ts

@@ -1 +1 @@
-export * from './useColorSchemePreference';
+export * from './useColorSchemePreference';

package/src/lib/utils/hooks/useColorSchemePreference/useColorSchemePreference.cjs

@@ -13,13 +13,13 @@ require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../constants/colors.cjs');
 require('../../../shared/utils/classes/storage/localStorage.cjs');
-require('ethers');
+require('viem');
 var useMediaQuery = require('../../../shared/utils/hooks/useMediaQuery/useMediaQuery.cjs');
 require('../../../shared/consts/index.cjs');
 
-const useColorSchemePreference = () => {
-    const isDarkMode = useMediaQuery.useMediaQuery('(prefers-color-scheme: dark)');
-    return isDarkMode ? 'dark' : 'light';
+const useColorSchemePreference = () => {
+    const isDarkMode = useMediaQuery.useMediaQuery('(prefers-color-scheme: dark)');
+    return isDarkMode ? 'dark' : 'light';
 };
 
 exports.useColorSchemePreference = useColorSchemePreference;

package/src/lib/utils/hooks/useColorSchemePreference/useColorSchemePreference.d.ts

@@ -1 +1 @@
-export declare const useColorSchemePreference: () => "dark" | "light";
+export declare const useColorSchemePreference: () => "dark" | "light";

package/src/lib/utils/hooks/useColorSchemePreference/useColorSchemePreference.js

@@ -9,13 +9,13 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../constants/colors.js';
 import '../../../shared/utils/classes/storage/localStorage.js';
-import 'ethers';
+import 'viem';
 import { useMediaQuery } from '../../../shared/utils/hooks/useMediaQuery/useMediaQuery.js';
 import '../../../shared/consts/index.js';
 
-const useColorSchemePreference = () => {
-    const isDarkMode = useMediaQuery('(prefers-color-scheme: dark)');
-    return isDarkMode ? 'dark' : 'light';
+const useColorSchemePreference = () => {
+    const isDarkMode = useMediaQuery('(prefers-color-scheme: dark)');
+    return isDarkMode ? 'dark' : 'light';
 };
 
 export { useColorSchemePreference };

package/src/lib/utils/hooks/useConfirmationModal/index.d.ts

@@ -1 +1 @@
-export { useConfirmationModal } from './useConfirmationModal';
+export { useConfirmationModal } from './useConfirmationModal';

package/src/lib/utils/hooks/useConfirmationModal/useConfirmationModal.cjs

@@ -8,26 +8,26 @@ var React = require('react');
 var reactDom = require('react-dom');
 var useElementById = require('../useElementById/useElementById.cjs');
 
-const useConfirmationModal = ({ elementId, }) => {
-    const modalRootElementRef = useElementById.useElementById(elementId);
-    const [node, setNode] = React.useState(null);
-    const open = React.useCallback((builder) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        const promise = new Promise((resolve, reject) => {
-            try {
-                setNode(builder(resolve, reject));
-            }
-            catch (err) {
-                reject(err);
-            }
-        });
-        return promise.finally(() => {
-            setNode(undefined);
-        });
-    }), [setNode]);
-    return {
-        modal: node ? (jsxRuntime.jsx("div", { children: reactDom.createPortal(node, modalRootElementRef.current) })) : undefined,
-        open,
-    };
+const useConfirmationModal = ({ elementId, }) => {
+    const modalRootElementRef = useElementById.useElementById(elementId);
+    const [node, setNode] = React.useState(null);
+    const open = React.useCallback((builder) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        const promise = new Promise((resolve, reject) => {
+            try {
+                setNode(builder(resolve, reject));
+            }
+            catch (err) {
+                reject(err);
+            }
+        });
+        return promise.finally(() => {
+            setNode(undefined);
+        });
+    }), [setNode]);
+    return {
+        modal: node ? (jsxRuntime.jsx("div", { children: reactDom.createPortal(node, modalRootElementRef.current) })) : undefined,
+        open,
+    };
 };
 
 exports.useConfirmationModal = useConfirmationModal;

package/src/lib/utils/hooks/useConfirmationModal/useConfirmationModal.d.ts

@@ -1,2 +1,2 @@
-import { ConfirmationModalHookProps, ConfirmationModalHookResult } from './useConfirmationModal.types';
-export declare const useConfirmationModal: <T, E = unknown>({ elementId, }: ConfirmationModalHookProps) => ConfirmationModalHookResult<T, E>;
+import { ConfirmationModalHookProps, ConfirmationModalHookResult } from './useConfirmationModal.types';
+export declare const useConfirmationModal: <T, E = unknown>({ elementId, }: ConfirmationModalHookProps) => ConfirmationModalHookResult<T, E>;

package/src/lib/utils/hooks/useConfirmationModal/useConfirmationModal.js

@@ -4,26 +4,26 @@ import { useState, useCallback } from 'react';
 import { createPortal } from 'react-dom';
 import { useElementById } from '../useElementById/useElementById.js';
 
-const useConfirmationModal = ({ elementId, }) => {
-    const modalRootElementRef = useElementById(elementId);
-    const [node, setNode] = useState(null);
-    const open = useCallback((builder) => __awaiter(void 0, void 0, void 0, function* () {
-        const promise = new Promise((resolve, reject) => {
-            try {
-                setNode(builder(resolve, reject));
-            }
-            catch (err) {
-                reject(err);
-            }
-        });
-        return promise.finally(() => {
-            setNode(undefined);
-        });
-    }), [setNode]);
-    return {
-        modal: node ? (jsx("div", { children: createPortal(node, modalRootElementRef.current) })) : undefined,
-        open,
-    };
+const useConfirmationModal = ({ elementId, }) => {
+    const modalRootElementRef = useElementById(elementId);
+    const [node, setNode] = useState(null);
+    const open = useCallback((builder) => __awaiter(void 0, void 0, void 0, function* () {
+        const promise = new Promise((resolve, reject) => {
+            try {
+                setNode(builder(resolve, reject));
+            }
+            catch (err) {
+                reject(err);
+            }
+        });
+        return promise.finally(() => {
+            setNode(undefined);
+        });
+    }), [setNode]);
+    return {
+        modal: node ? (jsx("div", { children: createPortal(node, modalRootElementRef.current) })) : undefined,
+        open,
+    };
 };
 
 export { useConfirmationModal };

package/src/lib/utils/hooks/useConfirmationModal/useConfirmationModal.types.d.ts

@@ -1,8 +1,8 @@
-import { ReactNode } from 'react';
-export type ConfirmationModalHookProps = {
-    elementId: string;
-};
-export type ConfirmationModalHookResult<T = unknown, E = unknown> = {
-    modal?: ReactNode;
-    open: (builder: (resolve: (value: T) => void, reject: (error: E) => void) => ReactNode) => Promise<T>;
-};
+import { ReactNode } from 'react';
+export type ConfirmationModalHookProps = {
+    elementId: string;
+};
+export type ConfirmationModalHookResult<T = unknown, E = unknown> = {
+    modal?: ReactNode;
+    open: (builder: (resolve: (value: T) => void, reject: (error: E) => void) => ReactNode) => Promise<T>;
+};

package/src/lib/utils/hooks/useConnectWallet/index.d.ts

@@ -1 +1 @@
-export { useConnectWallet } from './useConnectWallet';
+export { useConnectWallet } from './useConnectWallet';

package/src/lib/utils/hooks/useConnectWallet/useConnectWallet.cjs

@@ -15,7 +15,7 @@ require('@dynamic-labs/utils');
 var localStorage = require('../../constants/localStorage.cjs');
 require('../../constants/colors.cjs');
 require('../../../shared/utils/classes/storage/localStorage.cjs');
-require('ethers');
+require('viem');
 var useLocalStorage = require('../../../shared/utils/hooks/useLocalStorage/useLocalStorage.cjs');
 require('../../../shared/consts/index.cjs');
 var getWalletProvider = require('../../functions/getWalletProvider/getWalletProvider.cjs');
@@ -23,187 +23,187 @@ var api = require('../../../data/api.cjs');
 require('@dynamic-labs/multi-wallet');
 var shouldManuallyReconnectOnRefresh = require('../../functions/shouldManuallyReconnectOnRefresh/shouldManuallyReconnectOnRefresh.cjs');
 
-const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingOnConnectOnly, environmentId, primaryWalletId, setPrimaryWalletId, wallets, onUnlink, onBeforeConnectSuccessConfirmation, setShowAuthFlow, }) => {
-    const [connectedWalletsInfo, setConnectedWalletsInfo, removeConnectedWalletsInfo,] = useLocalStorage.useLocalStorage(localStorage.CONNECTED_WALLETS_INFO, []);
-    const [connectedWallets, setConnectedWallets] = React.useState([]);
-    // The function to update and define the connectedWallets list.
-    // It uses walletConnector to get the current wallet address and network
-    // The address and network in the runtime are updated by the event listeners
-    // The event listeners are updating `connectedWallets` list.
-    // It should be called on the first render and when connectedWalletsInfo updates
-    const updateConnectedWalletsList = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        const walletConnectors = wallets.map((wallet) => wallet.walletConnector);
-        if (!walletConnectors.length) {
-            return;
-        }
-        const nextConnectedWallets = (yield Promise.all(connectedWalletsInfo.map((storedConnectedWalletInfo) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-            const walletConnector = walletConnectorCore.getWalletConnectorByName(walletConnectors, storedConnectedWalletInfo.walletConnectorKey);
-            if (!walletConnector) {
-                walletConnectorCore.logger.error('Could not find walletConnector: ' +
-                    storedConnectedWalletInfo.walletConnectorKey);
-                return Promise.resolve(null);
-            }
-            const [walletAddress] = yield walletConnector.getConnectedAccounts();
-            const walletNetwork = yield walletConnector.getNetwork();
-            const walletChain = walletConnector.connectedChain;
-            const walletObject = {
-                address: 
-                // We use `storedConnectedWalletInfo.lastWalletAddress` as a workaround to Braavos issue
-                // Braavos during initialization returns an empty string as a wallet address
-                walletAddress ||
-                    storedConnectedWalletInfo.lastWalletAddress ||
-                    '',
-                chain: walletChain || '',
-                connected: true,
-                connector: walletConnector,
-                id: storedConnectedWalletInfo.id,
-                network: walletNetwork,
-            };
-            return Promise.resolve(walletObject);
-        })))).filter((wallet) => Boolean(wallet));
-        setConnectedWallets(nextConnectedWallets);
-    }), [connectedWalletsInfo, wallets]);
-    // Generate the connectedWallets list when connectedWalletsInfo (localStorage) or memoized wallet connector updates
-    React.useEffect(() => {
-        updateConnectedWalletsList();
-    }, [updateConnectedWalletsList]);
-    const getNextIdAvailable = React.useCallback((currentWallets) => {
-        const existingIds = currentWallets.map(({ id }) => id);
-        const sortedIds = existingIds
-            .map((id) => Number(id.replace('connect-wallet-', '')))
-            .sort((a, b) => a - b);
-        for (let i = 0; i < sortedIds.length; i++) {
-            if (sortedIds[i] !== i) {
-                return i;
-            }
-        }
-        return sortedIds.length;
-    }, []);
-    const updateConnectedWalletById = React.useCallback((walletId, walletObject) => {
-        const clonedConnectedWalletsList = [...connectedWallets];
-        const connectedWalletIndex = clonedConnectedWalletsList.findIndex((connectedWallet) => connectedWallet.id === walletId);
-        if (connectedWalletIndex > -1) {
-            clonedConnectedWalletsList[connectedWalletIndex] = Object.assign(Object.assign({}, clonedConnectedWalletsList[connectedWalletIndex]), walletObject);
-            setConnectedWallets(clonedConnectedWalletsList);
-        }
-    }, [connectedWallets]);
-    const connectedWallet = connectedWallets[0] || null;
-    // Keeps connected wallet data inside localStorage
-    const applyConnectedWalletToStore = ({ walletId, walletAddress, walletConnectorKey, walletChain, provider, }) => {
-        const nextConnectedWalletsInfo = [...connectedWalletsInfo];
-        nextConnectedWalletsInfo.push({
-            id: walletId,
-            lastWalletAddress: walletAddress,
-            provider,
-            walletChain,
-            walletConnectorKey,
-        });
-        setConnectedWalletsInfo(nextConnectedWalletsInfo);
-        return Promise.resolve();
-    };
-    // Updates connected wallet (network and address) and verifies connected wallet connection
-    const refreshConnectedWallet = (walletId, walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        if (shouldManuallyReconnectOnRefresh.shouldManuallyReconnectOnRefresh(walletConnector)) {
-            yield walletConnector.connect();
-        }
-        const currentWalletConnectorAddress = yield walletConnector.fetchPublicAddress();
-        if (onBeforeConnectSuccessConfirmation) {
-            const shouldProceedWithConnection = yield onBeforeConnectSuccessConfirmation({
-                address: currentWalletConnectorAddress,
-                chain: walletConnector.connectedChain,
-                connector: walletConnector,
-            });
-            if (!shouldProceedWithConnection) {
-                walletConnectorCore.logger.info('Connection was not established because onBeforeConnectSuccessConfirmation returned false');
-                unlinkConnectedWallet(walletId);
-                setShowAuthFlow(false);
-                return;
-            }
-        }
-        if (!currentWalletConnectorAddress) {
-            walletConnectorCore.logger.error('Could not refresh the wallet. The wallet address is not available');
-            return;
-        }
-        const currentWalletConnectoNetwork = yield walletConnector.getNetwork();
-        updateConnectedWalletById(walletId, {
-            address: currentWalletConnectorAddress,
-            network: currentWalletConnectoNetwork,
-        });
-    });
-    const shouldSkipCreatingVisit = React.useMemo(() => (authMode === 'connect-only' && !enableVisitTrackingOnConnectOnly) ||
-        connectedWallet, [authMode, connectedWallet, enableVisitTrackingOnConnectOnly]);
-    const connectWallet = (walletConnector, fetchPublicAddressOpts) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        const publicWalletAddress = yield walletConnector.fetchPublicAddress(fetchPublicAddressOpts);
-        if (!publicWalletAddress) {
-            const error = new Error();
-            error.code = 'missing-public-address';
-            throw error;
-        }
-        if (onBeforeConnectSuccessConfirmation) {
-            const shouldProceedWithConnection = yield onBeforeConnectSuccessConfirmation({
-                address: publicWalletAddress,
-                chain: walletConnector.connectedChain,
-                connector: walletConnector,
-            });
-            if (!shouldProceedWithConnection) {
-                walletConnectorCore.logger.info('Connection was not established because onBeforeConnectSuccessConfirmation returned false');
-                setShowAuthFlow(false);
-                return;
-            }
-        }
-        const walletId = `connect-wallet-${getNextIdAvailable(connectedWalletsInfo)}`;
-        if (!primaryWalletId) {
-            setPrimaryWalletId(walletId);
-        }
-        const walletChain = walletConnector.connectedChain;
-        const isWalletStored = connectedWalletsInfo.some(({ walletConnectorKey: storedWalletConnectorKey }) => storedWalletConnectorKey === walletConnector.name);
-        if (isWalletStored) {
-            yield updateConnectedWalletsList();
-        }
-        else {
-            applyConnectedWalletToStore({
-                provider: getWalletProvider.getWalletProvider(walletConnector),
-                walletAddress: publicWalletAddress,
-                walletChain,
-                walletConnectorKey: walletConnector.name,
-                walletId,
-            });
-        }
-        if (shouldSkipCreatingVisit) {
-            return Promise.resolve(publicWalletAddress);
-        }
-        // send information to backend to kick off background jobs
-        // so verify/sign on the next step could go by more quickly
-        // this is async work, but DO NOT AWAIT
-        api.createVisit({
-            authMode,
-            chain: walletChain || '',
-            environmentId,
-            publicWalletAddress,
-            walletName: walletConnector.name,
-            walletProvider: getWalletProvider.getWalletProvider(walletConnector),
-        });
-        return Promise.resolve(publicWalletAddress);
-    });
-    const unlinkConnectedWallet = (walletId) => {
-        const filteredWallets = connectedWalletsInfo.filter((wallet) => wallet.id !== walletId);
-        if (walletId === primaryWalletId) {
-            clearPrimaryWalletId();
-        }
-        setConnectedWalletsInfo(filteredWallets);
-        onUnlink === null || onUnlink === void 0 ? void 0 : onUnlink(walletId, filteredWallets);
-    };
-    const getConnectedWalletById = React.useCallback((walletId) => connectedWallets.find((wallet) => wallet.id === walletId), [connectedWallets]);
-    return {
-        connectWallet,
-        connectedWallet,
-        connectedWallets,
-        connectedWalletsInfo,
-        getConnectedWalletById,
-        refreshConnectedWallet,
-        removeConnectedWalletsInfo,
-        unlinkConnectedWallet,
-    };
+const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingOnConnectOnly, environmentId, primaryWalletId, setPrimaryWalletId, wallets, onUnlink, onBeforeConnectSuccessConfirmation, setShowAuthFlow, }) => {
+    const [connectedWalletsInfo, setConnectedWalletsInfo, removeConnectedWalletsInfo,] = useLocalStorage.useLocalStorage(localStorage.CONNECTED_WALLETS_INFO, []);
+    const [connectedWallets, setConnectedWallets] = React.useState([]);
+    // The function to update and define the connectedWallets list.
+    // It uses walletConnector to get the current wallet address and network
+    // The address and network in the runtime are updated by the event listeners
+    // The event listeners are updating `connectedWallets` list.
+    // It should be called on the first render and when connectedWalletsInfo updates
+    const updateConnectedWalletsList = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        const walletConnectors = wallets.map((wallet) => wallet.walletConnector);
+        if (!walletConnectors.length) {
+            return;
+        }
+        const nextConnectedWallets = (yield Promise.all(connectedWalletsInfo.map((storedConnectedWalletInfo) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+            const walletConnector = walletConnectorCore.getWalletConnectorByName(walletConnectors, storedConnectedWalletInfo.walletConnectorKey);
+            if (!walletConnector) {
+                walletConnectorCore.logger.error('Could not find walletConnector: ' +
+                    storedConnectedWalletInfo.walletConnectorKey);
+                return Promise.resolve(null);
+            }
+            const [walletAddress] = yield walletConnector.getConnectedAccounts();
+            const walletNetwork = yield walletConnector.getNetwork();
+            const walletChain = walletConnector.connectedChain;
+            const walletObject = {
+                address: 
+                // We use `storedConnectedWalletInfo.lastWalletAddress` as a workaround to Braavos issue
+                // Braavos during initialization returns an empty string as a wallet address
+                walletAddress ||
+                    storedConnectedWalletInfo.lastWalletAddress ||
+                    '',
+                chain: walletChain || '',
+                connected: true,
+                connector: walletConnector,
+                id: storedConnectedWalletInfo.id,
+                network: walletNetwork,
+            };
+            return Promise.resolve(walletObject);
+        })))).filter((wallet) => Boolean(wallet));
+        setConnectedWallets(nextConnectedWallets);
+    }), [connectedWalletsInfo, wallets]);
+    // Generate the connectedWallets list when connectedWalletsInfo (localStorage) or memoized wallet connector updates
+    React.useEffect(() => {
+        updateConnectedWalletsList();
+    }, [updateConnectedWalletsList]);
+    const getNextIdAvailable = React.useCallback((currentWallets) => {
+        const existingIds = currentWallets.map(({ id }) => id);
+        const sortedIds = existingIds
+            .map((id) => Number(id.replace('connect-wallet-', '')))
+            .sort((a, b) => a - b);
+        for (let i = 0; i < sortedIds.length; i++) {
+            if (sortedIds[i] !== i) {
+                return i;
+            }
+        }
+        return sortedIds.length;
+    }, []);
+    const updateConnectedWalletById = React.useCallback((walletId, walletObject) => {
+        const clonedConnectedWalletsList = [...connectedWallets];
+        const connectedWalletIndex = clonedConnectedWalletsList.findIndex((connectedWallet) => connectedWallet.id === walletId);
+        if (connectedWalletIndex > -1) {
+            clonedConnectedWalletsList[connectedWalletIndex] = Object.assign(Object.assign({}, clonedConnectedWalletsList[connectedWalletIndex]), walletObject);
+            setConnectedWallets(clonedConnectedWalletsList);
+        }
+    }, [connectedWallets]);
+    const connectedWallet = connectedWallets[0] || null;
+    // Keeps connected wallet data inside localStorage
+    const applyConnectedWalletToStore = ({ walletId, walletAddress, walletConnectorKey, walletChain, provider, }) => {
+        const nextConnectedWalletsInfo = [...connectedWalletsInfo];
+        nextConnectedWalletsInfo.push({
+            id: walletId,
+            lastWalletAddress: walletAddress,
+            provider,
+            walletChain,
+            walletConnectorKey,
+        });
+        setConnectedWalletsInfo(nextConnectedWalletsInfo);
+        return Promise.resolve();
+    };
+    // Updates connected wallet (network and address) and verifies connected wallet connection
+    const refreshConnectedWallet = (walletId, walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        if (shouldManuallyReconnectOnRefresh.shouldManuallyReconnectOnRefresh(walletConnector)) {
+            yield walletConnector.connect();
+        }
+        const currentWalletConnectorAddress = yield walletConnector.fetchPublicAddress();
+        if (onBeforeConnectSuccessConfirmation) {
+            const shouldProceedWithConnection = yield onBeforeConnectSuccessConfirmation({
+                address: currentWalletConnectorAddress,
+                chain: walletConnector.connectedChain,
+                connector: walletConnector,
+            });
+            if (!shouldProceedWithConnection) {
+                walletConnectorCore.logger.info('Connection was not established because onBeforeConnectSuccessConfirmation returned false');
+                unlinkConnectedWallet(walletId);
+                setShowAuthFlow(false);
+                return;
+            }
+        }
+        if (!currentWalletConnectorAddress) {
+            walletConnectorCore.logger.error('Could not refresh the wallet. The wallet address is not available');
+            return;
+        }
+        const currentWalletConnectoNetwork = yield walletConnector.getNetwork();
+        updateConnectedWalletById(walletId, {
+            address: currentWalletConnectorAddress,
+            network: currentWalletConnectoNetwork,
+        });
+    });
+    const shouldSkipCreatingVisit = React.useMemo(() => (authMode === 'connect-only' && !enableVisitTrackingOnConnectOnly) ||
+        connectedWallet, [authMode, connectedWallet, enableVisitTrackingOnConnectOnly]);
+    const connectWallet = (walletConnector, fetchPublicAddressOpts) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        const publicWalletAddress = yield walletConnector.fetchPublicAddress(fetchPublicAddressOpts);
+        if (!publicWalletAddress) {
+            const error = new Error();
+            error.code = 'missing-public-address';
+            throw error;
+        }
+        if (onBeforeConnectSuccessConfirmation) {
+            const shouldProceedWithConnection = yield onBeforeConnectSuccessConfirmation({
+                address: publicWalletAddress,
+                chain: walletConnector.connectedChain,
+                connector: walletConnector,
+            });
+            if (!shouldProceedWithConnection) {
+                walletConnectorCore.logger.info('Connection was not established because onBeforeConnectSuccessConfirmation returned false');
+                setShowAuthFlow(false);
+                return;
+            }
+        }
+        const walletId = `connect-wallet-${getNextIdAvailable(connectedWalletsInfo)}`;
+        if (!primaryWalletId) {
+            setPrimaryWalletId(walletId);
+        }
+        const walletChain = walletConnector.connectedChain;
+        const isWalletStored = connectedWalletsInfo.some(({ walletConnectorKey: storedWalletConnectorKey }) => storedWalletConnectorKey === walletConnector.name);
+        if (isWalletStored) {
+            yield updateConnectedWalletsList();
+        }
+        else {
+            applyConnectedWalletToStore({
+                provider: getWalletProvider.getWalletProvider(walletConnector),
+                walletAddress: publicWalletAddress,
+                walletChain,
+                walletConnectorKey: walletConnector.name,
+                walletId,
+            });
+        }
+        if (shouldSkipCreatingVisit) {
+            return Promise.resolve(publicWalletAddress);
+        }
+        // send information to backend to kick off background jobs
+        // so verify/sign on the next step could go by more quickly
+        // this is async work, but DO NOT AWAIT
+        api.createVisit({
+            authMode,
+            chain: walletChain || '',
+            environmentId,
+            publicWalletAddress,
+            walletName: walletConnector.name,
+            walletProvider: getWalletProvider.getWalletProvider(walletConnector),
+        });
+        return Promise.resolve(publicWalletAddress);
+    });
+    const unlinkConnectedWallet = (walletId) => {
+        const filteredWallets = connectedWalletsInfo.filter((wallet) => wallet.id !== walletId);
+        if (walletId === primaryWalletId) {
+            clearPrimaryWalletId();
+        }
+        setConnectedWalletsInfo(filteredWallets);
+        onUnlink === null || onUnlink === void 0 ? void 0 : onUnlink(walletId, filteredWallets);
+    };
+    const getConnectedWalletById = React.useCallback((walletId) => connectedWallets.find((wallet) => wallet.id === walletId), [connectedWallets]);
+    return {
+        connectWallet,
+        connectedWallet,
+        connectedWallets,
+        connectedWalletsInfo,
+        getConnectedWalletById,
+        refreshConnectedWallet,
+        removeConnectedWalletsInfo,
+        unlinkConnectedWallet,
+    };
 };
 
 exports.useConnectWallet = useConnectWallet;