@dynamic-labs/sdk-react-core 0.17.0-RC.2 → 0.17.0-RC.20

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

@@ -3,33 +3,38 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _tslib = require('../../../../../_virtual/_tslib.cjs');
-var multiWallet = require('@dynamic-labs/multi-wallet');
+var utils = require('@dynamic-labs/utils');
 var api = require('../../../data/api.cjs');
 var index = require('../../functions/storeAuthToken/index.cjs');
+require('@dynamic-labs/multi-wallet');
 var localStorage = require('../../constants/localStorage.cjs');
 require('../../constants/colors.cjs');
 var decodeJwt = require('../../../shared/utils/functions/decodeJwt/decodeJwt.cjs');
 var logger = require('../../../shared/logger.cjs');
 var setToLS = require('../../../shared/utils/functions/storage/setToLS.cjs');
 require('@dynamic-labs/iconic');
+require('@dynamic-labs/wallet-connector-core');
 require('react/jsx-runtime');
 var ViewContext = require('../../../context/ViewContext/ViewContext.cjs');
 require('react');
+require('ethers');
 var getVerifyArgs = require('../../functions/getVerifyArgs/getVerifyArgs.cjs');
 var createUserProfile = require('../../functions/createUserProfile/createUserProfile.cjs');
 var isSupportedNetwork = require('../../functions/isSupportedNetwork/isSupportedNetwork.cjs');
 require('@dynamic-labs/sdk-api');
 var isProgrammableNetworkSwitchSupported = require('../../functions/isProgrammableNetworkSwitchSupported/isProgrammableNetworkSwitchSupported.cjs');
+require('../../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useInternalDynamicContext.cjs');
 var ErrorContext = require('../../../context/ErrorContext/ErrorContext.cjs');
 var getSiweStatement = require('../../functions/getSiweStatement/getSiweStatement.cjs');
 var getWalletProvider = require('../../functions/getWalletProvider/getWalletProvider.cjs');
-require('../../../shared/consts/index.cjs');
+var AccessDeniedContext = require('../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 
 // This logic is used to both verify or link a wallet
 // Since we are re-using the different screens to authenticate or link the wallet.
 // This logic is the best place to determine whether we should verify or verify and link.
 const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, projectSettings, setIsSingleWalletAccount, }) => {
+    const { setDeniedAddress } = AccessDeniedContext.useAccessDeniedContext();
     const { setView } = ViewContext.useViewContext();
     const { setErrorMessage, setError } = ErrorContext.useErrorContext();
     const { setUser, multiWalletWidgetState, debugError, multiWallet: multiWalletEnabled, appName, primaryWalletId, setCallback, setShowAuthFlow, setPrimaryWalletId, siweStatement, connectedWallet, authMode, setOnboardingOnlyJwt, authToken, loginWithEmail, } = useInternalDynamicContext.useInternalDynamicContext();
@@ -37,11 +42,11 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
     // We need this boolean for the part of the logic where we already persisted a new authToken,
     // and need to distinguish between logic for verify or linking.
     const verifyOnly = !authToken;
-    const generateJWT = (walletConnector, walletProvider, fetchPublicAddressOpts, publicWalletAddress, captchaToken) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    const generateJWT = (walletConnector, walletProvider, fetchPublicAddressOpts, publicWalletAddress, captchaToken, oauth) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         let Jwt;
         const nonce = consumeNonce();
         if (nonce === undefined)
-            throw new multiWallet.DynamicError('Missing nonce');
+            throw new utils.DynamicError('Missing nonce');
         const verifyArgs = yield getVerifyArgs.getVerifyArgs({
             displayTermsOfService,
             environmentId,
@@ -53,13 +58,14 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             walletProvider,
         });
         if (authToken === undefined || !multiWalletEnabled) {
-            Jwt = yield api.verifyWallet(environmentId, Object.assign(Object.assign({}, verifyArgs), { captchaToken }));
+            Jwt = yield api.verifyWallet(environmentId, Object.assign(Object.assign({}, verifyArgs), { captchaToken,
+                oauth }));
         }
         else {
             Jwt = yield api.linkWallet(environmentId, verifyArgs, authToken);
         }
         if (Jwt === undefined)
-            throw new multiWallet.DynamicError('Could not obtain a valid JWT');
+            throw new utils.DynamicError('Could not obtain a valid JWT');
         // TODO DYN-523: add verification here that the JWT is valid with the publicKey
         return Jwt;
     });
