@dynamic-labs/sdk-react-core 3.0.0-alpha.45 → 3.0.0-alpha.47

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (117) hide show
  1. package/CHANGELOG.md +40 -0
  2. package/package.cjs +2 -2
  3. package/package.js +2 -2
  4. package/package.json +13 -13
  5. package/src/index.cjs +2 -2
  6. package/src/index.d.ts +1 -1
  7. package/src/index.js +1 -1
  8. package/src/lib/components/NetworkPicker/components/NonNetworkSwitchingSupportedControl/NonNetworkSwitchingSupportedControl.cjs +1 -1
  9. package/src/lib/components/NetworkPicker/components/NonNetworkSwitchingSupportedControl/NonNetworkSwitchingSupportedControl.js +1 -1
  10. package/src/lib/components/OTPVerificationView/OTPVerificationView.cjs +2 -2
  11. package/src/lib/components/OTPVerificationView/OTPVerificationView.d.ts +1 -0
  12. package/src/lib/components/OTPVerificationView/OTPVerificationView.js +2 -2
  13. package/src/lib/components/PinField/PinField.cjs +2 -2
  14. package/src/lib/components/PinField/PinField.d.ts +1 -1
  15. package/src/lib/components/PinField/PinField.js +2 -2
  16. package/src/lib/components/SendBalanceForm/SendBalanceForm.cjs +2 -2
  17. package/src/lib/components/SendBalanceForm/SendBalanceForm.d.ts +1 -1
  18. package/src/lib/components/SendBalanceForm/SendBalanceForm.js +2 -2
  19. package/src/lib/components/SendBalancePageLayout/SendBalancePageLayout.cjs +3 -3
  20. package/src/lib/components/SendBalancePageLayout/SendBalancePageLayout.d.ts +1 -1
  21. package/src/lib/components/SendBalancePageLayout/SendBalancePageLayout.js +3 -3
  22. package/src/lib/components/SendBalancePageLayout/components/TokensBalanceDropdown/TokensBalanceDropdown.d.ts +1 -1
  23. package/src/lib/components/TransactionConfirmationPageLayout/TransactionConfirmationPageLayout.cjs +3 -3
  24. package/src/lib/components/TransactionConfirmationPageLayout/TransactionConfirmationPageLayout.js +3 -3
  25. package/src/lib/components/TransactionStatusLayout/TransactionStatusLayout.cjs +34 -32
  26. package/src/lib/components/TransactionStatusLayout/TransactionStatusLayout.js +34 -32
  27. package/src/lib/components/UserProfile/parts/UserProfileSocialAccount/UserProfileSocialAccount.cjs +1 -1
  28. package/src/lib/components/UserProfile/parts/UserProfileSocialAccount/UserProfileSocialAccount.js +1 -1
  29. package/src/lib/context/DynamicContext/DynamicContext.cjs +16 -12
  30. package/src/lib/context/DynamicContext/DynamicContext.js +17 -13
  31. package/src/lib/context/DynamicContext/types/SettingsOverrides.d.ts +5 -0
  32. package/src/lib/context/DynamicContext/useDynamicContext/useDynamicContext.cjs +1 -2
  33. package/src/lib/context/DynamicContext/useDynamicContext/useDynamicContext.d.ts +1 -1
  34. package/src/lib/context/DynamicContext/useDynamicContext/useDynamicContext.js +1 -2
  35. package/src/lib/data/api/api.cjs +2 -4
  36. package/src/lib/data/api/api.d.ts +6 -2
  37. package/src/lib/data/api/api.js +2 -4
  38. package/src/lib/data/api/chains/balances.cjs +5 -2
  39. package/src/lib/data/api/chains/balances.d.ts +2 -1
  40. package/src/lib/data/api/chains/balances.js +5 -2
  41. package/src/lib/data/api/mfa/mfa.cjs +5 -1
  42. package/src/lib/data/api/mfa/mfa.d.ts +2 -1
  43. package/src/lib/data/api/mfa/mfa.js +6 -2
  44. package/src/lib/events/dynamicEvents.d.ts +2 -1
  45. package/src/lib/events/tokenBalances.d.ts +3 -0
  46. package/src/lib/layout/DynamicAuthLayout/WalletProgressStepper/WalletProgressStepper.cjs +1 -1
  47. package/src/lib/layout/DynamicAuthLayout/WalletProgressStepper/WalletProgressStepper.js +2 -2
  48. package/src/lib/locale/en/translation.cjs +5 -0
  49. package/src/lib/locale/en/translation.d.ts +5 -0
  50. package/src/lib/locale/en/translation.js +5 -0
  51. package/src/lib/shared/utils/functions/chain/getChainDisplayName.cjs +1 -1
  52. package/src/lib/shared/utils/functions/chain/getChainDisplayName.js +2 -2
  53. package/src/lib/store/actions/tokenBalancesActions/index.d.ts +1 -0
  54. package/src/lib/store/actions/tokenBalancesActions/tokenBalancesActions.cjs +12 -0
  55. package/src/lib/store/actions/tokenBalancesActions/tokenBalancesActions.d.ts +7 -0
  56. package/src/lib/store/actions/tokenBalancesActions/tokenBalancesActions.js +8 -0
  57. package/src/lib/store/hooks/useTokenBalancesState/index.d.ts +1 -0
  58. package/src/lib/store/hooks/useTokenBalancesState/useTokenBalancesState.cjs +14 -0
  59. package/src/lib/store/hooks/useTokenBalancesState/useTokenBalancesState.d.ts +1 -0
  60. package/src/lib/store/hooks/useTokenBalancesState/useTokenBalancesState.js +10 -0
  61. package/src/lib/store/index.d.ts +2 -0
  62. package/src/lib/store/store.cjs +6 -0
  63. package/src/lib/store/store.js +6 -0
  64. package/src/lib/store/types.d.ts +8 -1
  65. package/src/lib/styles/index.shadow.cjs +1 -1
  66. package/src/lib/styles/index.shadow.js +1 -1
  67. package/src/lib/utils/hooks/events/useDynamicEvents/useDynamicEvents.d.ts +1 -1
  68. package/src/lib/utils/hooks/index.d.ts +1 -1
  69. package/src/lib/utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/useSecureEnclaveEmbeddedWallet.cjs +8 -1
  70. package/src/lib/utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/useSecureEnclaveEmbeddedWallet.js +8 -1
  71. package/src/lib/utils/hooks/useMfa/useMfa.cjs +2 -1
  72. package/src/lib/utils/hooks/useMfa/useMfa.d.ts +1 -1
  73. package/src/lib/utils/hooks/useMfa/useMfa.js +2 -1
  74. package/src/lib/utils/hooks/useOnlyConnectedMode/useOnlyConnectedMode.d.ts +0 -1
  75. package/src/lib/utils/hooks/useSocialAuth/useSocialAuth.cjs +7 -13
  76. package/src/lib/utils/hooks/useSocialAuth/useSocialAuth.js +7 -13
  77. package/src/lib/utils/hooks/useTokenBalances/useTokenBalances.cjs +29 -19
  78. package/src/lib/utils/hooks/useTokenBalances/useTokenBalances.d.ts +4 -3
  79. package/src/lib/utils/hooks/useTokenBalances/useTokenBalances.js +30 -20
  80. package/src/lib/utils/hooks/useUserAuth/useUserAuth.cjs +2 -1
  81. package/src/lib/utils/hooks/useUserAuth/useUserAuth.js +3 -2
  82. package/src/lib/utils/hooks/useWalletOptions/index.d.ts +1 -0
  83. package/src/lib/utils/hooks/{useSelectWalletOption/useSelectWalletOption.cjs → useWalletOptions/useWalletOptions.cjs} +31 -4
  84. package/src/lib/utils/hooks/useWalletOptions/useWalletOptions.d.ts +9 -0
  85. package/src/lib/utils/hooks/{useSelectWalletOption/useSelectWalletOption.js → useWalletOptions/useWalletOptions.js} +32 -5
  86. package/src/lib/views/BridgeNextWalletConnectionView/BridgeNextWalletConnectionView.cjs +1 -1
  87. package/src/lib/views/BridgeNextWalletConnectionView/BridgeNextWalletConnectionView.js +2 -2
  88. package/src/lib/views/BridgeSummaryView/BridgeSummaryView.cjs +2 -2
  89. package/src/lib/views/BridgeSummaryView/BridgeSummaryView.js +3 -3
  90. package/src/lib/views/BridgeWelcomeView/BridgeWelcomeView.cjs +2 -2
  91. package/src/lib/views/BridgeWelcomeView/BridgeWelcomeView.js +3 -3
  92. package/src/lib/views/MfaVerificationView/MfaVerificationView.cjs +10 -3
  93. package/src/lib/views/MfaVerificationView/MfaVerificationView.js +11 -4
  94. package/src/lib/views/SendBalanceView/SendBalanceView.cjs +23 -7
  95. package/src/lib/views/SendBalanceView/SendBalanceView.js +23 -7
  96. package/src/lib/views/WalletGroupView/components/WalletGroupItem/WalletGroupItem.cjs +1 -1
  97. package/src/lib/views/WalletGroupView/components/WalletGroupItem/WalletGroupItem.js +2 -2
  98. package/src/lib/widgets/DynamicBridgeWidget/components/DynamicBridgeWidgetEmptyCard/DynamicBridgeWidgetEmptyCard.cjs +1 -1
  99. package/src/lib/widgets/DynamicBridgeWidget/components/DynamicBridgeWidgetEmptyCard/DynamicBridgeWidgetEmptyCard.js +2 -2
  100. package/src/lib/widgets/DynamicBridgeWidget/views/WalletsView/WalletsView.cjs +1 -1
  101. package/src/lib/widgets/DynamicBridgeWidget/views/WalletsView/WalletsView.js +2 -2
  102. package/src/lib/widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs +1 -1
  103. package/src/lib/widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js +2 -2
  104. package/src/lib/widgets/DynamicWidget/hooks/useFetchChain/useFetchChain.cjs +1 -1
  105. package/src/lib/widgets/DynamicWidget/hooks/useFetchChain/useFetchChain.js +2 -2
  106. package/src/lib/widgets/DynamicWidget/hooks/useFetchCurrency/useFetchCurrency.cjs +1 -1
  107. package/src/lib/widgets/DynamicWidget/hooks/useFetchCurrency/useFetchCurrency.js +2 -2
  108. package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/ManageMfaWidgetView.cjs +20 -6
  109. package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/ManageMfaWidgetView.js +21 -7
  110. package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/UserDeviceTile.cjs +3 -4
  111. package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/UserDeviceTile.d.ts +2 -1
  112. package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/UserDeviceTile.js +3 -4
  113. package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/utils/sort.cjs +2 -8
  114. package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/utils/sort.d.ts +1 -1
  115. package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/utils/sort.js +2 -8
  116. package/src/lib/utils/hooks/useSelectWalletOption/index.d.ts +0 -1
  117. package/src/lib/utils/hooks/useSelectWalletOption/useSelectWalletOption.d.ts +0 -3
