{"version":3,"file":"LoginPage-Ba9DYcBv-chunk.js","sources":["../../../GSDClient/Scripts/Pages/LoginPage.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport {\n    IFieldValue,\n    UpdateFieldValue,\n    updateFieldValue,\n} from 'Scripts/Slices/loginPage';\nimport { IRootState } from 'Scripts/store';\n\nimport { useChangePasswordMutation, useLoginMutation } from 'Services/loginApi';\nimport { logintUserDataLayerPush } from 'Utils/dataLayerPushService';\nimport { setVoyadoContactId } from 'Services/voyadoApi';\n\nimport CtaButton from 'Components/CtaButton';\nimport FormBox from 'Components/Forms/FormBox';\nimport RenderFormField, {\n    handleFormPost,\n    validateFormFields,\n    ValidationSchema,\n} from 'Components/Forms/RenderFormField';\nimport Markup from 'Components/Markup';\n\nconst LoginPage = () => {\n    const dispatch = useDispatch();\n    const [formValidation, setFormValidation] = useState<ValidationSchema>([]);\n\n    const [\n        login,\n        {\n            isLoading: loginResultIsLoading,\n            error: loginResultError,\n            data: loginResultData,\n        },\n    ] = useLoginMutation();\n    const [\n        changePassword,\n        {\n            isLoading: changePasswordResultIsLoading,\n            error: changePasswordResultError,\n            data: changePasswordResultData,\n        },\n    ] = useChangePasswordMutation();\n\n    const { login: loginPage, changePassword: changePasswordPage } =\n        useSelector((state: IRootState) => state.loginPage);\n\n    const {\n        inputFields,\n        canLogin,\n        loginPageTitle,\n        forgottenPasswordLink,\n        loginButton,\n        newCustomerTitle,\n        newCustomerContent,\n        linkToRegisterPage,\n        changePasswordTitle,\n        changePasswordButton,\n        channelUrl,\n        loginUserAlreadyLoggedInText,\n        logoutButtonText,\n    } = loginPage;\n    const { inputFields: changePasswordInputFields } = changePasswordPage;\n    const isChangePasswordView = changePasswordInputFields.length > 0;\n\n    const handleInputChange = (\n        data: IFieldValue,\n        key: UpdateFieldValue['key']\n    ) => {\n        dispatch(updateFieldValue({ data, key }));\n    };\n\n    const handleOnsubmit = (\n        e: React.FormEvent<HTMLFormElement>,\n        key: UpdateFieldValue['key']\n    ) => {\n        e.preventDefault();\n        if (key === 'login') {\n            if (validateFormFields(inputFields, setFormValidation)) {\n                login({ form: e.currentTarget });\n                logintUserDataLayerPush();\n            }\n        } else if (key === 'changePassword') {\n            if (\n                validateFormFields(changePasswordInputFields, setFormValidation)\n            ) {\n                changePassword({ form: e.currentTarget });\n            }\n        }\n    };\n\n    useEffect(() => {\n        if (loginResultData && loginResultData.contactId) {\n            setVoyadoContactId(loginResultData.contactId);\n        }\n\n        handleFormPost(loginResultData, loginResultError);\n    }, [loginResultData, loginResultError]);\n\n    useEffect(() => {\n        handleFormPost(changePasswordResultData, changePasswordResultError);\n    }, [changePasswordResultData, changePasswordResultError]);\n\n    return (\n        <div className=\"h-full w-full flex-grow bg-white\">\n            <div className=\"mx-auto max-w-content pb-4 lg:px-14\">\n                <div\n                    className={`mx-auto mt-9 grid w-full gap-6 md:max-w-form ${\n                        canLogin || !isChangePasswordView\n                            ? 'md:grid-cols-2'\n                            : ''\n                    }`}\n                >\n                    {canLogin ? (\n                        <>\n                            <div className=\"md:col-span-1 md:col-start-1 md:col-end-1\">\n                                <h1 className=\"mx-4.5 font-montserrat text-2xl font-medium text-black md:col-span-2 md:mx-4.5 md:mb-4 lg:col-span-1 lg:mx-7\">\n                                    {loginPageTitle}\n                                </h1>\n                                <FormBox\n                                    loading={\n                                        loginResultIsLoading ||\n                                        changePasswordResultIsLoading\n                                    }\n                                >\n                                    {isChangePasswordView ? (\n                                        <>\n                                            <h1 className=\"mx-4.5 font-montserrat text-2xl font-medium text-black md:col-span-2 md:mx-4.5 md:mb-4 lg:col-span-1 lg:mx-7\">\n                                                {changePasswordTitle}\n                                            </h1>\n                                            <form\n                                                onSubmit={e =>\n                                                    handleOnsubmit(\n                                                        e,\n                                                        'changePassword'\n                                                    )\n                                                }\n                                                className=\"md:max-w-md\"\n                                                method=\"post\"\n                                            >\n                                                <ul className=\"flex flex-col\">\n                                                    {changePasswordInputFields.map(\n                                                        (field, index) => (\n                                                            <RenderFormField\n                                                                key={`\n                                                             ${field.name}${index}`}\n                                                                field={field}\n                                                                handleInputChange={e =>\n                                                                    handleInputChange(\n                                                                        e,\n                                                                        'changePassword'\n                                                                    )\n                                                                }\n                                                                form={\n                                                                    changePasswordInputFields\n                                                                }\n                                                                validation={\n                                                                    formValidation\n                                                                }\n                                                                as=\"li\"\n                                                            />\n                                                        )\n                                                    )}\n                                                    <li>\n                                                        <CtaButton className=\"mb-3 w-full py-2.5 text-xl font-medium\">\n                                                            {\n                                                                changePasswordButton\n                                                            }\n                                                        </CtaButton>\n                                                    </li>\n                                                </ul>\n                                            </form>\n                                        </>\n                                    ) : (\n                                        <form\n                                            onSubmit={e =>\n                                                handleOnsubmit(e, 'login')\n                                            }\n                                            className=\"md:max-w-md\"\n                                            method=\"post\"\n                                        >\n                                            <ul className=\"flex flex-col\">\n                                                {inputFields.map(\n                                                    (field, index) => (\n                                                        <RenderFormField\n                                                            key={index}\n                                                            loading={\n                                                                loginResultIsLoading ||\n                                                                changePasswordResultIsLoading\n                                                            }\n                                                            field={field}\n                                                            handleInputChange={e =>\n                                                                handleInputChange(\n                                                                    e,\n                                                                    'login'\n                                                                )\n                                                            }\n                                                            form={inputFields}\n                                                            validation={\n                                                                formValidation\n                                                            }\n                                                            as=\"li\"\n                                                        />\n                                                    )\n                                                )}\n                                                <li>\n                                                    <CtaButton\n                                                        disabled={\n                                                            loginResultIsLoading ||\n                                                            changePasswordResultIsLoading\n                                                        }\n                                                        className=\"mb-3 w-full py-2.5 text-xl font-medium\"\n                                                        onClick={() => {}}\n                                                    >\n                                                        {loginButton}\n                                                    </CtaButton>\n                                                    <a\n                                                        href={\n                                                            forgottenPasswordLink?.href\n                                                        }\n                                                    >\n                                                        {\n                                                            forgottenPasswordLink?.text\n                                                        }\n                                                    </a>\n                                                </li>\n                                            </ul>\n                                        </form>\n                                    )}\n                                </FormBox>\n                            </div>\n                            {!isChangePasswordView && (\n                                <div className=\"px-3 md:col-span-1 md:col-start-2 md:col-end-2 md:row-start-1 md:px-0\">\n                                    <h2 className=\"mb-2.5 font-montserrat text-xl font-medium text-black\">\n                                        {newCustomerTitle}\n                                    </h2>\n                                    <FormBox>\n                                        <Markup\n                                            cssClass=\"mb-5\"\n                                            html={newCustomerContent?.value}\n                                        />\n                                        <CtaButton\n                                            className=\"w-full py-2.5 text-xl font-medium\"\n                                            as=\"a\"\n                                            href={linkToRegisterPage?.href}\n                                        >\n                                            {linkToRegisterPage?.text}\n                                        </CtaButton>\n                                    </FormBox>\n                                </div>\n                            )}\n                        </>\n                    ) : (\n                        <div className=\"md:max-w-md\">\n                            <FormBox>\n                                <p className=\"mb-5\">\n                                    {loginUserAlreadyLoggedInText}\n                                </p>\n                                <CtaButton\n                                    className=\"w-full py-2.5 text-xl font-medium\"\n                                    as=\"a\"\n                                    href={`${channelUrl}.Logout`}\n                                >\n                                    {logoutButtonText}\n                                </CtaButton>\n                            </FormBox>\n                        </div>\n                    )}\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport default LoginPage;\n"],"names":["LoginPage","dispatch","useDispatch","formValidation","setFormValidation","useState","login","loginResultIsLoading","loginResultError","loginResultData","useLoginMutation","changePassword","changePasswordResultIsLoading","changePasswordResultError","changePasswordResultData","useChangePasswordMutation","loginPage","changePasswordPage","useSelector","state","inputFields","canLogin","loginPageTitle","forgottenPasswordLink","loginButton","newCustomerTitle","newCustomerContent","linkToRegisterPage","changePasswordTitle","changePasswordButton","channelUrl","loginUserAlreadyLoggedInText","logoutButtonText","changePasswordInputFields","isChangePasswordView","handleInputChange","data","key","updateFieldValue","handleOnsubmit","e","validateFormFields","logintUserDataLayerPush","useEffect","setVoyadoContactId","handleFormPost","jsx","jsxs","Fragment","FormBox","field","index","RenderFormField","CtaButton","Markup"],"mappings":"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"}