@@ -83,10 +89,10 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             }
         }
     };
-    const handleError = (e, walletConnector) => {
+    const handleError = (e, walletConnector, address) => {
         // This is a special case where the user is trying to link a wallet
         // and the wallet is already linked and we don't want to kill the session.
-        if (e.name === 'WalletUsedError') {
+        if (e instanceof utils.WalletUsedError) {
             setShowAuthFlow(true);
             setView('wallet-used');
             setIsSingleWalletAccount(false);
@@ -96,16 +102,17 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             return;
         }
         walletConnector.endSession();
-        if (e.name === 'ChainalysisError') {
+        if (e instanceof utils.ChainalysisError) {
             setView('chainalysis-blocked-wallet');
             return;
         }
-        if (e.name === 'NoAccessError') {
+        if (e instanceof utils.NoAccessError) {
+            setDeniedAddress(address);
             setView('no-access');
             return;
         }
         if (connectedWallet && authMode === 'connect-only') {
-            throw new multiWallet.DynamicError(e.message);
+            throw new utils.DynamicError(e.message);
         }
         setView(loginWithEmail ? 'login-with-email-or-wallet' : 'wallet-list');
         logger.logger.error(e);
@@ -116,7 +123,7 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             setErrorMessage(e.code);
         }
     };
-    return ({ walletConnector, fetchPublicAddressOpts, publicWalletAddress, captchaToken, }) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    return ({ walletConnector, fetchPublicAddressOpts, publicWalletAddress, captchaToken, oauth, }) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         const walletProvider = getWalletProvider.getWalletProvider(walletConnector);
         const network = yield walletConnector.getNetwork();
         const _isSupportedNetwork = isSupportedNetwork.isSupportedNetwork({
@@ -124,10 +131,10 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             walletConnector,
         });
         try {
-            const Jwt = yield generateJWT(walletConnector, walletProvider, fetchPublicAddressOpts, publicWalletAddress, captchaToken);
+            const Jwt = yield generateJWT(walletConnector, walletProvider, fetchPublicAddressOpts, publicWalletAddress, captchaToken, oauth);
             const decodedJwt = decodeJwt.decodeJwt(Jwt);
             if (decodedJwt === undefined)
-                throw new multiWallet.DynamicError('Invalid token!');
+                throw new utils.DynamicError('Invalid token!');
             const user = yield createUserProfile.createUserProfile(decodedJwt);
             const isKycRequired = decodedJwt.missingFields.length;
             setOnboardingOnlyJwt(Jwt);
@@ -138,8 +145,7 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
                 verifyOnly &&
                 !_isSupportedNetwork &&
                 !isKycRequired) {
-                const _isProgrammableNetworkSwitchSupported = isProgrammableNetworkSwitchSupported.isProgrammableNetworkSwitchSupported(walletConnector);
-                if (_isProgrammableNetworkSwitchSupported) {
+                if (isProgrammableNetworkSwitchSupported.isProgrammableNetworkSwitchSupported(walletConnector)) {
                     return setView('network-not-supported');
                 }
                 return setView('network-not-supported-manual');
@@ -163,7 +169,7 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             }
         }
         catch (e) {
-            handleError(e, walletConnector);
+            handleError(e, walletConnector, publicWalletAddress);
         }
     });
 };

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

@@ -5,5 +5,5 @@ type UseVerifyWalletArgs = VerifyProps & ProjectSettingsProps & {
     displayTermsOfService: boolean;
     setIsSingleWalletAccount: Dispatch<SetStateAction<boolean>>;
 };
-export declare const useVerifyWallet: ({ consumeNonce, displayTermsOfService, environmentId, projectSettings, setIsSingleWalletAccount, }: UseVerifyWalletArgs) => ({ walletConnector, fetchPublicAddressOpts, publicWalletAddress, captchaToken, }: VerifyCallbackArgs) => Promise<void>;
+export declare const useVerifyWallet: ({ consumeNonce, displayTermsOfService, environmentId, projectSettings, setIsSingleWalletAccount, }: UseVerifyWalletArgs) => ({ walletConnector, fetchPublicAddressOpts, publicWalletAddress, captchaToken, oauth, }: VerifyCallbackArgs) => Promise<void>;
 export {};

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

