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

package/src/lib/views/CollectUserDataView/fieldsConfig.js

@@ -14,7 +14,7 @@ import 'ethers';
 import { countryCodes, tShirtSizes, teamNames } from '../../shared/consts/index.js';
 
 const fieldsConfig = {
-    alias: { label: 'Alias', type: 'string', validation: string() },
+    alias: { label: 'Alias', type: 'string', validation: string().trim() },
     country: {
         label: 'Country',
         type: 'select',
@@ -25,9 +25,13 @@ const fieldsConfig = {
         type: 'email',
         validation: string().email('Email is not valid'),
     },
-    firstName: { label: 'First Name', type: 'string', validation: string() },
-    jobTitle: { label: 'Job Title', type: 'string', validation: string() },
-    lastName: { label: 'Last Name', type: 'string', validation: string() },
+    firstName: {
+        label: 'First Name',
+        type: 'string',
+        validation: string().trim(),
+    },
+    jobTitle: { label: 'Job Title', type: 'string', validation: string().trim() },
+    lastName: { label: 'Last Name', type: 'string', validation: string().trim() },
     phoneNumber: {
         label: 'Phone number',
         type: 'string',

package/src/lib/views/CollectUserDataViewLoginWithEmail/CollectUserDataViewLoginWithEmail.cjs

@@ -28,11 +28,11 @@ require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs
 require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 require('../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
+require('../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../context/ErrorContext/ErrorContext.cjs');
 require('../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
-require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
@@ -41,6 +41,8 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../components/InlineWidget/InlineWidget.cjs');
+require('../../components/MenuList/Dropdown/Dropdown.cjs');
 var OnboardingUserDataForm = require('../CollectUserDataView/OnboardingUserDataForm/OnboardingUserDataForm.cjs');
 
 const CollectUserDataViewLoginWithEmail = () => {
@@ -51,7 +53,7 @@ const CollectUserDataViewLoginWithEmail = () => {
     const userProfile = createUserProfile.createUserProfile(decodedOnboardingOnlyToken);
     return (jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email', "data-testid": 'collect-user-data-login-with-email' }, { children: [onboardingImageUrl && (jsxRuntime.jsx("img", { className: 'collect-user-data-login-with-email__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsxRuntime.jsx("div", Object.assign({ className: 'collect-user-data-login-with-email__icon-container' }, { children: jsxRuntime.jsx(iconic.UserProfileIcon, {}) })), jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email__form' }, { children: [jsxRuntime.jsx(OnboardingUserDataForm.OnboardingUserDataForm, Object.assign({ userProfile: userProfile }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email__welcome-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'title', color: 'primary', className: 'collect-user-data-login-with-email__welcome-title' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
                                         `Welcome to ${appName}` })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeMessage) ||
-                                        'We need a bit of information to get started' }))] })) })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'collect-user-data-login-with-email__log-out', onClick: () => handleLogOut() }, { children: "Log out" }))] }))] })));
+                                        'We need a bit of information to get started' }))] })) })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'collect-user-data-login-with-email__log-out', onClick: handleLogOut }, { children: "Log out" }))] }))] })));
 };
 
 exports.CollectUserDataViewLoginWithEmail = CollectUserDataViewLoginWithEmail;

package/src/lib/views/CollectUserDataViewLoginWithEmail/CollectUserDataViewLoginWithEmail.js

@@ -24,11 +24,11 @@ import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../components/Transition/OpacityTransition/OpacityTransition.js';
 import '../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
+import '../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../context/ErrorContext/ErrorContext.js';
 import '../../context/AccessDeniedContext/AccessDeniedContext.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
-import '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '../../context/MockContext/MockContext.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
@@ -37,6 +37,8 @@ import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../components/InlineWidget/InlineWidget.js';
+import '../../components/MenuList/Dropdown/Dropdown.js';
 import { OnboardingUserDataForm } from '../CollectUserDataView/OnboardingUserDataForm/OnboardingUserDataForm.js';
 
 const CollectUserDataViewLoginWithEmail = () => {
@@ -47,7 +49,7 @@ const CollectUserDataViewLoginWithEmail = () => {
     const userProfile = createUserProfile(decodedOnboardingOnlyToken);
     return (jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email', "data-testid": 'collect-user-data-login-with-email' }, { children: [onboardingImageUrl && (jsx("img", { className: 'collect-user-data-login-with-email__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsx("div", Object.assign({ className: 'collect-user-data-login-with-email__icon-container' }, { children: jsx(UserProfileIcon, {}) })), jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email__form' }, { children: [jsx(OnboardingUserDataForm, Object.assign({ userProfile: userProfile }, { children: jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email__welcome-container' }, { children: [jsx(Typography, Object.assign({ variant: 'title', color: 'primary', className: 'collect-user-data-login-with-email__welcome-title' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
                                         `Welcome to ${appName}` })), jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeMessage) ||
-                                        'We need a bit of information to get started' }))] })) })), jsx(TextButton, Object.assign({ className: 'collect-user-data-login-with-email__log-out', onClick: () => handleLogOut() }, { children: "Log out" }))] }))] })));
+                                        'We need a bit of information to get started' }))] })) })), jsx(TextButton, Object.assign({ className: 'collect-user-data-login-with-email__log-out', onClick: handleLogOut }, { children: "Log out" }))] }))] })));
 };
 
 export { CollectUserDataViewLoginWithEmail };