@@ -27,6 +27,7 @@ require('../../../../shared/utils/classes/storage/localStorage.cjs');
27
27
  require('../../../../shared/utils/classes/storage/sessionStorage.cjs');
28
28
  var useEffectOnce = require('../../../../shared/utils/hooks/useEffectOnce/useEffectOnce.cjs');
29
29
  require('../../../../shared/consts/index.cjs');
30
+ var useInternalDynamicContext = require('../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.cjs');
30
31
  require('../../../../context/CaptchaContext/CaptchaContext.cjs');
31
32
  require('../../../../context/ErrorContext/ErrorContext.cjs');
32
33
  require('@dynamic-labs/multi-wallet');
@@ -101,32 +102,45 @@ require('../../../../components/InlineWidget/InlineWidget.cjs');
101
102
  require('qrcode');
102
103
 
103
104
  const ManageMfaWidgetView = () => {
105
+ var _a;
104
106
  const [userDevices, setUserDevices] = React.useState([]);
107
+ const [mfaMethod, setMfaMethod] = React.useState();
105
108
  const [loading, setLoading] = React.useState(false);
106
109
  const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
107
- const { setShowMfaQRCode } = useDynamicModals.useDynamicModals();
110
+ const { setShowMfaQRCode, setShowOTPVerification } = useDynamicModals.useDynamicModals();
108
111
  const { getUserDevices, deleteUserDevice } = useMfa.useMfa();
109
112
  const { t } = reactI18next.useTranslation();
113
+ const { projectSettings } = useInternalDynamicContext.useInternalDynamicContext();
114
+ const isMfaRequired = Boolean((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.mfa) === null || _a === void 0 ? void 0 : _a.required);
110
115
  const getDevices = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
111
116
  setLoading(true);
112
117
  const devices = yield getUserDevices();
113
118
  // set the user devices with the default device first
114
- setUserDevices(sort.sortAndNameDevices(devices));
119
+ setUserDevices(sort.sortDevices(devices));
115
120
  setLoading(false);
116
121
  }), [getUserDevices]);