@@ -1,31 +1,36 @@
 import { __awaiter } from '../../../../../_virtual/_tslib.js';
-import { DynamicError } from '@dynamic-labs/multi-wallet';
+import { DynamicError, WalletUsedError, ChainalysisError, NoAccessError } from '@dynamic-labs/utils';
 import { verifyWallet, linkWallet } from '../../../data/api.js';
 import { storeAuthToken } from '../../functions/storeAuthToken/index.js';
+import '@dynamic-labs/multi-wallet';
 import { LAST_USED_WALLET } from '../../constants/localStorage.js';
 import '../../constants/colors.js';
 import { decodeJwt } from '../../../shared/utils/functions/decodeJwt/decodeJwt.js';
 import { logger } from '../../../shared/logger.js';
 import { setToLS } from '../../../shared/utils/functions/storage/setToLS.js';
 import '@dynamic-labs/iconic';
+import '@dynamic-labs/wallet-connector-core';
 import 'react/jsx-runtime';
 import { useViewContext } from '../../../context/ViewContext/ViewContext.js';
 import 'react';
+import 'ethers';
 import { getVerifyArgs } from '../../functions/getVerifyArgs/getVerifyArgs.js';
 import { createUserProfile } from '../../functions/createUserProfile/createUserProfile.js';
 import { isSupportedNetwork } from '../../functions/isSupportedNetwork/isSupportedNetwork.js';
 import '@dynamic-labs/sdk-api';
 import { isProgrammableNetworkSwitchSupported } from '../../functions/isProgrammableNetworkSwitchSupported/isProgrammableNetworkSwitchSupported.js';
+import '../../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useInternalDynamicContext.js';
 import { useErrorContext } from '../../../context/ErrorContext/ErrorContext.js';
 import { getSiweStatement } from '../../functions/getSiweStatement/getSiweStatement.js';
 import { getWalletProvider } from '../../functions/getWalletProvider/getWalletProvider.js';