package/src/lib/views/EmailConfirmationWaitingView/EmailConfirmationWaitingView.cjs

@@ -30,25 +30,26 @@ require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs
 require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 require('../../config/ApiEndpoint.cjs');
 require('@dynamic-labs/rpc-providers');
+require('../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../context/ErrorContext/ErrorContext.cjs');
 require('../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 var IconButton = require('../../components/IconButton/IconButton.cjs');
 var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
 require('../../components/Alert/Alert.cjs');
-require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
-var TosAndPp = require('../../components/TosAndPp/TosAndPp.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../components/InlineWidget/InlineWidget.cjs');
+require('../../components/MenuList/Dropdown/Dropdown.cjs');
 
 const EmailConfirmationWaitingView = () => {
     const { setView } = ViewContext.useViewContext();
-    const { clearStatesOnBackClick, termsOfServiceUrl, privacyPolicyUrl, selectedWalletConnector: walletConnector, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { clearStatesOnBackClick, selectedWalletConnector: walletConnector } = useInternalDynamicContext.useInternalDynamicContext();
     if (walletConnector && !walletConnectorCore.isEmailWalletConnector(walletConnector)) {
         throw new Error('Wallet connector is not email provider');
     }
@@ -58,7 +59,7 @@ const EmailConfirmationWaitingView = () => {
         setView('login-with-email-or-wallet');
         clearStatesOnBackClick();
     }), [setView, emailConnector, clearStatesOnBackClick]);
-    return (jsxRuntime.jsxs("div", Object.assign({ className: 'email-confirmation-waiting-view' }, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__header-icon' }, { children: jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: true }) })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'email-confirmation-waiting-view__title' }, { children: "Confirm your email" })), jsxRuntime.jsxs(Typography.Typography, Object.assign({ weight: 'regular', variant: 'body_normal', color: 'secondary' }, { children: ["We\u2019ve sent a verification email to", ' '] })), jsxRuntime.jsxs("div", Object.assign({ className: 'email-confirmation-waiting-view__email-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'medium', as: 'span' }, { children: emailConnector === null || emailConnector === void 0 ? void 0 : emailConnector.email })), jsxRuntime.jsx(IconButton.IconButton, Object.assign({ onClick: onClickResetEmail, className: 'email-confirmation-waiting-view__edit-icon-button', "data-testid": 'email-confirmation-waiting-view__edit-button' }, { children: jsxRuntime.jsx(Icon.Icon, Object.assign({ color: 'text-tertiary' }, { children: jsxRuntime.jsx(pencilAltIcon.ReactComponent, {}) })) }))] })), jsxRuntime.jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__note' }, { children: jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'regular', variant: 'body_small', color: 'secondary' }, { children: "Note: it might take a few seconds to proceed after clicking the link in your email" })) })), jsxRuntime.jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__term_of_service' }, { children: jsxRuntime.jsx(TosAndPp.TosAndPp, { mode: 'logging in', privacyPolicyUrl: privacyPolicyUrl, termsOfServiceUrl: termsOfServiceUrl }) })), jsxRuntime.jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__powered_by_dynamic_footer' }, { children: jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {}) }))] })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'email-confirmation-waiting-view' }, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__header-icon' }, { children: jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: true }) })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'email-confirmation-waiting-view__title' }, { children: "Confirm your email" })), jsxRuntime.jsxs(Typography.Typography, Object.assign({ weight: 'regular', variant: 'body_normal', color: 'secondary' }, { children: ["We\u2019ve sent a verification email to", ' '] })), jsxRuntime.jsxs("div", Object.assign({ className: 'email-confirmation-waiting-view__email-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'medium', as: 'span' }, { children: emailConnector === null || emailConnector === void 0 ? void 0 : emailConnector.email })), jsxRuntime.jsx(IconButton.IconButton, Object.assign({ onClick: onClickResetEmail, className: 'email-confirmation-waiting-view__edit-icon-button', "data-testid": 'email-confirmation-waiting-view__edit-button' }, { children: jsxRuntime.jsx(Icon.Icon, Object.assign({ color: 'text-tertiary' }, { children: jsxRuntime.jsx(pencilAltIcon.ReactComponent, {}) })) }))] })), jsxRuntime.jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__note' }, { children: jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'regular', variant: 'body_small', color: 'secondary' }, { children: "Note: it might take a few seconds to proceed after clicking the link in your email" })) })), jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, { classNameRoot: 'email-confirmation-waiting-view__powered_by_dynamic_footer' })] })));
 };
 
 exports.EmailConfirmationWaitingView = EmailConfirmationWaitingView;

