all repos — caroster @ 8e335a7259f29db885849a0b2a7db3a4a5dc60a4

[Octree] Group carpool to your event https://caroster.io

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;