-import '../../../shared/consts/index.js';
+import { useAccessDeniedContext } from '../../../context/AccessDeniedContext/AccessDeniedContext.js';
 
 // This logic is used to both verify or link a wallet
 // Since we are re-using the different screens to authenticate or link the wallet.
 // This logic is the best place to determine whether we should verify or verify and link.
 const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, projectSettings, setIsSingleWalletAccount, }) => {
+    const { setDeniedAddress } = useAccessDeniedContext();
     const { setView } = useViewContext();
     const { setErrorMessage, setError } = useErrorContext();
     const { setUser, multiWalletWidgetState, debugError, multiWallet: multiWalletEnabled, appName, primaryWalletId, setCallback, setShowAuthFlow, setPrimaryWalletId, siweStatement, connectedWallet, authMode, setOnboardingOnlyJwt, authToken, loginWithEmail, } = useInternalDynamicContext();
@@ -33,7 +38,7 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
     // We need this boolean for the part of the logic where we already persisted a new authToken,
     // and need to distinguish between logic for verify or linking.
     const verifyOnly = !authToken;
-    const generateJWT = (walletConnector, walletProvider, fetchPublicAddressOpts, publicWalletAddress, captchaToken) => __awaiter(void 0, void 0, void 0, function* () {
+    const generateJWT = (walletConnector, walletProvider, fetchPublicAddressOpts, publicWalletAddress, captchaToken, oauth) => __awaiter(void 0, void 0, void 0, function* () {
         let Jwt;
         const nonce = consumeNonce();
         if (nonce === undefined)
@@ -49,7 +54,8 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             walletProvider,
         });
         if (authToken === undefined || !multiWalletEnabled) {
-            Jwt = yield verifyWallet(environmentId, Object.assign(Object.assign({}, verifyArgs), { captchaToken }));
+            Jwt = yield verifyWallet(environmentId, Object.assign(Object.assign({}, verifyArgs), { captchaToken,
+                oauth }));
         }
         else {
             Jwt = yield linkWallet(environmentId, verifyArgs, authToken);
@@ -79,10 +85,10 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             }
         }
     };
-    const handleError = (e, walletConnector) => {
+    const handleError = (e, walletConnector, address) => {
         // This is a special case where the user is trying to link a wallet
         // and the wallet is already linked and we don't want to kill the session.
-        if (e.name === 'WalletUsedError') {
+        if (e instanceof WalletUsedError) {
             setShowAuthFlow(true);
             setView('wallet-used');
             setIsSingleWalletAccount(false);
@@ -92,11 +98,12 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             return;
         }
         walletConnector.endSession();
-        if (e.name === 'ChainalysisError') {
+        if (e instanceof ChainalysisError) {
             setView('chainalysis-blocked-wallet');
             return;
         }
-        if (e.name === 'NoAccessError') {
+        if (e instanceof NoAccessError) {
+            setDeniedAddress(address);
             setView('no-access');
             return;
         }
@@ -112,7 +119,7 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             setErrorMessage(e.code);
         }
     };
-    return ({ walletConnector, fetchPublicAddressOpts, publicWalletAddress, captchaToken, }) => __awaiter(void 0, void 0, void 0, function* () {
+    return ({ walletConnector, fetchPublicAddressOpts, publicWalletAddress, captchaToken, oauth, }) => __awaiter(void 0, void 0, void 0, function* () {
         const walletProvider = getWalletProvider(walletConnector);
         const network = yield walletConnector.getNetwork();
         const _isSupportedNetwork = isSupportedNetwork({
@@ -120,7 +127,7 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             walletConnector,
         });
         try {
-            const Jwt = yield generateJWT(walletConnector, walletProvider, fetchPublicAddressOpts, publicWalletAddress, captchaToken);
+            const Jwt = yield generateJWT(walletConnector, walletProvider, fetchPublicAddressOpts, publicWalletAddress, captchaToken, oauth);
             const decodedJwt = decodeJwt(Jwt);
             if (decodedJwt === undefined)
                 throw new DynamicError('Invalid token!');
@@ -134,8 +141,7 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
                 verifyOnly &&
                 !_isSupportedNetwork &&
                 !isKycRequired) {
-                const _isProgrammableNetworkSwitchSupported = isProgrammableNetworkSwitchSupported(walletConnector);
-                if (_isProgrammableNetworkSwitchSupported) {
+                if (isProgrammableNetworkSwitchSupported(walletConnector)) {
                     return setView('network-not-supported');
                 }
                 return setView('network-not-supported-manual');
@@ -159,7 +165,7 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
             }
         }
         catch (e) {
-            handleError(e, walletConnector);
+            handleError(e, walletConnector, publicWalletAddress);
         }
     });
 };

package/src/lib/utils/hooks/useWalletConnectors/reconnectSocialWallet.cjs

@@ -0,0 +1,37 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../../../../_virtual/_tslib.cjs');
+var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
+require('../../constants/colors.cjs');
+require('@dynamic-labs/multi-wallet');
+require('@dynamic-labs/utils');
+require('@dynamic-labs/sdk-api');
+require('../../../shared/logger.cjs');
+require('@dynamic-labs/iconic');
+require('react/jsx-runtime');
+require('../../../context/ViewContext/ViewContext.cjs');
+require('react');
+require('ethers');
+var getReferencedAccount = require('../../functions/getReferencedAccount/getReferencedAccount.cjs');
+
+/**
+ * This function will use a referenced account to kick off the social wallet
+ * authentication. This is useful in the multiwallet scenario where the user
+ * wants to set their disconnected social wallet as their primary wallet, in
+ * which case the wallet needs to be reconnected
+ */
+const reconnectSocialWallet = (jwt, wallet) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    if (!walletConnectorCore.isSocialWalletConnector(wallet.connector)) {
+        return;
+    }
+    const socialAccountDataForWallet = getReferencedAccount.getReferencedAccount(jwt, wallet.id);
+    if (!socialAccountDataForWallet ||
+        !socialAccountDataForWallet.oauthProvider) {
+        return;
+    }
+    yield wallet.connector.connect(socialAccountDataForWallet.oauthProvider);
+});
+
+exports.reconnectSocialWallet = reconnectSocialWallet;

package/src/lib/utils/hooks/useWalletConnectors/reconnectSocialWallet.d.ts

@@ -0,0 +1,8 @@
+import { Wallet } from '../../../shared';
+/**
+ * This function will use a referenced account to kick off the social wallet
+ * authentication. This is useful in the multiwallet scenario where the user
+ * wants to set their disconnected social wallet as their primary wallet, in
+ * which case the wallet needs to be reconnected
+ */
+export declare const reconnectSocialWallet: (jwt: string | undefined, wallet: Wallet) => Promise<void>;

package/src/lib/utils/hooks/useWalletConnectors/reconnectSocialWallet.js

@@ -0,0 +1,33 @@
+import { __awaiter } from '../../../../../_virtual/_tslib.js';
+import { isSocialWalletConnector } from '@dynamic-labs/wallet-connector-core';
+import '../../constants/colors.js';
+import '@dynamic-labs/multi-wallet';
+import '@dynamic-labs/utils';
+import '@dynamic-labs/sdk-api';
+import '../../../shared/logger.js';
+import '@dynamic-labs/iconic';
+import 'react/jsx-runtime';
+import '../../../context/ViewContext/ViewContext.js';
+import 'react';
+import 'ethers';
+import { getReferencedAccount } from '../../functions/getReferencedAccount/getReferencedAccount.js';
+
+/**
+ * This function will use a referenced account to kick off the social wallet
+ * authentication. This is useful in the multiwallet scenario where the user
+ * wants to set their disconnected social wallet as their primary wallet, in
+ * which case the wallet needs to be reconnected
+ */
+const reconnectSocialWallet = (jwt, wallet) => __awaiter(void 0, void 0, void 0, function* () {
+    if (!isSocialWalletConnector(wallet.connector)) {
+        return;
+    }
+    const socialAccountDataForWallet = getReferencedAccount(jwt, wallet.id);
+    if (!socialAccountDataForWallet ||
+        !socialAccountDataForWallet.oauthProvider) {
+        return;
+    }
+    yield wallet.connector.connect(socialAccountDataForWallet.oauthProvider);
+});
+
+export { reconnectSocialWallet };

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

@@ -4,7 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _tslib = require('../../../../../_virtual/_tslib.cjs');
 var React = require('react');
-var multiWallet = require('@dynamic-labs/multi-wallet');
+var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
+var utils = require('@dynamic-labs/utils');
 var decodeJwt = require('../../../shared/utils/functions/decodeJwt/decodeJwt.cjs');
 var logger = require('../../../shared/logger.cjs');
 require('@dynamic-labs/iconic');
@@ -12,12 +13,15 @@ require('react/jsx-runtime');
 require('../../../context/ViewContext/ViewContext.cjs');
 var localStorage$1 = require('../../constants/localStorage.cjs');
 require('../../constants/colors.cjs');
+require('ethers');
 var useLocalStorage = require('../../../shared/utils/hooks/useLocalStorage/useLocalStorage.cjs');
 require('../../../shared/consts/index.cjs');
 var isWalletConnected = require('../../functions/isWalletConnected/isWalletConnected.cjs');
 var isSameWalletName = require('../../functions/isSameWalletName/isSameWalletName.cjs');
+require('@dynamic-labs/multi-wallet');
 require('@dynamic-labs/sdk-api');
 var shouldManuallyReconnectOnRefresh = require('../../functions/shouldManuallyReconnectOnRefresh/shouldManuallyReconnectOnRefresh.cjs');
+var reconnectSocialWallet = require('./reconnectSocialWallet.cjs');
 
 const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWalletWidgetState, setDesktopUri, setMultiWalletWidgetState, setQrcodeUri, }) => {
     const [showQrcodeModal, setShowQrcodeModal] = React.useState(false);
@@ -89,14 +93,12 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
     const getSelectedWallet = React.useCallback((walletId) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         const newWallet = wallets.find(({ id }) => id === walletId);
         if (!newWallet) {
-            throw new multiWallet.DynamicError(`Wallet with id: ${walletId} not found`);
+            throw new utils.DynamicError(`Wallet with id: ${walletId} not found`);
         }
         const connectedAccounts = yield newWallet.connector.getConnectedAccounts();
         return { connectedAccounts, newWallet };
     }), [wallets]);
