UNPKG

@dynamic-labs/sdk-react-core

Version:

A React SDK for implementing wallet web3 authentication and authorization to your website.

154 lines (149 loc) 10.2 kB
'use client' 'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var _tslib = require('../../../../../../_virtual/_tslib.cjs'); var jsxRuntime = require('react/jsx-runtime'); var React = require('react'); var reactI18next = require('react-i18next'); var utils = require('@dynamic-labs/utils'); var ErrorContainer = require('../../../../components/ErrorContainer/ErrorContainer.cjs'); var NeedHelpSection = require('../../../../components/NeedHelpSection/NeedHelpSection.cjs'); var PasskeyCreatedSuccessBanner = require('../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs'); var Typography = require('../../../../components/Typography/Typography.cjs'); var TypographyButton = require('../../../../components/TypographyButton/TypographyButton.cjs'); require('../../../../context/DynamicContext/DynamicContext.cjs'); require('../../../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs'); require('@dynamic-labs/sdk-api-core'); var logger = require('../../../../shared/logger.cjs'); require('@dynamic-labs/iconic'); require('@dynamic-labs/wallet-connector-core'); var passkeyIntroIcon = require('../../../../shared/assets/passkey-intro-icon.cjs'); require('../../../../context/ViewContext/ViewContext.cjs'); require('@dynamic-labs/wallet-book'); require('../../../../utils/constants/colors.cjs'); require('../../../../utils/constants/values.cjs'); require('../../../../shared/consts/index.cjs'); var dynamicEvents = require('../../../../events/dynamicEvents.cjs'); require('../../../../context/CaptchaContext/CaptchaContext.cjs'); require('../../../../context/ErrorContext/ErrorContext.cjs'); require('@dynamic-labs/multi-wallet'); require('react-international-phone'); require('../../../../store/state/nonce/nonce.cjs'); require('../../../../store/state/projectSettings/projectSettings.cjs'); require('../../../../config/ApiEndpoint.cjs'); require('../../../../store/state/user/user.cjs'); require('../../../../locale/locale.cjs'); require('../../../../store/state/dynamicContextProps/dynamicContextProps.cjs'); require('../../../../store/state/primaryWalletId/primaryWalletId.cjs'); require('../../../../store/state/connectedWalletsInfo/connectedWalletsInfo.cjs'); require('../../../../context/AccessDeniedContext/AccessDeniedContext.cjs'); require('../../../../context/AccountExistsContext/AccountExistsContext.cjs'); require('../../../../context/UserWalletsContext/UserWalletsContext.cjs'); require('../../../../store/state/authMode/authMode.cjs'); require('../../../../context/VerificationContext/VerificationContext.cjs'); require('react-dom'); require('../../../../utils/functions/compareChains/compareChains.cjs'); require('../../utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.cjs'); require('../../../../context/ThemeContext/ThemeContext.cjs'); var useSmartWallets = require('../../../../utils/hooks/useSmartWallets/useSmartWallets.cjs'); require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs'); var useMutation = require('../../../../utils/hooks/useMutation/useMutation.cjs'); var passkeyRecovery = require('../../utils/passkeyRecovery/passkeyRecovery.cjs'); var useIsTurnkeyWallet = require('../../../../utils/hooks/useIsTurnkeyWallet/useIsTurnkeyWallet.cjs'); require('bs58'); require('@dynamic-labs/types'); require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs'); require('../../../../context/LoadingContext/LoadingContext.cjs'); require('../../../../context/WalletContext/WalletContext.cjs'); require('../../../../utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.cjs'); require('yup'); require('../../../../context/MockContext/MockContext.cjs'); require('../../../CollectUserDataView/useFields.cjs'); require('../../../../context/FieldsStateContext/FieldsStateContext.cjs'); require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs'); require('@dynamic-labs/rpc-providers'); require('../../../../store/state/walletOptions/walletOptions.cjs'); require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs'); require('../../../../components/Alert/Alert.cjs'); require('../../../../components/ShadowDOM/ShadowDOM.cjs'); require('../../../../components/IconButton/IconButton.cjs'); require('../../../../components/InlineWidget/InlineWidget.cjs'); require('../../../../components/Input/Input.cjs'); require('../../../../components/IsBrowser/IsBrowser.cjs'); require('../../../../components/MenuList/Dropdown/Dropdown.cjs'); require('../../../../components/OverlayCard/OverlayCard.cjs'); require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs'); require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs'); require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs'); require('../../../../components/Popper/Popper/Popper.cjs'); require('../../../../components/Popper/PopperContext/PopperContext.cjs'); require('react-focus-lock'); require('qrcode'); require('formik'); require('../../../../utils/hooks/useSubdomainCheck/useSubdomainCheck.cjs'); require('../../../../context/WalletGroupContext/WalletGroupContext.cjs'); require('../../../../context/IpConfigurationContext/IpConfigurationContext.cjs'); require('../../../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs'); require('../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs'); require('@hcaptcha/react-hcaptcha'); var getProperErrorMessage = require('../../../../modals/SignMessageConfirmationModal/getProperErrorMessage.cjs'); require('../../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs'); require('../../../../context/FooterAnimationContext/index.cjs'); require('../../../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs'); var PasskeyDeviceIcon = require('../../PasskeyDeviceIcon/PasskeyDeviceIcon.cjs'); require('../../../../context/PasskeyContext/PasskeyContext.cjs'); require('../../../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.cjs'); require('../../../../store/state/sendBalances.cjs'); require('../../../../store/state/connectorsInitializing/connectorsInitializing.cjs'); require('../../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.cjs'); require('../../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs'); require('../../../TransactionConfirmationView/TransactionConfirmationView.cjs'); require('../../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs'); require('../../../../context/OnrampContext/OnrampContext.cjs'); require('../../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.cjs'); require('../../../../../index.cjs'); require('../../../../store/state/tokenBalances.cjs'); require('../../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs'); var useInternalDynamicContext = require('../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.cjs'); const PasskeyCompleteRecovery = ({ goBack, }) => { const { primaryWallet, environmentId, user, setPasskeySuccessPopup } = useInternalDynamicContext.useInternalDynamicContext(); const { isTurnkeyWalletWithoutAuthenticator } = useIsTurnkeyWallet.useIsTurnkeyWallet(); const { getEOAWallet } = useSmartWallets.useSmartWallets(); const { t } = reactI18next.useTranslation(); const { mutate: completeRecovery, isLoading, error, } = useMutation.useMutation(() => _tslib.__awaiter(void 0, void 0, void 0, function* () { var _a; const wallet = (_a = (primaryWallet && getEOAWallet(primaryWallet))) !== null && _a !== void 0 ? _a : primaryWallet; const updatedUser = yield passkeyRecovery.completePasskeyRecovery({ environmentId, user, wallet, }); if (!updatedUser) { throw new utils.DynamicError('Error completing passkey recovery'); } dynamicEvents.dynamicEvents.emit('passkeyRecoveryCompleted', primaryWallet); goBack(); setPasskeySuccessPopup(PasskeyCreatedSuccessBanner.PasskeySuccessEnum.CREATED); }), { onFailure: (err) => { logger.logger.error('Failed to init passkey recovery', err); dynamicEvents.dynamicEvents.emit('passkeyRecoveryFailed', err); }, }); const errorText = React.useMemo(() => { if (!error) { return undefined; } if (error instanceof utils.DynamicError) { return error.message; } return getProperErrorMessage.getProperErrorMessage(error); }, [error]); const translationKey = isTurnkeyWalletWithoutAuthenticator ? 'dyn_passkey_secure_modal' : 'dyn_passkey_recovery'; return (jsxRuntime.jsxs("div", { className: 'passkey-recovery-view', children: [jsxRuntime.jsx("div", { className: 'passkey-recovery-view__header', children: jsxRuntime.jsx(passkeyIntroIcon.ReactComponent, {}) }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', weight: 'regular', color: 'secondary', className: 'passkey-recovery-view__subtitle', children: t(`${translationKey}.complete.description`) }), errorText && jsxRuntime.jsx(ErrorContainer.ErrorContainer, { children: errorText }), jsxRuntime.jsx("div", { className: 'passkey-recovery-view__actions', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonVariant: 'brand-primary', buttonPadding: 'large', dataTestId: 'passkey-recovery-complete-button', onClick: () => completeRecovery(), disabled: isLoading, showInternalLoading: false, typographyProps: { color: 'inherit', }, children: jsxRuntime.jsxs("div", { className: 'passkey-recovery-view__inline-button', children: [jsxRuntime.jsx(PasskeyDeviceIcon.PasskeyDeviceIcon, { size: 'small' }), jsxRuntime.jsx(Typography.Typography, { children: t(`${translationKey}.complete.complete_button`) })] }) }) }), jsxRuntime.jsx(NeedHelpSection.NeedHelpSection, { isRecoveryFlow: true })] })); }; exports.PasskeyCompleteRecovery = PasskeyCompleteRecovery;