import { useLingui } from '../../../../../../node_modules/@lingui/react/dist/index.mjs';
import React__default, { useState } from 'react';
import { getTranslatedError } from '../../../utils/getTranslatedError.mjs';
import Button from '../../components/atoms/Button.mjs';
import Column from '../../components/atoms/Column.mjs';
import EmailInput from '../../components/molecules/EmailInput.mjs';
import UsePasswordButton from '../components/UsePasswordButton.mjs';
import { useGlobalReducer } from '../GlobalContextProvider.mjs';
import { useEffectiveAuthConfig } from '../hooks/useEffectiveAuthConfig.mjs';
import { useEmailOtpDiscoverySend } from '../hooks/useEmailOtpDiscoverySend.mjs';
import { useEmailOtpLoginOrSignup } from '../hooks/useEmailOtpLoginOrSignup.mjs';
import { useEmlDiscoverySend } from '../hooks/useEmlDiscoverySend.mjs';
import { useEmlLoginOrSignup } from '../hooks/useEmlLoginOrSignup.mjs';
import { AppScreens } from '../types/AppScreens.mjs';
import { hasProduct } from '../utils.mjs';

const JIT_PROVISIONING_ERRORS = [
    'email_jit_provisioning_not_allowed',
    'invalid_email_for_jit_provisioning'
];
const useParseErrorMessage = ()=>{
    const { i18n: $__i18n, _: $__ } = useLingui();
    return (error, { email, org: organizationName })=>{
        if (JIT_PROVISIONING_ERRORS.includes(error.error_type)) {
            return $__i18n._({
                id: "error.jitIneligible",
                message: "{email} does not have access to {organizationName}. If you think this is a mistake, contact your admin",
                values: {
                    email: email,
                    organizationName: organizationName
                }
            });
        }
        return getTranslatedError(error, $__);
    };
};
const EmailForm = ({ showPasswordButton })=>{
    const [state, dispatch] = useGlobalReducer();
    const [emailInput, setEmailInput] = useState(state.formState.passwordState.email);
    const parseErrorMessage = useParseErrorMessage();
    const { i18n: $__i18n, _: $__ } = useLingui();
    const { products } = useEffectiveAuthConfig();
    const enableEml = hasProduct(products, 'emailMagicLinks');
    const enableOtp = hasProduct(products, 'emailOtp');
    const providedEmail = state.primary.email;
    const email = providedEmail || emailInput;
    const { trigger: stytchEmlLoginOrSignup, error: emlError, isMutating: emlIsMutating } = useEmlLoginOrSignup();
    const { trigger: stytchOtpLoginOrSignup, error: otpError, isMutating: otpIsMutating } = useEmailOtpLoginOrSignup();
    const isMutating = emlIsMutating || otpIsMutating;
    const error = emlError || otpError;
    const organization = state.flowState.organization;
    if (!organization) return /*#__PURE__*/ React__default.createElement(React__default.Fragment, null);
    const handleSubmit = async (e)=>{
        e.preventDefault();
        dispatch({
            type: 'set_user_supplied_email',
            email
        });
        if (enableEml && enableOtp) {
            dispatch({
                type: 'transition',
                screen: AppScreens.EmailMethodSelection,
                history: 'push'
            });
        } else if (enableEml) {
            stytchEmlLoginOrSignup({
                email,
                organization_id: organization.organization_id
            });
        } else if (enableOtp) {
            stytchOtpLoginOrSignup({
                email,
                organization_id: organization.organization_id
            });
        }
    };
    if (providedEmail) {
        return /*#__PURE__*/ React__default.createElement(Column, {
            gap: 2
        }, products.filter((product)=>product.id === 'emailMagicLinks' || product.id === 'emailOtp').map((product)=>{
            switch(product.id){
                case 'emailMagicLinks':
                    return /*#__PURE__*/ React__default.createElement(Button, {
                        key: product.id,
                        onClick: ()=>{
                            dispatch({
                                type: 'set_user_supplied_email',
                                email
                            });
                            stytchEmlLoginOrSignup({
                                email,
                                organization_id: organization.organization_id
                            });
                        },
                        loading: emlIsMutating,
                        disabled: isMutating,
                        variant: "outline"
                    }, $__i18n._({
                        id: "button.emailLink",
                        message: "Email me a link"
                    }));
                case 'emailOtp':
                    return /*#__PURE__*/ React__default.createElement(Button, {
                        key: product.id,
                        onClick: ()=>{
                            dispatch({
                                type: 'set_user_supplied_email',
                                email
                            });
                            stytchOtpLoginOrSignup({
                                email,
                                organization_id: organization.organization_id
                            });
                        },
                        loading: otpIsMutating,
                        disabled: isMutating,
                        variant: "outline"
                    }, $__i18n._({
                        id: "button.emailCode",
                        message: "Email me a code"
                    }));
            }
        }), showPasswordButton && /*#__PURE__*/ React__default.createElement(UsePasswordButton, {
            email: email
        }));
    }
    return /*#__PURE__*/ React__default.createElement(Column, {
        as: "form",
        onSubmit: handleSubmit,
        gap: 2
    }, /*#__PURE__*/ React__default.createElement(EmailInput, {
        email: email,
        setEmail: setEmailInput,
        hideLabel: true,
        error: error ? parseErrorMessage(error, {
            email,
            org: organization.organization_name
        }) : undefined
    }), /*#__PURE__*/ React__default.createElement(Button, {
        type: "submit",
        variant: "primary",
        loading: isMutating
    }, $__i18n._({
        id: "button.continueWithEmail",
        message: "Continue with email"
    })), showPasswordButton && /*#__PURE__*/ React__default.createElement(UsePasswordButton, {
        email: email
    }));
};
const EmailDiscoveryForm = ({ showPasswordButton })=>{
    const [state, dispatch] = useGlobalReducer();
    const [email, setEmail] = useState(state.formState.passwordState.email);
    const { i18n: $__i18n, _: $__ } = useLingui();
    const { products } = useEffectiveAuthConfig();
    const enableEml = products.some((p)=>p.id === 'emailMagicLinks');
    const enableOtp = products.some((p)=>p.id === 'emailOtp');
    const { trigger: stytchEmlDiscoverySend, error: emlError, isMutating: emlIsMutating } = useEmlDiscoverySend();
    const { trigger: stytchOtpDiscoverySend, error: otpError, isMutating: otpIsMutating } = useEmailOtpDiscoverySend();
    const handleSubmit = async (e)=>{
        e.preventDefault();
        dispatch({
            type: 'set_user_supplied_email',
            email
        });
        if (enableEml && enableOtp) {
            dispatch({
                type: 'transition',
                screen: AppScreens.EmailMethodSelection,
                history: 'push'
            });
        } else if (enableEml) {
            stytchEmlDiscoverySend({
                email
            });
        } else if (enableOtp) {
            stytchOtpDiscoverySend({
                email
            });
        }
    };
    const isMutating = emlIsMutating || otpIsMutating;
    const error = emlError || otpError;
    return /*#__PURE__*/ React__default.createElement(Column, {
        as: "form",
        onSubmit: handleSubmit,
        gap: 2
    }, /*#__PURE__*/ React__default.createElement(EmailInput, {
        email: email,
        setEmail: setEmail,
        hideLabel: true,
        error: error ? getTranslatedError(error, $__) : undefined
    }), /*#__PURE__*/ React__default.createElement(Button, {
        type: "submit",
        variant: "primary",
        loading: isMutating
    }, $__i18n._({
        id: "button.continueWithEmail",
        message: "Continue with email"
    })), showPasswordButton && /*#__PURE__*/ React__default.createElement(UsePasswordButton, {
        email: email
    }));
};

export { EmailDiscoveryForm, EmailForm };
//# sourceMappingURL=EmailForm.mjs.map
