@dynamic-labs/sdk-react-core 3.0.0-alpha.20 → 3.0.0-alpha.21

package/CHANGELOG.md

@@ -1,4 +1,12 @@
 
+## [3.0.0-alpha.21](https://github.com/dynamic-labs/DynamicAuth/compare/v3.0.0-alpha.20...v3.0.0-alpha.21) (2024-07-17)
+
+
+### Bug Fixes
+
+* invalid email error appears ([#6348](https://github.com/dynamic-labs/DynamicAuth/issues/6348)) ([01bcfd2](https://github.com/dynamic-labs/DynamicAuth/commit/01bcfd2f3cc37083c47c0f26e3398f974f6b6a17))
+* stop unnecessary phantom btc popup when disconnecting ([#6188](https://github.com/dynamic-labs/DynamicAuth/issues/6188)) ([15c2eb5](https://github.com/dynamic-labs/DynamicAuth/commit/15c2eb5da90be93ab917e7c61a873a0e9a568211))
+
 ## [3.0.0-alpha.20](https://github.com/dynamic-labs/DynamicAuth/compare/v3.0.0-alpha.19...v3.0.0-alpha.20) (2024-07-15)
 
 

package/package.cjs

@@ -3,7 +3,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var version = "3.0.0-alpha.20";
+var version = "3.0.0-alpha.21";
 var dependencies = {
 	"@dynamic-labs/sdk-api-core": "0.0.470",
 	"@hcaptcha/react-hcaptcha": "1.4.4",

package/package.js

@@ -1,5 +1,5 @@
 'use client'
-var version = "3.0.0-alpha.20";
+var version = "3.0.0-alpha.21";
 var dependencies = {
 	"@dynamic-labs/sdk-api-core": "0.0.470",
 	"@hcaptcha/react-hcaptcha": "1.4.4",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynamic-labs/sdk-react-core",
-  "version": "3.0.0-alpha.20",
+  "version": "3.0.0-alpha.21",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/dynamic-labs/dynamic-auth.git",
@@ -17,15 +17,15 @@
     "react-i18next": "13.5.0",
     "yup": "0.32.11",
     "react-international-phone": "4.2.5",
-    "@dynamic-labs/iconic": "3.0.0-alpha.20",
-    "@dynamic-labs/logger": "3.0.0-alpha.20",
-    "@dynamic-labs/multi-wallet": "3.0.0-alpha.20",
-    "@dynamic-labs/rpc-providers": "3.0.0-alpha.20",
-    "@dynamic-labs/store": "3.0.0-alpha.20",
-    "@dynamic-labs/types": "3.0.0-alpha.20",
-    "@dynamic-labs/utils": "3.0.0-alpha.20",
-    "@dynamic-labs/wallet-book": "3.0.0-alpha.20",
-    "@dynamic-labs/wallet-connector-core": "3.0.0-alpha.20",
+    "@dynamic-labs/iconic": "3.0.0-alpha.21",
+    "@dynamic-labs/logger": "3.0.0-alpha.21",
+    "@dynamic-labs/multi-wallet": "3.0.0-alpha.21",
+    "@dynamic-labs/rpc-providers": "3.0.0-alpha.21",
+    "@dynamic-labs/store": "3.0.0-alpha.21",
+    "@dynamic-labs/types": "3.0.0-alpha.21",
+    "@dynamic-labs/utils": "3.0.0-alpha.21",
+    "@dynamic-labs/wallet-book": "3.0.0-alpha.21",
+    "@dynamic-labs/wallet-connector-core": "3.0.0-alpha.21",
     "eventemitter3": "5.0.1"
   },
   "devDependencies": {

package/src/lib/components/EmailForm/EmailForm.cjs

@@ -94,7 +94,6 @@ require('qrcode');
 const EmailForm = ({ isLoading, onSubmit, isEmailInvalid = false, currentEmail, emailSubmitButtonInsideInput = false, buttonCopyKey = 'dyn_login.email_form.submit_button.label', isDisabled = false, className, style, }) => {
     const { t } = reactI18next.useTranslation();
     const [emailInput, setEmailInput] = React.useState(currentEmail !== null && currentEmail !== void 0 ? currentEmail : '');
-    const [invalidEmail, setInvalidEmail] = React.useState(isEmailInvalid);
     /** Indicates the state of the input relative to the user's interaction */
     const [isHovered, setIsHovered] = React.useState(false);
     const [isFocused, setIsFocused] = React.useState(false);
@@ -105,12 +104,11 @@ const EmailForm = ({ isLoading, onSubmit, isEmailInvalid = false, currentEmail,
     const handleSubmit = (e) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         e.preventDefault();
         if (!isEmailValid.isEmailValid(emailInput)) {
-            setInvalidEmail(true);
             return;
         }
         onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(emailInput);
     });
-    return (jsxRuntime.jsxs("form", { className: classNames.classNames('login-with-email-form', className), style: style, "data-testid": 'email-form', onSubmit: (e) => handleSubmit(e), children: [jsxRuntime.jsx(Input.Input, { id: 'email_field', value: emailInput, onChange: handleEmailOnChangeEvent, copykey: 'dyn_login.email_form.email_field.label', label: t('dyn_login.email_form.email_field.label'), error: invalidEmail, message: invalidEmail && t('dyn_login.helper.email_form.invalid_email'), suffix: jsxRuntime.jsx(InlineSubmitButton.InlineSubmitButton, { disabled: isLoading || isDisabled, highlighted: emailInput.length > 0, isFocused: isFocused, isHovered: isHovered, emailSubmitButtonInsideInput: emailSubmitButtonInsideInput }), disabled: isLoading || isDisabled, type: 'email', onPointerEnter: () => setIsHovered(true), onPointerLeave: () => setIsHovered(false), onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), autoComplete: 'email' }), !emailSubmitButtonInsideInput && (jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'submit_button', buttonClassName: 'login-with-email-form__button', type: 'submit', loading: isLoading, disabled: isLoading || emailInput.length < 3 || isDisabled, buttonVariant: 'brand-primary', buttonPadding: 'login-screen-height', expanded: true, copykey: buttonCopyKey, typographyProps: {
+    return (jsxRuntime.jsxs("form", { className: classNames.classNames('login-with-email-form', className), style: style, "data-testid": 'email-form', onSubmit: (e) => handleSubmit(e), children: [jsxRuntime.jsx(Input.Input, { id: 'email_field', value: emailInput, onChange: handleEmailOnChangeEvent, copykey: 'dyn_login.email_form.email_field.label', label: t('dyn_login.email_form.email_field.label'), error: isEmailInvalid, message: isEmailInvalid && t('dyn_login.helper.email_form.invalid_email'), suffix: jsxRuntime.jsx(InlineSubmitButton.InlineSubmitButton, { disabled: isLoading || isDisabled, highlighted: emailInput.length > 0, isFocused: isFocused, isHovered: isHovered, emailSubmitButtonInsideInput: emailSubmitButtonInsideInput }), disabled: isLoading || isDisabled, type: 'email', onPointerEnter: () => setIsHovered(true), onPointerLeave: () => setIsHovered(false), onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), autoComplete: 'email' }), !emailSubmitButtonInsideInput && (jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'submit_button', buttonClassName: 'login-with-email-form__button', type: 'submit', loading: isLoading, disabled: isLoading || emailInput.length < 3 || isDisabled, buttonVariant: 'brand-primary', buttonPadding: 'login-screen-height', expanded: true, copykey: buttonCopyKey, typographyProps: {
                     color: 'inherit',
                 }, children: t(buttonCopyKey) }))] }));
 };

package/src/lib/components/EmailForm/EmailForm.js

@@ -90,7 +90,6 @@ import 'qrcode';
 const EmailForm = ({ isLoading, onSubmit, isEmailInvalid = false, currentEmail, emailSubmitButtonInsideInput = false, buttonCopyKey = 'dyn_login.email_form.submit_button.label', isDisabled = false, className, style, }) => {
     const { t } = useTranslation();
     const [emailInput, setEmailInput] = useState(currentEmail !== null && currentEmail !== void 0 ? currentEmail : '');
-    const [invalidEmail, setInvalidEmail] = useState(isEmailInvalid);
     /** Indicates the state of the input relative to the user's interaction */
     const [isHovered, setIsHovered] = useState(false);
     const [isFocused, setIsFocused] = useState(false);
@@ -101,12 +100,11 @@ const EmailForm = ({ isLoading, onSubmit, isEmailInvalid = false, currentEmail,
     const handleSubmit = (e) => __awaiter(void 0, void 0, void 0, function* () {
         e.preventDefault();
         if (!isEmailValid(emailInput)) {
-            setInvalidEmail(true);
             return;
         }
         onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(emailInput);
     });
-    return (jsxs("form", { className: classNames('login-with-email-form', className), style: style, "data-testid": 'email-form', onSubmit: (e) => handleSubmit(e), children: [jsx(Input, { id: 'email_field', value: emailInput, onChange: handleEmailOnChangeEvent, copykey: 'dyn_login.email_form.email_field.label', label: t('dyn_login.email_form.email_field.label'), error: invalidEmail, message: invalidEmail && t('dyn_login.helper.email_form.invalid_email'), suffix: jsx(InlineSubmitButton, { disabled: isLoading || isDisabled, highlighted: emailInput.length > 0, isFocused: isFocused, isHovered: isHovered, emailSubmitButtonInsideInput: emailSubmitButtonInsideInput }), disabled: isLoading || isDisabled, type: 'email', onPointerEnter: () => setIsHovered(true), onPointerLeave: () => setIsHovered(false), onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), autoComplete: 'email' }), !emailSubmitButtonInsideInput && (jsx(TypographyButton, { dataTestId: 'submit_button', buttonClassName: 'login-with-email-form__button', type: 'submit', loading: isLoading, disabled: isLoading || emailInput.length < 3 || isDisabled, buttonVariant: 'brand-primary', buttonPadding: 'login-screen-height', expanded: true, copykey: buttonCopyKey, typographyProps: {
+    return (jsxs("form", { className: classNames('login-with-email-form', className), style: style, "data-testid": 'email-form', onSubmit: (e) => handleSubmit(e), children: [jsx(Input, { id: 'email_field', value: emailInput, onChange: handleEmailOnChangeEvent, copykey: 'dyn_login.email_form.email_field.label', label: t('dyn_login.email_form.email_field.label'), error: isEmailInvalid, message: isEmailInvalid && t('dyn_login.helper.email_form.invalid_email'), suffix: jsx(InlineSubmitButton, { disabled: isLoading || isDisabled, highlighted: emailInput.length > 0, isFocused: isFocused, isHovered: isHovered, emailSubmitButtonInsideInput: emailSubmitButtonInsideInput }), disabled: isLoading || isDisabled, type: 'email', onPointerEnter: () => setIsHovered(true), onPointerLeave: () => setIsHovered(false), onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), autoComplete: 'email' }), !emailSubmitButtonInsideInput && (jsx(TypographyButton, { dataTestId: 'submit_button', buttonClassName: 'login-with-email-form__button', type: 'submit', loading: isLoading, disabled: isLoading || emailInput.length < 3 || isDisabled, buttonVariant: 'brand-primary', buttonPadding: 'login-screen-height', expanded: true, copykey: buttonCopyKey, typographyProps: {
                     color: 'inherit',
                 }, children: t(buttonCopyKey) }))] }));
 };

package/src/lib/context/DynamicContext/DynamicContext.cjs

@@ -34,6 +34,7 @@ require('@dynamic-labs/multi-wallet');
 var getAuthToken = require('../../utils/functions/getAuthToken/getAuthToken.cjs');
 var getMinAuthToken = require('../../utils/functions/getMinAuthToken/getMinAuthToken.cjs');
 require('react-international-phone');
+var version = require('../../../version.cjs');
 var ApiEndpoint = require('../../config/ApiEndpoint.cjs');
 var userActions = require('../../store/actions/userActions/userActions.cjs');
 var settings = require('../../data/api/settings/settings.cjs');
@@ -689,6 +690,12 @@ const InnerDynamicContextProvider = ({ children, theme, settings: settings$1, lo
         id: 'wallet-book',
         type: 'application/json',
     });
+    usePrefetch.usePrefetch({
+        as: 'fetch',
+        href: `${ApiEndpoint.getBaseUrl()}/sdk/${environmentId}/settings?sdkVersion=${encodeURIComponent(`WalletKit/${version.VERSION}`)}`,
+        id: `project-settings-${environmentId}`,
+        type: 'application/json',
+    });
     // DYN-1140 - Opens Widget when multiWalletWidgetState changes
     React.useEffect(() => {
         // If statement to secure SingleWallet widget

package/src/lib/context/DynamicContext/DynamicContext.js

@@ -30,6 +30,7 @@ import '@dynamic-labs/multi-wallet';
 import { getAuthToken } from '../../utils/functions/getAuthToken/getAuthToken.js';
 import { getMinAuthToken } from '../../utils/functions/getMinAuthToken/getMinAuthToken.js';
 import 'react-international-phone';
+import { VERSION } from '../../../version.js';
 import ApiEndpoint from '../../config/ApiEndpoint.js';
 import { setUser } from '../../store/actions/userActions/userActions.js';
 import { sendDynamicProps } from '../../data/api/settings/settings.js';
@@ -685,6 +686,12 @@ const InnerDynamicContextProvider = ({ children, theme, settings, locale, enable
         id: 'wallet-book',
         type: 'application/json',
     });
+    usePrefetch({
+        as: 'fetch',
+        href: `${ApiEndpoint.getBaseUrl()}/sdk/${environmentId}/settings?sdkVersion=${encodeURIComponent(`WalletKit/${VERSION}`)}`,
+        id: `project-settings-${environmentId}`,
+        type: 'application/json',
+    });
     // DYN-1140 - Opens Widget when multiWalletWidgetState changes
     useEffect(() => {
         // If statement to secure SingleWallet widget

package/src/lib/context/DynamicContext/useCustomerCallbacks/useCustomerCallbacks.cjs

@@ -75,9 +75,9 @@ const useCustomerCallbacks = ({ callbacks: { onAuthSuccess, onUserProfileUpdate
             return updatedQueue;
         });
     }, [callbackQueue, handleNextCallback, primaryWallet, user]);
-    const setCallback = (callback, params) => {
+    const setCallback = React.useCallback((callback, params) => {
         setCallbackQueue((prev) => [...prev, { callback, params }]);
-    };
+    }, []);
     return { setCallback };
 };
 

package/src/lib/context/DynamicContext/useCustomerCallbacks/useCustomerCallbacks.js

@@ -71,9 +71,9 @@ const useCustomerCallbacks = ({ callbacks: { onAuthSuccess, onUserProfileUpdate
             return updatedQueue;
         });
     }, [callbackQueue, handleNextCallback, primaryWallet, user]);
-    const setCallback = (callback, params) => {
+    const setCallback = useCallback((callback, params) => {
         setCallbackQueue((prev) => [...prev, { callback, params }]);
-    };
+    }, []);
     return { setCallback };
 };
 

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

@@ -4,6 +4,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _tslib = require('../../../../../_virtual/_tslib.cjs');
+var React = require('react');
 require('@dynamic-labs/utils');
 require('@dynamic-labs/sdk-api-core');
 require('../../../shared/logger.cjs');
@@ -11,7 +12,6 @@ require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
 require('react/jsx-runtime');
 require('../../../context/ViewContext/ViewContext.cjs');
-require('react');
 require('@dynamic-labs/wallet-book');
 require('../../constants/colors.cjs');
 require('../../constants/values.cjs');
@@ -101,7 +101,7 @@ const useExternalAuth = () => {
      *
      * @returns {UserProfile} - User profile for successfully signed in user
      */
-    const signInWithExternalJwt = (_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ externalUserId, externalJwt, }) {
+    const signInWithExternalJwt = React.useCallback((_a) => _tslib.__awaiter(void 0, [_a], void 0, function* ({ externalUserId, externalJwt, }) {
         try {
             const userProfile = yield externalAuth.externalAuthSignin({
                 environmentId,
@@ -119,8 +119,8 @@ const useExternalAuth = () => {
             }, { error: e });
             throw e;
         }
-    });
-    return { signInWithExternalJwt };
+    }), [environmentId, setCallback, setShowAuthFlow]);
+    return React.useMemo(() => ({ signInWithExternalJwt }), [signInWithExternalJwt]);
 };
 
 exports.useExternalAuth = useExternalAuth;

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

@@ -1,5 +1,6 @@
 'use client'
 import { __awaiter } from '../../../../../_virtual/_tslib.js';
+import { useCallback, useMemo } from 'react';
 import '@dynamic-labs/utils';
 import '@dynamic-labs/sdk-api-core';
 import '../../../shared/logger.js';
@@ -7,7 +8,6 @@ import '@dynamic-labs/iconic';
 import '@dynamic-labs/wallet-connector-core';
 import 'react/jsx-runtime';
 import '../../../context/ViewContext/ViewContext.js';
-import 'react';
 import '@dynamic-labs/wallet-book';
 import '../../constants/colors.js';
 import '../../constants/values.js';
@@ -97,7 +97,7 @@ const useExternalAuth = () => {
      *
      * @returns {UserProfile} - User profile for successfully signed in user
      */
-    const signInWithExternalJwt = (_a) => __awaiter(void 0, [_a], void 0, function* ({ externalUserId, externalJwt, }) {
+    const signInWithExternalJwt = useCallback((_a) => __awaiter(void 0, [_a], void 0, function* ({ externalUserId, externalJwt, }) {
         try {
             const userProfile = yield externalAuthSignin({
                 environmentId,
@@ -115,8 +115,8 @@ const useExternalAuth = () => {
             }, { error: e });
             throw e;
         }
-    });
-    return { signInWithExternalJwt };
+    }), [environmentId, setCallback, setShowAuthFlow]);
+    return useMemo(() => ({ signInWithExternalJwt }), [signInWithExternalJwt]);
 };
 
 export { useExternalAuth };