-    const checkIfAccountChangeIsRequired = React.useCallback((primaryWallet, newPrimaryWallet) => {
-        if (!primaryWallet)
-            return;
+    const checkIfAccountChangeIsRequired = React.useCallback((primaryWallet, newPrimaryWallet, connectedAccounts) => {
         /**
          * we need to check multiWalletWidgetState here because `setPrimaryWallet` currently gets
          * called twice: once when the user clicks "make active" and once when the user performs
@@ -104,8 +106,12 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
          * (https://github.com/dynamic-labs/DynamicAuth/pull/550) is merged, since setting the
          * primary wallet will be simpler, so we won't need to call `setPrimaryWallet` twice.
          */
-        return (multiWalletWidgetState === 'idle' &&
-            isSameWalletName.isSameWalletName(newPrimaryWallet.connector.name, primaryWallet.connector.name));
+        if (!primaryWallet || multiWalletWidgetState !== 'idle')
+            return;
+        const accountIsNotConnectedInSecondaryWallet = connectedAccounts &&
+            !connectedAccounts.find((connectedAccount) => connectedAccount.toLowerCase() ===
+                newPrimaryWallet.address.toLowerCase());
+        return (isSameWalletName.isSameWalletName(newPrimaryWallet.connector.name, primaryWallet.connector.name) || accountIsNotConnectedInSecondaryWallet);
     }, [multiWalletWidgetState]);
     const checkIfShowQrCodeModal = React.useCallback((wallet) => !wallet.connector.isInstalledOnBrowser() &&
         !wallet.connector.canConnectViaCustodialService, []);
@@ -120,20 +126,26 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
             return;
         const primaryWallet = getPrimaryWallet();
         if (checkIfAccountChangeIsRequired(primaryWallet, newPrimaryWallet)) {
-            setMultiWalletWidgetState('awaiting_account_switch', 'switching_primary');
+            yield newPrimaryWallet.connector.connect();
+            setPrimaryWalletId(walletId);
             return;
         }
         if (!connectedAccounts.length) {
             setMultiWalletWidgetState('awaiting_connection');
             setShowQrcodeModal(checkIfShowQrCodeModal(newPrimaryWallet));
         }
-        if (multiWallet.isEmailWalletConnector(newPrimaryWallet.connector)) {
+        if (walletConnectorCore.isEmailWalletConnector(newPrimaryWallet.connector)) {
             const emailConnector = newPrimaryWallet.connector;
             const email = localStorage.getItem('magic-link-email');
             if (email) {
                 emailConnector.setEmail(email);
             }
         }
+        if (walletConnectorCore.isSocialWalletConnector(newPrimaryWallet.connector) &&
+            !newPrimaryWallet.connected) {
+            reconnectSocialWallet.reconnectSocialWallet(authToken, newPrimaryWallet);
+            return;
+        }
         /* istanbul ignore next */
         const publicAddress = yield newPrimaryWallet.connector.fetchPublicAddress({
             onDesktopUri: (uri) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
@@ -143,6 +155,15 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
                 setQrcodeUri(uri);
             }),
         });
+        /**
+         * need to check for connected account again for wallets that disconnect on refresh
+         *  and only reconnect upon fetching public address above
+         */
+        const updatedConnectedAccounts = yield newPrimaryWallet.connector.getConnectedAccounts();
+        if (checkIfAccountChangeIsRequired(primaryWallet, newPrimaryWallet, updatedConnectedAccounts)) {
+            setMultiWalletWidgetState('awaiting_account_switch', 'switching_primary');
+            return;
+        }
         if (publicAddress) {
             setPrimaryWalletId(walletId);
             setMultiWalletWidgetState('idle');
@@ -151,6 +172,7 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
             logger.logger.error('Failed to connect to wallet');
         }
     }), [
+        authToken,
         checkIfAccountChangeIsRequired,
         checkIfShowQrCodeModal,
         getPrimaryWallet,

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

@@ -1,6 +1,7 @@
 import { __awaiter } from '../../../../../_virtual/_tslib.js';
 import { useState, useCallback, useEffect } from 'react';
-import { DynamicError, isEmailWalletConnector } from '@dynamic-labs/multi-wallet';
+import { isEmailWalletConnector, isSocialWalletConnector } from '@dynamic-labs/wallet-connector-core';
+import { DynamicError } from '@dynamic-labs/utils';
 import { decodeJwt } from '../../../shared/utils/functions/decodeJwt/decodeJwt.js';
 import { logger } from '../../../shared/logger.js';
 import '@dynamic-labs/iconic';
@@ -8,12 +9,15 @@ import 'react/jsx-runtime';
 import '../../../context/ViewContext/ViewContext.js';
 import { PRIMARY_WALLET_ID } from '../../constants/localStorage.js';
 import '../../constants/colors.js';
+import 'ethers';
 import { useLocalStorage } from '../../../shared/utils/hooks/useLocalStorage/useLocalStorage.js';
 import '../../../shared/consts/index.js';
 import { isWalletConnected } from '../../functions/isWalletConnected/isWalletConnected.js';
 import { isSameWalletName } from '../../functions/isSameWalletName/isSameWalletName.js';
+import '@dynamic-labs/multi-wallet';
 import '@dynamic-labs/sdk-api';
 import { shouldManuallyReconnectOnRefresh } from '../../functions/shouldManuallyReconnectOnRefresh/shouldManuallyReconnectOnRefresh.js';
+import { reconnectSocialWallet } from './reconnectSocialWallet.js';
 
 const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWalletWidgetState, setDesktopUri, setMultiWalletWidgetState, setQrcodeUri, }) => {
     const [showQrcodeModal, setShowQrcodeModal] = useState(false);
@@ -90,9 +94,7 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
         const connectedAccounts = yield newWallet.connector.getConnectedAccounts();
         return { connectedAccounts, newWallet };
     }), [wallets]);
