@dynamic-labs/sdk-react-core 2.1.0-alpha.17 → 2.1.0-alpha.19

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

@@ -0,0 +1,127 @@
+'use client'
+import { useCallback } from 'react';
+import { useViewContext } from '../../../context/ViewContext/ViewContext.js';
+import '../../../context/DynamicContext/DynamicContext.js';
+import '@dynamic-labs/sdk-api-core';
+import '../../../shared/logger.js';
+import '@dynamic-labs/iconic';
+import '@dynamic-labs/wallet-connector-core';
+import 'react/jsx-runtime';
+import '@dynamic-labs/wallet-book';
+import '../../constants/colors.js';
+import '../../constants/values.js';
+import '../../../shared/utils/classes/storage/localStorage.js';
+import '@dynamic-labs/utils';
+import '../../../shared/consts/index.js';
+import '../../../events/dynamicEvents.js';
+import '../../../../../_virtual/_tslib.js';
+import '../../../context/CaptchaContext/CaptchaContext.js';
+import '../../../context/ErrorContext/ErrorContext.js';
+import '@dynamic-labs/multi-wallet';
+import 'react-international-phone';
+import 'viem';
+import 'viem/chains';
+import '../../../config/ApiEndpoint.js';
+import '../../../locale/locale.js';
+import '../../../context/AccessDeniedContext/AccessDeniedContext.js';
+import '../../../context/AccountExistsContext/AccountExistsContext.js';
+import '../../../context/UserWalletsContext/UserWalletsContext.js';
+import '../../../context/VerificationContext/VerificationContext.js';
+import 'react-dom';
+import '../../../context/WalletContext/WalletContext.js';
+import '../../../context/ThemeContext/ThemeContext.js';
+import '@dynamic-labs/types';
+import '../../../context/LoadingContext/LoadingContext.js';
+import 'yup';
+import '../../../context/MockContext/MockContext.js';
+import 'react-i18next';
+import '../../../context/FieldsStateContext/FieldsStateContext.js';
+import '../useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
+import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
+import '@dynamic-labs/rpc-providers';
+import '../../../components/Alert/Alert.js';
+import '../../../components/ShadowDOM/ShadowDOM.js';
+import '../../../components/IconButton/IconButton.js';
+import '../../../components/InlineWidget/InlineWidget.js';
+import '../../../components/Input/Input.js';
+import '../../../components/IsBrowser/IsBrowser.js';
+import '../../../components/MenuList/Dropdown/Dropdown.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 '../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
+import '../../../components/Popper/Popper/Popper.js';
+import '../../../components/Popper/PopperContext/PopperContext.js';
+import 'react-focus-lock';
+import 'qrcode';
+import 'formik';
+import '../../../views/WalletList/WalletList.js';
+import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
+import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '@hcaptcha/react-hcaptcha';
+import '../../../context/FooterAnimationContext/index.js';
+import '../../../views/LoginView/sections/PhoneNumberSignInSection/PhoneNumberSignInSection.js';
+import '../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../../context/PasskeyContext/PasskeyContext.js';
+import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
+import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
+import '../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
+import '../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.js';
+
+const useMfaModals = () => {
+    var _a;
+    const { setShowAuthFlow, projectSettings } = useInternalDynamicContext();
+    const { setView } = useViewContext();
+    const isMfaEnabled = (_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.mfa) === null || _a === void 0 ? void 0 : _a.enabled;
+    const setShowMfaChooseType = useCallback((value) => {
+        if (value) {
+            if (!isMfaEnabled)
+                return;
+            setView('mfa-choose-device');
+        }
+        setShowAuthFlow(value, { emitCancelAuth: true });
+    }, [isMfaEnabled, setShowAuthFlow, setView]);
+    const setShowMfaQRCode = useCallback((value) => {
+        if (value) {
+            if (!isMfaEnabled)
+                return;
+            setView('mfa-secure-device');
+        }
+        setShowAuthFlow(value, { emitCancelAuth: true });
+    }, [isMfaEnabled, setShowAuthFlow, setView]);
+    const setShowOTPVerification = useCallback((value) => {
+        if (value) {
+            if (!isMfaEnabled)
+                return;
+            setView('mfa-verification');
+        }
+        setShowAuthFlow(value, { emitCancelAuth: true });
+    }, [isMfaEnabled, setShowAuthFlow, setView]);
+    const setShowMfaViewBackupCodes = useCallback((value) => {
+        if (value) {
+            if (!isMfaEnabled)
+                return;
+            setView('mfa-display-backup-codes');
+        }
+        setShowAuthFlow(value, { emitCancelAuth: true });
+    }, [isMfaEnabled, setShowAuthFlow, setView]);
+    const setShowMfaEnterBackupCodes = useCallback((value) => {
+        if (value) {
+            if (!isMfaEnabled)
+                return;
+            setView('mfa-recovery');
+        }
+        setShowAuthFlow(value, { emitCancelAuth: true });
+    }, [isMfaEnabled, setShowAuthFlow, setView]);
+    return {
+        setShowMfaChooseType,
+        setShowMfaEnterBackupCodes,
+        setShowMfaQRCode,
+        setShowMfaViewBackupCodes,
+        setShowOTPVerification,
+    };
+};
+
+export { useMfaModals };

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

