95 lines
3.1 KiB
TypeScript
95 lines
3.1 KiB
TypeScript
'use client';
|
|
|
|
import React, { Dispatch, FC, SetStateAction, useEffect } from 'react';
|
|
import { usePathname } from 'next/navigation';
|
|
import Link from 'next/link';
|
|
import { Modal, Form } from 'antd';
|
|
import { CloseOutlined } from '@ant-design/icons';
|
|
import { RegisterContent, ResetContent, FinishContent, EnterContent } from './authModalContent';
|
|
import { i18nText } from '../../i18nKeys';
|
|
|
|
type AuthModalProps = {
|
|
open: boolean;
|
|
handleCancel: () => void;
|
|
mode: 'enter' | 'register' | 'reset' | 'finish';
|
|
updateMode: (mode: 'enter' | 'register' | 'reset' | 'finish') => void;
|
|
updateToken: string | Dispatch<SetStateAction<string | undefined>> | undefined;
|
|
locale: string;
|
|
};
|
|
|
|
export const AuthModal: FC<AuthModalProps> = ({
|
|
open,
|
|
handleCancel,
|
|
mode,
|
|
updateMode,
|
|
updateToken,
|
|
locale
|
|
}) => {
|
|
const [form] = Form.useForm<{ login: string, password: string, confirmPassword: string }>();
|
|
const paths = usePathname().split('/');
|
|
|
|
const onAfterClose = () => {
|
|
form.resetFields();
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (form) {
|
|
form.resetFields();
|
|
}
|
|
}, [mode]);
|
|
|
|
const onUpdateToken = (token: string) => {
|
|
if (updateToken && typeof updateToken !== 'string') {
|
|
updateToken(token);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<Modal
|
|
className="b-modal"
|
|
open={open}
|
|
title={undefined}
|
|
onOk={undefined}
|
|
onCancel={handleCancel}
|
|
afterClose={onAfterClose}
|
|
footer={false}
|
|
width={598}
|
|
closeIcon={<CloseOutlined style={{ fontSize: 20, color: '#000' }}/>}
|
|
>
|
|
<div className="b-modal__auth__content">
|
|
<div className="b-modal__auth__logo">
|
|
<img className="" src="/images/logo-auth.svg" alt=""/>
|
|
</div>
|
|
{mode === 'enter' && (
|
|
<EnterContent
|
|
form={form}
|
|
updateMode={updateMode}
|
|
locale={paths[1]}
|
|
handleCancel={handleCancel}
|
|
updateToken={onUpdateToken}
|
|
/>
|
|
)}
|
|
{mode === 'register' && (
|
|
<RegisterContent
|
|
form={form}
|
|
locale={paths[1]}
|
|
updateMode={updateMode}
|
|
updateToken={onUpdateToken}
|
|
handleCancel={handleCancel}
|
|
/>
|
|
)}
|
|
{mode === 'reset' && (
|
|
<ResetContent form={form} updateMode={updateMode} locale={paths[1]} />
|
|
)}
|
|
{mode === 'finish' && (
|
|
<FinishContent locale={paths[1]} />
|
|
)}
|
|
<div className="b-modal__auth__agreement">
|
|
{`${i18nText('agreementText', locale)} `}
|
|
<Link href={'/docs/BBUDDY_privacy_policy_fin.docx' as any}>{i18nText('privacyPolicy', locale)}</Link>
|
|
</div>
|
|
</div>
|
|
</Modal>
|
|
);
|
|
};
|