@dynamic-labs/sdk-react-core 2.0.0-alpha.22 → 2.0.0-alpha.23

package/src/lib/utils/constants/localStorage.cjs

@@ -16,7 +16,6 @@ const CONNECTED_WALLETS_INFO = 'dynamic_connected_wallets';
 const AUTH_MODE = 'dynamic_auth_mode';
 const CONNECTED_WALLET_NAME_SERVICE = 'dynamic_connected_wallet_ns';
 const BRIDGE_ONBOARDING_COMPLETED = 'dynamic_bridge_onboarding_completed';
-const IS_MULTI_WALLET_ENABLED = 'dynamic_multi_wallet_enabled';
 const DYNAMIC_CONTEXT_LAST_SESSION_SETTINGS = 'dynamic_context_session_settings';
 const WAGMI_LAST_SESSION_SETTINGS = 'dynamic_wagmi_session_settings';
 const EMBEDDED_WALLET_SESSION_SETTINGS = 'dynamic_embedded_wallet_session_settings';
@@ -33,7 +32,6 @@ exports.CONNECTED_WALLET_NAME_SERVICE = CONNECTED_WALLET_NAME_SERVICE;
 exports.DYNAMIC_CONTEXT_LAST_SESSION_SETTINGS = DYNAMIC_CONTEXT_LAST_SESSION_SETTINGS;
 exports.EMBEDDED_WALLET_SECURE_BANNER = EMBEDDED_WALLET_SECURE_BANNER;
 exports.EMBEDDED_WALLET_SESSION_SETTINGS = EMBEDDED_WALLET_SESSION_SETTINGS;
-exports.IS_MULTI_WALLET_ENABLED = IS_MULTI_WALLET_ENABLED;
 exports.LAST_USED_WALLET = LAST_USED_WALLET;
 exports.NETWORKS_STORAGE_KEY = NETWORKS_STORAGE_KEY;
 exports.NEWTOWEB3_WALLET_EXTENSION_FLAG_KEY = NEWTOWEB3_WALLET_EXTENSION_FLAG_KEY;

package/src/lib/utils/constants/localStorage.d.ts

@@ -13,7 +13,6 @@ export declare const CONNECTED_WALLETS_INFO = "dynamic_connected_wallets";
 export declare const AUTH_MODE = "dynamic_auth_mode";
 export declare const CONNECTED_WALLET_NAME_SERVICE = "dynamic_connected_wallet_ns";
 export declare const BRIDGE_ONBOARDING_COMPLETED = "dynamic_bridge_onboarding_completed";
-export declare const IS_MULTI_WALLET_ENABLED = "dynamic_multi_wallet_enabled";
 export declare const DYNAMIC_CONTEXT_LAST_SESSION_SETTINGS = "dynamic_context_session_settings";
 export declare const WAGMI_LAST_SESSION_SETTINGS = "dynamic_wagmi_session_settings";
 export declare const EMBEDDED_WALLET_SESSION_SETTINGS = "dynamic_embedded_wallet_session_settings";

package/src/lib/utils/constants/localStorage.js

@@ -12,11 +12,10 @@ const CONNECTED_WALLETS_INFO = 'dynamic_connected_wallets';
 const AUTH_MODE = 'dynamic_auth_mode';
 const CONNECTED_WALLET_NAME_SERVICE = 'dynamic_connected_wallet_ns';
 const BRIDGE_ONBOARDING_COMPLETED = 'dynamic_bridge_onboarding_completed';
-const IS_MULTI_WALLET_ENABLED = 'dynamic_multi_wallet_enabled';
 const DYNAMIC_CONTEXT_LAST_SESSION_SETTINGS = 'dynamic_context_session_settings';
 const WAGMI_LAST_SESSION_SETTINGS = 'dynamic_wagmi_session_settings';
 const EMBEDDED_WALLET_SESSION_SETTINGS = 'dynamic_embedded_wallet_session_settings';
 const EMBEDDED_WALLET_SECURE_BANNER = 'dynamic_embedded_secure_banner';
 const PHONE_INPUT_DEFAULT_COUNTRY = 'dynamic_phone_input_default_country';
 