117
122
  // re-fetch devices when a new device is added
118
- useDynamicEvents.useDynamicEvents('mfaCompletionSuccess', () => getDevices());
123
+ useDynamicEvents.useDynamicEvents('mfaCompletionSuccess', (_b) => _tslib.__awaiter(void 0, [_b], void 0, function* ({ mfaToken }) {
124
+ if (mfaToken) {
125
+ // we now require an MFA token to delete a device which is an async operation
126
+ if ((mfaMethod === null || mfaMethod === void 0 ? void 0 : mfaMethod.action) === 'remove') {
127
+ yield deleteUserDevice(mfaMethod.params.deviceId, mfaToken);
128
+ setMfaMethod(undefined);
129
+ }
130
+ }
131
+ getDevices();
132
+ }));
119
133
  // delete device and then re-fetch devices
120
134
  const deleteDevice = (id) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
121
- yield deleteUserDevice(id);
122
- getDevices();
135
+ setMfaMethod({ action: 'remove', params: { deviceId: id } });
136
+ setShowOTPVerification(true);
123
137
  });
124
138
  // load devices on initial page load
125
139
  useEffectOnce.useEffectOnce(() => {
126
140
  getDevices();
127
141
  });
128
142
  const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) }));
129
- return (jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx("div", { className: 'send-balance-page-layout__header-content', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', copykey: 'dyn_manage_mfa.title', children: t('dyn_manage_mfa.title') }) }) }), jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__scroll-container', children: [loading && jsxRuntime.jsx(MfaDeviceTileSkeleton.MfaDeviceTileSkeleton, {}), !loading && userDevices.length === 0 && (jsxRuntime.jsx(Typography.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) => (jsxRuntime.jsx(UserDeviceTile.UserDeviceTile, { userDevice: device, index: index, deleteDevice: deleteDevice }, device.id)))] }), jsxRuntime.jsx("div", { className: 'manage-mfa-widget-view__add-mfa-button-container', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonClassName: 'manage-mfa-widget-view__add-mfa-button-container__button', onClick: () => setShowMfaQRCode(true), copykey: 'dyn_manage_mfa.add_mfa_button', startSlot: jsxRuntime.jsx(add.ReactComponent, {}), children: t('dyn_manage_mfa.add_mfa_button') }) })] }));
143
+ return (jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx("div", { className: 'send-balance-page-layout__header-content', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', copykey: 'dyn_manage_mfa.title', children: t('dyn_manage_mfa.title') }) }) }), jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__scroll-container', children: [loading && jsxRuntime.jsx(MfaDeviceTileSkeleton.MfaDeviceTileSkeleton, {}), !loading && userDevices.length === 0 && (jsxRuntime.jsx(Typography.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) => (jsxRuntime.jsx(UserDeviceTile.UserDeviceTile, { isMfaRequired: isMfaRequired, userDevice: device, index: index, deleteDevice: deleteDevice }, device.id)))] }), userDevices.length > 0 || (jsxRuntime.jsx("div", { className: 'manage-mfa-widget-view__add-mfa-button-container', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonClassName: 'manage-mfa-widget-view__add-mfa-button-container__button', onClick: () => setShowMfaQRCode(true), copykey: 'dyn_manage_mfa.add_mfa_button', startSlot: jsxRuntime.jsx(add.ReactComponent, {}), children: t('dyn_manage_mfa.add_mfa_button') }) }))] }));
130
144
  };
