UNPKG

@dynamic-labs/sdk-react-core

Version:

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

268 lines (265 loc) 13.3 kB
'use client' import { __awaiter } from '../../../../../_virtual/_tslib.js'; import { useCallback } from 'react'; import { MFADeviceType, MfaBackupCodeAcknowledgement } from '@dynamic-labs/sdk-api-core'; import '@dynamic-labs/utils'; import '../../../config/ApiEndpoint.js'; import '../../../store/state/projectSettings/projectSettings.js'; import '../../constants/values.js'; import { USER_NOT_LOGGED_IN } from '../../constants/errors.js'; import '@dynamic-labs/multi-wallet'; import '../../../shared/logger.js'; import '../../constants/colors.js'; import 'react-international-phone'; import '@dynamic-labs/iconic'; import '@dynamic-labs/wallet-connector-core'; import 'react/jsx-runtime'; import '../../../context/ViewContext/ViewContext.js'; import '@dynamic-labs/wallet-book'; import '../../../shared/consts/index.js'; import '../../../store/state/nonce/nonce.js'; import { getEnvironmentId } from '../../../store/state/dynamicContextProps/dynamicContextProps.js'; import '../../../store/state/primaryWalletId/primaryWalletId.js'; import { getUser } from '../../../store/state/user/user.js'; import '../../../store/state/connectedWalletsInfo/connectedWalletsInfo.js'; import { authMfaDevice, getUserMfaDevices, updateUserMfaDevice, deleteMfaDevice, addMfaDevice, authMfaRecovery, verifyMfaDevice, createNewRecoveryCodes, getRecoveryCodes } from '../../../data/api/mfa/mfa.js'; import '../../../locale/locale.js'; import { refreshUserJwt } from '../../../data/api/user/user.js'; import { useUserAuth } from '../useUserAuth/useUserAuth.js'; import { dynamicEvents } from '../../../events/dynamicEvents.js'; import { useUserUpdateRequestInternal } from '../useUserUpdateRequest/useUserUpdateRequest.js'; import '../../../context/DynamicContext/DynamicContext.js'; import '../../../store/state/loadingAndLifecycle/loadingAndLifecycle.js'; import '../../../context/CaptchaContext/CaptchaContext.js'; import '../../../context/ErrorContext/ErrorContext.js'; import '../../../context/AccessDeniedContext/AccessDeniedContext.js'; import '../../../context/AccountExistsContext/AccountExistsContext.js'; import '../../../context/UserWalletsContext/UserWalletsContext.js'; import '../../../store/state/authMode/authMode.js'; import '../../../context/VerificationContext/VerificationContext.js'; import 'react-dom'; import '../../functions/compareChains/compareChains.js'; import '../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.js'; import '../../../context/ThemeContext/ThemeContext.js'; import '../useUserUpdateRequest/useUpdateUser/userFieldsSchema.js'; import 'bs58'; import '@dynamic-labs/types'; import '../../../context/SocialRedirectContext/SocialRedirectContext.js'; import 'yup'; import '../../../context/MockContext/MockContext.js'; import '../../../views/CollectUserDataView/useFields.js'; import '@dynamic-labs/rpc-providers'; import '../../../store/state/walletOptions/walletOptions.js'; import 'react-i18next'; import '../../../components/Accordion/components/AccordionItem/AccordionItem.js'; import '../../../components/Alert/Alert.js'; import '../../../context/WalletContext/WalletContext.js'; import '../../../components/ShadowDOM/ShadowDOM.js'; import '../../../components/IconButton/IconButton.js'; import '../../../components/InlineWidget/InlineWidget.js'; import '../../../components/Input/Input.js'; import '../../../components/IsBrowser/IsBrowser.js'; import '../../../components/MenuList/Dropdown/Dropdown.js'; import '../../../components/OverlayCard/OverlayCard.js'; import '../../../components/Transition/ZoomTransition/ZoomTransition.js'; import '../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js'; import '../../../components/Transition/OpacityTransition/OpacityTransition.js'; import '../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js'; import '../../../components/Popper/Popper/Popper.js'; import '../../../components/Popper/PopperContext/PopperContext.js'; import 'react-focus-lock'; import 'qrcode'; import 'formik'; import '../../../context/FieldsStateContext/FieldsStateContext.js'; import '../useSubdomainCheck/useSubdomainCheck.js'; import '../../../context/WalletGroupContext/WalletGroupContext.js'; import '../../../context/IpConfigurationContext/IpConfigurationContext.js'; import '../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js'; import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js'; import '@hcaptcha/react-hcaptcha'; import '../../../context/LoadingContext/LoadingContext.js'; import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js'; import '../../../context/FooterAnimationContext/index.js'; import '../../../context/ErrorContext/hooks/useErrorText/useErrorText.js'; import '../../../context/PasskeyContext/PasskeyContext.js'; import '../../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js'; import '../../../store/state/sendBalances.js'; import '../../../store/state/connectorsInitializing/connectorsInitializing.js'; import '../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js'; import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js'; import '../../../views/TransactionConfirmationView/TransactionConfirmationView.js'; import '../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js'; import '../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.js'; import '../../../context/OnrampContext/OnrampContext.js'; import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js'; import '../../../../index.js'; import '../../../store/state/tokenBalances.js'; import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js'; import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js'; const useMfa = () => { const { completeAuth } = useUserAuth({}); const checkUserIsVerifiedAndGetEnvironmentId = useCallback(() => { const verifiedUser = getUser(); if (!verifiedUser) { throw new Error(USER_NOT_LOGGED_IN); } const environmentId = getEnvironmentId(); return environmentId; }, []); const handleMfaAuth = useCallback((code_1, ...args_1) => __awaiter(void 0, [code_1, ...args_1], void 0, function* (code, type = MFADeviceType.Totp, deviceId, resultHandler) { try { const environmentId = checkUserIsVerifiedAndGetEnvironmentId(); let result; yield completeAuth({ onValidUpdatedJwt: () => __awaiter(void 0, void 0, void 0, function* () { // This callback is used by authDevice }), updateJwtFunction: () => __awaiter(void 0, void 0, void 0, function* () { const response = yield authMfaDevice({ code, createMfaToken: { singleUse: true, }, deviceId, environmentId, type, }); dynamicEvents.emit('mfaCompletionSuccess', { mfaToken: response.mfaToken, }); result = resultHandler(response); return { isEmailVerificationRequired: false, isSmsVerificationRequired: false, missingFields: [], updateUserProfileResponse: response, }; }), }); return result; } catch (error) { dynamicEvents.emit('mfaCompletionFailure', { error }); throw error; } }), [checkUserIsVerifiedAndGetEnvironmentId, completeAuth]); const getUserDevices = useCallback(() => __awaiter(void 0, void 0, void 0, function* () { const environmentId = checkUserIsVerifiedAndGetEnvironmentId(); const devices = yield getUserMfaDevices({ environmentId }); return devices; }), [checkUserIsVerifiedAndGetEnvironmentId]); const updateUserDevice = useCallback((deviceId) => __awaiter(void 0, void 0, void 0, function* () { const environmentId = checkUserIsVerifiedAndGetEnvironmentId(); yield updateUserMfaDevice({ environmentId, mfaDeviceId: deviceId, }); }), [checkUserIsVerifiedAndGetEnvironmentId]); const deleteUserDevice = useCallback((deviceId, mfaAuthToken) => __awaiter(void 0, void 0, void 0, function* () { const environmentId = checkUserIsVerifiedAndGetEnvironmentId(); yield deleteMfaDevice({ environmentId, mfaAuthToken, mfaDeviceId: deviceId, }); // Refresh the user JWT to get the updated MFA acknowledgement // since if it is completed we won't show the QR code again yield refreshUserJwt({ environmentId }); }), [checkUserIsVerifiedAndGetEnvironmentId]); const addDevice = useCallback((...args_2) => __awaiter(void 0, [...args_2], void 0, function* (type = MFADeviceType.Totp) { const environmentId = checkUserIsVerifiedAndGetEnvironmentId(); const { id, secret, uri } = yield addMfaDevice({ environmentId, type, }); return { id, secret, uri }; }), [checkUserIsVerifiedAndGetEnvironmentId]); // @deprecated Use authenticateDevice instead. // This function authenticates a device and returns a boolean value // indicating if the authentication was successful. const authDevice = useCallback((code_2, ...args_3) => __awaiter(void 0, [code_2, ...args_3], void 0, function* (code, type = MFADeviceType.Totp, deviceId) { let isValid = false; yield handleMfaAuth(code, type, deviceId, () => { isValid = true; return true; }); return isValid; }), [handleMfaAuth]); /** * Authenticates a device and returns a single use MFA token * if the authentication is successful. */ const authenticateDevice = useCallback((_a) => __awaiter(void 0, [_a], void 0, function* ({ code, type = MFADeviceType.Totp, deviceId, }) { return handleMfaAuth(code, type, deviceId, (response) => response.mfaToken); }), [handleMfaAuth]); const authRecoveryCode = useCallback((code) => __awaiter(void 0, void 0, void 0, function* () { const environmentId = checkUserIsVerifiedAndGetEnvironmentId(); let isValid = false; yield completeAuth({ onValidUpdatedJwt: () => __awaiter(void 0, void 0, void 0, function* () { isValid = true; }), updateJwtFunction: () => __awaiter(void 0, void 0, void 0, function* () { const response = yield authMfaRecovery({ code, environmentId, }); if (!response) { throw new Error('Failed to authenticate recovey code'); } return { isEmailVerificationRequired: false, isSmsVerificationRequired: false, missingFields: [], // in the mfa flow, we only care about the user in the response updateUserProfileResponse: response, }; }), }); return isValid; }), [checkUserIsVerifiedAndGetEnvironmentId, completeAuth]); const verifyDevice = useCallback((code_3, ...args_4) => __awaiter(void 0, [code_3, ...args_4], void 0, function* (code, type = MFADeviceType.Totp) { const environmentId = checkUserIsVerifiedAndGetEnvironmentId(); const device = yield verifyMfaDevice({ code, environmentId, type, }); if (!device) { throw new Error('Failed to verify device'); } return device; }), [checkUserIsVerifiedAndGetEnvironmentId]); const getRecoveryCodes$1 = useCallback((...args_5) => __awaiter(void 0, [...args_5], void 0, function* (generateNewCodes = false) { const environmentId = checkUserIsVerifiedAndGetEnvironmentId(); const getRecoveryCodesFunc = generateNewCodes ? createNewRecoveryCodes : getRecoveryCodes; const recoveryCodes = yield getRecoveryCodesFunc({ environmentId, }); if (!recoveryCodes) { throw new Error('Recovery codes not found'); } return recoveryCodes; }), [checkUserIsVerifiedAndGetEnvironmentId]); const { updateUser } = useUserUpdateRequestInternal({ validationSchemaStripUnknown: false, }); const completeAcknowledgement = useCallback(() => __awaiter(void 0, void 0, void 0, function* () { yield updateUser({ mfaBackupCodeAcknowledgement: MfaBackupCodeAcknowledgement.Complete, }); }), [updateUser]); return { addDevice, authDevice, authRecoveryCode, authenticateDevice, completeAcknowledgement, deleteUserDevice, getRecoveryCodes: getRecoveryCodes$1, getUserDevices, updateUserDevice, verifyDevice, }; }; export { useMfa };