diff options
author | Anton Tananaev <anton@traccar.org> | 2024-04-06 09:22:10 -0700 |
---|---|---|
committer | Anton Tananaev <anton@traccar.org> | 2024-04-06 09:22:10 -0700 |
commit | f418231b6b2f5e030a0d2dcc390c314602b1f740 (patch) | |
tree | 10326adf3792bc2697e06bb5f2b8ef2a8f7e55fe /modern/src/login/ResetPasswordPage.jsx | |
parent | b392a4af78e01c8e0f50aad5468e9583675b24be (diff) | |
download | trackermap-web-f418231b6b2f5e030a0d2dcc390c314602b1f740.tar.gz trackermap-web-f418231b6b2f5e030a0d2dcc390c314602b1f740.tar.bz2 trackermap-web-f418231b6b2f5e030a0d2dcc390c314602b1f740.zip |
Move modern to the top
Diffstat (limited to 'modern/src/login/ResetPasswordPage.jsx')
-rw-r--r-- | modern/src/login/ResetPasswordPage.jsx | 118 |
1 files changed, 0 insertions, 118 deletions
diff --git a/modern/src/login/ResetPasswordPage.jsx b/modern/src/login/ResetPasswordPage.jsx deleted file mode 100644 index d10299ca..00000000 --- a/modern/src/login/ResetPasswordPage.jsx +++ /dev/null @@ -1,118 +0,0 @@ -import React, { useState } from 'react'; -import { - Button, TextField, Typography, Snackbar, IconButton, -} from '@mui/material'; -import makeStyles from '@mui/styles/makeStyles'; -import { useNavigate } from 'react-router-dom'; -import ArrowBackIcon from '@mui/icons-material/ArrowBack'; -import LoginLayout from './LoginLayout'; -import { useTranslation } from '../common/components/LocalizationProvider'; -import useQuery from '../common/util/useQuery'; -import { snackBarDurationShortMs } from '../common/util/duration'; -import { useCatch } from '../reactHelper'; - -const useStyles = makeStyles((theme) => ({ - container: { - display: 'flex', - flexDirection: 'column', - gap: theme.spacing(2), - }, - header: { - display: 'flex', - alignItems: 'center', - }, - title: { - fontSize: theme.spacing(3), - fontWeight: 500, - marginLeft: theme.spacing(1), - textTransform: 'uppercase', - }, -})); - -const ResetPasswordPage = () => { - const classes = useStyles(); - const navigate = useNavigate(); - const t = useTranslation(); - const query = useQuery(); - - const token = query.get('passwordReset'); - - const [email, setEmail] = useState(''); - const [password, setPassword] = useState(''); - const [snackbarOpen, setSnackbarOpen] = useState(false); - - const handleSubmit = useCatch(async (event) => { - event.preventDefault(); - let response; - if (!token) { - response = await fetch('/api/password/reset', { - method: 'POST', - body: new URLSearchParams(`email=${encodeURIComponent(email)}`), - }); - } else { - response = await fetch('/api/password/update', { - method: 'POST', - body: new URLSearchParams(`token=${encodeURIComponent(token)}&password=${encodeURIComponent(password)}`), - }); - } - if (response.ok) { - setSnackbarOpen(true); - } else { - throw Error(await response.text()); - } - }); - - return ( - <LoginLayout> - <div className={classes.container}> - <div className={classes.header}> - <IconButton color="primary" onClick={() => navigate('/login')}> - <ArrowBackIcon /> - </IconButton> - <Typography className={classes.title} color="primary"> - {t('loginReset')} - </Typography> - </div> - {!token ? ( - <TextField - required - type="email" - label={t('userEmail')} - name="email" - value={email} - autoComplete="email" - onChange={(event) => setEmail(event.target.value)} - /> - ) : ( - <TextField - required - label={t('userPassword')} - name="password" - value={password} - type="password" - autoComplete="current-password" - onChange={(event) => setPassword(event.target.value)} - /> - )} - <Button - variant="contained" - color="secondary" - type="submit" - onClick={handleSubmit} - disabled={!/(.+)@(.+)\.(.{2,})/.test(email) && !password} - fullWidth - > - {t('loginReset')} - </Button> - </div> - <Snackbar - open={snackbarOpen} - onClose={() => navigate('/login')} - autoHideDuration={snackBarDurationShortMs} - message={!token ? t('loginResetSuccess') : t('loginUpdateSuccess')} - /> - </LoginLayout> - ); -}; - -export default ResetPasswordPage; |