-    const checkIfAccountChangeIsRequired = useCallback((primaryWallet, newPrimaryWallet) => {
-        if (!primaryWallet)
-            return;
+    const checkIfAccountChangeIsRequired = useCallback((primaryWallet, newPrimaryWallet, connectedAccounts) => {
         /**
          * we need to check multiWalletWidgetState here because `setPrimaryWallet` currently gets
          * called twice: once when the user clicks "make active" and once when the user performs
@@ -100,8 +102,12 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
          * (https://github.com/dynamic-labs/DynamicAuth/pull/550) is merged, since setting the
          * primary wallet will be simpler, so we won't need to call `setPrimaryWallet` twice.
          */
-        return (multiWalletWidgetState === 'idle' &&
-            isSameWalletName(newPrimaryWallet.connector.name, primaryWallet.connector.name));
+        if (!primaryWallet || multiWalletWidgetState !== 'idle')
+            return;
+        const accountIsNotConnectedInSecondaryWallet = connectedAccounts &&
+            !connectedAccounts.find((connectedAccount) => connectedAccount.toLowerCase() ===
+                newPrimaryWallet.address.toLowerCase());
+        return (isSameWalletName(newPrimaryWallet.connector.name, primaryWallet.connector.name) || accountIsNotConnectedInSecondaryWallet);
     }, [multiWalletWidgetState]);
     const checkIfShowQrCodeModal = useCallback((wallet) => !wallet.connector.isInstalledOnBrowser() &&
         !wallet.connector.canConnectViaCustodialService, []);
@@ -116,7 +122,8 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
             return;
         const primaryWallet = getPrimaryWallet();
         if (checkIfAccountChangeIsRequired(primaryWallet, newPrimaryWallet)) {
-            setMultiWalletWidgetState('awaiting_account_switch', 'switching_primary');
+            yield newPrimaryWallet.connector.connect();
+            setPrimaryWalletId(walletId);
             return;
         }
         if (!connectedAccounts.length) {
@@ -130,6 +137,11 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
                 emailConnector.setEmail(email);
             }
         }
+        if (isSocialWalletConnector(newPrimaryWallet.connector) &&
+            !newPrimaryWallet.connected) {
+            reconnectSocialWallet(authToken, newPrimaryWallet);
+            return;
+        }
         /* istanbul ignore next */
         const publicAddress = yield newPrimaryWallet.connector.fetchPublicAddress({
             onDesktopUri: (uri) => __awaiter(void 0, void 0, void 0, function* () {
@@ -139,6 +151,15 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
                 setQrcodeUri(uri);
             }),
         });
+        /**
+         * need to check for connected account again for wallets that disconnect on refresh
+         *  and only reconnect upon fetching public address above
+         */
+        const updatedConnectedAccounts = yield newPrimaryWallet.connector.getConnectedAccounts();
+        if (checkIfAccountChangeIsRequired(primaryWallet, newPrimaryWallet, updatedConnectedAccounts)) {
+            setMultiWalletWidgetState('awaiting_account_switch', 'switching_primary');
+            return;
+        }
         if (publicAddress) {
             setPrimaryWalletId(walletId);
             setMultiWalletWidgetState('idle');
@@ -147,6 +168,7 @@ const useWalletConnectors = ({ authToken, wallets: availableWallets, multiWallet
             logger.error('Failed to connect to wallet');
         }
     }), [
+        authToken,
         checkIfAccountChangeIsRequired,
         checkIfShowQrCodeModal,
         getPrimaryWallet,