131
145
 
132
146
  exports.ManageMfaWidgetView = ManageMfaWidgetView;
@@ -23,6 +23,7 @@ import '../../../../shared/utils/classes/storage/localStorage.js';
23
23
  import '../../../../shared/utils/classes/storage/sessionStorage.js';
24
24
  import { useEffectOnce } from '../../../../shared/utils/hooks/useEffectOnce/useEffectOnce.js';
25
25
  import '../../../../shared/consts/index.js';
26
+ import { useInternalDynamicContext } from '../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.js';
26
27
  import '../../../../context/CaptchaContext/CaptchaContext.js';
27
28
  import '../../../../context/ErrorContext/ErrorContext.js';
28
29
  import '@dynamic-labs/multi-wallet';
@@ -71,7 +72,7 @@ import '../../../../context/PasskeyContext/PasskeyContext.js';
71
72
  import '../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
72
73
  import { MfaDeviceTileSkeleton } from '../../../../components/MfaDeviceTileSkeleton/MfaDeviceTileSkeleton.js';
73
74
  import { UserDeviceTile } from './components/UserDeviceTile.js';
74
- import { sortAndNameDevices } from './components/utils/sort.js';
75
+ import { sortDevices } from './components/utils/sort.js';
75
76
  import '../../../../../polyfills.js';