package/src/lib/views/EmailConfirmationWaitingView/EmailConfirmationWaitingView.js

@@ -26,25 +26,26 @@ import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../components/Transition/OpacityTransition/OpacityTransition.js';
 import '../../config/ApiEndpoint.js';
 import '@dynamic-labs/rpc-providers';
+import '../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import '../../context/ErrorContext/ErrorContext.js';
 import '../../context/AccessDeniedContext/AccessDeniedContext.js';
 import { IconButton } from '../../components/IconButton/IconButton.js';
 import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
 import { IconWithSpinner } from '../../components/IconWithSpinner/IconWithSpinner.js';
 import '../../components/Alert/Alert.js';
-import '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '../../context/MockContext/MockContext.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
-import { TosAndPp } from '../../components/TosAndPp/TosAndPp.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../components/InlineWidget/InlineWidget.js';
+import '../../components/MenuList/Dropdown/Dropdown.js';
 
 const EmailConfirmationWaitingView = () => {
     const { setView } = useViewContext();
-    const { clearStatesOnBackClick, termsOfServiceUrl, privacyPolicyUrl, selectedWalletConnector: walletConnector, } = useInternalDynamicContext();
+    const { clearStatesOnBackClick, selectedWalletConnector: walletConnector } = useInternalDynamicContext();
     if (walletConnector && !isEmailWalletConnector(walletConnector)) {
         throw new Error('Wallet connector is not email provider');
     }
@@ -54,7 +55,7 @@ const EmailConfirmationWaitingView = () => {
         setView('login-with-email-or-wallet');
         clearStatesOnBackClick();
     }), [setView, emailConnector, clearStatesOnBackClick]);
-    return (jsxs("div", Object.assign({ className: 'email-confirmation-waiting-view' }, { children: [jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__header-icon' }, { children: jsx(IconWithSpinner, { Icon: SignInWithEmailIcon, iconSize: 80, isSpinning: true }) })), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'email-confirmation-waiting-view__title' }, { children: "Confirm your email" })), jsxs(Typography, Object.assign({ weight: 'regular', variant: 'body_normal', color: 'secondary' }, { children: ["We\u2019ve sent a verification email to", ' '] })), jsxs("div", Object.assign({ className: 'email-confirmation-waiting-view__email-container' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'medium', as: 'span' }, { children: emailConnector === null || emailConnector === void 0 ? void 0 : emailConnector.email })), jsx(IconButton, Object.assign({ onClick: onClickResetEmail, className: 'email-confirmation-waiting-view__edit-icon-button', "data-testid": 'email-confirmation-waiting-view__edit-button' }, { children: jsx(Icon, Object.assign({ color: 'text-tertiary' }, { children: jsx(SvgPencilAltIcon, {}) })) }))] })), jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__note' }, { children: jsx(Typography, Object.assign({ weight: 'regular', variant: 'body_small', color: 'secondary' }, { children: "Note: it might take a few seconds to proceed after clicking the link in your email" })) })), jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__term_of_service' }, { children: jsx(TosAndPp, { mode: 'logging in', privacyPolicyUrl: privacyPolicyUrl, termsOfServiceUrl: termsOfServiceUrl }) })), jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__powered_by_dynamic_footer' }, { children: jsx(PoweredByDynamic, {}) }))] })));
+    return (jsxs("div", Object.assign({ className: 'email-confirmation-waiting-view' }, { children: [jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__header-icon' }, { children: jsx(IconWithSpinner, { Icon: SignInWithEmailIcon, iconSize: 80, isSpinning: true }) })), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'email-confirmation-waiting-view__title' }, { children: "Confirm your email" })), jsxs(Typography, Object.assign({ weight: 'regular', variant: 'body_normal', color: 'secondary' }, { children: ["We\u2019ve sent a verification email to", ' '] })), jsxs("div", Object.assign({ className: 'email-confirmation-waiting-view__email-container' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', weight: 'medium', as: 'span' }, { children: emailConnector === null || emailConnector === void 0 ? void 0 : emailConnector.email })), jsx(IconButton, Object.assign({ onClick: onClickResetEmail, className: 'email-confirmation-waiting-view__edit-icon-button', "data-testid": 'email-confirmation-waiting-view__edit-button' }, { children: jsx(Icon, Object.assign({ color: 'text-tertiary' }, { children: jsx(SvgPencilAltIcon, {}) })) }))] })), jsx("div", Object.assign({ className: 'email-confirmation-waiting-view__note' }, { children: jsx(Typography, Object.assign({ weight: 'regular', variant: 'body_small', color: 'secondary' }, { children: "Note: it might take a few seconds to proceed after clicking the link in your email" })) })), jsx(PoweredByDynamic, { classNameRoot: 'email-confirmation-waiting-view__powered_by_dynamic_footer' })] })));
 };
 
 export { EmailConfirmationWaitingView };

package/src/lib/views/EmailUpdate/EmailUpdate.cjs

