import { useLingui } from '../../../../../../../node_modules/@lingui/react/dist/index.mjs';
import React__default from 'react';
import Button from '../../../components/atoms/Button.mjs';
import Column from '../../../components/atoms/Column.mjs';
import Typography from '../../../components/atoms/Typography.mjs';
import Divider from '../../../components/molecules/Divider.mjs';
import TextColumn from '../../../components/molecules/TextColumn.mjs';
import { useConfig, useGlobalReducer, AppScreens } from '../../GlobalContextProvider.mjs';
import { hasProduct } from '../../utils.mjs';
import { PasswordAuthenticate } from '../Password/PasswordAuthenticate.mjs';
import { PasswordNewUser } from '../Password/PasswordNewUser.mjs';
import { PasswordlessAuthenticate } from './PasswordlessAuthenticate.mjs';
import { usePasswordlessAuthenticate } from './usePasswordlessAuthenticate.mjs';
import { OTPMethods } from '../../../../../../core/src/public/ui.mjs';

const PasswordCreateAuthenticate = ()=>{
    const { i18n: $__i18n, _: $__ } = useLingui();
    const { emailMagicLinksOptions, otpOptions, products } = useConfig();
    const [state, dispatch] = useGlobalReducer();
    const otpMethods = otpOptions?.methods ?? [];
    const hasEmailMagicLink = hasProduct(products, 'emailMagicLinks') && !!emailMagicLinksOptions;
    const hasOTPEmail = otpMethods.includes(OTPMethods.Email);
    const secondaryType = hasOTPEmail ? 'otp' : hasEmailMagicLink ? 'eml' : undefined;
    const userType = state.formState.passwordState.type;
    const secondaryAuth = useSecondaryAuthenticate(secondaryType, {
        dispatch
    });
    return /*#__PURE__*/ React__default.createElement(Column, {
        gap: 2
    }, (()=>{
        switch(userType){
            case 'new':
                return /*#__PURE__*/ React__default.createElement(Column, {
                    gap: 6
                }, secondaryAuth ? /*#__PURE__*/ React__default.createElement(TextColumn, {
                    header: $__i18n._({
                        id: "password.createAccount.title",
                        message: "Create an account"
                    }),
                    body: $__i18n._({
                        id: "createAccount.title",
                        message: "Choose how you would like to create your account."
                    })
                }) : /*#__PURE__*/ React__default.createElement(TextColumn, {
                    header: $__i18n._({
                        id: "password.setPassword.title",
                        message: "Set a password"
                    }),
                    body: $__i18n._({
                        id: "password.createAccount.content",
                        message: "Finish creating your account by setting a password."
                    })
                }), secondaryAuth && /*#__PURE__*/ React__default.createElement(Button, {
                    variant: "primary",
                    onClick: secondaryAuth.handle,
                    loading: secondaryAuth.isSubmitting
                }, secondaryAuth.buttonText), secondaryAuth && /*#__PURE__*/ React__default.createElement(Divider, null), /*#__PURE__*/ React__default.createElement(PasswordNewUser, null));
            case 'password':
                return /*#__PURE__*/ React__default.createElement(Column, {
                    gap: 6
                }, /*#__PURE__*/ React__default.createElement(Typography, {
                    variant: "header"
                }, $__i18n._({
                    id: "password.login.title",
                    message: "Log in"
                })), /*#__PURE__*/ React__default.createElement(PasswordAuthenticate, null), secondaryAuth && /*#__PURE__*/ React__default.createElement(Divider, null), secondaryAuth && /*#__PURE__*/ React__default.createElement(Button, {
                    variant: "outline",
                    onClick: secondaryAuth.handle,
                    loading: secondaryAuth.isSubmitting
                }, secondaryAuth.buttonText));
            case 'passwordless':
                return /*#__PURE__*/ React__default.createElement(PasswordlessAuthenticate, {
                    secondaryType: secondaryType
                });
        }
    })(), /*#__PURE__*/ React__default.createElement(Button, {
        variant: "ghost",
        onClick: ()=>dispatch({
                type: 'transition',
                screen: AppScreens.Main
            })
    }, $__i18n._({
        id: "button.goBack",
        message: "Go back"
    })));
};
function useSecondaryAuthenticate(secondaryType, { dispatch }) {
    const { i18n: $__i18n, _: $__ } = useLingui();
    const { sendLink, sendCode, isSubmitting } = usePasswordlessAuthenticate();
    if (secondaryType == null) {
        return undefined;
    }
    const buttonText = secondaryType === 'eml' ? $__i18n._({
        id: "button.emailMagicLink",
        message: "Email me a login link"
    }) : $__i18n._({
        id: "button.emailOTP",
        message: "Email me a login code"
    });
    const handle = secondaryType === 'eml' ? async ()=>{
        await sendLink();
        dispatch({
            type: 'transition',
            screen: AppScreens.EmailConfirmation
        });
    } : async ()=>{
        await sendCode();
        dispatch({
            type: 'transition',
            screen: AppScreens.OTPAuthenticate
        });
    };
    return {
        buttonText,
        handle,
        isSubmitting
    };
}

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