import { useLingui } from '../../../../../../node_modules/@lingui/react/dist/index.mjs';
import React__default from 'react';
import Column from '../../components/atoms/Column.mjs';
import Typography from '../../components/atoms/Typography.mjs';
import Divider from '../../components/molecules/Divider.mjs';
import { LoadingScreen } from '../../components/molecules/Loading.mjs';
import { usePresentation } from '../../components/PresentationConfig.mjs';
import { generateProductComponentsOrdering, isButtonsComponent } from '../generateProductComponentsOrdering.mjs';
import { useGlobalReducer, useConfig } from '../GlobalContextProvider.mjs';
import { useEffectiveAuthConfig } from '../hooks/useEffectiveAuthConfig.mjs';
import { MainScreenComponent } from '../types/AppScreens.mjs';
import { useProductComponents } from '../utils.mjs';
import { AuthFlowType } from '../../../../../core/src/public/b2b/ui.mjs';

function isButtonGroup(group) {
    return group.every(isButtonsComponent);
}
const MainScreen = ()=>{
    const { options } = usePresentation();
    const [state] = useGlobalReducer();
    const { i18n: $__i18n, _: $__ } = useLingui();
    const { primaryAuthMethods, email, emailVerified } = state.primary;
    const config = useConfig();
    const { products } = useEffectiveAuthConfig();
    const isLoading = state.flowState.type === AuthFlowType.Organization && !state.flowState.organization;
    // Generate ordering and types of product components
    const productComponentsOrdering = generateProductComponentsOrdering(products, state.flowState);
    const mainScreenComponents = useProductComponents(config, 'mainScreen');
    const { SsoAndOAuthButtons } = useProductComponents(config, 'ssoAndOAuthButtons');
    const organizationName = state.flowState.organization?.organization_name;
    let title;
    switch(state.flowState.type){
        case AuthFlowType.Discovery:
            title = $__i18n._({
                id: "login.title",
                message: "Sign up or log in"
            });
            break;
        case AuthFlowType.PasswordReset:
            title = '';
            break;
        default:
            title = organizationName ? $__i18n._({
                id: "organizationLogin.title",
                message: "Continue to {organizationName}",
                values: {
                    organizationName: organizationName
                }
            }) : $__i18n._({
                id: "organizationLogin.titleUnknown",
                message: "Continue to ..."
            });
            break;
    }
    // Show a targeted message if the member has an unverified email address and
    // additional primary auth is required
    const showVerifyEmailCopy = email && emailVerified === false && primaryAuthMethods;
    if (isLoading) {
        return /*#__PURE__*/ React__default.createElement(LoadingScreen, null);
    }
    return /*#__PURE__*/ React__default.createElement(Column, {
        gap: 6
    }, !options.hideHeaderText && (showVerifyEmailCopy ? /*#__PURE__*/ React__default.createElement(React__default.Fragment, null, /*#__PURE__*/ React__default.createElement(Typography, {
        variant: "header"
    }, $__i18n._({
        id: "emailVerification.title",
        message: "Verify your email"
    })), /*#__PURE__*/ React__default.createElement(Typography, null, $__i18n._({
        id: "emailVerification.content",
        message: "Confirm your email address with one of the following:"
    }))) : title && /*#__PURE__*/ React__default.createElement(Typography, {
        variant: "header",
        align: "center"
    }, title)), /*#__PURE__*/ React__default.createElement(Column, {
        gap: 4
    }, productComponentsOrdering.map((group)=>isButtonGroup(group) ? /*#__PURE__*/ React__default.createElement(SsoAndOAuthButtons, {
            key: "buttons",
            buttons: group
        }) : group.map((component, index)=>{
            const Component = mainScreenComponents[component];
            if (Component) {
                return /*#__PURE__*/ React__default.createElement(Component, {
                    key: component
                });
            }
            if (component === MainScreenComponent.Divider) {
                return /*#__PURE__*/ React__default.createElement(Divider, {
                    key: 'divider' + index
                });
            }
            return null;
        }))));
};

export { MainScreen };
//# sourceMappingURL=Main.mjs.map
