import { useLingui } from '../../../../../../../node_modules/@lingui/react/dist/index.mjs';
import React__default, { useState } from 'react';
import { convertPasswordResetOptions } from '../../../../utils/index.mjs';
import { getTranslatedError } from '../../../../utils/getTranslatedError.mjs';
import Button from '../../../components/atoms/Button.mjs';
import Column from '../../../components/atoms/Column.mjs';
import Divider from '../../../components/molecules/Divider.mjs';
import ErrorText from '../../../components/molecules/ErrorText.mjs';
import { useMountEffect } from '../../../hooks/useMountEffect.mjs';
import { useStytch, useConfig, useGlobalReducer, useEventCallback, useErrorCallback, AppScreens } from '../../GlobalContextProvider.mjs';
import { EmailConfirmation } from './EmailConfirmation.mjs';
import { OTPAuthenticate } from './OTPAuthenticate.mjs';
import { usePasswordlessAuthenticate } from './usePasswordlessAuthenticate.mjs';
import { StytchEventType } from '../../../../../../core/src/public/ui.mjs';

const PasswordlessAuthenticate = ({ secondaryType })=>{
    const { i18n: $__i18n, _: $__ } = useLingui();
    const stytchClient = useStytch();
    const config = useConfig();
    const [state, dispatch] = useGlobalReducer();
    const onEvent = useEventCallback();
    const onError = useErrorCallback();
    const [errorMessage, setErrorMessage] = useState('');
    const { sendLink, sendCode } = usePasswordlessAuthenticate();
    const passwordOptions = config.passwordOptions;
    const email = state.formState.passwordState.email;
    const resetPassword = ()=>{
        stytchClient.passwords.resetByEmailStart(convertPasswordResetOptions(email, passwordOptions)).then((data)=>{
            onEvent({
                type: StytchEventType.PasswordResetByEmailStart,
                data
            });
            dispatch({
                type: 'transition',
                screen: AppScreens.PasswordSetNew
            });
        }).catch((e)=>{
            onError(e);
            setErrorMessage(getTranslatedError(e, $__));
        });
    };
    useMountEffect(()=>{
        switch(secondaryType){
            case 'eml':
                sendLink().catch(()=>{
                // Swallow error to avoid unhandled promise errors, sendLink() will already show error toast
                });
                return;
            case 'otp':
                sendCode().catch(()=>{
                // Swallow error to avoid unhandled promise errors, sendLink() will already show error toast
                });
                return;
            default:
                stytchClient.passwords.resetByEmailStart(convertPasswordResetOptions(email, passwordOptions)).then((data)=>{
                    onEvent({
                        type: StytchEventType.PasswordResetByEmailStart,
                        data
                    });
                    dispatch({
                        type: 'transition',
                        screen: AppScreens.PasswordSetNew
                    });
                }).catch((e)=>{
                    onError(e);
                });
                return;
        }
    });
    if (!secondaryType) {
        return null;
    }
    return /*#__PURE__*/ React__default.createElement(React__default.Fragment, null, secondaryType === 'eml' ? /*#__PURE__*/ React__default.createElement(EmailConfirmation, {
        showGoBack: false
    }) : /*#__PURE__*/ React__default.createElement(OTPAuthenticate, {
        hideBackButton: true
    }), /*#__PURE__*/ React__default.createElement(Divider, null), /*#__PURE__*/ React__default.createElement(Column, {
        gap: 2
    }, /*#__PURE__*/ React__default.createElement(Button, {
        onClick: resetPassword,
        variant: "outline"
    }, $__i18n._({
        id: "button.createPasswordInstead",
        message: "Create a password instead"
    })), errorMessage && /*#__PURE__*/ React__default.createElement(ErrorText, null, errorMessage)));
};

export { PasswordlessAuthenticate };
//# sourceMappingURL=PasswordlessAuthenticate.mjs.map
