frontend/containers/LoginDialog/index.tsx (view raw)
1import {
2 Button,
3 Dialog,
4 DialogContent,
5 DialogTitle,
6 Typography,
7} from '@mui/material';
8import {useTranslation} from 'next-i18next';
9import LoginForm from '../LoginForm';
10import {useState} from 'react';
11import {setCookie} from '../../lib/cookies';
12
13type Props = {
14 open: boolean;
15 toggle: () => void;
16 redirectPath: string;
17 title?: string;
18 content?: string;
19};
20
21const LoginDialog = (props: Props) => {
22 const {t} = useTranslation();
23 const {
24 open,
25 toggle,
26 redirectPath,
27 title = t`signin.title`,
28 content = '',
29 } = props;
30 const [sent, setSent] = useState(false);
31
32 const onSend = () => {
33 setSent(true);
34 setCookie('redirectPath', redirectPath);
35 };
36
37 return (
38 <Dialog open={open} onClose={toggle} maxWidth="xs">
39 <DialogTitle>{title}</DialogTitle>
40 <DialogContent>
41 {!sent && (
42 <>
43 {content && <Typography mb={2}>{content}</Typography>}
44 <LoginForm onSend={onSend} />
45 <Button
46 fullWidth
47 sx={{mt: 2}}
48 variant="outlined"
49 onClick={toggle}
50 >{t`generic.cancel`}</Button>
51 </>
52 )}
53 {sent && (
54 <>
55 <Typography mb={2}>{t`signin.check_email`}</Typography>
56 <Button
57 fullWidth
58 variant="contained"
59 onClick={toggle}
60 >{t`generic.close`}</Button>
61 </>
62 )}
63 </DialogContent>
64 </Dialog>
65 );
66};
67
68export default LoginDialog;