@@ -8,7 +8,7 @@ var React = require('react');
 var iconic = require('@dynamic-labs/iconic');
 var Typography = require('../../components/Typography/Typography.cjs');
 require('@dynamic-labs/sdk-api');
-require('../../shared/logger.cjs');
+var logger = require('../../shared/logger.cjs');
 require('@dynamic-labs/wallet-connector-core');
 var ViewContext = require('../../context/ViewContext/ViewContext.cjs');
 var chevronLeft = require('../../shared/assets/chevron-left.cjs');
@@ -30,12 +30,12 @@ require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs
 require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 var api = require('../../data/api.cjs');
 require('@dynamic-labs/rpc-providers');
+require('../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 var ErrorContext = require('../../context/ErrorContext/ErrorContext.cjs');
 require('../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 var IconButton = require('../../components/IconButton/IconButton.cjs');
 var Button = require('../../components/Button/Button.cjs');
 require('../../components/Alert/Alert.cjs');
-require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
@@ -43,6 +43,8 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../components/InlineWidget/InlineWidget.cjs');
+require('../../components/MenuList/Dropdown/Dropdown.cjs');
 var EmailVerificationContext = require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 var LoadingContext = require('../../context/LoadingContext/LoadingContext.cjs');
 
@@ -75,6 +77,7 @@ const EmailUpdate = () => {
             setVerificationUUID(emailVerification.verificationUUID);
         }
         catch (error) {
+            logger.logger.debug(error);
             setErrorMessage(error.code);
         }
         finally {

package/src/lib/views/EmailUpdate/EmailUpdate.js

@@ -4,7 +4,7 @@ import { useState } from 'react';
 import { SignInWithEmailIcon } from '@dynamic-labs/iconic';
 import { Typography } from '../../components/Typography/Typography.js';
 import '@dynamic-labs/sdk-api';
-import '../../shared/logger.js';
+import { logger } from '../../shared/logger.js';
 import '@dynamic-labs/wallet-connector-core';
 import { useViewContext } from '../../context/ViewContext/ViewContext.js';
 import { ReactComponent as SvgChevronLeft } from '../../shared/assets/chevron-left.js';
@@ -26,12 +26,12 @@ import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../components/Transition/OpacityTransition/OpacityTransition.js';
 import { updateUserProfileFields } from '../../data/api.js';
 import '@dynamic-labs/rpc-providers';
+import '../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import { useErrorContext } from '../../context/ErrorContext/ErrorContext.js';
 import '../../context/AccessDeniedContext/AccessDeniedContext.js';
 import { IconButton } from '../../components/IconButton/IconButton.js';
 import { Button } from '../../components/Button/Button.js';
 import '../../components/Alert/Alert.js';
-import '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '../../context/MockContext/MockContext.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
@@ -39,6 +39,8 @@ import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../components/InlineWidget/InlineWidget.js';
+import '../../components/MenuList/Dropdown/Dropdown.js';
 import { useEmailVerificationContext } from '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import { useLoadingContext } from '../../context/LoadingContext/LoadingContext.js';
 
@@ -71,6 +73,7 @@ const EmailUpdate = () => {
             setVerificationUUID(emailVerification.verificationUUID);
         }
         catch (error) {
+            logger.debug(error);
             setErrorMessage(error.code);
         }
         finally {

package/src/lib/views/EmailVerification/EmailVerification.cjs

@@ -13,7 +13,7 @@ require('@dynamic-labs/wallet-connector-core');
 var ViewContext = require('../../context/ViewContext/ViewContext.cjs');
 var check = require('../../shared/assets/check.cjs');
 var checkCircle = require('../../shared/assets/check-circle.cjs');
-require('../../shared/logger.cjs');
+var logger = require('../../shared/logger.cjs');
 require('@dynamic-labs/wallet-book');
 require('../../utils/constants/colors.cjs');
 require('../../shared/utils/classes/storage/localStorage.cjs');
@@ -32,6 +32,7 @@ require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs
 require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 var api = require('../../data/api.cjs');
 require('@dynamic-labs/rpc-providers');
+require('../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 var ErrorContext = require('../../context/ErrorContext/ErrorContext.cjs');
 require('../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('../../components/IconButton/IconButton.cjs');
@@ -39,36 +40,40 @@ var IconWithStatus = require('../../components/IconWithStatus/IconWithStatus.cjs
 var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
 require('../../components/Alert/Alert.cjs');
-require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
+var useCountdown = require('../../utils/hooks/useCountdown/useCountdown.cjs');
 var TextButton = require('../../components/TextButton/TextButton.cjs');
 var ErrorContainer = require('../../components/ErrorContainer/ErrorContainer.cjs');
-var TosAndPp = require('../../components/TosAndPp/TosAndPp.cjs');
 var PinField = require('../../components/PinField/PinField.cjs');
 var shortenEmail = require('../../shared/utils/functions/shortenEmail/shortenEmail.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../components/InlineWidget/InlineWidget.cjs');
+require('../../components/MenuList/Dropdown/Dropdown.cjs');
 var EmailVerificationContext = require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 var LoadingContext = require('../../context/LoadingContext/LoadingContext.cjs');
 var useEmailVerificationRequest = require('../../utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.cjs');
 var useCreateUserProfileByJWTCallback = require('../../utils/hooks/useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.cjs');
 
-const secondsToRetry = 15;
+const SECONDS_TO_RETRY = 15;
 const EmailVerification = () => {
     const [hideRetryButton, setHideRetryButton] = React.useState(false);
-    const [count, setCount] = React.useState(secondsToRetry);
     const [retried, setRetried] = React.useState(false);
     const [isValidated, setIsValidated] = React.useState(false);
     const [showTransferMessage, setShowTransferMessage] = React.useState(false);
     const { view, setView, goToInitialView } = ViewContext.useViewContext();
     const { error, setError, setErrorMessage } = ErrorContext.useErrorContext();
-    const { environmentId, onboardingOnlyJwt, handleLogOut, termsOfServiceUrl, privacyPolicyUrl, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, } = useInternalDynamicContext.useInternalDynamicContext();
     const { email, verificationUUID, setVerificationUUID } = EmailVerificationContext.useEmailVerificationContext();
     const { loading, setLoading } = LoadingContext.useLoadingContext();
+    const { remainingSeconds, startCountdown } = useCountdown.useCountdown({
+        callback: () => setRetried(false),
+        seconds: SECONDS_TO_RETRY,
+    });
     const isLoginView = view === 'login-with-email-verification';
     const { verifyEmail } = useEmailVerificationRequest.useEmailVerificationRequest();
     const { createUserProfileByJWT } = useCreateUserProfileByJWTCallback.useCreateUserProfileByJWTCallback();
@@ -93,6 +98,7 @@ const EmailVerification = () => {
             setShowAuthFlow(false);
         }
         catch (error) {
+            logger.logger.debug(error);
             setErrorMessage(error.code);
         }
         finally {
@@ -142,15 +148,16 @@ const EmailVerification = () => {
             }
             setCallback('authSuccess');
             // this timeout is set to make sure that the user will see success message
-            setTimeout(() => {
-                createUserProfileByJWT(jwt);
+            setTimeout(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+                yield createUserProfileByJWT(jwt);
                 setShowAuthFlow(false);
-            }, 1500);
+            }), 1500);
         }
         catch (error) {
             if (error instanceof utils.NoAccessError) {
                 setView('no-access');
             }
+            logger.logger.debug(error);
             setErrorMessage(error.code);
         }
         finally {
@@ -183,9 +190,11 @@ const EmailVerification = () => {
             });
             setVerificationUUID(newVerificationUUID);
             setRetried(true);
+            startCountdown();
             setError(undefined);
         }
         catch (error) {
+            logger.logger.debug(error);
             setErrorMessage(error.code);
             if (error.code === 'too_many_email_verification_attempts') {
                 setHideRetryButton(true);
@@ -198,26 +207,9 @@ const EmailVerification = () => {
             setLoading(false);
         }
     });
-    React.useEffect(() => {
-        /* istanbul ignore next */
-        setCount(secondsToRetry);
-        const timeout = setTimeout(() => {
-            if (retried)
-                setRetried(false);
-        }, secondsToRetry * 1000);
-        return () => clearTimeout(timeout);
-    }, [retried]);
-    React.useEffect(() => {
-        /* istanbul ignore next */
-        const timeout = setTimeout(() => {
-            if (count)
-                setCount((prev) => prev - 1);
-        }, 1000);
-        return () => clearTimeout(timeout);
-    }, [count]);
     return (jsxRuntime.jsxs("div", Object.assign({ className: 'email-verification__container' }, { children: [error && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, Object.assign({ withIcon: false, className: 'email-verification__error-message' }, { children: error }))), showTransferMessage && (jsxRuntime.jsx("div", Object.assign({ className: 'email-verification__transfer-message' }, { children: "Verification complete, the email is now verified to this account." }))), isValidated ? (jsxRuntime.jsx("div", Object.assign({ className: 'email-verification__icon-container' }, { children: jsxRuntime.jsx(IconWithStatus.IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: iconic.SignInWithEmailIcon, iconSize: 50, InnerIcon: check.ReactComponent }) }))) : (jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { className: classNames.classNames({
                     'email-verification__icon-with-spinner': Boolean(!error),
-                }), Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: true })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary' }, { children: "Confirm verification code" })), jsxRuntime.jsxs("div", Object.assign({ className: 'email-verification__copy-text-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail.shortenEmail(email) }))] })), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, Object.assign({ onClick: () => setView('update-email'), className: 'email-verification__text-button', disabled: loading }, { children: "Edit email" }))), jsxRuntime.jsx(PinField.PinField, { initialValue: Array(6).join('.').split('.'), isLoading: loading, handleComplete: isLoginView ? handleEmailLogin : handleComplete, isValidated: isValidated, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: () => setError(undefined) }), retried ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: ["Re-send code in ", count] })), jsxRuntime.jsxs("span", Object.assign({ className: 'email-verification__retry-container' }, { children: [jsxRuntime.jsx(checkCircle.ReactComponent, {}), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text' }, { children: "Code sent" }))] }))] })) : (!hideRetryButton && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'secondary' }, { children: "Did not receive your code yet?" })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry() }, { children: "Re-send code" }))] }))), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'email-verification__log-out', onClick: () => handleLogOut() }, { children: "Log out" }))), termsOfServiceUrl && privacyPolicyUrl && isLoginView && (jsxRuntime.jsx(TosAndPp.TosAndPp, { mode: 'logging in', privacyPolicyUrl: privacyPolicyUrl, termsOfServiceUrl: termsOfServiceUrl })), jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {})] })));
+                }), Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: true })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary' }, { children: "Confirm verification code" })), jsxRuntime.jsxs("div", Object.assign({ className: 'email-verification__copy-text-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail.shortenEmail(email) }))] })), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, Object.assign({ onClick: () => setView('update-email'), className: 'email-verification__text-button', disabled: loading }, { children: "Edit email" }))), jsxRuntime.jsx(PinField.PinField, { initialValue: Array(6).join('.').split('.'), isLoading: loading, handleComplete: isLoginView ? handleEmailLogin : handleComplete, isValidated: isValidated, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: () => setError(undefined) }), retried ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: ["Re-send code in ", remainingSeconds] })), jsxRuntime.jsxs("span", Object.assign({ className: 'email-verification__retry-container' }, { children: [jsxRuntime.jsx(checkCircle.ReactComponent, {}), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text' }, { children: "Code sent" }))] }))] })) : (!hideRetryButton && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'secondary' }, { children: "Did not receive your code yet?" })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry() }, { children: "Re-send code" }))] }))), !isLoginView && (jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'email-verification__log-out', onClick: handleLogOut }, { children: "Log out" }))), jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {})] })));
 };
 
 exports.EmailVerification = EmailVerification;

package/src/lib/views/EmailVerification/EmailVerification.js

@@ -1,6 +1,6 @@
 import { __awaiter } from '../../../../_virtual/_tslib.js';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { useState, useCallback, useEffect } from 'react';
+import { useState, useCallback } from 'react';
 import { SignInWithEmailIcon } from '@dynamic-labs/iconic';
 import { NoAccessError } from '@dynamic-labs/utils';
 import { Typography } from '../../components/Typography/Typography.js';
@@ -9,7 +9,7 @@ import '@dynamic-labs/wallet-connector-core';
 import { useViewContext } from '../../context/ViewContext/ViewContext.js';
 import { ReactComponent as SvgCheck } from '../../shared/assets/check.js';
 import { ReactComponent as SvgCheckCircle } from '../../shared/assets/check-circle.js';
-import '../../shared/logger.js';
+import { logger } from '../../shared/logger.js';
 import '@dynamic-labs/wallet-book';
 import '../../utils/constants/colors.js';
 import '../../shared/utils/classes/storage/localStorage.js';
@@ -28,6 +28,7 @@ import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../components/Transition/OpacityTransition/OpacityTransition.js';
 import { signInWithEmailVerification, retryEmailVerification } from '../../data/api.js';
 import '@dynamic-labs/rpc-providers';
+import '../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.js';
 import { useErrorContext } from '../../context/ErrorContext/ErrorContext.js';
 import '../../context/AccessDeniedContext/AccessDeniedContext.js';
 import '../../components/IconButton/IconButton.js';
@@ -35,36 +36,40 @@ import { IconWithStatus } from '../../components/IconWithStatus/IconWithStatus.j
 import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
 import { IconWithSpinner } from '../../components/IconWithSpinner/IconWithSpinner.js';
 import '../../components/Alert/Alert.js';
-import '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '../../context/MockContext/MockContext.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
+import { useCountdown } from '../../utils/hooks/useCountdown/useCountdown.js';
 import { TextButton } from '../../components/TextButton/TextButton.js';
 import { ErrorContainer } from '../../components/ErrorContainer/ErrorContainer.js';
-import { TosAndPp } from '../../components/TosAndPp/TosAndPp.js';
 import { PinField } from '../../components/PinField/PinField.js';
 import { shortenEmail } from '../../shared/utils/functions/shortenEmail/shortenEmail.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../components/InlineWidget/InlineWidget.js';
+import '../../components/MenuList/Dropdown/Dropdown.js';
 import { useEmailVerificationContext } from '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import { useLoadingContext } from '../../context/LoadingContext/LoadingContext.js';
 import { useEmailVerificationRequest } from '../../utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.js';
 import { useCreateUserProfileByJWTCallback } from '../../utils/hooks/useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.js';
 
-const secondsToRetry = 15;
+const SECONDS_TO_RETRY = 15;
 const EmailVerification = () => {
     const [hideRetryButton, setHideRetryButton] = useState(false);
-    const [count, setCount] = useState(secondsToRetry);
     const [retried, setRetried] = useState(false);
     const [isValidated, setIsValidated] = useState(false);
     const [showTransferMessage, setShowTransferMessage] = useState(false);
     const { view, setView, goToInitialView } = useViewContext();
     const { error, setError, setErrorMessage } = useErrorContext();
-    const { environmentId, onboardingOnlyJwt, handleLogOut, termsOfServiceUrl, privacyPolicyUrl, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, } = useInternalDynamicContext();
+    const { environmentId, onboardingOnlyJwt, handleLogOut, authToken, setOnboardingOnlyJwt, setShowAuthFlow, setCallback, } = useInternalDynamicContext();
     const { email, verificationUUID, setVerificationUUID } = useEmailVerificationContext();
     const { loading, setLoading } = useLoadingContext();
+    const { remainingSeconds, startCountdown } = useCountdown({
+        callback: () => setRetried(false),
+        seconds: SECONDS_TO_RETRY,
+    });
     const isLoginView = view === 'login-with-email-verification';
     const { verifyEmail } = useEmailVerificationRequest();
     const { createUserProfileByJWT } = useCreateUserProfileByJWTCallback();
@@ -89,6 +94,7 @@ const EmailVerification = () => {
             setShowAuthFlow(false);
         }
         catch (error) {
+            logger.debug(error);
             setErrorMessage(error.code);
         }
         finally {
@@ -138,15 +144,16 @@ const EmailVerification = () => {
             }
             setCallback('authSuccess');
             // this timeout is set to make sure that the user will see success message
-            setTimeout(() => {
-                createUserProfileByJWT(jwt);
+            setTimeout(() => __awaiter(void 0, void 0, void 0, function* () {
+                yield createUserProfileByJWT(jwt);
                 setShowAuthFlow(false);
-            }, 1500);
+            }), 1500);
         }
         catch (error) {
             if (error instanceof NoAccessError) {
                 setView('no-access');
             }
+            logger.debug(error);
             setErrorMessage(error.code);
         }
         finally {
@@ -179,9 +186,11 @@ const EmailVerification = () => {
             });
             setVerificationUUID(newVerificationUUID);
             setRetried(true);
+            startCountdown();
             setError(undefined);
         }
         catch (error) {
+            logger.debug(error);
             setErrorMessage(error.code);
             if (error.code === 'too_many_email_verification_attempts') {
                 setHideRetryButton(true);
@@ -194,26 +203,9 @@ const EmailVerification = () => {
             setLoading(false);
         }
     });
-    useEffect(() => {
-        /* istanbul ignore next */
-        setCount(secondsToRetry);
-        const timeout = setTimeout(() => {
-            if (retried)
-                setRetried(false);
-        }, secondsToRetry * 1000);
-        return () => clearTimeout(timeout);
-    }, [retried]);
-    useEffect(() => {
-        /* istanbul ignore next */
-        const timeout = setTimeout(() => {
-            if (count)
-                setCount((prev) => prev - 1);
-        }, 1000);
-        return () => clearTimeout(timeout);
-    }, [count]);
     return (jsxs("div", Object.assign({ className: 'email-verification__container' }, { children: [error && (jsx(ErrorContainer, Object.assign({ withIcon: false, className: 'email-verification__error-message' }, { children: error }))), showTransferMessage && (jsx("div", Object.assign({ className: 'email-verification__transfer-message' }, { children: "Verification complete, the email is now verified to this account." }))), isValidated ? (jsx("div", Object.assign({ className: 'email-verification__icon-container' }, { children: jsx(IconWithStatus, { containerClassName: 'email-verification__icon--verified', Icon: SignInWithEmailIcon, iconSize: 50, InnerIcon: SvgCheck }) }))) : (jsx(IconWithSpinner, { className: classNames({
                     'email-verification__icon-with-spinner': Boolean(!error),
-                }), Icon: SignInWithEmailIcon, iconSize: 80, isSpinning: true })), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary' }, { children: "Confirm verification code" })), jsxs("div", Object.assign({ className: 'email-verification__copy-text-container' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail(email) }))] })), !isLoginView && (jsx(TextButton, Object.assign({ onClick: () => setView('update-email'), className: 'email-verification__text-button', disabled: loading }, { children: "Edit email" }))), jsx(PinField, { initialValue: Array(6).join('.').split('.'), isLoading: loading, handleComplete: isLoginView ? handleEmailLogin : handleComplete, isValidated: isValidated, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: () => setError(undefined) }), retried ? (jsxs(Fragment, { children: [jsxs(Typography, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: ["Re-send code in ", count] })), jsxs("span", Object.assign({ className: 'email-verification__retry-container' }, { children: [jsx(SvgCheckCircle, {}), jsx(Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text' }, { children: "Code sent" }))] }))] })) : (!hideRetryButton && (jsxs(Fragment, { children: [jsx(Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'secondary' }, { children: "Did not receive your code yet?" })), jsx(TextButton, Object.assign({ className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry() }, { children: "Re-send code" }))] }))), !isLoginView && (jsx(TextButton, Object.assign({ className: 'email-verification__log-out', onClick: () => handleLogOut() }, { children: "Log out" }))), termsOfServiceUrl && privacyPolicyUrl && isLoginView && (jsx(TosAndPp, { mode: 'logging in', privacyPolicyUrl: privacyPolicyUrl, termsOfServiceUrl: termsOfServiceUrl })), jsx(PoweredByDynamic, {})] })));
+                }), Icon: SignInWithEmailIcon, iconSize: 80, isSpinning: true })), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', className: 'email-verification__title', color: 'primary' }, { children: "Confirm verification code" })), jsxs("div", Object.assign({ className: 'email-verification__copy-text-container' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail(email) }))] })), !isLoginView && (jsx(TextButton, Object.assign({ onClick: () => setView('update-email'), className: 'email-verification__text-button', disabled: loading }, { children: "Edit email" }))), jsx(PinField, { initialValue: Array(6).join('.').split('.'), isLoading: loading, handleComplete: isLoginView ? handleEmailLogin : handleComplete, isValidated: isValidated, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: () => setError(undefined) }), retried ? (jsxs(Fragment, { children: [jsxs(Typography, Object.assign({ variant: 'body_small', color: 'secondary' }, { children: ["Re-send code in ", remainingSeconds] })), jsxs("span", Object.assign({ className: 'email-verification__retry-container' }, { children: [jsx(SvgCheckCircle, {}), jsx(Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'primary', className: 'email-verification__retry-container-text' }, { children: "Code sent" }))] }))] })) : (!hideRetryButton && (jsxs(Fragment, { children: [jsx(Typography, Object.assign({ variant: 'body_small', weight: 'medium', color: 'secondary' }, { children: "Did not receive your code yet?" })), jsx(TextButton, Object.assign({ className: 'email-verification__text-button', disabled: loading || isValidated, onClick: () => handleRetry() }, { children: "Re-send code" }))] }))), !isLoginView && (jsx(TextButton, Object.assign({ className: 'email-verification__log-out', onClick: handleLogOut }, { children: "Log out" }))), jsx(PoweredByDynamic, {})] })));
 };
 
 export { EmailVerification };