76
77
  import '../../../../context/ErrorBoundary/ErrorBoundaryBase.js';
77
78
  import '../../../../context/ErrorBoundary/ErrorBoundaryContext.js';
@@ -97,32 +98,45 @@ import '../../../../components/InlineWidget/InlineWidget.js';
97
98
  import 'qrcode';
98
99
 
99
100
  const ManageMfaWidgetView = () => {
101
+ var _a;
100
102
  const [userDevices, setUserDevices] = useState([]);
103
+ const [mfaMethod, setMfaMethod] = useState();
101
104
  const [loading, setLoading] = useState(false);
102
105
  const { setDynamicWidgetView } = useWidgetContext();
103
- const { setShowMfaQRCode } = useDynamicModals();
106
+ const { setShowMfaQRCode, setShowOTPVerification } = useDynamicModals();
104
107
  const { getUserDevices, deleteUserDevice } = useMfa();
105
108
  const { t } = useTranslation();
109
+ const { projectSettings } = useInternalDynamicContext();
110
+ const isMfaRequired = Boolean((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security.mfa) === null || _a === void 0 ? void 0 : _a.required);
106
111
  const getDevices = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
107
112
  setLoading(true);
108
113
  const devices = yield getUserDevices();
109
114
  // set the user devices with the default device first
110
- setUserDevices(sortAndNameDevices(devices));
115
+ setUserDevices(sortDevices(devices));
111
116
  setLoading(false);
112
117
  }), [getUserDevices]);
113
118
  // re-fetch devices when a new device is added
114
- useDynamicEvents('mfaCompletionSuccess', () => getDevices());
119
+ useDynamicEvents('mfaCompletionSuccess', (_b) => __awaiter(void 0, [_b], void 0, function* ({ mfaToken }) {
120
+ if (mfaToken) {
121
+ // we now require an MFA token to delete a device which is an async operation
122
+ if ((mfaMethod === null || mfaMethod === void 0 ? void 0 : mfaMethod.action) === 'remove') {
123
+ yield deleteUserDevice(mfaMethod.params.deviceId, mfaToken);
124
+ setMfaMethod(undefined);
125
+ }
126
+ }
127
+ getDevices();
128
+ }));
115
129
  // delete device and then re-fetch devices