@@ -26,6 +26,7 @@ require('../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
 require('react-international-phone');
 var index = require('../../functions/getEnabledOAuthProviders/index.cjs');
+var getEnabledSocialSignInProvidersAsProviderEnum = require('../../functions/getEnabledSocialSignInProvidersAsProviderEnum/getEnabledSocialSignInProvidersAsProviderEnum.cjs');
 var isSocialKycEnabled = require('../../functions/isSocialKycEnabled/isSocialKycEnabled.cjs');
 require('viem');
 require('viem/chains');
@@ -88,11 +89,9 @@ const useSocialAccounts = ({ sessionTimeout } = {
     const { setView } = ViewContext.useViewContext();
     const { updateUserProfileByJWT } = useUpdateUserProfileByJWTCallback.useUpdateUserProfileByJWTCallback();
     const { handleError, setError, setIsProcessing, checkValidProvider, error, isProcessing, connectSocialAccount, } = useSocialAuth.useSocialAuth({
-        authMode: 'link',
         onFarcasterUrl: (url) => setView('farcaster-connect-view', { url }),
         sessionTimeout,
     });
-    const oauthProviders = index.getEnabledOAuthProviders(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers);
     const verifiedOAuthCredentialsMap = React.useMemo(() => {
         var _a, _b;
         const verifiedOAuthCredential = (_b = (_a = user === null || user === void 0 ? void 0 : user.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.filter((credential) => credential.format === 'oauth')) !== null && _b !== void 0 ? _b : [];
@@ -114,6 +113,7 @@ const useSocialAccounts = ({ sessionTimeout } = {
             handleError(types.SocialOAuthErrorCode.ACCOUNT_ALREADY_LINKED, `Account already linked for provider: ${provider}`);
             return false;
         }
+        const oauthProviders = index.getEnabledOAuthProviders(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers);
         const oauthProvider = oauthProviders.find((p) => p.provider === provider);
         if (!oauthProvider) {
             handleError(types.SocialOAuthErrorCode.PROVIDER_NOT_ENABLED, `Provider is not enabled on the dashboard: ${provider}`);
@@ -122,7 +122,11 @@ const useSocialAccounts = ({ sessionTimeout } = {
         return true;
     };
     const linkSocialAccount = (provider) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        connectSocialAccount({ provider, validator: checkValidOAuthLinking });
+        connectSocialAccount({
+            authMode: 'link',
+            provider,
+            validator: checkValidOAuthLinking,
+        });
     });
     const unlinkSocialAccount = (provider) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         var _a;
@@ -172,12 +176,29 @@ const useSocialAccounts = ({ sessionTimeout } = {
             username: oauthUsername,
         };
     };
+    const checkValidOAuthSignIn = (provider) => {
+        var _a;
+        const oauthProvider = getEnabledSocialSignInProvidersAsProviderEnum.getEnabledSocialSignInProvidersAsProviderEnum((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.socialSignIn) === null || _a === void 0 ? void 0 : _a.providers).find((socialProvider) => socialProvider === provider);
+        if (!oauthProvider) {
+            handleError(types.SocialOAuthErrorCode.PROVIDER_NOT_ENABLED, `Provider is not enabled for sign-in on the dashboard: ${provider}`);
+            return false;
+        }
+        return true;
+    };
+    const signInWithSocialAccount = (provider) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        connectSocialAccount({
+            authMode: 'signin',
+            provider,
+            validator: checkValidOAuthSignIn,
+        });
+    });
     return {
         error,
         getLinkedAccountInformation,
         isLinked,
         isProcessing,
         linkSocialAccount,
+        signInWithSocialAccount,
         unlinkSocialAccount,
     };
 };

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

@@ -9,6 +9,7 @@ export declare const useSocialAccounts: ({ sessionTimeout }?: UseSocialAccountsP
     readonly isLinked: (provider: ProviderEnum) => boolean;
     readonly isProcessing: boolean;
     readonly linkSocialAccount: (provider: ProviderEnum) => Promise<void>;
+    readonly signInWithSocialAccount: (provider: ProviderEnum) => Promise<void>;
     readonly unlinkSocialAccount: (provider: ProviderEnum) => Promise<void>;
 };
 export {};

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

@@ -22,6 +22,7 @@ import '../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
 import 'react-international-phone';
 import { getEnabledOAuthProviders } from '../../functions/getEnabledOAuthProviders/index.js';
+import { getEnabledSocialSignInProvidersAsProviderEnum } from '../../functions/getEnabledSocialSignInProvidersAsProviderEnum/getEnabledSocialSignInProvidersAsProviderEnum.js';
 import { isSocialKycEnabled } from '../../functions/isSocialKycEnabled/isSocialKycEnabled.js';
 import 'viem';
 import 'viem/chains';
@@ -84,11 +85,9 @@ const useSocialAccounts = ({ sessionTimeout } = {
     const { setView } = useViewContext();
     const { updateUserProfileByJWT } = useUpdateUserProfileByJWTCallback();
     const { handleError, setError, setIsProcessing, checkValidProvider, error, isProcessing, connectSocialAccount, } = useSocialAuth({
-        authMode: 'link',
         onFarcasterUrl: (url) => setView('farcaster-connect-view', { url }),
         sessionTimeout,
     });
-    const oauthProviders = getEnabledOAuthProviders(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers);
     const verifiedOAuthCredentialsMap = useMemo(() => {
         var _a, _b;
         const verifiedOAuthCredential = (_b = (_a = user === null || user === void 0 ? void 0 : user.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.filter((credential) => credential.format === 'oauth')) !== null && _b !== void 0 ? _b : [];
@@ -110,6 +109,7 @@ const useSocialAccounts = ({ sessionTimeout } = {
             handleError(SocialOAuthErrorCode.ACCOUNT_ALREADY_LINKED, `Account already linked for provider: ${provider}`);
             return false;
         }
+        const oauthProviders = getEnabledOAuthProviders(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers);
         const oauthProvider = oauthProviders.find((p) => p.provider === provider);
         if (!oauthProvider) {
             handleError(SocialOAuthErrorCode.PROVIDER_NOT_ENABLED, `Provider is not enabled on the dashboard: ${provider}`);
@@ -118,7 +118,11 @@ const useSocialAccounts = ({ sessionTimeout } = {
         return true;
     };
     const linkSocialAccount = (provider) => __awaiter(void 0, void 0, void 0, function* () {
-        connectSocialAccount({ provider, validator: checkValidOAuthLinking });
+        connectSocialAccount({
+            authMode: 'link',
+            provider,
+            validator: checkValidOAuthLinking,
+        });
     });
     const unlinkSocialAccount = (provider) => __awaiter(void 0, void 0, void 0, function* () {
         var _a;
@@ -168,12 +172,29 @@ const useSocialAccounts = ({ sessionTimeout } = {
             username: oauthUsername,
         };
     };
+    const checkValidOAuthSignIn = (provider) => {
+        var _a;
+        const oauthProvider = getEnabledSocialSignInProvidersAsProviderEnum((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.socialSignIn) === null || _a === void 0 ? void 0 : _a.providers).find((socialProvider) => socialProvider === provider);
+        if (!oauthProvider) {
+            handleError(SocialOAuthErrorCode.PROVIDER_NOT_ENABLED, `Provider is not enabled for sign-in on the dashboard: ${provider}`);
+            return false;
+        }
+        return true;
+    };
+    const signInWithSocialAccount = (provider) => __awaiter(void 0, void 0, void 0, function* () {
+        connectSocialAccount({
+            authMode: 'signin',
+            provider,
+            validator: checkValidOAuthSignIn,
+        });
+    });
     return {
         error,
         getLinkedAccountInformation,
         isLinked,
         isProcessing,
         linkSocialAccount,
+        signInWithSocialAccount,
         unlinkSocialAccount,
     };
 };

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

@@ -101,7 +101,7 @@ const socialProviders = [
 const providersRequiringPkce = ['twitter', 'github'];
 const providersWithoutWindowOpenerRefence = ['twitter'];
 // Hook to handle common social auth logic (for social linking and social sign in)
-const useSocialAuth = ({ sessionTimeout, authMode, onSettled, onError, onFarcasterUrl, }) => {
+const useSocialAuth = ({ sessionTimeout, onSettled, onError, onFarcasterUrl, }) => {
     const { environmentId, setShowAuthFlow, projectSettings, consumeNonce, redirectUrl, } = useInternalDynamicContext.useInternalDynamicContext();
     const { setErrorMessage, setError: setContextError } = ErrorContext.useErrorContext();
     const { updateUserProfileByJWT } = useUpdateUserProfileByJWTCallback.useUpdateUserProfileByJWTCallback();
@@ -180,11 +180,15 @@ const useSocialAuth = ({ sessionTimeout, authMode, onSettled, onError, onFarcast
             verifyFunction: () => apiCall(),
         });
     });
-    const connectSocialAccount = (_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ provider, validator, captchaToken, }) {
+    const connectSocialAccount = (_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ authMode, provider, validator, captchaToken, }) {
         var _b, _c;
         clearInterval(authWindowInterval.current);
         clearError();
         setIsProcessing(true);
+        if (!authMode) {
+            logger.logger.error('Auth mode is required. Please use either "link" or "signin"');
+            return;
+        }
         if (!checkValidProvider(provider)) {
             return;
         }
@@ -193,7 +197,7 @@ const useSocialAuth = ({ sessionTimeout, authMode, onSettled, onError, onFarcast
             return;
         }
         if (provider === sdkApiCore.ProviderEnum.Farcaster) {
-            connectWithFarcaster();
+            connectWithFarcaster(authMode);
             return;
         }
         const authWindow = window.open('', '_blank', 'width=500,height=600');
@@ -351,7 +355,7 @@ const useSocialAuth = ({ sessionTimeout, authMode, onSettled, onError, onFarcast
             }), authWindowTimeout);
         }
     });
-    const connectWithFarcaster = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    const connectWithFarcaster = (authMode) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         const dynamicNonce = consumeNonce();
         const domain = window.location.host;
         const data = yield farcaster.connect({

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

@@ -4,14 +4,14 @@ import { SocialOAuthError, SocialOAuthErrorCode } from '@dynamic-labs/types';
 type SocialAuthMode = 'link' | 'signin';
 type UseSocialAuthProps = {
     sessionTimeout: number;
-    authMode: SocialAuthMode;
     onSettled?: () => void;
     onError?: () => void;
     onFarcasterUrl?: (url: string) => void;
 };
-export declare const useSocialAuth: ({ sessionTimeout, authMode, onSettled, onError, onFarcasterUrl, }: UseSocialAuthProps) => {
+export declare const useSocialAuth: ({ sessionTimeout, onSettled, onError, onFarcasterUrl, }: UseSocialAuthProps) => {
     readonly checkValidProvider: (provider: ProviderEnum) => boolean;
-    readonly connectSocialAccount: ({ provider, validator, captchaToken, }: {
+    readonly connectSocialAccount: ({ authMode, provider, validator, captchaToken, }: {
+        authMode: SocialAuthMode;
         provider: ProviderEnum;
         validator?: (provider: ProviderEnum) => boolean;
         captchaToken?: string;

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

@@ -97,7 +97,7 @@ const socialProviders = [
 const providersRequiringPkce = ['twitter', 'github'];
 const providersWithoutWindowOpenerRefence = ['twitter'];
 // Hook to handle common social auth logic (for social linking and social sign in)
-const useSocialAuth = ({ sessionTimeout, authMode, onSettled, onError, onFarcasterUrl, }) => {
+const useSocialAuth = ({ sessionTimeout, onSettled, onError, onFarcasterUrl, }) => {
     const { environmentId, setShowAuthFlow, projectSettings, consumeNonce, redirectUrl, } = useInternalDynamicContext();
     const { setErrorMessage, setError: setContextError } = useErrorContext();
     const { updateUserProfileByJWT } = useUpdateUserProfileByJWTCallback();
@@ -176,11 +176,15 @@ const useSocialAuth = ({ sessionTimeout, authMode, onSettled, onError, onFarcast
             verifyFunction: () => apiCall(),
         });
     });
-    const connectSocialAccount = (_a) => __awaiter(void 0, [_a], void 0, function* ({ provider, validator, captchaToken, }) {
+    const connectSocialAccount = (_a) => __awaiter(void 0, [_a], void 0, function* ({ authMode, provider, validator, captchaToken, }) {
         var _b, _c;
         clearInterval(authWindowInterval.current);
         clearError();
         setIsProcessing(true);
+        if (!authMode) {
+            logger.error('Auth mode is required. Please use either "link" or "signin"');
+            return;
+        }
         if (!checkValidProvider(provider)) {
             return;
         }
@@ -189,7 +193,7 @@ const useSocialAuth = ({ sessionTimeout, authMode, onSettled, onError, onFarcast
             return;
         }
         if (provider === ProviderEnum.Farcaster) {
-            connectWithFarcaster();
+            connectWithFarcaster(authMode);
             return;
         }
         const authWindow = window.open('', '_blank', 'width=500,height=600');
@@ -347,7 +351,7 @@ const useSocialAuth = ({ sessionTimeout, authMode, onSettled, onError, onFarcast
             }), authWindowTimeout);
         }
     });
-    const connectWithFarcaster = () => __awaiter(void 0, void 0, void 0, function* () {
+    const connectWithFarcaster = (authMode) => __awaiter(void 0, void 0, void 0, function* () {
         const dynamicNonce = consumeNonce();
         const domain = window.location.host;
         const data = yield connect({

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

@@ -81,15 +81,15 @@ var useInternalDynamicContext = require('../../../context/DynamicContext/useDyna
 
 const sleepToShowSuccessMessage = () => utils.sleep(1500);
 const useUserAuth = ({ authMethod, }) => {
-    const { handleLogOut, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, onboardingOnlyJwt, setMultiWalletWidgetState, projectSettings, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { handleLogOut, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, onboardingOnlyJwt, setMultiWalletWidgetState, } = useInternalDynamicContext.useInternalDynamicContext();
     const { view, setView, goToInitialView } = ViewContext.useViewContext();
     const { setLoading } = LoadingContext.useLoadingContext();
     const { setErrorMessage, setError } = ErrorContext.useErrorContext();
     const { setExistentAccountData } = AccountExistsContext.useAccountExistsContext();
-    const { createEmbeddedWallet } = useEmbeddedWallet.useEmbeddedWallet();
     const { handleVerifiedUserWithJWT } = useHandleVerifiedUser.useHandleVerifiedUser();
     const { createUserProfileByJWT } = useCreateUserProfileByJWTCallback.useCreateUserProfileByJWTCallback();
     const { displayedDestination: formattedPhone } = VerificationContext.useVerification();
+    const { shouldAutoCreateEmbeddedWallet } = useEmbeddedWallet.useEmbeddedWallet();
     const initAuth = (_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ isSignIn = true, verifyFunction, onVerifySuccess, onSettled, onError, showSuccessMessage = false, skipDefaultErrorHandling = false, }) {
         logger.logger.debug('initAuth', { authMethod, isSignIn });
         try {
@@ -115,9 +115,13 @@ const useUserAuth = ({ authMethod, }) => {
             yield createUserProfileByJWT(jwt, minifiedJwt);
             if (isSignIn) {
                 setCallback('authSuccess');
-                yield createEmbeddedWalletIfEnabled();
             }
-            setShowAuthFlow(false);
+            // we should only close auth flow if no wallet is going to be created,
+            // otherwise there will be a glitch with auth flow closing and then reopening for passkeys
+            const shouldCreateWallet = shouldAutoCreateEmbeddedWallet();
+            if (!shouldCreateWallet) {
+                setShowAuthFlow(false);
+            }
             onSettled === null || onSettled === void 0 ? void 0 : onSettled();
         }
         catch (error) {
@@ -156,22 +160,14 @@ const useUserAuth = ({ authMethod, }) => {
         }
         onSettled === null || onSettled === void 0 ? void 0 : onSettled();
     });
-    const createEmbeddedWalletIfEnabled = () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        var _b, _c;
-        if (!((_c = (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.embeddedWallets) === null || _c === void 0 ? void 0 : _c.automaticEmbeddedWalletCreation)) {
-            return;
-        }
-        try {
-            // this function will check if embedded wallet is enabled and create wallet if needed
-            // if not enabled, it will throw an error.
-            yield createEmbeddedWallet();
-        }
-        catch (e) {
-            logger.logger.debug('createEmbeddedWallet', e);
-            setShowAuthFlow(false);
-        }
-    });
     const handleError = (error, { options = {}, onError, }) => {
+        // these get caught in onboarding form and handled there
+        if (error instanceof utils.EmailAlreadyExistsError ||
+            error instanceof utils.CustomFieldNotUniqueError ||
+            error instanceof utils.UsernameAlreadyExistsError ||
+            error instanceof utils.TooManyEmailVerificationsError ||
+            error instanceof utils.InvalidPhoneNumberError)
+            throw error;
         if (error instanceof utils.NoAccessError) {
             setView('no-access');
             return;
@@ -201,29 +197,35 @@ const useUserAuth = ({ authMethod, }) => {
             setError(error.message);
         }
     };
-    const completeAuth = (_d) => _tslib.__awaiter(void 0, [_d], void 0, function* ({ completeSignInFlow, updateJwtFunction, onValidUpdatedJwt, options = {}, }) {
+    const handleVerifyMissingFields = (_b) => _tslib.__awaiter(void 0, [_b], void 0, function* ({ missingFields, isEmailVerificationRequired, isSmsVerificationRequired, }) {
+        if (isEmailVerificationRequired &&
+            missingFields.find((field) => field.name === 'email')) {
+            setView('verify-email');
+            return;
+        }
+        if (isSmsVerificationRequired &&
+            missingFields.find((field) => field.name === 'phoneNumber')) {
+            setView('verify-sms');
+            return;
+        }
+        setView(view.type);
+    });
+    const completeAuth = (_c) => _tslib.__awaiter(void 0, [_c], void 0, function* ({ completeSignInFlow, updateJwtFunction, onValidUpdatedJwt, options = {}, }) {
         logger.logger.debug('completeAuth', { authMethod });
         try {
             const { updateUserProfileResponse, isSmsVerificationRequired, isEmailVerificationRequired, missingFields, } = yield updateJwtFunction();
             onValidUpdatedJwt === null || onValidUpdatedJwt === void 0 ? void 0 : onValidUpdatedJwt();
             setOnboardingOnlyJwt(updateUserProfileResponse.jwt);
             localStorage.LocalStorage.setToLS(localStorage$1.AUTH_ONBOARDING_TOKEN, updateUserProfileResponse.minifiedJwt, true);
-            if (isEmailVerificationRequired &&
-                missingFields.map((field) => field.name).toString() === 'email') {
-                setView('verify-email');
-                return;
-            }
-            else if (isSmsVerificationRequired &&
-                missingFields.map((field) => field.name).toString() === 'phoneNumber') {
-                setView('verify-sms');
-                return;
-            }
-            else if (missingFields.length > 0) {
-                // make sure we capture the fields that are required and still missing!
-                // do not change the view, just use the current one
-                setView(view.type);
+            if (missingFields.length > 0) {
+                yield handleVerifyMissingFields({
+                    isEmailVerificationRequired,
+                    isSmsVerificationRequired,
+                    missingFields,
+                });
                 return;
             }
+            // no more onboarding needed, clean up onboarding jwt
             if (onboardingOnlyJwt) {
                 yield handleVerifiedUserWithJWT(updateUserProfileResponse.jwt);
                 setOnboardingOnlyJwt(undefined);
@@ -236,7 +238,12 @@ const useUserAuth = ({ authMethod, }) => {
                     return;
                 }
             }
-            yield createEmbeddedWalletIfEnabled();
+            // we should only close auth flow if no wallet is going to be created,
+            // otherwise there will be a glitch with auth flow closing and then reopening for passkeys
+            const shouldCreateWallet = shouldAutoCreateEmbeddedWallet();
+            if (!shouldCreateWallet) {
+                setShowAuthFlow(false);
+            }
         }
         catch (error) {
             logger.logger.debug(error);

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

@@ -1,6 +1,6 @@
 'use client'
 import { __awaiter } from '../../../../../_virtual/_tslib.js';
-import { DynamicError, NoAccessError, AccountExistsError, UserHasAccountWithEmailError, sleep } from '@dynamic-labs/utils';
+import { DynamicError, EmailAlreadyExistsError, CustomFieldNotUniqueError, UsernameAlreadyExistsError, TooManyEmailVerificationsError, InvalidPhoneNumberError, NoAccessError, AccountExistsError, UserHasAccountWithEmailError, sleep } from '@dynamic-labs/utils';
 import 'react';
 import '../../../context/DynamicContext/DynamicContext.js';
 import { decodeJwt } from '../../../shared/utils/functions/decodeJwt/decodeJwt.js';
@@ -77,15 +77,15 @@ import { useInternalDynamicContext } from '../../../context/DynamicContext/useDy
 
 const sleepToShowSuccessMessage = () => sleep(1500);
 const useUserAuth = ({ authMethod, }) => {
-    const { handleLogOut, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, onboardingOnlyJwt, setMultiWalletWidgetState, projectSettings, } = useInternalDynamicContext();
+    const { handleLogOut, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, onboardingOnlyJwt, setMultiWalletWidgetState, } = useInternalDynamicContext();
     const { view, setView, goToInitialView } = useViewContext();
     const { setLoading } = useLoadingContext();
     const { setErrorMessage, setError } = useErrorContext();
     const { setExistentAccountData } = useAccountExistsContext();
-    const { createEmbeddedWallet } = useEmbeddedWallet();
     const { handleVerifiedUserWithJWT } = useHandleVerifiedUser();
     const { createUserProfileByJWT } = useCreateUserProfileByJWTCallback();
     const { displayedDestination: formattedPhone } = useVerification();
+    const { shouldAutoCreateEmbeddedWallet } = useEmbeddedWallet();
     const initAuth = (_a) => __awaiter(void 0, [_a], void 0, function* ({ isSignIn = true, verifyFunction, onVerifySuccess, onSettled, onError, showSuccessMessage = false, skipDefaultErrorHandling = false, }) {
         logger.debug('initAuth', { authMethod, isSignIn });
         try {
@@ -111,9 +111,13 @@ const useUserAuth = ({ authMethod, }) => {
             yield createUserProfileByJWT(jwt, minifiedJwt);
             if (isSignIn) {
                 setCallback('authSuccess');
-                yield createEmbeddedWalletIfEnabled();
             }
-            setShowAuthFlow(false);
+            // we should only close auth flow if no wallet is going to be created,
+            // otherwise there will be a glitch with auth flow closing and then reopening for passkeys
+            const shouldCreateWallet = shouldAutoCreateEmbeddedWallet();
+            if (!shouldCreateWallet) {
+                setShowAuthFlow(false);
+            }
             onSettled === null || onSettled === void 0 ? void 0 : onSettled();
         }
         catch (error) {
@@ -152,22 +156,14 @@ const useUserAuth = ({ authMethod, }) => {
         }
         onSettled === null || onSettled === void 0 ? void 0 : onSettled();
     });
-    const createEmbeddedWalletIfEnabled = () => __awaiter(void 0, void 0, void 0, function* () {
-        var _b, _c;
-        if (!((_c = (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.embeddedWallets) === null || _c === void 0 ? void 0 : _c.automaticEmbeddedWalletCreation)) {
-            return;
-        }
-        try {
-            // this function will check if embedded wallet is enabled and create wallet if needed
-            // if not enabled, it will throw an error.
-            yield createEmbeddedWallet();
-        }
-        catch (e) {
-            logger.debug('createEmbeddedWallet', e);
-            setShowAuthFlow(false);
-        }
-    });
     const handleError = (error, { options = {}, onError, }) => {
+        // these get caught in onboarding form and handled there
+        if (error instanceof EmailAlreadyExistsError ||
+            error instanceof CustomFieldNotUniqueError ||
+            error instanceof UsernameAlreadyExistsError ||
+            error instanceof TooManyEmailVerificationsError ||
+            error instanceof InvalidPhoneNumberError)
+            throw error;
         if (error instanceof NoAccessError) {
             setView('no-access');
             return;
@@ -197,29 +193,35 @@ const useUserAuth = ({ authMethod, }) => {
             setError(error.message);
         }
     };
-    const completeAuth = (_d) => __awaiter(void 0, [_d], void 0, function* ({ completeSignInFlow, updateJwtFunction, onValidUpdatedJwt, options = {}, }) {
+    const handleVerifyMissingFields = (_b) => __awaiter(void 0, [_b], void 0, function* ({ missingFields, isEmailVerificationRequired, isSmsVerificationRequired, }) {
+        if (isEmailVerificationRequired &&
+            missingFields.find((field) => field.name === 'email')) {
+            setView('verify-email');
+            return;
+        }
+        if (isSmsVerificationRequired &&
+            missingFields.find((field) => field.name === 'phoneNumber')) {
+            setView('verify-sms');
+            return;
+        }
+        setView(view.type);
+    });
+    const completeAuth = (_c) => __awaiter(void 0, [_c], void 0, function* ({ completeSignInFlow, updateJwtFunction, onValidUpdatedJwt, options = {}, }) {
         logger.debug('completeAuth', { authMethod });
         try {
             const { updateUserProfileResponse, isSmsVerificationRequired, isEmailVerificationRequired, missingFields, } = yield updateJwtFunction();
             onValidUpdatedJwt === null || onValidUpdatedJwt === void 0 ? void 0 : onValidUpdatedJwt();
             setOnboardingOnlyJwt(updateUserProfileResponse.jwt);
             LocalStorage.setToLS(AUTH_ONBOARDING_TOKEN, updateUserProfileResponse.minifiedJwt, true);
-            if (isEmailVerificationRequired &&
-                missingFields.map((field) => field.name).toString() === 'email') {
-                setView('verify-email');
-                return;
-            }
-            else if (isSmsVerificationRequired &&
-                missingFields.map((field) => field.name).toString() === 'phoneNumber') {
-                setView('verify-sms');
-                return;
-            }
-            else if (missingFields.length > 0) {
-                // make sure we capture the fields that are required and still missing!
-                // do not change the view, just use the current one
-                setView(view.type);
+            if (missingFields.length > 0) {
+                yield handleVerifyMissingFields({
+                    isEmailVerificationRequired,
+                    isSmsVerificationRequired,
+                    missingFields,
+                });
                 return;
             }
+            // no more onboarding needed, clean up onboarding jwt
             if (onboardingOnlyJwt) {
                 yield handleVerifiedUserWithJWT(updateUserProfileResponse.jwt);
                 setOnboardingOnlyJwt(undefined);
@@ -232,7 +234,12 @@ const useUserAuth = ({ authMethod, }) => {
                     return;
                 }
             }
-            yield createEmbeddedWalletIfEnabled();
+            // we should only close auth flow if no wallet is going to be created,
+            // otherwise there will be a glitch with auth flow closing and then reopening for passkeys
+            const shouldCreateWallet = shouldAutoCreateEmbeddedWallet();
+            if (!shouldCreateWallet) {
+                setShowAuthFlow(false);
+            }
         }
         catch (error) {
             logger.debug(error);