@dynamic-labs/sdk-react-core 1.1.0-alpha.3 → 1.1.0-alpha.5
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.
- package/CHANGELOG.md +17 -0
- package/package.cjs +1 -1
- package/package.js +1 -1
- package/package.json +10 -10
- package/src/index.cjs +16 -0
- package/src/index.d.ts +2 -1
- package/src/index.js +8 -0
- package/src/lib/components/index.d.ts +1 -0
- package/src/lib/context/ViewContext/ViewContext.d.ts +1 -1
- package/src/lib/data/api.cjs +15 -0
- package/src/lib/data/api.d.ts +7 -1
- package/src/lib/data/api.js +16 -2
- package/src/lib/events/dynamicEvents.d.ts +2 -0
- package/src/lib/layout/DynamicUserProfileLayout/DynamicUserProfileLayout.cjs +1 -0
- package/src/lib/layout/DynamicUserProfileLayout/DynamicUserProfileLayout.js +2 -1
- package/src/lib/locale/en/translation.cjs +71 -1
- package/src/lib/locale/en/translation.d.ts +70 -0
- package/src/lib/locale/en/translation.js +71 -1
- package/src/lib/shared/assets/alt-embedded-wallet.cjs +54 -0
- package/src/lib/shared/assets/alt-embedded-wallet.js +30 -0
- package/src/lib/shared/assets/export-embedded-hero.cjs +90 -0
- package/src/lib/shared/assets/export-embedded-hero.js +66 -0
- package/src/lib/shared/assets/eye-off-icon.cjs +53 -0
- package/src/lib/shared/assets/eye-off-icon.js +29 -0
- package/src/lib/shared/assets/face-id.cjs +53 -0
- package/src/lib/shared/assets/face-id.js +29 -0
- package/src/lib/shared/assets/index.d.ts +6 -0
- package/src/lib/shared/assets/lock.cjs +54 -0
- package/src/lib/shared/assets/lock.js +30 -0
- package/src/lib/shared/assets/wallet-v2.cjs +53 -0
- package/src/lib/shared/assets/wallet-v2.js +29 -0
- package/src/lib/styles/index.shadow.cjs +1 -1
- package/src/lib/styles/index.shadow.js +1 -1
- package/src/lib/utils/functions/index.d.ts +1 -0
- package/src/lib/utils/functions/isEmailValid/index.d.ts +1 -0
- package/src/lib/utils/functions/isEmailValid/isEmailValid.cjs +8 -0
- package/src/lib/utils/functions/isEmailValid/isEmailValid.d.ts +1 -0
- package/src/lib/utils/functions/isEmailValid/isEmailValid.js +4 -0
- package/src/lib/utils/functions/isProviderEnabled/isProviderEnabled.cjs +9 -1
- package/src/lib/utils/functions/isProviderEnabled/isProviderEnabled.js +9 -1
- package/src/lib/utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.cjs +28 -1
- package/src/lib/utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.js +28 -1
- package/src/lib/utils/hooks/index.d.ts +1 -0
- package/src/lib/utils/hooks/useAuthLayoutChecks/useAuthLayoutChecks.cjs +4 -1
- package/src/lib/utils/hooks/useAuthLayoutChecks/useAuthLayoutChecks.d.ts +1 -0
- package/src/lib/utils/hooks/useAuthLayoutChecks/useAuthLayoutChecks.js +4 -1
- package/src/lib/utils/hooks/useConnectWithEmailOtp/index.d.ts +1 -0
- package/src/lib/utils/hooks/useConnectWithEmailOtp/useConnectWithEmailOtp.cjs +150 -0
- package/src/lib/utils/hooks/useConnectWithEmailOtp/useConnectWithEmailOtp.d.ts +32 -0
- package/src/lib/utils/hooks/useConnectWithEmailOtp/useConnectWithEmailOtp.js +146 -0
- package/src/lib/utils/hooks/useEmailProvider/useEmailProvider.cjs +3 -3
- package/src/lib/utils/hooks/useEmailProvider/useEmailProvider.js +3 -3
- package/src/lib/utils/hooks/useEmbeddedReveal/index.d.ts +1 -0
- package/src/lib/utils/hooks/useEmbeddedReveal/useEmbeddedReveal.cjs +60 -0
- package/src/lib/utils/hooks/useEmbeddedReveal/useEmbeddedReveal.d.ts +4 -0
- package/src/lib/utils/hooks/useEmbeddedReveal/useEmbeddedReveal.js +56 -0
- package/src/lib/utils/hooks/useEmbeddedWallet/useEmbeddedWallet.cjs +3 -0
- package/src/lib/utils/hooks/useEmbeddedWallet/useEmbeddedWallet.js +3 -0
- package/src/lib/utils/hooks/useIsLoggedIn/useIsLoggedIn.cjs +2 -27
- package/src/lib/utils/hooks/useIsLoggedIn/useIsLoggedIn.js +2 -27
- package/src/lib/utils/hooks/useSocialAuth/useSocialAuth.cjs +20 -14
- package/src/lib/utils/hooks/useSocialAuth/useSocialAuth.js +20 -14
- package/src/lib/utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs +26 -4
- package/src/lib/utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js +26 -4
- package/src/lib/views/EmailVerification/EmailVerification.cjs +34 -23
- package/src/lib/views/EmailVerification/EmailVerification.js +34 -23
- package/src/lib/views/EmbeddedReveal/EmbeddedRevealView/EmbeddedRevealView.cjs +158 -0
- package/src/lib/views/EmbeddedReveal/EmbeddedRevealView/EmbeddedRevealView.d.ts +2 -0
- package/src/lib/views/EmbeddedReveal/EmbeddedRevealView/EmbeddedRevealView.js +154 -0
- package/src/lib/views/EmbeddedReveal/EmbeddedRevealView/index.d.ts +1 -0
- package/src/lib/views/EmbeddedReveal/constants.cjs +9 -0
- package/src/lib/views/EmbeddedReveal/constants.d.ts +2 -0
- package/src/lib/views/EmbeddedReveal/constants.js +4 -0
- package/src/lib/views/EmbeddedReveal/index.d.ts +1 -0
- package/src/lib/views/EmbeddedReveal/utils/turnkeyExport/index.d.ts +1 -0
- package/src/lib/views/EmbeddedReveal/utils/turnkeyExport/turnkeyExport.cjs +114 -0
- package/src/lib/views/EmbeddedReveal/utils/turnkeyExport/turnkeyExport.d.ts +15 -0
- package/src/lib/views/EmbeddedReveal/utils/turnkeyExport/turnkeyExport.js +108 -0
- package/src/lib/views/LoginView/sections/EmailSignInSection/LoginEmailForm.cjs +2 -3
- package/src/lib/views/LoginView/sections/EmailSignInSection/LoginEmailForm.d.ts +0 -1
- package/src/lib/views/LoginView/sections/EmailSignInSection/LoginEmailForm.js +3 -3
- package/src/lib/views/Passkey/PasskeyRecovery/InitRecovery/PasskeyInitRecovery.cjs +2 -2
- package/src/lib/views/Passkey/PasskeyRecovery/InitRecovery/PasskeyInitRecovery.js +2 -2
- package/src/lib/views/Passkey/utils/passkeyRecovery/passkeyRecovery.cjs +2 -2
- package/src/lib/views/Passkey/utils/passkeyRecovery/passkeyRecovery.d.ts +2 -2
- package/src/lib/views/Passkey/utils/passkeyRecovery/passkeyRecovery.js +2 -2
- package/src/lib/views/WalletList/WalletList.cjs +5 -8
- package/src/lib/views/WalletList/WalletList.js +5 -8
- package/src/lib/views/viewToComponentMap.cjs +2 -0
- package/src/lib/views/viewToComponentMap.js +2 -0
- package/src/lib/widgets/DynamicWidget/components/ActiveWalletInformation/ActiveWalletInformation.cjs +2 -2
- package/src/lib/widgets/DynamicWidget/components/ActiveWalletInformation/ActiveWalletInformation.js +2 -2
- package/src/lib/widgets/DynamicWidget/components/DynamicWidgetViews/DynamicWidgetViews.cjs +2 -0
- package/src/lib/widgets/DynamicWidget/components/DynamicWidgetViews/DynamicWidgetViews.js +2 -0
- package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.types.cjs +2 -0
- package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.types.d.ts +3 -1
- package/src/lib/widgets/DynamicWidget/context/DynamicWidgetContext.types.js +2 -1
- package/src/lib/widgets/DynamicWidget/views/ManagePasskeysWidgetView/ManagePasskeysWidgetView.cjs +4 -4
- package/src/lib/widgets/DynamicWidget/views/ManagePasskeysWidgetView/ManagePasskeysWidgetView.js +4 -4
- package/src/lib/widgets/DynamicWidget/views/WalletSettingsView/WalletSettingsView.cjs +93 -0
- package/src/lib/widgets/DynamicWidget/views/WalletSettingsView/WalletSettingsView.d.ts +2 -0
- package/src/lib/widgets/DynamicWidget/views/WalletSettingsView/WalletSettingsView.js +89 -0
- package/src/lib/widgets/DynamicWidget/views/WalletSettingsView/index.d.ts +1 -0
- package/src/lib/widgets/DynamicWidget/views/index.d.ts +1 -0
|
@@ -21,6 +21,7 @@ import 'viem';
|
|
|
21
21
|
import '../../../../shared/consts/index.js';
|
|
22
22
|
import '@dynamic-labs/multi-wallet';
|
|
23
23
|
import { isEmailProviderEnabled } from '../../../../utils/functions/isEmailProviderEnabled/isEmailProviderEnabled.js';
|
|
24
|
+
import { isEmailValid } from '../../../../utils/functions/isEmailValid/isEmailValid.js';
|
|
24
25
|
import '../../../../context/AccessDeniedContext/AccessDeniedContext.js';
|
|
25
26
|
import '../../../../context/AccountExistsContext/AccountExistsContext.js';
|
|
26
27
|
import '../../../../config/ApiEndpoint.js';
|
|
@@ -62,7 +63,6 @@ import '../../../../components/Popper/PopperContext/PopperContext.js';
|
|
|
62
63
|
import 'react-focus-lock';
|
|
63
64
|
import { useEmailProvider } from '../../../../utils/hooks/useEmailProvider/useEmailProvider.js';
|
|
64
65
|
|
|
65
|
-
const EMAIL_REGEX = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i;
|
|
66
66
|
const LoginEmailForm = ({ isLoading: isExternalLoading, onSubmit, onSubmitError, currentEmail, }) => {
|
|
67
67
|
var _a, _b, _c;
|
|
68
68
|
const { t } = useTranslation();
|
|
@@ -108,7 +108,7 @@ const LoginEmailForm = ({ isLoading: isExternalLoading, onSubmit, onSubmitError,
|
|
|
108
108
|
const handleSubmit = (e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
109
109
|
var _d;
|
|
110
110
|
e.preventDefault();
|
|
111
|
-
if (!
|
|
111
|
+
if (!isEmailValid(emailInput)) {
|
|
112
112
|
setInvalidEmail(true);
|
|
113
113
|
return;
|
|
114
114
|
}
|
|
@@ -149,4 +149,4 @@ const LoginEmailForm = ({ isLoading: isExternalLoading, onSubmit, onSubmitError,
|
|
|
149
149
|
}, children: "Continue" }))] }));
|
|
150
150
|
};
|
|
151
151
|
|
|
152
|
-
export {
|
|
152
|
+
export { LoginEmailForm };
|
|
@@ -80,7 +80,7 @@ const PasskeyInitRecovery = () => {
|
|
|
80
80
|
const { authToken, primaryWallet, environmentId, setShowAuthFlow, user } = useInternalDynamicContext.useInternalDynamicContext();
|
|
81
81
|
const { isTurnkeyWalletWithoutAuthenticator } = useIsTurnkeyWallet.useIsTurnkeyWallet();
|
|
82
82
|
const { setView } = ViewContext.useViewContext();
|
|
83
|
-
useElementById.useElementById(constants.iframeContainerId);
|
|
83
|
+
const iframeContainerRef = useElementById.useElementById(constants.iframeContainerId);
|
|
84
84
|
const { t } = reactI18next.useTranslation();
|
|
85
85
|
const { mutate: initRecovery, isLoading, error, } = useMutation.useMutation(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
|
|
86
86
|
const wallet = isAccountAbstractionWallet.isAccountAbstractionWallet(primaryWallet)
|
|
@@ -89,7 +89,7 @@ const PasskeyInitRecovery = () => {
|
|
|
89
89
|
yield passkeyRecovery.initPasskeyRecovery({
|
|
90
90
|
authToken,
|
|
91
91
|
environmentId,
|
|
92
|
-
|
|
92
|
+
iframeContainer: iframeContainerRef.current,
|
|
93
93
|
iframeElementId: constants.iframeElementId,
|
|
94
94
|
wallet,
|
|
95
95
|
});
|
|
@@ -76,7 +76,7 @@ const PasskeyInitRecovery = () => {
|
|
|
76
76
|
const { authToken, primaryWallet, environmentId, setShowAuthFlow, user } = useInternalDynamicContext();
|
|
77
77
|
const { isTurnkeyWalletWithoutAuthenticator } = useIsTurnkeyWallet();
|
|
78
78
|
const { setView } = useViewContext();
|
|
79
|
-
useElementById(iframeContainerId);
|
|
79
|
+
const iframeContainerRef = useElementById(iframeContainerId);
|
|
80
80
|
const { t } = useTranslation();
|
|
81
81
|
const { mutate: initRecovery, isLoading, error, } = useMutation(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
82
82
|
const wallet = isAccountAbstractionWallet(primaryWallet)
|
|
@@ -85,7 +85,7 @@ const PasskeyInitRecovery = () => {
|
|
|
85
85
|
yield initPasskeyRecovery({
|
|
86
86
|
authToken,
|
|
87
87
|
environmentId,
|
|
88
|
-
|
|
88
|
+
iframeContainer: iframeContainerRef.current,
|
|
89
89
|
iframeElementId,
|
|
90
90
|
wallet,
|
|
91
91
|
});
|
|
@@ -23,7 +23,7 @@ require('@dynamic-labs/sdk-api');
|
|
|
23
23
|
var removeElementById = require('../../../../utils/functions/removeElementById/removeElementById.cjs');
|
|
24
24
|
var constants = require('../../PasskeyRecovery/constants.cjs');
|
|
25
25
|
|
|
26
|
-
const initPasskeyRecovery = ({ authToken,
|
|
26
|
+
const initPasskeyRecovery = ({ authToken, iframeContainer, iframeElementId, environmentId, wallet, }) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
|
|
27
27
|
var _a;
|
|
28
28
|
if (!authToken) {
|
|
29
29
|
throw new utils.DynamicError('Auth token is not defined');
|
|
@@ -34,7 +34,7 @@ const initPasskeyRecovery = ({ authToken, iframeContainerId, iframeElementId, en
|
|
|
34
34
|
throw new utils.DynamicError('PasskeyWalletConnector not found');
|
|
35
35
|
}
|
|
36
36
|
const turnkeyRecoveryHandler = (_a = wallet.connector) === null || _a === void 0 ? void 0 : _a.getRecoverPasskeyHandler();
|
|
37
|
-
const publicKey = yield turnkeyRecoveryHandler.initRecovery(
|
|
37
|
+
const publicKey = yield turnkeyRecoveryHandler.initRecovery(iframeContainer, iframeElementId);
|
|
38
38
|
if (!publicKey) {
|
|
39
39
|
throw new utils.DynamicError('Something went wrong');
|
|
40
40
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Wallet } from '../../../../shared';
|
|
2
|
-
export declare const initPasskeyRecovery: ({ authToken,
|
|
2
|
+
export declare const initPasskeyRecovery: ({ authToken, iframeContainer, iframeElementId, environmentId, wallet, }: {
|
|
3
3
|
authToken: string | undefined;
|
|
4
|
-
|
|
4
|
+
iframeContainer: HTMLElement;
|
|
5
5
|
iframeElementId: string;
|
|
6
6
|
environmentId: string;
|
|
7
7
|
wallet: Wallet | null;
|
|
@@ -19,7 +19,7 @@ import '@dynamic-labs/sdk-api';
|
|
|
19
19
|
import { removeElementById } from '../../../../utils/functions/removeElementById/removeElementById.js';
|
|
20
20
|
import { iframeContainerId } from '../../PasskeyRecovery/constants.js';
|
|
21
21
|
|
|
22
|
-
const initPasskeyRecovery = ({ authToken,
|
|
22
|
+
const initPasskeyRecovery = ({ authToken, iframeContainer, iframeElementId, environmentId, wallet, }) => __awaiter(void 0, void 0, void 0, function* () {
|
|
23
23
|
var _a;
|
|
24
24
|
if (!authToken) {
|
|
25
25
|
throw new DynamicError('Auth token is not defined');
|
|
@@ -30,7 +30,7 @@ const initPasskeyRecovery = ({ authToken, iframeContainerId, iframeElementId, en
|
|
|
30
30
|
throw new DynamicError('PasskeyWalletConnector not found');
|
|
31
31
|
}
|
|
32
32
|
const turnkeyRecoveryHandler = (_a = wallet.connector) === null || _a === void 0 ? void 0 : _a.getRecoverPasskeyHandler();
|
|
33
|
-
const publicKey = yield turnkeyRecoveryHandler.initRecovery(
|
|
33
|
+
const publicKey = yield turnkeyRecoveryHandler.initRecovery(iframeContainer, iframeElementId);
|
|
34
34
|
if (!publicKey) {
|
|
35
35
|
throw new DynamicError('Something went wrong');
|
|
36
36
|
}
|
|
@@ -15,30 +15,27 @@ require('../../utils/constants/colors.cjs');
|
|
|
15
15
|
var walletListBuilder = require('../../utils/functions/walletListBuilder/walletListBuilder.cjs');
|
|
16
16
|
var classNames = require('../../utils/functions/classNames/classNames.cjs');
|
|
17
17
|
var useInternalDynamicContext = require('../../context/DynamicContext/useInternalDynamicContext.cjs');
|
|
18
|
-
var MockContext = require('../../context/MockContext/MockContext.cjs');
|
|
19
|
-
var ViewContext = require('../../context/ViewContext/ViewContext.cjs');
|
|
20
|
-
var isUserLinkingWallet = require('../../shared/utils/functions/isUserLinkingWallet/isUserLinkingWallet.cjs');
|
|
21
18
|
var index = require('../../utils/functions/walletFilters/index.cjs');
|
|
22
19
|
require('@dynamic-labs/sdk-api');
|
|
23
20
|
require('../../shared/logger.cjs');
|
|
24
21
|
require('@dynamic-labs/iconic');
|
|
25
22
|
require('@dynamic-labs/wallet-connector-core');
|
|
23
|
+
require('../../context/ViewContext/ViewContext.cjs');
|
|
26
24
|
var localStorage = require('../../shared/utils/classes/storage/localStorage.cjs');
|
|
27
25
|
require('viem');
|
|
28
26
|
require('@dynamic-labs/utils');
|
|
29
27
|
require('../../shared/consts/index.cjs');
|
|
30
28
|
var noWalletFound = require('../../assets/no-wallet-found.cjs');
|
|
29
|
+
var useAuthLayoutChecks = require('../../utils/hooks/useAuthLayoutChecks/useAuthLayoutChecks.cjs');
|
|
31
30
|
var SearchNotFoundMessage = require('./SearchNotFoundMessage/SearchNotFoundMessage.cjs');
|
|
32
31
|
var WalletListItem = require('./WalletListItem/WalletListItem.cjs');
|
|
33
32
|
|
|
34
33
|
localStorage.LocalStorage.setToLS(localStorage$1.WALLET_PICKER_SEARCH_KEY, '');
|
|
35
34
|
const WalletList = ({ isWalletConnectList = false, }) => {
|
|
36
35
|
var _a;
|
|
37
|
-
const { walletsFilter, signWithEmailWalletName,
|
|
36
|
+
const { walletsFilter, signWithEmailWalletName, walletConnectorOptions, projectSettings, defaultNumberOfWalletsToShow, bridgeChainsToConnect, connectedWallets, authMode, multiWallet, walletConnector, } = useInternalDynamicContext.useInternalDynamicContext();
|
|
38
37
|
const { walletBook: walletBook$1 } = walletBook.useWalletBookContext();
|
|
39
38
|
const { error } = ErrorContext.useErrorContext();
|
|
40
|
-
const { view } = ViewContext.useViewContext();
|
|
41
|
-
const { mockedSDK } = MockContext.useMockContext();
|
|
42
39
|
const { t } = reactI18next.useTranslation();
|
|
43
40
|
const [filterValue, setFilterValue] = React.useState((_a = localStorage.LocalStorage.getFromLS(localStorage$1.WALLET_PICKER_SEARCH_KEY)) !== null && _a !== void 0 ? _a : '');
|
|
44
41
|
const [footerIsVisible, setFooterIsVisibile] = React.useState(false);
|
|
@@ -62,7 +59,7 @@ const WalletList = ({ isWalletConnectList = false, }) => {
|
|
|
62
59
|
});
|
|
63
60
|
const isSearchEnabled = numberOfWallets > defaultNumberOfWalletsToShow &&
|
|
64
61
|
walletsList.length !== numberOfWallets;
|
|
65
|
-
const
|
|
62
|
+
const { showDefaultFooter } = useAuthLayoutChecks.useAuthLayoutChecks(walletConnector);
|
|
66
63
|
const walletListScrollRef = React.useRef(null);
|
|
67
64
|
/* istanbul ignore next */
|
|
68
65
|
const handleScroll = () => {
|
|
@@ -87,7 +84,7 @@ const WalletList = ({ isWalletConnectList = false, }) => {
|
|
|
87
84
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [searchContainer, Boolean(error) && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, { className: 'wallet-list__error-container', withIcon: false, children: error })), jsxRuntime.jsx("div", { className: 'wallet-list__container', children: jsxRuntime.jsxs("div", { className: classNames.classNames('wallet-list__scroll-container', {
|
|
88
85
|
'wallet-list__scroll-container--error': Boolean(error),
|
|
89
86
|
'wallet-list__scroll-container--full-height': isSearchEnabled,
|
|
90
|
-
}), "data-testid": 'wallet-list-scroll-container', ref: walletListScrollRef, onScroll: handleScroll, children: [!projectSettings ? (jsxRuntime.jsx(Skeleton.Skeleton, { count: 10, className: 'wallet-list__tile-skeleton' })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [walletConnectorOptions.length === 0 && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, { copykey: 'dyn_wallet_list.configuration_mismatch', children: t('dyn_wallet_list.configuration_mismatch') })), walletConnectorOptions.length && walletsList.length === 0 ? (jsxRuntime.jsx(SearchNotFoundMessage.SearchNotFoundMessage, { title: t('dyn_wallet_list.search.not_found.title'), subtitle: t('dyn_wallet_list.search.not_found.description'), image: jsxRuntime.jsx(noWalletFound.ReactComponent, {}) })) : (walletsList.map((wallet, index) => (jsxRuntime.jsx(WalletListItem.WalletListItem, { wallet: wallet, usingMultiWallet: multiWallet, onResetSearchValue: () => handleFilterValueChange('') }, `${wallet.key}_${index}`))))] })), isSearchEnabled && !filterValue && projectSettings && (jsxRuntime.jsx(SearchNotFoundMessage.SearchNotFoundMessage, {}))] }) }),
|
|
87
|
+
}), "data-testid": 'wallet-list-scroll-container', ref: walletListScrollRef, onScroll: handleScroll, children: [!projectSettings ? (jsxRuntime.jsx(Skeleton.Skeleton, { count: 10, className: 'wallet-list__tile-skeleton' })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [walletConnectorOptions.length === 0 && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, { copykey: 'dyn_wallet_list.configuration_mismatch', children: t('dyn_wallet_list.configuration_mismatch') })), walletConnectorOptions.length && walletsList.length === 0 ? (jsxRuntime.jsx(SearchNotFoundMessage.SearchNotFoundMessage, { title: t('dyn_wallet_list.search.not_found.title'), subtitle: t('dyn_wallet_list.search.not_found.description'), image: jsxRuntime.jsx(noWalletFound.ReactComponent, {}) })) : (walletsList.map((wallet, index) => (jsxRuntime.jsx(WalletListItem.WalletListItem, { wallet: wallet, usingMultiWallet: multiWallet, onResetSearchValue: () => handleFilterValueChange('') }, `${wallet.key}_${index}`))))] })), isSearchEnabled && !filterValue && projectSettings && (jsxRuntime.jsx(SearchNotFoundMessage.SearchNotFoundMessage, {}))] }) }), showDefaultFooter && (jsxRuntime.jsx("div", { className: classNames.classNames('wallet-list__tiny-footer', {
|
|
91
88
|
'wallet-list__tiny-footer--hidden': footerIsVisible,
|
|
92
89
|
}), "data-testid": 'wallet-list-tiny-footer' }))] }));
|
|
93
90
|
};
|
|
@@ -11,30 +11,27 @@ import '../../utils/constants/colors.js';
|
|
|
11
11
|
import { walletListBuilder } from '../../utils/functions/walletListBuilder/walletListBuilder.js';
|
|
12
12
|
import { classNames } from '../../utils/functions/classNames/classNames.js';
|
|
13
13
|
import { useInternalDynamicContext } from '../../context/DynamicContext/useInternalDynamicContext.js';
|
|
14
|
-
import { useMockContext } from '../../context/MockContext/MockContext.js';
|
|
15
|
-
import { useViewContext } from '../../context/ViewContext/ViewContext.js';
|
|
16
|
-
import { isUserLinkingWallet } from '../../shared/utils/functions/isUserLinkingWallet/isUserLinkingWallet.js';
|
|
17
14
|
import { FilterBridgeChainsName } from '../../utils/functions/walletFilters/index.js';
|
|
18
15
|
import '@dynamic-labs/sdk-api';
|
|
19
16
|
import '../../shared/logger.js';
|
|
20
17
|
import '@dynamic-labs/iconic';
|
|
21
18
|
import '@dynamic-labs/wallet-connector-core';
|
|
19
|
+
import '../../context/ViewContext/ViewContext.js';
|
|
22
20
|
import { LocalStorage } from '../../shared/utils/classes/storage/localStorage.js';
|
|
23
21
|
import 'viem';
|
|
24
22
|
import '@dynamic-labs/utils';
|
|
25
23
|
import '../../shared/consts/index.js';
|
|
26
24
|
import { ReactComponent as SvgNoWalletFound } from '../../assets/no-wallet-found.js';
|
|
25
|
+
import { useAuthLayoutChecks } from '../../utils/hooks/useAuthLayoutChecks/useAuthLayoutChecks.js';
|
|
27
26
|
import { SearchNotFoundMessage } from './SearchNotFoundMessage/SearchNotFoundMessage.js';
|
|
28
27
|
import { WalletListItem } from './WalletListItem/WalletListItem.js';
|
|
29
28
|
|
|
30
29
|
LocalStorage.setToLS(WALLET_PICKER_SEARCH_KEY, '');
|
|
31
30
|
const WalletList = ({ isWalletConnectList = false, }) => {
|
|
32
31
|
var _a;
|
|
33
|
-
const { walletsFilter, signWithEmailWalletName,
|
|
32
|
+
const { walletsFilter, signWithEmailWalletName, walletConnectorOptions, projectSettings, defaultNumberOfWalletsToShow, bridgeChainsToConnect, connectedWallets, authMode, multiWallet, walletConnector, } = useInternalDynamicContext();
|
|
34
33
|
const { walletBook } = useWalletBookContext();
|
|
35
34
|
const { error } = useErrorContext();
|
|
36
|
-
const { view } = useViewContext();
|
|
37
|
-
const { mockedSDK } = useMockContext();
|
|
38
35
|
const { t } = useTranslation();
|
|
39
36
|
const [filterValue, setFilterValue] = useState((_a = LocalStorage.getFromLS(WALLET_PICKER_SEARCH_KEY)) !== null && _a !== void 0 ? _a : '');
|
|
40
37
|
const [footerIsVisible, setFooterIsVisibile] = useState(false);
|
|
@@ -58,7 +55,7 @@ const WalletList = ({ isWalletConnectList = false, }) => {
|
|
|
58
55
|
});
|
|
59
56
|
const isSearchEnabled = numberOfWallets > defaultNumberOfWalletsToShow &&
|
|
60
57
|
walletsList.length !== numberOfWallets;
|
|
61
|
-
const
|
|
58
|
+
const { showDefaultFooter } = useAuthLayoutChecks(walletConnector);
|
|
62
59
|
const walletListScrollRef = useRef(null);
|
|
63
60
|
/* istanbul ignore next */
|
|
64
61
|
const handleScroll = () => {
|
|
@@ -83,7 +80,7 @@ const WalletList = ({ isWalletConnectList = false, }) => {
|
|
|
83
80
|
return (jsxs(Fragment, { children: [searchContainer, Boolean(error) && (jsx(ErrorContainer, { className: 'wallet-list__error-container', withIcon: false, children: error })), jsx("div", { className: 'wallet-list__container', children: jsxs("div", { className: classNames('wallet-list__scroll-container', {
|
|
84
81
|
'wallet-list__scroll-container--error': Boolean(error),
|
|
85
82
|
'wallet-list__scroll-container--full-height': isSearchEnabled,
|
|
86
|
-
}), "data-testid": 'wallet-list-scroll-container', ref: walletListScrollRef, onScroll: handleScroll, children: [!projectSettings ? (jsx(Skeleton, { count: 10, className: 'wallet-list__tile-skeleton' })) : (jsxs(Fragment, { children: [walletConnectorOptions.length === 0 && (jsx(ErrorContainer, { copykey: 'dyn_wallet_list.configuration_mismatch', children: t('dyn_wallet_list.configuration_mismatch') })), walletConnectorOptions.length && walletsList.length === 0 ? (jsx(SearchNotFoundMessage, { title: t('dyn_wallet_list.search.not_found.title'), subtitle: t('dyn_wallet_list.search.not_found.description'), image: jsx(SvgNoWalletFound, {}) })) : (walletsList.map((wallet, index) => (jsx(WalletListItem, { wallet: wallet, usingMultiWallet: multiWallet, onResetSearchValue: () => handleFilterValueChange('') }, `${wallet.key}_${index}`))))] })), isSearchEnabled && !filterValue && projectSettings && (jsx(SearchNotFoundMessage, {}))] }) }),
|
|
83
|
+
}), "data-testid": 'wallet-list-scroll-container', ref: walletListScrollRef, onScroll: handleScroll, children: [!projectSettings ? (jsx(Skeleton, { count: 10, className: 'wallet-list__tile-skeleton' })) : (jsxs(Fragment, { children: [walletConnectorOptions.length === 0 && (jsx(ErrorContainer, { copykey: 'dyn_wallet_list.configuration_mismatch', children: t('dyn_wallet_list.configuration_mismatch') })), walletConnectorOptions.length && walletsList.length === 0 ? (jsx(SearchNotFoundMessage, { title: t('dyn_wallet_list.search.not_found.title'), subtitle: t('dyn_wallet_list.search.not_found.description'), image: jsx(SvgNoWalletFound, {}) })) : (walletsList.map((wallet, index) => (jsx(WalletListItem, { wallet: wallet, usingMultiWallet: multiWallet, onResetSearchValue: () => handleFilterValueChange('') }, `${wallet.key}_${index}`))))] })), isSearchEnabled && !filterValue && projectSettings && (jsx(SearchNotFoundMessage, {}))] }) }), showDefaultFooter && (jsx("div", { className: classNames('wallet-list__tiny-footer', {
|
|
87
84
|
'wallet-list__tiny-footer--hidden': footerIsVisible,
|
|
88
85
|
}), "data-testid": 'wallet-list-tiny-footer' }))] }));
|
|
89
86
|
};
|
|
@@ -35,6 +35,7 @@ var PasskeyIntroView = require('./Passkey/PasskeyIntroView/PasskeyIntroView.cjs'
|
|
|
35
35
|
var PasskeyBundleRecovery = require('./Passkey/PasskeyRecovery/BundleValidation/PasskeyBundleRecovery.cjs');
|
|
36
36
|
var PasskeyCompleteRecovery = require('./Passkey/PasskeyRecovery/CompleteRecovery/PasskeyCompleteRecovery.cjs');
|
|
37
37
|
var PasskeyInitRecovery = require('./Passkey/PasskeyRecovery/InitRecovery/PasskeyInitRecovery.cjs');
|
|
38
|
+
var EmbeddedRevealView = require('./EmbeddedReveal/EmbeddedRevealView/EmbeddedRevealView.cjs');
|
|
38
39
|
|
|
39
40
|
const viewToComponentMap = {
|
|
40
41
|
'account-exists': jsxRuntime.jsx(AccountExistsView.AccountExistsView, {}),
|
|
@@ -46,6 +47,7 @@ const viewToComponentMap = {
|
|
|
46
47
|
'collect-user-data': jsxRuntime.jsx(CollectUserDataView.CollectUserDataView, {}),
|
|
47
48
|
'collect-user-data-login-with-email': jsxRuntime.jsx(CollectUserDataViewLoginWithEmail.CollectUserDataViewLoginWithEmail, {}),
|
|
48
49
|
'email-wallet-otp-verification-view': jsxRuntime.jsx(EmailWalletOTPVerificationView.EmailWalletOTPVerificationView, {}),
|
|
50
|
+
'embedded-reveal-view': jsxRuntime.jsx(EmbeddedRevealView.EmbeddedRevealView, {}),
|
|
49
51
|
'gate-blocked-wallet': jsxRuntime.jsx(NoAccess.NoAccess, {}),
|
|
50
52
|
'login-with-email-or-wallet': jsxRuntime.jsx(LoginView.LoginView, {}),
|
|
51
53
|
'login-with-email-or-wallet-full-wallet-list': jsxRuntime.jsx(LoginView.LoginView, {}),
|
|
@@ -31,6 +31,7 @@ import { PasskeyIntroView } from './Passkey/PasskeyIntroView/PasskeyIntroView.js
|
|
|
31
31
|
import { PasskeyBundleRecovery } from './Passkey/PasskeyRecovery/BundleValidation/PasskeyBundleRecovery.js';
|
|
32
32
|
import { PasskeyCompleteRecovery } from './Passkey/PasskeyRecovery/CompleteRecovery/PasskeyCompleteRecovery.js';
|
|
33
33
|
import { PasskeyInitRecovery } from './Passkey/PasskeyRecovery/InitRecovery/PasskeyInitRecovery.js';
|
|
34
|
+
import { EmbeddedRevealView } from './EmbeddedReveal/EmbeddedRevealView/EmbeddedRevealView.js';
|
|
34
35
|
|
|
35
36
|
const viewToComponentMap = {
|
|
36
37
|
'account-exists': jsx(AccountExistsView, {}),
|
|
@@ -42,6 +43,7 @@ const viewToComponentMap = {
|
|
|
42
43
|
'collect-user-data': jsx(CollectUserDataView, {}),
|
|
43
44
|
'collect-user-data-login-with-email': jsx(CollectUserDataViewLoginWithEmail, {}),
|
|
44
45
|
'email-wallet-otp-verification-view': jsx(EmailWalletOTPVerificationView, {}),
|
|
46
|
+
'embedded-reveal-view': jsx(EmbeddedRevealView, {}),
|
|
45
47
|
'gate-blocked-wallet': jsx(NoAccess, {}),
|
|
46
48
|
'login-with-email-or-wallet': jsx(LoginView, {}),
|
|
47
49
|
'login-with-email-or-wallet-full-wallet-list': jsx(LoginView, {}),
|
package/src/lib/widgets/DynamicWidget/components/ActiveWalletInformation/ActiveWalletInformation.cjs
CHANGED
|
@@ -101,10 +101,10 @@ const ActiveWalletInformation = () => {
|
|
|
101
101
|
},
|
|
102
102
|
{
|
|
103
103
|
Icon: null,
|
|
104
|
-
callback: () => setDynamicWidgetView('
|
|
104
|
+
callback: () => setDynamicWidgetView('wallet-settings'),
|
|
105
105
|
hide: !(wallet &&
|
|
106
106
|
walletConnectorCore.normalizeWalletName(wallet.connector.name).startsWith('turnkey')),
|
|
107
|
-
text: '
|
|
107
|
+
text: 'Wallet settings',
|
|
108
108
|
},
|
|
109
109
|
{
|
|
110
110
|
Icon: null,
|
package/src/lib/widgets/DynamicWidget/components/ActiveWalletInformation/ActiveWalletInformation.js
CHANGED
|
@@ -97,10 +97,10 @@ const ActiveWalletInformation = () => {
|
|
|
97
97
|
},
|
|
98
98
|
{
|
|
99
99
|
Icon: null,
|
|
100
|
-
callback: () => setDynamicWidgetView('
|
|
100
|
+
callback: () => setDynamicWidgetView('wallet-settings'),
|
|
101
101
|
hide: !(wallet &&
|
|
102
102
|
normalizeWalletName(wallet.connector.name).startsWith('turnkey')),
|
|
103
|
-
text: '
|
|
103
|
+
text: 'Wallet settings',
|
|
104
104
|
},
|
|
105
105
|
{
|
|
106
106
|
Icon: null,
|
|
@@ -9,12 +9,14 @@ var ProfileView = require('../../views/ProfileView/ProfileView.cjs');
|
|
|
9
9
|
var EditProfileView = require('../../views/EditProfileView/EditProfileView.cjs');
|
|
10
10
|
var SendBalanceWidgetView = require('../../views/SendBalanceWidgetView/SendBalanceWidgetView.cjs');
|
|
11
11
|
var ManagePasskeysWidgetView = require('../../views/ManagePasskeysWidgetView/ManagePasskeysWidgetView.cjs');
|
|
12
|
+
var WalletSettingsView = require('../../views/WalletSettingsView/WalletSettingsView.cjs');
|
|
12
13
|
|
|
13
14
|
const mapViewToComponent = {
|
|
14
15
|
'edit-profile': EditProfileView.EditProfileView,
|
|
15
16
|
'manage-passkeys': ManagePasskeysWidgetView.ManagePasskeysWidgetView,
|
|
16
17
|
profile: ProfileView.ProfileView,
|
|
17
18
|
'send-balance': SendBalanceWidgetView.SendBalanceWidgetView,
|
|
19
|
+
'wallet-settings': WalletSettingsView.WalletSettingsView,
|
|
18
20
|
wallets: WalletsView.WalletsView,
|
|
19
21
|
};
|
|
20
22
|
const DynamicWidgetViews = () => {
|
|
@@ -5,12 +5,14 @@ import { ProfileView } from '../../views/ProfileView/ProfileView.js';
|
|
|
5
5
|
import { EditProfileView } from '../../views/EditProfileView/EditProfileView.js';
|
|
6
6
|
import { SendBalanceWidgetView } from '../../views/SendBalanceWidgetView/SendBalanceWidgetView.js';
|
|
7
7
|
import { ManagePasskeysWidgetView } from '../../views/ManagePasskeysWidgetView/ManagePasskeysWidgetView.js';
|
|
8
|
+
import { WalletSettingsView } from '../../views/WalletSettingsView/WalletSettingsView.js';
|
|
8
9
|
|
|
9
10
|
const mapViewToComponent = {
|
|
10
11
|
'edit-profile': EditProfileView,
|
|
11
12
|
'manage-passkeys': ManagePasskeysWidgetView,
|
|
12
13
|
profile: ProfileView,
|
|
13
14
|
'send-balance': SendBalanceWidgetView,
|
|
15
|
+
'wallet-settings': WalletSettingsView,
|
|
14
16
|
wallets: WalletsView,
|
|
15
17
|
};
|
|
16
18
|
const DynamicWidgetViews = () => {
|
|
@@ -2,8 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
const DynamicWalletSettingsViews = ['wallet-settings'];
|
|
5
6
|
const DynamicPasskeyWidgetViews = ['manage-passkeys'];
|
|
6
7
|
const DynamicTransactionsWidgetViews = ['send-balance'];
|
|
7
8
|
|
|
8
9
|
exports.DynamicPasskeyWidgetViews = DynamicPasskeyWidgetViews;
|
|
9
10
|
exports.DynamicTransactionsWidgetViews = DynamicTransactionsWidgetViews;
|
|
11
|
+
exports.DynamicWalletSettingsViews = DynamicWalletSettingsViews;
|
|
@@ -10,8 +10,10 @@ export interface WidgetContextProps {
|
|
|
10
10
|
setIsOpen: Dispatch<SetStateAction<boolean>>;
|
|
11
11
|
widgetRef: RefObject<HTMLDivElement>;
|
|
12
12
|
}
|
|
13
|
+
export declare const DynamicWalletSettingsViews: readonly ["wallet-settings"];
|
|
14
|
+
export type DynamicWalletSettingsType = typeof DynamicWalletSettingsViews[number];
|
|
13
15
|
export declare const DynamicPasskeyWidgetViews: readonly ["manage-passkeys"];
|
|
14
16
|
export type DynamicPasskeyWidgetViewsType = typeof DynamicPasskeyWidgetViews[number];
|
|
15
17
|
export declare const DynamicTransactionsWidgetViews: readonly ["send-balance"];
|
|
16
18
|
export type DynamicTransactionsWidgetViewsType = typeof DynamicTransactionsWidgetViews[number];
|
|
17
|
-
export type DynamicWidgetViews = 'wallets' | 'profile' | 'edit-profile' | DynamicTransactionsWidgetViewsType | DynamicPasskeyWidgetViewsType;
|
|
19
|
+
export type DynamicWidgetViews = 'wallets' | 'profile' | 'edit-profile' | DynamicTransactionsWidgetViewsType | DynamicPasskeyWidgetViewsType | DynamicWalletSettingsType;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
+
const DynamicWalletSettingsViews = ['wallet-settings'];
|
|
1
2
|
const DynamicPasskeyWidgetViews = ['manage-passkeys'];
|
|
2
3
|
const DynamicTransactionsWidgetViews = ['send-balance'];
|
|
3
4
|
|
|
4
|
-
export { DynamicPasskeyWidgetViews, DynamicTransactionsWidgetViews };
|
|
5
|
+
export { DynamicPasskeyWidgetViews, DynamicTransactionsWidgetViews, DynamicWalletSettingsViews };
|
package/src/lib/widgets/DynamicWidget/views/ManagePasskeysWidgetView/ManagePasskeysWidgetView.cjs
CHANGED
|
@@ -16,6 +16,7 @@ require('../../../../context/ViewContext/ViewContext.cjs');
|
|
|
16
16
|
require('@dynamic-labs/sdk-api');
|
|
17
17
|
require('../../../../shared/logger.cjs');
|
|
18
18
|
require('@dynamic-labs/iconic');
|
|
19
|
+
var add = require('../../../../shared/assets/add.cjs');
|
|
19
20
|
var chevronLeft = require('../../../../shared/assets/chevron-left.cjs');
|
|
20
21
|
require('@dynamic-labs/wallet-book');
|
|
21
22
|
require('../../../../utils/constants/colors.cjs');
|
|
@@ -65,13 +66,12 @@ require('@dynamic-labs/viem-utils');
|
|
|
65
66
|
var PasskeyCard = require('./PasskeyCard/PasskeyCard.cjs');
|
|
66
67
|
require('../../../../components/InlineWidget/InlineWidget.cjs');
|
|
67
68
|
require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
|
|
68
|
-
var NeedHelpSection = require('../../../../components/NeedHelpSection/NeedHelpSection.cjs');
|
|
69
69
|
require('../../../../components/Popper/Popper/Popper.cjs');
|
|
70
70
|
require('../../../../components/Popper/PopperContext/PopperContext.cjs');
|
|
71
71
|
require('react-focus-lock');
|
|
72
72
|
|
|
73
73
|
const ManagePasskeysWidgetView = () => {
|
|
74
|
-
const {
|
|
74
|
+
const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
|
|
75
75
|
const { environmentId, projectSettings } = useInternalDynamicContext.useInternalDynamicContext();
|
|
76
76
|
const { initPasskeyRecoveryProcess } = usePasskeyRecovery.usePasskeyRecovery();
|
|
77
77
|
const { t } = reactI18next.useTranslation();
|
|
@@ -90,8 +90,8 @@ const ManagePasskeysWidgetView = () => {
|
|
|
90
90
|
enabled: Boolean(environmentId) && Boolean(userJwt),
|
|
91
91
|
});
|
|
92
92
|
const isRecoveryEnabled = Boolean(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.passkeyEmbeddedWalletRecoveryEnabled);
|
|
93
|
-
const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick:
|
|
94
|
-
return (jsxRuntime.jsxs("div", { className: 'manage-passkeys-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_passkeys.title', children: t('dyn_manage_passkeys.title') }) }) }), jsxRuntime.jsx(PasskeyCreatedSuccessBanner.PasskeyCreatedSuccessBanner, {}), jsxRuntime.jsxs("div", { className: 'manage-passkeys-widget-view__body', children: [jsxRuntime.jsx("div", { className: 'manage-passkeys-widget-view__body__cards', children: isLoading ? (jsxRuntime.jsx(Skeleton.Skeleton, { count: 1, className: 'manage-passkeys-widget-view__body__cards__skeleton' })) : (userPasskeys.map((passkey) => (jsxRuntime.jsx(PasskeyCard.PasskeyCard, { passkey: passkey }, passkey.id)))) }), isRecoveryEnabled && (jsxRuntime.jsx(Button.Button, { buttonPadding: 'large', buttonClassName: 'manage-passkeys-widget-view__body__recovery-button', onClick: initPasskeyRecoveryProcess, showInternalLoading: false, copykey: 'dyn_manage_passkeys.recovery_button', children: t('dyn_manage_passkeys.recovery_button') }))
|
|
93
|
+
const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: () => setDynamicWidgetView('wallet-settings'), "data-testid": 'back-button', children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) }));
|
|
94
|
+
return (jsxRuntime.jsxs("div", { className: 'manage-passkeys-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_passkeys.title', children: t('dyn_manage_passkeys.title') }) }) }), jsxRuntime.jsx(PasskeyCreatedSuccessBanner.PasskeyCreatedSuccessBanner, {}), jsxRuntime.jsxs("div", { className: 'manage-passkeys-widget-view__body', children: [jsxRuntime.jsx("div", { className: 'manage-passkeys-widget-view__body__cards', children: isLoading ? (jsxRuntime.jsx(Skeleton.Skeleton, { count: 1, className: 'manage-passkeys-widget-view__body__cards__skeleton' })) : (userPasskeys.map((passkey) => (jsxRuntime.jsx(PasskeyCard.PasskeyCard, { passkey: passkey }, passkey.id)))) }), isRecoveryEnabled && (jsxRuntime.jsx(Button.Button, { buttonPadding: 'large', buttonClassName: 'manage-passkeys-widget-view__body__recovery-button', onClick: initPasskeyRecoveryProcess, showInternalLoading: false, startSlot: jsxRuntime.jsx(add.ReactComponent, {}), copykey: 'dyn_manage_passkeys.recovery_button', children: t('dyn_manage_passkeys.recovery_button') }))] })] }));
|
|
95
95
|
};
|
|
96
96
|
|
|
97
97
|
exports.ManagePasskeysWidgetView = ManagePasskeysWidgetView;
|
package/src/lib/widgets/DynamicWidget/views/ManagePasskeysWidgetView/ManagePasskeysWidgetView.js
CHANGED
|
@@ -12,6 +12,7 @@ import '../../../../context/ViewContext/ViewContext.js';
|
|
|
12
12
|
import '@dynamic-labs/sdk-api';
|
|
13
13
|
import '../../../../shared/logger.js';
|
|
14
14
|
import '@dynamic-labs/iconic';
|
|
15
|
+
import { ReactComponent as SvgAdd } from '../../../../shared/assets/add.js';
|
|
15
16
|
import { ReactComponent as SvgChevronLeft } from '../../../../shared/assets/chevron-left.js';
|
|
16
17
|
import '@dynamic-labs/wallet-book';
|
|
17
18
|
import '../../../../utils/constants/colors.js';
|
|
@@ -61,13 +62,12 @@ import '@dynamic-labs/viem-utils';
|
|
|
61
62
|
import { PasskeyCard } from './PasskeyCard/PasskeyCard.js';
|
|
62
63
|
import '../../../../components/InlineWidget/InlineWidget.js';
|
|
63
64
|
import '../../../../components/MenuList/Dropdown/Dropdown.js';
|
|
64
|
-
import { NeedHelpSection } from '../../../../components/NeedHelpSection/NeedHelpSection.js';
|
|
65
65
|
import '../../../../components/Popper/Popper/Popper.js';
|
|
66
66
|
import '../../../../components/Popper/PopperContext/PopperContext.js';
|
|
67
67
|
import 'react-focus-lock';
|
|
68
68
|
|
|
69
69
|
const ManagePasskeysWidgetView = () => {
|
|
70
|
-
const {
|
|
70
|
+
const { setDynamicWidgetView } = useWidgetContext();
|
|
71
71
|
const { environmentId, projectSettings } = useInternalDynamicContext();
|
|
72
72
|
const { initPasskeyRecoveryProcess } = usePasskeyRecovery();
|
|
73
73
|
const { t } = useTranslation();
|
|
@@ -86,8 +86,8 @@ const ManagePasskeysWidgetView = () => {
|
|
|
86
86
|
enabled: Boolean(environmentId) && Boolean(userJwt),
|
|
87
87
|
});
|
|
88
88
|
const isRecoveryEnabled = Boolean(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.passkeyEmbeddedWalletRecoveryEnabled);
|
|
89
|
-
const backButton = (jsx(IconButton, { type: 'button', onClick:
|
|
90
|
-
return (jsxs("div", { className: 'manage-passkeys-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_passkeys.title', children: t('dyn_manage_passkeys.title') }) }) }), jsx(PasskeyCreatedSuccessBanner, {}), jsxs("div", { className: 'manage-passkeys-widget-view__body', children: [jsx("div", { className: 'manage-passkeys-widget-view__body__cards', children: isLoading ? (jsx(Skeleton, { count: 1, className: 'manage-passkeys-widget-view__body__cards__skeleton' })) : (userPasskeys.map((passkey) => (jsx(PasskeyCard, { passkey: passkey }, passkey.id)))) }), isRecoveryEnabled && (jsx(Button, { buttonPadding: 'large', buttonClassName: 'manage-passkeys-widget-view__body__recovery-button', onClick: initPasskeyRecoveryProcess, showInternalLoading: false, copykey: 'dyn_manage_passkeys.recovery_button', children: t('dyn_manage_passkeys.recovery_button') }))
|
|
89
|
+
const backButton = (jsx(IconButton, { type: 'button', onClick: () => setDynamicWidgetView('wallet-settings'), "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) }));
|
|
90
|
+
return (jsxs("div", { className: 'manage-passkeys-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_passkeys.title', children: t('dyn_manage_passkeys.title') }) }) }), jsx(PasskeyCreatedSuccessBanner, {}), jsxs("div", { className: 'manage-passkeys-widget-view__body', children: [jsx("div", { className: 'manage-passkeys-widget-view__body__cards', children: isLoading ? (jsx(Skeleton, { count: 1, className: 'manage-passkeys-widget-view__body__cards__skeleton' })) : (userPasskeys.map((passkey) => (jsx(PasskeyCard, { passkey: passkey }, passkey.id)))) }), isRecoveryEnabled && (jsx(Button, { buttonPadding: 'large', buttonClassName: 'manage-passkeys-widget-view__body__recovery-button', onClick: initPasskeyRecoveryProcess, showInternalLoading: false, startSlot: jsx(SvgAdd, {}), copykey: 'dyn_manage_passkeys.recovery_button', children: t('dyn_manage_passkeys.recovery_button') }))] })] }));
|
|
91
91
|
};
|
|
92
92
|
|
|
93
93
|
export { ManagePasskeysWidgetView };
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var reactI18next = require('react-i18next');
|
|
7
|
+
require('react');
|
|
8
|
+
require('../../../../events/dynamicEvents.cjs');
|
|
9
|
+
require('@dynamic-labs/utils');
|
|
10
|
+
var useInternalDynamicContext = require('../../../../context/DynamicContext/useInternalDynamicContext.cjs');
|
|
11
|
+
require('@dynamic-labs/wallet-connector-core');
|
|
12
|
+
require('../../../../context/CaptchaContext/CaptchaContext.cjs');
|
|
13
|
+
require('../../../../context/ErrorContext/ErrorContext.cjs');
|
|
14
|
+
require('../../../../context/ViewContext/ViewContext.cjs');
|
|
15
|
+
var decodeJwt = require('../../../../shared/utils/functions/decodeJwt/decodeJwt.cjs');
|
|
16
|
+
require('@dynamic-labs/iconic');
|
|
17
|
+
var checkCircle = require('../../../../shared/assets/check-circle.cjs');
|
|
18
|
+
var chevronLeft = require('../../../../shared/assets/chevron-left.cjs');
|
|
19
|
+
var lock = require('../../../../shared/assets/lock.cjs');
|
|
20
|
+
var altEmbeddedWallet = require('../../../../shared/assets/alt-embedded-wallet.cjs');
|
|
21
|
+
var faceId = require('../../../../shared/assets/face-id.cjs');
|
|
22
|
+
require('../../../../shared/logger.cjs');
|
|
23
|
+
require('@dynamic-labs/wallet-book');
|
|
24
|
+
require('../../../../utils/constants/colors.cjs');
|
|
25
|
+
require('../../../../shared/utils/classes/storage/localStorage.cjs');
|
|
26
|
+
require('viem');
|
|
27
|
+
require('../../../../shared/consts/index.cjs');
|
|
28
|
+
require('@dynamic-labs/multi-wallet');
|
|
29
|
+
require('@dynamic-labs/sdk-api');
|
|
30
|
+
require('../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
|
|
31
|
+
require('../../../../context/AccountExistsContext/AccountExistsContext.cjs');
|
|
32
|
+
require('../../../../config/ApiEndpoint.cjs');
|
|
33
|
+
require('../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
|
|
34
|
+
require('react-dom');
|
|
35
|
+
require('../../../../context/ThemeContext/ThemeContext.cjs');
|
|
36
|
+
require('@dynamic-labs/types');
|
|
37
|
+
require('yup');
|
|
38
|
+
require('../../../../context/MockContext/MockContext.cjs');
|
|
39
|
+
require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
|
|
40
|
+
require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
|
|
41
|
+
require('@dynamic-labs/rpc-providers');
|
|
42
|
+
require('../../../../context/UserWalletsContext/UserWalletsContext.cjs');
|
|
43
|
+
require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
|
|
44
|
+
require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
|
|
45
|
+
require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
|
|
46
|
+
require('../../../../components/ShadowDOM/ShadowDOM.cjs');
|
|
47
|
+
require('../../../../components/OverlayCard/OverlayCard.context.cjs');
|
|
48
|
+
require('../../../../context/FooterAnimationContext/index.cjs');
|
|
49
|
+
require('../../../../context/QrCodeContext/QrCodeContext.cjs');
|
|
50
|
+
var useIsTurnkeyWallet = require('../../../../utils/hooks/useIsTurnkeyWallet/useIsTurnkeyWallet.cjs');
|
|
51
|
+
var Typography = require('../../../../components/Typography/Typography.cjs');
|
|
52
|
+
require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
|
|
53
|
+
require('../../components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
|
|
54
|
+
require('qrcode');
|
|
55
|
+
require('../../../../context/LoadingContext/LoadingContext.cjs');
|
|
56
|
+
require('i18next');
|
|
57
|
+
var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
|
|
58
|
+
require('../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
|
|
59
|
+
require('formik');
|
|
60
|
+
var Button = require('../../../../components/Button/Button.cjs');
|
|
61
|
+
var ModalHeader = require('../../../../components/ModalHeader/ModalHeader.cjs');
|
|
62
|
+
var IconButton = require('../../../../components/IconButton/IconButton.cjs');
|
|
63
|
+
require('../../../../components/Alert/Alert.cjs');
|
|
64
|
+
require('@dynamic-labs/viem-utils');
|
|
65
|
+
require('../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
|
|
66
|
+
var useEmbeddedReveal = require('../../../../utils/hooks/useEmbeddedReveal/useEmbeddedReveal.cjs');
|
|
67
|
+
require('../../../../components/InlineWidget/InlineWidget.cjs');
|
|
68
|
+
require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
|
|
69
|
+
require('../../../../components/Popper/Popper/Popper.cjs');
|
|
70
|
+
require('../../../../components/Popper/PopperContext/PopperContext.cjs');
|
|
71
|
+
require('react-focus-lock');
|
|
72
|
+
|
|
73
|
+
const WalletSettingsView = () => {
|
|
74
|
+
var _a, _b;
|
|
75
|
+
const { goToInitialDynamicWidgetView, setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
|
|
76
|
+
const { authToken } = useInternalDynamicContext.useInternalDynamicContext();
|
|
77
|
+
const { initExportProcess } = useEmbeddedReveal.useEmbeddedReveal();
|
|
78
|
+
const { isTurnkeyWallet, isTurnkeyWalletWithoutAuthenticator } = useIsTurnkeyWallet.useIsTurnkeyWallet();
|
|
79
|
+
const { t } = reactI18next.useTranslation();
|
|
80
|
+
const decodedJwt = decodeJwt.decodeJwt(authToken);
|
|
81
|
+
const walletProperties = (_b = (_a = decodedJwt === null || decodedJwt === void 0 ? void 0 : decodedJwt.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find(({ walletName }) => walletName === null || walletName === void 0 ? void 0 : walletName.startsWith('turnkey'))) === null || _b === void 0 ? void 0 : _b.walletProperties;
|
|
82
|
+
const isTurnkeyHDWallet = walletProperties === null || walletProperties === void 0 ? void 0 : walletProperties.turnkeyHDWalletId;
|
|
83
|
+
const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: goToInitialDynamicWidgetView, "data-testid": 'back-button', children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) }));
|
|
84
|
+
return (jsxRuntime.jsxs("div", { className: 'wallet-settings-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx("div", { className: 'wallet-settings-view__header', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', children: t('dyn_wallet_settings.title') }) }) }), jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body', children: [jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body__section', children: [jsxRuntime.jsx("div", { className: 'wallet-settings-view__body__section__title', children: t('dyn_wallet_settings.signing_section.title') }), jsxRuntime.jsx(Button.Button, { dataTestId: 'manage-passkeys-button', onClick: () => setDynamicWidgetView('manage-passkeys'), buttonClassName: 'wallet-settings-view__body__section__button', startSlot:
|
|
85
|
+
// eslint-disable-next-line react/jsx-wrap-multilines
|
|
86
|
+
jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(faceId.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', children: t('dyn_wallet_settings.signing_section.passkey_button') })] }), endSlot: isTurnkeyWallet && !isTurnkeyWalletWithoutAuthenticator ? (jsxRuntime.jsx(checkCircle.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon-secondary--success' })) : undefined, showInternalLoading: false })] }), jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body__section', children: [jsxRuntime.jsx("div", { className: 'wallet-settings-view__body__section__title', children: t('dyn_wallet_settings.export_section.title') }), jsxRuntime.jsx(Button.Button, { dataTestId: 'embedded-reveal-button', onClick: initExportProcess, buttonClassName: 'wallet-settings-view__body__section__button', disabled: !isTurnkeyWallet || isTurnkeyWalletWithoutAuthenticator, startSlot:
|
|
87
|
+
// eslint-disable-next-line react/jsx-wrap-multilines
|
|
88
|
+
jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(altEmbeddedWallet.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', children: isTurnkeyHDWallet
|
|
89
|
+
? t('dyn_wallet_settings.export_section.srp_button')
|
|
90
|
+
: t('dyn_wallet_settings.export_section.private_key_button') })] }), endSlot: isTurnkeyWallet && !isTurnkeyWalletWithoutAuthenticator ? (jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon-secondary--rotate' })) : (jsxRuntime.jsx(lock.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon-secondary' })), showInternalLoading: false })] })] })] }));
|
|
91
|
+
};
|
|
92
|
+
|
|
93
|
+
exports.WalletSettingsView = WalletSettingsView;
|