116
130
  const deleteDevice = (id) => __awaiter(void 0, void 0, void 0, function* () {
117
- yield deleteUserDevice(id);
118
- getDevices();
131
+ setMfaMethod({ action: 'remove', params: { deviceId: id } });
132
+ setShowOTPVerification(true);
119
133
  });
120
134
  // load devices on initial page load
121
135
  useEffectOnce(() => {
122
136
  getDevices();
123
137
  });
124
138
  const backButton = (jsx(IconButton, { type: 'button', onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) }));
125
- 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, { userDevice: device, index: index, deleteDevice: deleteDevice }, device.id)))] }), jsx("div", { className: 'manage-mfa-widget-view__add-mfa-button-container', children: 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') }) })] }));
139
+ 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)))] }), userDevices.length > 0 || (jsx("div", { className: 'manage-mfa-widget-view__add-mfa-button-container', children: 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') }) }))] }));
126
140
  };
127
141
 
128
142
  export { ManageMfaWidgetView };
@@ -83,7 +83,6 @@ require('../../../../../components/Popper/PopperContext/PopperContext.cjs');
83
83
  require('../../../../../views/WalletList/WalletList.cjs');
84
84
  require('../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
85
85
  require('@hcaptcha/react-hcaptcha');
86
- var Badge = require('../../../../../components/Badge/Badge.cjs');
87
86
  require('../../../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
88
87
  require('../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
89
88
  require('../../../../../context/SendBalanceContext/SendBalanceContext.cjs');
@@ -93,7 +92,7 @@ require('../../../../../context/ReinitializeContext/ReinitializeContextProvider.
93
92
  require('../../../../../components/InlineWidget/InlineWidget.cjs');
94
93
  require('qrcode');
95
94
 
96
- const UserDeviceTile = ({ userDevice, deleteDevice, }) => {
95
+ const UserDeviceTile = ({ userDevice, deleteDevice, isMfaRequired, }) => {
97
96
  const optionsMenu = [
98
97
  {
99
98
  Icon: null,
@@ -102,10 +101,10 @@ const UserDeviceTile = ({ userDevice, deleteDevice, }) => {
102
101
  },
103
102
  ];
104
103
  const timeSinceCreated = userDevice.verifiedAt && getTimeSince.getTimeSince(new Date(userDevice.verifiedAt));
105
- 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.jsxs("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' }), userDevice._default && jsxRuntime.jsx(Badge.Badge, { text: 'Default' })] }), timeSinceCreated && (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), jsxRuntime.jsx("div", { style: {
104
+ 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: {
106
105
  cursor: 'pointer',
107
106
  display: 'flex',
108
- }, 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));
107
+ }, 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));
109
108
  };
110
109
 
111
110
  exports.UserDeviceTile = UserDeviceTile;
@@ -4,5 +4,6 @@ export type UserDeviceTileProps = {
4
4
  userDevice: MFADevice;
5
5
  index: number;
6
6
  deleteDevice: (id: string) => void;
7
+ isMfaRequired: boolean;
7
8
  };
8
- export declare const UserDeviceTile: ({ userDevice, deleteDevice, }: UserDeviceTileProps) => JSX.Element;
9
+ export declare const UserDeviceTile: ({ userDevice, deleteDevice, isMfaRequired, }: UserDeviceTileProps) => JSX.Element;
@@ -79,7 +79,6 @@ import '../../../../../components/Popper/PopperContext/PopperContext.js';
79
79
  import '../../../../../views/WalletList/WalletList.js';
80
80
  import '../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
81
81
  import '@hcaptcha/react-hcaptcha';
82
- import { Badge } from '../../../../../components/Badge/Badge.js';
83
82
  import '../../../../../context/IpConfigurationContext/IpConfigurationContext.js';
84
83
  import '../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
85
84
  import '../../../../../context/SendBalanceContext/SendBalanceContext.js';
@@ -89,7 +88,7 @@ import '../../../../../context/ReinitializeContext/ReinitializeContextProvider.j
89
88
  import '../../../../../components/InlineWidget/InlineWidget.js';
90
89
  import 'qrcode';
91
90
 
92
- const UserDeviceTile = ({ userDevice, deleteDevice, }) => {
91
+ const UserDeviceTile = ({ userDevice, deleteDevice, isMfaRequired, }) => {
93
92
  const optionsMenu = [
94
93
  {
95
94
  Icon: null,
@@ -98,10 +97,10 @@ const UserDeviceTile = ({ userDevice, deleteDevice, }) => {
98
97
  },
99
98
  ];
100
99
  const timeSinceCreated = userDevice.verifiedAt && getTimeSince(new Date(userDevice.verifiedAt));
101
- 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: [jsxs("div", { className: 'manage-mfa-widget-view__list-tile__details__title', children: [jsx(Typography, { variant: 'body_normal', color: 'primary', children: userDevice.alias || 'Authenticator App' }), userDevice._default && jsx(Badge, { text: 'Default' })] }), timeSinceCreated && (jsxs(Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), jsx("div", { style: {
100
+ 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: {
102
101
  cursor: 'pointer',
103
102
  display: 'flex',
104
- }, 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));
103
+ }, 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));
105
104
  };
106
105
 
107
106
  export { UserDeviceTile };
@@ -10,14 +10,8 @@ const sortDevicesByVerifiedDateDesc = (a, b) => {
10
10
  const dateB = b.verifiedAt ? new Date(b.verifiedAt).getTime() : 0;
11
11
  return dateA - dateB;
12
12
  };
13
- const sortAndNameDevices = (devices) => devices
14
- .sort(sortDevicesByVerifiedDateDesc)
15
- .map((device, index) => {
16
- device.alias = device.alias || `Authenticator App ${index + 1}`;
17
- return device;
18
- })
19
- .sort(sortDevicesByDefault);
13
+ const sortDevices = (devices) => devices.sort(sortDevicesByVerifiedDateDesc).sort(sortDevicesByDefault);
20
14
 
21
- exports.sortAndNameDevices = sortAndNameDevices;
15
+ exports.sortDevices = sortDevices;
22
16
  exports.sortDevicesByDefault = sortDevicesByDefault;
23
17
  exports.sortDevicesByVerifiedDateDesc = sortDevicesByVerifiedDateDesc;
@@ -1,4 +1,4 @@
1
1
  import { MFADevice } from '@dynamic-labs/sdk-api-core';
2
2
  export declare const sortDevicesByDefault: (a: MFADevice, b: MFADevice) => 0 | 1 | -1;
3
3
  export declare const sortDevicesByVerifiedDateDesc: (a: MFADevice, b: MFADevice) => number;
4
- export declare const sortAndNameDevices: (devices: MFADevice[]) => MFADevice[];
4
+ export declare const sortDevices: (devices: MFADevice[]) => MFADevice[];
@@ -6,12 +6,6 @@ const sortDevicesByVerifiedDateDesc = (a, b) => {
6
6
  const dateB = b.verifiedAt ? new Date(b.verifiedAt).getTime() : 0;
7
7
  return dateA - dateB;
8
8
  };
9
- const sortAndNameDevices = (devices) => devices
10
- .sort(sortDevicesByVerifiedDateDesc)
11
- .map((device, index) => {
12
- device.alias = device.alias || `Authenticator App ${index + 1}`;
13
- return device;
14
- })
15
- .sort(sortDevicesByDefault);
9
+ const sortDevices = (devices) => devices.sort(sortDevicesByVerifiedDateDesc).sort(sortDevicesByDefault);
16
10
 
17
- export { sortAndNameDevices, sortDevicesByDefault, sortDevicesByVerifiedDateDesc };
11
+ export { sortDevices, sortDevicesByDefault, sortDevicesByVerifiedDateDesc };
@@ -1 +0,0 @@
1
- export { useSelectWalletOption } from './useSelectWalletOption';
@@ -1,3 +0,0 @@
1
- export declare const useSelectWalletOption: () => {
2
- selectWalletOption: (walletKey: string) => Promise<void>;
3
- };