-export { AUTH_MIN_TOKEN, AUTH_MODE, AUTH_TOKEN, AUTH_USER, BRIDGE_ONBOARDING_COMPLETED, CONNECTED_WALLETS_INFO, CONNECTED_WALLET_NAME_SERVICE, DYNAMIC_CONTEXT_LAST_SESSION_SETTINGS, EMBEDDED_WALLET_SECURE_BANNER, EMBEDDED_WALLET_SESSION_SETTINGS, IS_MULTI_WALLET_ENABLED, LAST_USED_WALLET, NETWORKS_STORAGE_KEY, NEWTOWEB3_WALLET_EXTENSION_FLAG_KEY, NONCE_STORAGE_KEY, PHONE_INPUT_DEFAULT_COUNTRY, PRIMARY_WALLET_ID, PROJECT_SETTINGS_STORAGE_KEY, WAGMI_LAST_SESSION_SETTINGS, WALLET_PICKER_SEARCH_KEY };
+export { AUTH_MIN_TOKEN, AUTH_MODE, AUTH_TOKEN, AUTH_USER, BRIDGE_ONBOARDING_COMPLETED, CONNECTED_WALLETS_INFO, CONNECTED_WALLET_NAME_SERVICE, DYNAMIC_CONTEXT_LAST_SESSION_SETTINGS, EMBEDDED_WALLET_SECURE_BANNER, EMBEDDED_WALLET_SESSION_SETTINGS, LAST_USED_WALLET, NETWORKS_STORAGE_KEY, NEWTOWEB3_WALLET_EXTENSION_FLAG_KEY, NONCE_STORAGE_KEY, PHONE_INPUT_DEFAULT_COUNTRY, PRIMARY_WALLET_ID, PROJECT_SETTINGS_STORAGE_KEY, WAGMI_LAST_SESSION_SETTINGS, WALLET_PICKER_SEARCH_KEY };

package/src/lib/utils/functions/getUserVerifiedCredentialType/getUserVerifiedCredentialType.cjs

@@ -5,21 +5,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
 /**
  * This will return a string which we can present to the user credential type
  * @param decodedJwt
- * @returns CredentialType | undefined
+ * @param type optional parameter to check for specific credential type
+ * @returns JwtVerifiedCredentialFormatEnum | undefined
  */