package/src/lib/views/EmailWalletOTPVerificationView/EmailWalletOTPVerificationView.cjs

@@ -19,6 +19,7 @@ require('ethers');
 require('../../shared/consts/index.cjs');
 require('@dynamic-labs/multi-wallet');
 require('@dynamic-labs/rpc-providers');
+require('../../utils/hooks/useWallets/utils/verifyMagicIsSetup/verifyMagicIsSetup.cjs');
 require('../../context/ErrorContext/ErrorContext.cjs');
 require('../../context/AccessDeniedContext/AccessDeniedContext.cjs');
 require('react-dom');
@@ -35,7 +36,8 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
-require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('../../components/InlineWidget/InlineWidget.cjs');
+require('../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 var useMutation = require('../../utils/hooks/useMutation/useMutation.cjs');
@@ -44,7 +46,7 @@ require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 const EmailWalletOTPVerificationView = () => {
     const { setView } = ViewContext.useViewContext();
     const [error, setError] = React.useState();
-    const { selectedWalletConnector: emailWalletConnector, termsOfServiceUrl, privacyPolicyUrl, clearStatesOnBackClick, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { selectedWalletConnector: emailWalletConnector, clearStatesOnBackClick, } = useInternalDynamicContext.useInternalDynamicContext();
     if (!emailWalletConnector ||
         !walletConnectorCore.isEmailOTPWalletConnector(emailWalletConnector)) {
         throw new Error('Current wallet is not EmailWalletConnector');
@@ -61,7 +63,7 @@ const EmailWalletOTPVerificationView = () => {
     const { data: isValid, isLoading, mutate: onSubmit, } = useMutation.useMutation((otp) => emailWalletConnector.verifyOneTimePassword(otp), {
         onFailure: (error) => setError(error),
     });
-    return (jsxRuntime.jsx(OTPVerificationView.OTPVerificationView, { email: email, error: error, onClickBack: handleBackClick, isLoading: isLoading, onPinComplete: onSubmit, isValid: isValid === true, termsOfServiceUrl: termsOfServiceUrl, privacyPolicyUrl: privacyPolicyUrl, onPinChange: () => setError(undefined), onClickEditEmail: handleBackClick, displayPoweredByDynamic: true }));
+    return (jsxRuntime.jsx(OTPVerificationView.OTPVerificationView, { email: email, error: error, onClickBack: handleBackClick, isLoading: isLoading, onPinComplete: onSubmit, isValid: isValid === true, onPinChange: () => setError(undefined), onClickEditEmail: handleBackClick, displayPoweredByDynamic: true }));
 };
 
 exports.EmailWalletOTPVerificationView = EmailWalletOTPVerificationView;