@dynamic-labs/sdk-react-core 4.22.7 → 4.23.0

package/src/lib/widgets/DynamicWidget/views/{ManageMfaWidgetView/ManageMfaWidgetView.js → ManageTotpMfaWidgetView/ManageTotpMfaWidgetView.js}

@@ -31,7 +31,7 @@ import '@dynamic-labs-sdk/client/core';
 import '@dynamic-labs-sdk/client';
 import '../../../../client/client.js';
 import '../../../../events/dynamicEvents.js';
-import '../../../../store/state/projectSettings/projectSettings.js';
+import { useProjectSettings } from '../../../../store/state/projectSettings/projectSettings.js';
 import '../../../../config/ApiEndpoint.js';
 import '../../../../locale/locale.js';
 import '../../../../store/state/dynamicContextProps/dynamicContextProps.js';
@@ -107,7 +107,7 @@ import '../../../../components/IsBrowser/IsBrowser.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
 
-const ManageMfaWidgetView = () => {
+const ManageTotpMfaWidgetView = () => {
     var _a;
     const [userDevices, setUserDevices] = useState([]);
     const [mfaMethod, setMfaMethod] = useState();
@@ -117,7 +117,8 @@ const ManageMfaWidgetView = () => {
     const { clearStackAndPush } = useViewContext();
     const { getUserDevices, deleteUserDevice } = useMfa();
     const { t } = useTranslation();
-    const { projectSettings, setShowAuthFlow } = useInternalDynamicContext();
+    const { setShowAuthFlow } = useInternalDynamicContext();
+    const projectSettings = useProjectSettings();
     const isMfaRequired = Boolean((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.mfa) === null || _a === void 0 ? void 0 : _a.required);
     const getDevices = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
         setLoading(true);
@@ -146,12 +147,12 @@ const ManageMfaWidgetView = () => {
     useEffectOnce(() => {
         getDevices();
     });
-    const backButton = dynamicWidgetView === 'manage-mfa' ? (jsx(IconButton, { type: 'button', onClick: () => setDynamicWidgetView('account-and-security-settings'), "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) })) : undefined;
+    const backButton = dynamicWidgetView === 'manage-totp-mfa' ? (jsx(IconButton, { type: 'button', onClick: () => setDynamicWidgetView('account-and-security-settings'), "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) })) : undefined;
     const handleGenerateBackupCodes = () => __awaiter(void 0, void 0, void 0, function* () {
         setShowAuthFlow(true);
         clearStackAndPush('mfa-display-backup-codes', { regenerateCodes: true });
     });
-    return (jsxs("div", { className: 'manage-mfa-widget-view', children: [jsx(ModalHeader, { leading: backButton, children: jsx("div", { className: 'send-balance-page-layout__header-content', children: jsx(Typography, { variant: 'title', color: 'primary', copykey: 'dyn_manage_mfa.title', children: t('dyn_manage_mfa.title') }) }) }), jsxs("div", { className: 'manage-mfa-widget-view__scroll-container', children: [loading && jsx(MfaDeviceTileSkeleton, {}), !loading && userDevices.length === 0 && (jsx(Typography, { className: 'manage-mfa-widget-view__no-devices', variant: 'body_normal', color: 'secondary', copykey: 'dyn_manage_mfa.no_devices', children: t('dyn_manage_mfa.no_devices') })), userDevices.map((device, index) => (jsx(UserDeviceTile, { isMfaRequired: isMfaRequired, userDevice: device, index: index, deleteDevice: deleteDevice }, device.id)))] }), jsx("div", { className: 'manage-mfa-widget-view__add-mfa-button-container', children: userDevices.length > 0 ? (jsx(TypographyButton, { buttonClassName: 'manage-mfa-widget-view__add-mfa-button-container__button', onClick: handleGenerateBackupCodes, copykey: 'dyn_manage_mfa.generate_backup_codes_button', children: t('dyn_manage_mfa.generate_backup_codes_button') })) : (jsx(TypographyButton, { buttonClassName: 'manage-mfa-widget-view__add-mfa-button-container__button', onClick: () => setShowMfaQRCode(true), copykey: 'dyn_manage_mfa.add_mfa_button', startSlot: jsx(SvgAdd, {}), children: t('dyn_manage_mfa.add_mfa_button') })) })] }));
+    return (jsxs("div", { className: 'manage-totp-mfa-widget-view', children: [jsx(ModalHeader, { leading: backButton, children: jsx("div", { className: 'send-balance-page-layout__header-content', children: jsx(Typography, { variant: 'title', color: 'primary', copykey: 'dyn_manage_mfa.title', children: t('dyn_manage_mfa.title') }) }) }), jsxs("div", { className: 'manage-totp-mfa-widget-view__scroll-container', children: [loading && jsx(MfaDeviceTileSkeleton, {}), !loading && userDevices.length === 0 && (jsx(Typography, { className: 'manage-totp-mfa-widget-view__no-devices', variant: 'body_normal', color: 'secondary', copykey: 'dyn_manage_mfa.no_devices', children: t('dyn_manage_mfa.no_devices') })), userDevices.map((device, index) => (jsx(UserDeviceTile, { isMfaRequired: isMfaRequired, userDevice: device, index: index, deleteDevice: deleteDevice }, device.id)))] }), jsx("div", { className: 'manage-totp-mfa-widget-view__add-mfa-button-container', children: userDevices.length > 0 ? (jsx(TypographyButton, { buttonClassName: 'manage-totp-mfa-widget-view__add-mfa-button-container__button', onClick: handleGenerateBackupCodes, copykey: 'dyn_manage_mfa.generate_backup_codes_button', children: t('dyn_manage_mfa.generate_backup_codes_button') })) : (jsx(TypographyButton, { buttonClassName: 'manage-totp-mfa-widget-view__add-mfa-button-container__button', onClick: () => setShowMfaQRCode(true), copykey: 'dyn_manage_mfa.add_mfa_button', startSlot: jsx(SvgAdd, {}), children: t('dyn_manage_mfa.add_mfa_button') })) })] }));
 };
 
-export { ManageMfaWidgetView };
+export { ManageTotpMfaWidgetView };

package/src/lib/widgets/DynamicWidget/views/{ManageMfaWidgetView → ManageTotpMfaWidgetView}/components/UserDeviceTile.cjs

@@ -11,7 +11,7 @@ var authenticator = require('../../../../../shared/assets/authenticator.cjs');
 require('@dynamic-labs/iconic');
 require('../../../../../context/ViewContext/ViewContext.cjs');
 var DotsMenu = require('../../../components/DotsMenu/DotsMenu.cjs');
-var getTimeSince = require('../../../helpers/getTimeSince.cjs');
+var getTimeSince = require('../../../../../utils/functions/getTimeSince/getTimeSince.cjs');
 
 const UserDeviceTile = ({ userDevice, deleteDevice, isMfaRequired, }) => {
     const { t } = reactI18next.useTranslation();
@@ -24,10 +24,10 @@ const UserDeviceTile = ({ userDevice, deleteDevice, isMfaRequired, }) => {
         },
     ];
     const timeSinceCreated = userDevice.verifiedAt && getTimeSince.getTimeSince(new Date(userDevice.verifiedAt));
-    return (jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__list-tile', children: [jsxRuntime.jsx(authenticator.ReactComponent, { className: 'manage-mfa-widget-view__list-tile__icon' }), jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__list-tile__details', children: [jsxRuntime.jsx("div", { className: 'manage-mfa-widget-view__list-tile__details__title', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: userDevice.alias || 'Authenticator App' }) }), timeSinceCreated && (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), isMfaRequired || (jsxRuntime.jsx("div", { style: {
+    return (jsxRuntime.jsxs("div", { className: 'manage-totp-mfa-widget-view__list-tile', children: [jsxRuntime.jsx(authenticator.ReactComponent, { className: 'manage-totp-mfa-widget-view__list-tile__icon' }), jsxRuntime.jsxs("div", { className: 'manage-totp-mfa-widget-view__list-tile__details', children: [jsxRuntime.jsx("div", { className: 'manage-totp-mfa-widget-view__list-tile__details__title', children: jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: userDevice.alias || 'Authenticator App' }) }), timeSinceCreated && (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), isMfaRequired || (jsxRuntime.jsx("div", { style: {
                     cursor: 'pointer',
                     display: 'flex',
-                }, children: jsxRuntime.jsx(DotsMenu.DotsMenu, { direction: 'left', "data-testid": 'dots-menu', options: optionsMenu, buttonClassName: 'manage-mfa-widget-view__list-tile__dots-menu', buttonClassNameWithOpenMenu: 'manage-mfa-widget-view__list-tile__dots-menu' }) }))] }, userDevice.id));
+                }, children: jsxRuntime.jsx(DotsMenu.DotsMenu, { direction: 'left', "data-testid": 'dots-menu', options: optionsMenu, buttonClassName: 'manage-totp-mfa-widget-view__list-tile__dots-menu', buttonClassNameWithOpenMenu: 'manage-totp-mfa-widget-view__list-tile__dots-menu' }) }))] }, userDevice.id));
 };
 
 exports.UserDeviceTile = UserDeviceTile;

package/src/lib/widgets/DynamicWidget/views/{ManageMfaWidgetView → ManageTotpMfaWidgetView}/components/UserDeviceTile.js

@@ -7,7 +7,7 @@ import { ReactComponent as SvgAuthenticator } from '../../../../../shared/assets
 import '@dynamic-labs/iconic';
 import '../../../../../context/ViewContext/ViewContext.js';
 import { DotsMenu } from '../../../components/DotsMenu/DotsMenu.js';
-import { getTimeSince } from '../../../helpers/getTimeSince.js';
+import { getTimeSince } from '../../../../../utils/functions/getTimeSince/getTimeSince.js';
 
 const UserDeviceTile = ({ userDevice, deleteDevice, isMfaRequired, }) => {
     const { t } = useTranslation();
@@ -20,10 +20,10 @@ const UserDeviceTile = ({ userDevice, deleteDevice, isMfaRequired, }) => {
         },
     ];
     const timeSinceCreated = userDevice.verifiedAt && getTimeSince(new Date(userDevice.verifiedAt));
-    return (jsxs("div", { className: 'manage-mfa-widget-view__list-tile', children: [jsx(SvgAuthenticator, { className: 'manage-mfa-widget-view__list-tile__icon' }), jsxs("div", { className: 'manage-mfa-widget-view__list-tile__details', children: [jsx("div", { className: 'manage-mfa-widget-view__list-tile__details__title', children: jsx(Typography, { variant: 'body_normal', color: 'primary', children: userDevice.alias || 'Authenticator App' }) }), timeSinceCreated && (jsxs(Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), isMfaRequired || (jsx("div", { style: {
+    return (jsxs("div", { className: 'manage-totp-mfa-widget-view__list-tile', children: [jsx(SvgAuthenticator, { className: 'manage-totp-mfa-widget-view__list-tile__icon' }), jsxs("div", { className: 'manage-totp-mfa-widget-view__list-tile__details', children: [jsx("div", { className: 'manage-totp-mfa-widget-view__list-tile__details__title', children: jsx(Typography, { variant: 'body_normal', color: 'primary', children: userDevice.alias || 'Authenticator App' }) }), timeSinceCreated && (jsxs(Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), isMfaRequired || (jsx("div", { style: {
                     cursor: 'pointer',
                     display: 'flex',
-                }, children: jsx(DotsMenu, { direction: 'left', "data-testid": 'dots-menu', options: optionsMenu, buttonClassName: 'manage-mfa-widget-view__list-tile__dots-menu', buttonClassNameWithOpenMenu: 'manage-mfa-widget-view__list-tile__dots-menu' }) }))] }, userDevice.id));
+                }, children: jsx(DotsMenu, { direction: 'left', "data-testid": 'dots-menu', options: optionsMenu, buttonClassName: 'manage-totp-mfa-widget-view__list-tile__dots-menu', buttonClassNameWithOpenMenu: 'manage-totp-mfa-widget-view__list-tile__dots-menu' }) }))] }, userDevice.id));
 };
 
 export { UserDeviceTile };

package/src/lib/widgets/DynamicWidget/views/ManageTotpMfaWidgetView/index.d.ts

@@ -0,0 +1 @@
+export { ManageTotpMfaWidgetView } from './ManageTotpMfaWidgetView';

package/src/lib/widgets/DynamicWidget/views/SettingsView/SettingsView.cjs

@@ -103,12 +103,13 @@ var EmptyScreen = require('./EmptyScreen/EmptyScreen.cjs');
 require('../../../../context/OnrampContext/OnrampContext.cjs');
 require('../ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 require('../../../../../index.cjs');
+var useIsMfaEnabled = require('../../../../utils/hooks/useIsMfaEnabled/useIsMfaEnabled.cjs');
 require('../../../../store/state/tokenBalances.cjs');
 require('../../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
 var useInternalDynamicContext = require('../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs');
 
 const SettingsView = () => {
-    var _a, _b, _c, _d, _e, _f, _g;
+    var _a, _b, _c, _d, _e;
     const { clearStackAndPush } = ViewContext.useViewContext();
     const { primaryWallet, handleLogOut, setShowAuthFlow } = useInternalDynamicContext.useInternalDynamicContext();
     const projectSettings$1 = projectSettings.useProjectSettings();
@@ -134,9 +135,9 @@ const SettingsView = () => {
     const { getEOAWallet } = useSmartWallets.useSmartWallets();
     const eoaWallet = primaryWallet && getEOAWallet(primaryWallet);
     const wallet = eoaWallet !== null && eoaWallet !== void 0 ? eoaWallet : primaryWallet;
-    const isMfaEnabled = Boolean((_c = (_b = projectSettings$1 === null || projectSettings$1 === void 0 ? void 0 : projectSettings$1.security) === null || _b === void 0 ? void 0 : _b.mfa) === null || _c === void 0 ? void 0 : _c.enabled);
-    const isEmbeddedWallet = Boolean(wallet && ((_e = (_d = wallet === null || wallet === void 0 ? void 0 : wallet.connector) === null || _d === void 0 ? void 0 : _d.key) === null || _e === void 0 ? void 0 : _e.startsWith('turnkey')));
-    const isV3WaasWallet = Boolean(wallet && ((_g = (_f = wallet === null || wallet === void 0 ? void 0 : wallet.connector) === null || _f === void 0 ? void 0 : _f.key) === null || _g === void 0 ? void 0 : _g.startsWith('dynamicwaas')));
+    const isMfaEnabled = useIsMfaEnabled.useIsMfaEnabled();
+    const isEmbeddedWallet = Boolean(wallet && ((_c = (_b = wallet === null || wallet === void 0 ? void 0 : wallet.connector) === null || _b === void 0 ? void 0 : _b.key) === null || _c === void 0 ? void 0 : _c.startsWith('turnkey')));
+    const isV3WaasWallet = Boolean(wallet && ((_e = (_d = wallet === null || wallet === void 0 ? void 0 : wallet.connector) === null || _d === void 0 ? void 0 : _d.key) === null || _e === void 0 ? void 0 : _e.startsWith('dynamicwaas')));
     const shouldShowAccountAndSecuritySettings = isMfaEnabled ||
         isEmbeddedWallet ||
         isV3WaasWallet ||

package/src/lib/widgets/DynamicWidget/views/SettingsView/SettingsView.js

@@ -99,12 +99,13 @@ import { EmptyScreen } from './EmptyScreen/EmptyScreen.js';
 import '../../../../context/OnrampContext/OnrampContext.js';
 import '../ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../../index.js';
+import { useIsMfaEnabled } from '../../../../utils/hooks/useIsMfaEnabled/useIsMfaEnabled.js';
 import '../../../../store/state/tokenBalances.js';
 import '../../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
 import { useInternalDynamicContext } from '../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
 
 const SettingsView = () => {
-    var _a, _b, _c, _d, _e, _f, _g;
+    var _a, _b, _c, _d, _e;
     const { clearStackAndPush } = useViewContext();
     const { primaryWallet, handleLogOut, setShowAuthFlow } = useInternalDynamicContext();
     const projectSettings = useProjectSettings();
@@ -130,9 +131,9 @@ const SettingsView = () => {
     const { getEOAWallet } = useSmartWallets();
     const eoaWallet = primaryWallet && getEOAWallet(primaryWallet);
     const wallet = eoaWallet !== null && eoaWallet !== void 0 ? eoaWallet : primaryWallet;
-    const isMfaEnabled = Boolean((_c = (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security) === null || _b === void 0 ? void 0 : _b.mfa) === null || _c === void 0 ? void 0 : _c.enabled);
-    const isEmbeddedWallet = Boolean(wallet && ((_e = (_d = wallet === null || wallet === void 0 ? void 0 : wallet.connector) === null || _d === void 0 ? void 0 : _d.key) === null || _e === void 0 ? void 0 : _e.startsWith('turnkey')));
-    const isV3WaasWallet = Boolean(wallet && ((_g = (_f = wallet === null || wallet === void 0 ? void 0 : wallet.connector) === null || _f === void 0 ? void 0 : _f.key) === null || _g === void 0 ? void 0 : _g.startsWith('dynamicwaas')));
+    const isMfaEnabled = useIsMfaEnabled();
+    const isEmbeddedWallet = Boolean(wallet && ((_c = (_b = wallet === null || wallet === void 0 ? void 0 : wallet.connector) === null || _b === void 0 ? void 0 : _b.key) === null || _c === void 0 ? void 0 : _c.startsWith('turnkey')));
+    const isV3WaasWallet = Boolean(wallet && ((_e = (_d = wallet === null || wallet === void 0 ? void 0 : wallet.connector) === null || _d === void 0 ? void 0 : _d.key) === null || _e === void 0 ? void 0 : _e.startsWith('dynamicwaas')));
     const shouldShowAccountAndSecuritySettings = isMfaEnabled ||
         isEmbeddedWallet ||
         isV3WaasWallet ||

package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/ManageMfaWidgetView.d.ts

@@ -1,2 +0,0 @@
-import { FC } from 'react';
-export declare const ManageMfaWidgetView: FC;

package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/index.d.ts

@@ -1 +0,0 @@
-export { ManageMfaWidgetView } from './ManageMfaWidgetView';