-const getUserVerifiedCredentialType = (decodedJwt) => {
-    var _a;
-    const verifiedCredential = (_a = decodedJwt.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find((credentials) => credentials.id === decodedJwt.lastVerifiedCredentialId);
-    if (!(verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.publicIdentifier)) {
-        return;
+const getUserVerifiedCredentialType = (decodedJwt, type) => {
+    var _a, _b, _c;
+    if (type) {
+        return (_b = (_a = decodedJwt.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find((credentials) => credentials.format === type)) === null || _b === void 0 ? void 0 : _b.format;
     }
-    if (verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.email) {
-        return 'email';
-    }
-    if (verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.phoneNumber) {
-        return 'phone';
-    }
-    return 'wallet';
+    const verifiedCredential = (_c = decodedJwt.verifiedCredentials) === null || _c === void 0 ? void 0 : _c.find((credentials) => credentials.id === decodedJwt.lastVerifiedCredentialId);
+    return verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.format;
 };
 
 exports.getUserVerifiedCredentialType = getUserVerifiedCredentialType;

package/src/lib/utils/functions/getUserVerifiedCredentialType/getUserVerifiedCredentialType.d.ts

@@ -1,9 +1,8 @@
-import { DynamicJwt } from '@dynamic-labs/sdk-api';
-type CredentialType = 'email' | 'phone' | 'wallet';
+import { DynamicJwt, JwtVerifiedCredentialFormatEnum } from '@dynamic-labs/sdk-api';
 /**
  * This will return a string which we can present to the user credential type
  * @param decodedJwt
- * @returns CredentialType | undefined
+ * @param type optional parameter to check for specific credential type
+ * @returns JwtVerifiedCredentialFormatEnum | undefined
  */
-export declare const getUserVerifiedCredentialType: (decodedJwt: DynamicJwt) => CredentialType | undefined;
-export {};
+export declare const getUserVerifiedCredentialType: (decodedJwt: DynamicJwt, type?: JwtVerifiedCredentialFormatEnum) => JwtVerifiedCredentialFormatEnum | undefined;

package/src/lib/utils/functions/getUserVerifiedCredentialType/getUserVerifiedCredentialType.js

@@ -1,21 +1,16 @@
 /**
  * This will return a string which we can present to the user credential type
  * @param decodedJwt
- * @returns CredentialType | undefined
+ * @param type optional parameter to check for specific credential type
+ * @returns JwtVerifiedCredentialFormatEnum | undefined
  */
-const getUserVerifiedCredentialType = (decodedJwt) => {
-    var _a;
-    const verifiedCredential = (_a = decodedJwt.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find((credentials) => credentials.id === decodedJwt.lastVerifiedCredentialId);
-    if (!(verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.publicIdentifier)) {
-        return;
+const getUserVerifiedCredentialType = (decodedJwt, type) => {
+    var _a, _b, _c;
+    if (type) {
+        return (_b = (_a = decodedJwt.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find((credentials) => credentials.format === type)) === null || _b === void 0 ? void 0 : _b.format;
     }
-    if (verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.email) {
-        return 'email';
-    }
-    if (verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.phoneNumber) {
-        return 'phone';
-    }
-    return 'wallet';
+    const verifiedCredential = (_c = decodedJwt.verifiedCredentials) === null || _c === void 0 ? void 0 : _c.find((credentials) => credentials.id === decodedJwt.lastVerifiedCredentialId);
+    return verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.format;
 };
 
 export { getUserVerifiedCredentialType };

package/src/lib/utils/functions/walletListBuilder/utils/getCalculatedOffset/getCalculatedOffset.cjs

@@ -2,16 +2,21 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('../../../../constants/colors.cjs');
+var values = require('../../../../constants/values.cjs');
 var findLastPriorityIndex = require('../findLastWalletIndex/findLastPriorityIndex.cjs');
 
 const getCalculatedOffset = ({ hasWalletFilter, defaultOffset, list, priorityList, }) => {
     const lastPriorityIndex = findLastPriorityIndex.findLastPriorityIndex(list, priorityList);
-    if (hasWalletFilter ||
-        list.length <= defaultOffset ||
-        lastPriorityIndex === -1) {
+    if (defaultOffset === values.DEFAULT_NUMBER_OF_WALLETS_TO_SHOW &&
+        !hasWalletFilter &&
+        list.length > defaultOffset &&
+        lastPriorityIndex !== -1) {
+        return lastPriorityIndex + 1;
+    }
+    else {
         return defaultOffset;
     }
-    return lastPriorityIndex + 1;
 };
 
 exports.getCalculatedOffset = getCalculatedOffset;

package/src/lib/utils/functions/walletListBuilder/utils/getCalculatedOffset/getCalculatedOffset.js

@@ -1,13 +1,18 @@
+import '../../../../constants/colors.js';
+import { DEFAULT_NUMBER_OF_WALLETS_TO_SHOW } from '../../../../constants/values.js';
 import { findLastPriorityIndex } from '../findLastWalletIndex/findLastPriorityIndex.js';
 
 const getCalculatedOffset = ({ hasWalletFilter, defaultOffset, list, priorityList, }) => {
     const lastPriorityIndex = findLastPriorityIndex(list, priorityList);
-    if (hasWalletFilter ||
-        list.length <= defaultOffset ||
-        lastPriorityIndex === -1) {
+    if (defaultOffset === DEFAULT_NUMBER_OF_WALLETS_TO_SHOW &&
+        !hasWalletFilter &&
+        list.length > defaultOffset &&
+        lastPriorityIndex !== -1) {
+        return lastPriorityIndex + 1;
+    }
+    else {
         return defaultOffset;
     }
-    return lastPriorityIndex + 1;
 };
 
 export { getCalculatedOffset };

package/src/lib/utils/functions/walletListBuilder/walletListBuilder.cjs

@@ -107,8 +107,10 @@ const walletListBuilder = ({ authMode, connectedWallets, multiWallet, numberOfWa
     const finalizedWalletList = groupWallets
         ? groupWalletOptions.groupWalletOptions(walletBook, walletsList)
         : walletsList;
+    // If a filter has been applied we want to add an offset to the number of wallets
+    // to include the installed and last used wallets
     const updatedNumberOfWalletsToShow = showMoreWalletsWithFilter && hasWalletFilter
-        ? calculateWithFilterNumberOfWalletsToShow(orderedInputList, firstPriorityWallets.concat(installedWallets), numberOfWalletsToShow)
+        ? calculateWalletOffsetBasedOnInstalledAndLastUsedWallets(orderedInputList, firstPriorityWallets.concat(installedWallets), numberOfWalletsToShow)
         : numberOfWalletsToShow;
     return {
         numberOfWallets: walletsList.length,
@@ -126,17 +128,24 @@ const orderAndFilterList = (walletList, walletsFilter, isWalletConnectList, reco
         return sortedWalletList;
     }
 };
+const KEEP_WALLETS_NAME_LIST = ['wallet connect'];
 const applySearchFilterToWalletOptionList = (rawSearchFilter, walletOptionList) => {
     const searchFilter = rawSearchFilter.trim().toLowerCase();
-    const cleanName = (name) => name
-        .trim()
-        .toLowerCase()
-        .replace('wallet', '')
-        .replace('evm', '')
-        .replace('starknet', '')
-        .replace('solana', '')
-        .replace('flow', '')
-        .replace('bitcoin', '');
+    const cleanName = (name) => {
+        const trimmedLowerName = name.trim().toLowerCase();
+        if (KEEP_WALLETS_NAME_LIST.includes(trimmedLowerName)) {
+            return trimmedLowerName;
+        }
+        else {
+            return trimmedLowerName
+                .replace('wallet', '')
+                .replace('evm', '')
+                .replace('starknet', '')
+                .replace('solana', '')
+                .replace('flow', '')
+                .replace('bitcoin', '');
+        }
+    };
     return walletOptionList.filter((walletOption) => {
         var _a;
         return cleanName(walletOption.name).includes(searchFilter) ||
@@ -167,19 +176,18 @@ const listToDisplay = (finalizedList, searchFilter, isWalletConnectList, numberO
     }
 };
 /**
- * When a filter is applied we would like to show the installed + last used wallets
- * in addition to the wallets that the filter has specified.
  * This calculation adds an offset to numberOfWalletsToShow so we will show the
  * intended wallets + installed and last used.
+ * We should would only apply the additonal offset if the installed wallets was not in the original list.
  *
  * For example:
  * we want to show 4 wallets: ['metamask', 'rainbow', 'walletconnect', 'coinbase']
  * and someone is using brave with installed phantom he should see
  * [ 'brave injected', phantom ,'metamask', 'rainbow', 'walletconnect', 'coinbase',]
- *
- * note — this should only apply to the WalletList view!
+ * And when someone is using metamask and coinbase they should see
+ * [ 'metamask', 'coinbase', 'rainbow', 'walletconnect']
  */
-const calculateWithFilterNumberOfWalletsToShow = (allWalletsOrdered, installedOrUsedWallets, numberOfWalletsToShow) => {
+const calculateWalletOffsetBasedOnInstalledAndLastUsedWallets = (allWalletsOrdered, installedOrUsedWallets, numberOfWalletsToShow) => {
     const filteredWallets = allWalletsOrdered.slice(0, numberOfWalletsToShow);
     const offset = installedOrUsedWallets.filter((wallet) => !filteredWallets.includes(wallet)).length;
     return numberOfWalletsToShow + offset;
@@ -199,4 +207,5 @@ const getSignWithEmailWallet = (signWithEmailWalletName, inputList) => {
 
 exports.PRIORITY_WALLET_LIST = PRIORITY_WALLET_LIST;
 exports.SIGN_IN_WITH_EMAIL_WALLET_NAME = SIGN_IN_WITH_EMAIL_WALLET_NAME;
+exports.calculateWalletOffsetBasedOnInstalledAndLastUsedWallets = calculateWalletOffsetBasedOnInstalledAndLastUsedWallets;
 exports.walletListBuilder = walletListBuilder;

package/src/lib/utils/functions/walletListBuilder/walletListBuilder.d.ts

@@ -24,4 +24,17 @@ type BuilderResult = {
 export declare const PRIORITY_WALLET_LIST: string[];
 export declare const SIGN_IN_WITH_EMAIL_WALLET_NAME = "Sign In With Email";
 export declare const walletListBuilder: ({ authMode, connectedWallets, multiWallet, numberOfWalletsToShow, inputList, isWalletConnectList, lastUsedWalletKey, signWithEmailWalletName, searchFilter, walletsFilter, loginWithEmail, groupWallets, walletBook, showMoreWalletsWithFilter, recommendedWallets, }: BuilderParams) => BuilderResult;
+/**
+ * This calculation adds an offset to numberOfWalletsToShow so we will show the
+ * intended wallets + installed and last used.
+ * We should would only apply the additonal offset if the installed wallets was not in the original list.
+ *
+ * For example:
+ * we want to show 4 wallets: ['metamask', 'rainbow', 'walletconnect', 'coinbase']
+ * and someone is using brave with installed phantom he should see
+ * [ 'brave injected', phantom ,'metamask', 'rainbow', 'walletconnect', 'coinbase',]
+ * And when someone is using metamask and coinbase they should see
+ * [ 'metamask', 'coinbase', 'rainbow', 'walletconnect']
+ */
+export declare const calculateWalletOffsetBasedOnInstalledAndLastUsedWallets: (allWalletsOrdered: WalletOption[], installedOrUsedWallets: WalletOption[], numberOfWalletsToShow: number) => number;
 export {};

package/src/lib/utils/functions/walletListBuilder/walletListBuilder.js

@@ -103,8 +103,10 @@ const walletListBuilder = ({ authMode, connectedWallets, multiWallet, numberOfWa
     const finalizedWalletList = groupWallets
         ? groupWalletOptions(walletBook, walletsList)
         : walletsList;
+    // If a filter has been applied we want to add an offset to the number of wallets
+    // to include the installed and last used wallets
     const updatedNumberOfWalletsToShow = showMoreWalletsWithFilter && hasWalletFilter
-        ? calculateWithFilterNumberOfWalletsToShow(orderedInputList, firstPriorityWallets.concat(installedWallets), numberOfWalletsToShow)
+        ? calculateWalletOffsetBasedOnInstalledAndLastUsedWallets(orderedInputList, firstPriorityWallets.concat(installedWallets), numberOfWalletsToShow)
         : numberOfWalletsToShow;
     return {
         numberOfWallets: walletsList.length,
@@ -122,17 +124,24 @@ const orderAndFilterList = (walletList, walletsFilter, isWalletConnectList, reco
         return sortedWalletList;
     }
 };
+const KEEP_WALLETS_NAME_LIST = ['wallet connect'];
 const applySearchFilterToWalletOptionList = (rawSearchFilter, walletOptionList) => {
     const searchFilter = rawSearchFilter.trim().toLowerCase();
-    const cleanName = (name) => name
-        .trim()
-        .toLowerCase()
-        .replace('wallet', '')
-        .replace('evm', '')
-        .replace('starknet', '')
-        .replace('solana', '')
-        .replace('flow', '')
-        .replace('bitcoin', '');
+    const cleanName = (name) => {
+        const trimmedLowerName = name.trim().toLowerCase();
+        if (KEEP_WALLETS_NAME_LIST.includes(trimmedLowerName)) {
+            return trimmedLowerName;
+        }
+        else {
+            return trimmedLowerName
+                .replace('wallet', '')
+                .replace('evm', '')
+                .replace('starknet', '')
+                .replace('solana', '')
+                .replace('flow', '')
+                .replace('bitcoin', '');
+        }
+    };
     return walletOptionList.filter((walletOption) => {
         var _a;
         return cleanName(walletOption.name).includes(searchFilter) ||
@@ -163,19 +172,18 @@ const listToDisplay = (finalizedList, searchFilter, isWalletConnectList, numberO
     }
 };
 /**
- * When a filter is applied we would like to show the installed + last used wallets
- * in addition to the wallets that the filter has specified.
  * This calculation adds an offset to numberOfWalletsToShow so we will show the
  * intended wallets + installed and last used.
+ * We should would only apply the additonal offset if the installed wallets was not in the original list.
  *
  * For example:
  * we want to show 4 wallets: ['metamask', 'rainbow', 'walletconnect', 'coinbase']
  * and someone is using brave with installed phantom he should see
  * [ 'brave injected', phantom ,'metamask', 'rainbow', 'walletconnect', 'coinbase',]
- *
- * note — this should only apply to the WalletList view!
+ * And when someone is using metamask and coinbase they should see
+ * [ 'metamask', 'coinbase', 'rainbow', 'walletconnect']
  */
-const calculateWithFilterNumberOfWalletsToShow = (allWalletsOrdered, installedOrUsedWallets, numberOfWalletsToShow) => {
+const calculateWalletOffsetBasedOnInstalledAndLastUsedWallets = (allWalletsOrdered, installedOrUsedWallets, numberOfWalletsToShow) => {
     const filteredWallets = allWalletsOrdered.slice(0, numberOfWalletsToShow);
     const offset = installedOrUsedWallets.filter((wallet) => !filteredWallets.includes(wallet)).length;
     return numberOfWalletsToShow + offset;
@@ -193,4 +201,4 @@ const getSignWithEmailWallet = (signWithEmailWalletName, inputList) => {
     return walletOverride;
 };
 
-export { PRIORITY_WALLET_LIST, SIGN_IN_WITH_EMAIL_WALLET_NAME, walletListBuilder };
+export { PRIORITY_WALLET_LIST, SIGN_IN_WITH_EMAIL_WALLET_NAME, calculateWalletOffsetBasedOnInstalledAndLastUsedWallets, walletListBuilder };

package/src/lib/utils/hooks/authenticationHooks/useConnectAndSignSplitSteps/useConnectAndSignSplitSteps.cjs

@@ -23,6 +23,8 @@ require('../../../../events/dynamicEvents.cjs');
 var ErrorContext = require('../../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
 require('react-international-phone');
+var isProgrammableNetworkSwitchSupported = require('../../../functions/isProgrammableNetworkSwitchSupported/isProgrammableNetworkSwitchSupported.cjs');
+var isSupportedNetwork = require('../../../functions/isSupportedNetwork/isSupportedNetwork.cjs');
 require('viem');
 require('viem/chains');
 require('../../../../config/ApiEndpoint.cjs');
@@ -82,7 +84,7 @@ const useConnectAndSignSplitSteps = () => {
     const { setView, goToInitialView } = ViewContext.useViewContext();
     const { setErrorMessage } = ErrorContext.useErrorContext();
     const { getCaptchaToken, engageCaptcha } = CaptchaContext.useCaptchaContext();
-    const { connectWallet, consumeNonce, displaySiweStatement, projectSettings, environmentId, setIsSingleWalletAccount, setShowAuthFlow, user, authMode, setIsVerificationInProgress, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { connectWallet, consumeNonce, displaySiweStatement, projectSettings, environmentId, networkValidationMode, setIsSingleWalletAccount, setShowAuthFlow, user, authMode, setIsVerificationInProgress, } = useInternalDynamicContext.useInternalDynamicContext();
     const { handleWalletsToConnect } = useHandleWalletsToConnect.useHandleWalletsToConnect();
     const verifyWallet = useVerifyWallet.useVerifyWallet({
         consumeNonce,
@@ -151,6 +153,19 @@ const useConnectAndSignSplitSteps = () => {
             if (!(connectionResult === null || connectionResult === void 0 ? void 0 : connectionResult.address)) {
                 return;
             }
+            const walletNetwork = yield walletConnector.getNetwork();
+            const usesSupportedNetwork = isSupportedNetwork.isSupportedNetwork({
+                network: walletNetwork,
+                walletConnector,
+            });
+            const isNetworkValidationEnabledForSignIn = networkValidationMode === 'always' ||
+                networkValidationMode === 'sign-in';
+            if (!usesSupportedNetwork && isNetworkValidationEnabledForSignIn) {
+                if (!isProgrammableNetworkSwitchSupported.isProgrammableNetworkSwitchSupported(walletConnector)) {
+                    return setView('network-not-supported-manual');
+                }
+                return setView('network-not-supported');
+            }
             yield verifyWallet({
                 captchaToken: getCaptchaToken(),
                 publicWalletAddress: connectionResult.address,

package/src/lib/utils/hooks/authenticationHooks/useConnectAndSignSplitSteps/useConnectAndSignSplitSteps.js

@@ -19,6 +19,8 @@ import '../../../../events/dynamicEvents.js';
 import { useErrorContext } from '../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
 import 'react-international-phone';
+import { isProgrammableNetworkSwitchSupported } from '../../../functions/isProgrammableNetworkSwitchSupported/isProgrammableNetworkSwitchSupported.js';
+import { isSupportedNetwork } from '../../../functions/isSupportedNetwork/isSupportedNetwork.js';
 import 'viem';
 import 'viem/chains';
 import '../../../../config/ApiEndpoint.js';
@@ -78,7 +80,7 @@ const useConnectAndSignSplitSteps = () => {
     const { setView, goToInitialView } = useViewContext();
     const { setErrorMessage } = useErrorContext();
     const { getCaptchaToken, engageCaptcha } = useCaptchaContext();
-    const { connectWallet, consumeNonce, displaySiweStatement, projectSettings, environmentId, setIsSingleWalletAccount, setShowAuthFlow, user, authMode, setIsVerificationInProgress, } = useInternalDynamicContext();
+    const { connectWallet, consumeNonce, displaySiweStatement, projectSettings, environmentId, networkValidationMode, setIsSingleWalletAccount, setShowAuthFlow, user, authMode, setIsVerificationInProgress, } = useInternalDynamicContext();
     const { handleWalletsToConnect } = useHandleWalletsToConnect();
     const verifyWallet = useVerifyWallet({
         consumeNonce,
@@ -147,6 +149,19 @@ const useConnectAndSignSplitSteps = () => {
             if (!(connectionResult === null || connectionResult === void 0 ? void 0 : connectionResult.address)) {
                 return;
             }
+            const walletNetwork = yield walletConnector.getNetwork();
+            const usesSupportedNetwork = isSupportedNetwork({
+                network: walletNetwork,
+                walletConnector,
+            });
+            const isNetworkValidationEnabledForSignIn = networkValidationMode === 'always' ||
+                networkValidationMode === 'sign-in';
+            if (!usesSupportedNetwork && isNetworkValidationEnabledForSignIn) {
+                if (!isProgrammableNetworkSwitchSupported(walletConnector)) {
+                    return setView('network-not-supported-manual');
+                }
+                return setView('network-not-supported');
+            }
             yield verifyWallet({
                 captchaToken: getCaptchaToken(),
                 publicWalletAddress: connectionResult.address,

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

@@ -187,9 +187,11 @@ const useAuthLayoutChecks = () => {
         view.type === 'farcaster-connect-view' ||
         (view.type === 'merge-user-accounts' && !user);
     const showDefaultFooter = !showConnectedWalletProgress && !showDynamicFooter && !showToSFooter;
+    const shouldHideDynamicFooterSeparator = showDynamicFooter && showToSFooter;
     return {
         displayBorderBelowHeader,
         isWalletListTypeView,
+        shouldHideDynamicFooterSeparator,
         showBackButton,
         showCloseButton,
         showConnectedWalletProgress,

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

@@ -1,6 +1,7 @@
 export declare const useAuthLayoutChecks: () => {
     displayBorderBelowHeader: boolean;
     isWalletListTypeView: boolean;
+    shouldHideDynamicFooterSeparator: boolean;
     showBackButton: boolean;
     showCloseButton: boolean;
     showConnectedWalletProgress: boolean;

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

@@ -183,9 +183,11 @@ const useAuthLayoutChecks = () => {
         view.type === 'farcaster-connect-view' ||
         (view.type === 'merge-user-accounts' && !user);
     const showDefaultFooter = !showConnectedWalletProgress && !showDynamicFooter && !showToSFooter;
+    const shouldHideDynamicFooterSeparator = showDynamicFooter && showToSFooter;
     return {
         displayBorderBelowHeader,
         isWalletListTypeView,
+        shouldHideDynamicFooterSeparator,
         showBackButton,
         showCloseButton,
         showConnectedWalletProgress,

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

@@ -218,10 +218,18 @@ const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingO
                 return;
             }
         }
+        // On connect and sign, we don't want to add this wallet to userWallets
+        // until it has been signed. Therefore, we don't add it to
+        // the connectedWallets array because userWallets draws from it.
+        // In this scenario we only need the wallet address, since the id will come from somewhere else.
+        // In fact, there is a refactor planned to never use the connect-wallet-X ids anymore:
+        // https://linear.app/dynamic-labs/issue/QNTM-784/rework-the-way-we-compute-wallet-ids
+        if (!isConnectOnly.isConnectOnly(user, authMode))
+            return { address: walletAddress, id: '' };
         const walletId = `connect-wallet-${getNextIdAvailable(connectedWalletsInfo)}`;
         // We are already using the new syntax for wallet ids for this.
         // Eventually the connect-wallet-X syntax will be dropped
-        if (raiseOnConnect && isConnectOnly.isConnectOnly(user, authMode))
+        if (raiseOnConnect)
             onConnectWaitList.current.add(getWalletIdentifier.getWalletIdentifier({
                 address: walletAddress,
                 connector: walletConnector,

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

@@ -214,10 +214,18 @@ const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingO
                 return;
             }
         }
+        // On connect and sign, we don't want to add this wallet to userWallets
+        // until it has been signed. Therefore, we don't add it to
+        // the connectedWallets array because userWallets draws from it.
+        // In this scenario we only need the wallet address, since the id will come from somewhere else.
+        // In fact, there is a refactor planned to never use the connect-wallet-X ids anymore:
+        // https://linear.app/dynamic-labs/issue/QNTM-784/rework-the-way-we-compute-wallet-ids
+        if (!isConnectOnly(user, authMode))
+            return { address: walletAddress, id: '' };
         const walletId = `connect-wallet-${getNextIdAvailable(connectedWalletsInfo)}`;
         // We are already using the new syntax for wallet ids for this.
         // Eventually the connect-wallet-X syntax will be dropped
-        if (raiseOnConnect && isConnectOnly(user, authMode))
+        if (raiseOnConnect)
             onConnectWaitList.current.add(getWalletIdentifier({
                 address: walletAddress,
                 connector: walletConnector,

package/src/lib/utils/hooks/useEmbeddedWallet/useTurnkey/useTurnkey.cjs

@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _tslib = require('../../../../../../_virtual/_tslib.cjs');
 var React = require('react');
+var sdkApi = require('@dynamic-labs/sdk-api');
 require('../../../../context/DynamicContext/DynamicContext.cjs');
 var decodeJwt = require('../../../../shared/utils/functions/decodeJwt/decodeJwt.cjs');
 require('@dynamic-labs/iconic');
@@ -15,7 +16,6 @@ require('@dynamic-labs/wallet-book');
 require('../../../constants/colors.cjs');
 require('../../../constants/values.cjs');
 require('../../../../shared/utils/classes/storage/localStorage.cjs');
-require('@dynamic-labs/sdk-api');
 require('@dynamic-labs/utils');
 require('../../../../shared/consts/index.cjs');
 var dynamicEvents = require('../../../../events/dynamicEvents.cjs');
@@ -163,12 +163,12 @@ const useTurnkey = () => {
         const userWaletsCredentials = getUserWalletsFromVerifiedCredentials.getUserWalletsFromVerifiedCredentials(jwt);
         // if user doesn't have a wallet yet,
         if (!(userWaletsCredentials === null || userWaletsCredentials === void 0 ? void 0 : userWaletsCredentials.length)) {
-            const credentialType = getUserVerifiedCredentialType.getUserVerifiedCredentialType(decodedJwt);
+            const hasEmailVC = getUserVerifiedCredentialType.getUserVerifiedCredentialType(decodedJwt, sdkApi.JwtVerifiedCredentialFormatEnum.Email);
             // create wallet without authenticator
-            // if users log in with sms they won't be able to use passkey recovery
+            // if users log in and doesn't have an email vc they won't be able to use passkey recovery
             // and it means that they need to create it while creating a wallet
             if (!((_e = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.embeddedWallets) === null || _e === void 0 ? void 0 : _e.forceAuthenticatorAtSignup) &&
-                credentialType !== 'phone') {
+                Boolean(hasEmailVC)) {
                 return startPregeneratedWalletCreationFlow(jwt, decodedJwt);
             }
             // show the passkey view to create an embedded wallet

package/src/lib/utils/hooks/useEmbeddedWallet/useTurnkey/useTurnkey.js

@@ -1,5 +1,6 @@
 import { __awaiter } from '../../../../../../_virtual/_tslib.js';
 import { useCallback } from 'react';
+import { JwtVerifiedCredentialFormatEnum } from '@dynamic-labs/sdk-api';
 import '../../../../context/DynamicContext/DynamicContext.js';
 import { decodeJwt } from '../../../../shared/utils/functions/decodeJwt/decodeJwt.js';
 import '@dynamic-labs/iconic';
@@ -11,7 +12,6 @@ import '@dynamic-labs/wallet-book';
 import '../../../constants/colors.js';
 import '../../../constants/values.js';
 import '../../../../shared/utils/classes/storage/localStorage.js';
-import '@dynamic-labs/sdk-api';
 import '@dynamic-labs/utils';
 import '../../../../shared/consts/index.js';
 import { dynamicEvents } from '../../../../events/dynamicEvents.js';
@@ -159,12 +159,12 @@ const useTurnkey = () => {
         const userWaletsCredentials = getUserWalletsFromVerifiedCredentials(jwt);
         // if user doesn't have a wallet yet,
         if (!(userWaletsCredentials === null || userWaletsCredentials === void 0 ? void 0 : userWaletsCredentials.length)) {
-            const credentialType = getUserVerifiedCredentialType(decodedJwt);
+            const hasEmailVC = getUserVerifiedCredentialType(decodedJwt, JwtVerifiedCredentialFormatEnum.Email);
             // create wallet without authenticator
-            // if users log in with sms they won't be able to use passkey recovery
+            // if users log in and doesn't have an email vc they won't be able to use passkey recovery
             // and it means that they need to create it while creating a wallet
             if (!((_e = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.embeddedWallets) === null || _e === void 0 ? void 0 : _e.forceAuthenticatorAtSignup) &&
-                credentialType !== 'phone') {
+                Boolean(hasEmailVC)) {
                 return startPregeneratedWalletCreationFlow(jwt, decodedJwt);
             }
             // show the passkey view to create an embedded wallet

package/src/lib/views/AccountExistsView/AccountExistsView.cjs

@@ -46,12 +46,12 @@ require('@dynamic-labs/rpc-providers');
 require('../../context/UserWalletsContext/UserWalletsContext.cjs');
 require('i18next');
 var Typography = require('../../components/Typography/Typography.cjs');
+require('../../context/FooterAnimationContext/index.cjs');
 require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 require('../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
-require('../../context/FooterAnimationContext/index.cjs');
 var SocialRedirectContext = require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');

package/src/lib/views/AccountExistsView/AccountExistsView.js

@@ -42,12 +42,12 @@ import '@dynamic-labs/rpc-providers';
 import '../../context/UserWalletsContext/UserWalletsContext.js';
 import 'i18next';
 import { Typography } from '../../components/Typography/Typography.js';
+import '../../context/FooterAnimationContext/index.js';
 import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../components/Transition/OpacityTransition/OpacityTransition.js';
 import '../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
-import '../../context/FooterAnimationContext/index.js';
 import { useSocialRedirectContext } from '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';

package/src/lib/views/CaptchaVerifyUser/CaptchaVerifyUser.cjs

@@ -42,12 +42,12 @@ require('@dynamic-labs/rpc-providers');
 require('../../context/UserWalletsContext/UserWalletsContext.cjs');
 require('i18next');
 var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
+require('../../context/FooterAnimationContext/index.cjs');
 require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 require('../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
-require('../../context/FooterAnimationContext/index.cjs');
 require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');

package/src/lib/views/CaptchaVerifyUser/CaptchaVerifyUser.js

@@ -38,12 +38,12 @@ import '@dynamic-labs/rpc-providers';
 import '../../context/UserWalletsContext/UserWalletsContext.js';
 import 'i18next';
 import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
+import '../../context/FooterAnimationContext/index.js';
 import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../components/Transition/OpacityTransition/OpacityTransition.js';
 import '../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
-import '../../context/FooterAnimationContext/index.js';
 import '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';