Reorganize login pages

3 files changed, 0 insertions, 425 deletions

diff --git a/modern/src/components/registration/LoginForm.js b/modern/src/components/registration/LoginForm.js
deleted file mode 100644
index 3d030a89..00000000
--- a/modern/src/components/registration/LoginForm.js
+++ /dev/null
@@ -1,170 +0,0 @@
-import React, { useState } from 'react';
-import {
-  Grid, useMediaQuery, makeStyles, InputLabel, Select, MenuItem, FormControl, Button, TextField, Link, Snackbar, IconButton, Tooltip,
-} from '@material-ui/core';
-import CloseIcon from '@material-ui/icons/Close';
-import CachedIcon from '@material-ui/icons/Cached';
-import { useTheme } from '@material-ui/core/styles';
-import { useDispatch, useSelector } from 'react-redux';
-import { useHistory } from 'react-router-dom';
-import { sessionActions } from '../../store';
-import { useLocalization, useTranslation } from '../../LocalizationProvider';
-import StartPage from '../../StartPage';
-import usePersistedState from '../../common/usePersistedState';
-
-const useStyles = makeStyles((theme) => ({
-  legacy: {
-    position: 'absolute',
-    top: theme.spacing(1),
-    right: theme.spacing(1),
-  },
-  logoContainer: {
-    textAlign: 'center',
-    color: theme.palette.primary.main,
-  },
-  resetPassword: {
-    cursor: 'pointer',
-  },
-}));
-
-const LoginForm = () => {
-  const classes = useStyles();
-  const dispatch = useDispatch();
-  const history = useHistory();
-  const theme = useTheme();
-  const t = useTranslation();
-
-  const { languages, language, setLanguage } = useLocalization();
-  const languageList = Object.entries(languages).map((values) => ({ code: values[0], name: values[1].name }));
-
-  const [failed, setFailed] = useState(false);
-
-  const [email, setEmail] = usePersistedState('loginEmail', '');
-  const [password, setPassword] = useState('');
-
-  const registrationEnabled = useSelector((state) => state.session.server?.registration);
-  const emailEnabled = useSelector((state) => state.session.server?.emailEnabled);
-
-  const [announcementShown, setAnnouncementShown] = useState(false);
-  const announcement = useSelector((state) => state.session.server?.announcement);
-
-  const handleSubmit = async (event) => {
-    event.preventDefault();
-    const response = await fetch('/api/session', {
-      method: 'POST',
-      body: new URLSearchParams(`email=${encodeURIComponent(email)}&password=${encodeURIComponent(password)}`),
-    });
-    if (response.ok) {
-      const user = await response.json();
-      dispatch(sessionActions.updateUser(user));
-      history.push('/');
-    } else {
-      setFailed(true);
-      setPassword('');
-    }
-  };
-
-  const handleSpecialKey = (e) => {
-    if (e.keyCode === 13 && email && password) {
-      handleSubmit(e);
-    }
-  };
-
-  return (
-    <StartPage>
-      <Tooltip title="Switch to Legacy App" className={classes.legacy}>
-        <IconButton onClick={() => window.localStorage.setItem('legacyApp', true) || window.location.replace('/')}>
-          <CachedIcon />
-        </IconButton>
-      </Tooltip>
-      <Grid container direction="column" spacing={2}>
-        {useMediaQuery(theme.breakpoints.down('md'))
-          && (
-            <Grid item className={classes.logoContainer}>
-              <svg height="64" width="240">
-                <use xlinkHref="/logo.svg#img" />
-              </svg>
-            </Grid>
-          )}
-        <Grid item>
-          <TextField
-            required
-            fullWidth
-            error={failed}
-            label={t('userEmail')}
-            name="email"
-            value={email}
-            autoComplete="email"
-            autoFocus={!email}
-            onChange={(e) => setEmail(e.target.value)}
-            onKeyUp={handleSpecialKey}
-            helperText={failed && 'Invalid username or password'}
-            variant="filled"
-          />
-        </Grid>
-        <Grid item>
-          <TextField
-            required
-            fullWidth
-            error={failed}
-            label={t('userPassword')}
-            name="password"
-            value={password}
-            type="password"
-            autoComplete="current-password"
-            autoFocus={!!email}
-            onChange={(e) => setPassword(e.target.value)}
-            onKeyUp={handleSpecialKey}
-            variant="filled"
-          />
-        </Grid>
-        <Grid item>
-          <Button
-            onClick={handleSubmit}
-            onKeyUp={handleSpecialKey}
-            variant="contained"
-            color="secondary"
-            disabled={!email || !password}
-            fullWidth
-          >
-            {t('loginLogin')}
-          </Button>
-        </Grid>
-        <Grid item container spacing={2}>
-          <Grid item>
-            <Button onClick={() => history.push('/register')} disabled={!registrationEnabled} color="secondary">
-              {t('loginRegister')}
-            </Button>
-          </Grid>
-          <Grid item xs>
-            <FormControl variant="filled" fullWidth>
-              <InputLabel>{t('loginLanguage')}</InputLabel>
-              <Select value={language} onChange={(e) => setLanguage(e.target.value)}>
-                {languageList.map((it) => <MenuItem key={it.code} value={it.code}>{it.name}</MenuItem>)}
-              </Select>
-            </FormControl>
-          </Grid>
-        </Grid>
-        {emailEnabled && (
-          <Grid item container justifyContent="flex-end">
-            <Grid item>
-              <Link onClick={() => history.push('/reset-password')} className={classes.resetPassword} underline="none">{t('loginReset')}</Link>
-            </Grid>
-          </Grid>
-        )}
-        <Snackbar
-          anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
-          open={!!announcement && !announcementShown}
-          message={announcement}
-          action={(
-            <IconButton size="small" color="inherit" onClick={() => setAnnouncementShown(true)}>
-              <CloseIcon fontSize="small" />
-            </IconButton>
-          )}
-        />
-      </Grid>
-    </StartPage>
-  );
-};
-
-export default LoginForm;
diff --git a/modern/src/components/registration/RegisterForm.js b/modern/src/components/registration/RegisterForm.js
deleted file mode 100644
index 11dd510e..00000000
--- a/modern/src/components/registration/RegisterForm.js
+++ /dev/null
@@ -1,126 +0,0 @@
-import React, { useState } from 'react';
-import {
-  Grid, Button, TextField, Typography, Link, makeStyles, Snackbar,
-} from '@material-ui/core';
-import { useHistory } from 'react-router-dom';
-import ArrowBackIcon from '@material-ui/icons/ArrowBack';
-import StartPage from '../../StartPage';
-import { useTranslation } from '../../LocalizationProvider';
-import { snackBarDurationShortMs } from '../../common/duration';
-
-const useStyles = makeStyles((theme) => ({
-  title: {
-    fontSize: theme.spacing(3),
-    fontWeight: 500,
-    marginLeft: theme.spacing(2),
-    textTransform: 'uppercase',
-  },
-  link: {
-    fontSize: theme.spacing(3),
-    fontWeight: 500,
-    marginTop: theme.spacing(0.5),
-    cursor: 'pointer',
-  },
-}));
-
-const RegisterForm = () => {
-  const classes = useStyles();
-  const history = useHistory();
-  const t = useTranslation();
-
-  const [name, setName] = useState('');
-  const [email, setEmail] = useState('');
-  const [password, setPassword] = useState('');
-  const [snackbarOpen, setSnackbarOpen] = useState(false);
-
-  const handleSubmit = async () => {
-    const response = await fetch('/api/users', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ name, email, password }),
-    });
-    if (response.ok) {
-      setSnackbarOpen(true);
-    }
-  };
-
-  return (
-    <StartPage>
-      <Snackbar
-        anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
-        open={snackbarOpen}
-        onClose={() => history.push('/login')}
-        autoHideDuration={snackBarDurationShortMs}
-        message={t('loginCreated')}
-      />
-      <Grid container direction="column" spacing={2}>
-        <Grid container item>
-          <Grid item>
-            <Typography className={classes.link} color="primary">
-              <Link onClick={() => history.push('/login')}>
-                <ArrowBackIcon />
-              </Link>
-            </Typography>
-          </Grid>
-          <Grid item xs>
-            <Typography className={classes.title} color="primary">
-              {t('loginRegister')}
-            </Typography>
-          </Grid>
-        </Grid>
-        <Grid item>
-          <TextField
-            required
-            fullWidth
-            label={t('sharedName')}
-            name="name"
-            value={name}
-            autoComplete="name"
-            autoFocus
-            onChange={(event) => setName(event.target.value)}
-            variant="filled"
-          />
-        </Grid>
-        <Grid item>
-          <TextField
-            required
-            fullWidth
-            type="email"
-            label={t('userEmail')}
-            name="email"
-            value={email}
-            autoComplete="email"
-            onChange={(event) => setEmail(event.target.value)}
-            variant="filled"
-          />
-        </Grid>
-        <Grid item>
-          <TextField
-            required
-            fullWidth
-            label={t('userPassword')}
-            name="password"
-            value={password}
-            type="password"
-            autoComplete="current-password"
-            onChange={(event) => setPassword(event.target.value)}
-            variant="filled"
-          />
-        </Grid>
-        <Grid item>
-          <Button
-            variant="contained"
-            color="secondary"
-            onClick={handleSubmit}
-            disabled={!name || !/(.+)@(.+)\.(.{2,})/.test(email) || !password}
-            fullWidth
-          >
-            {t('loginRegister')}
-          </Button>
-        </Grid>
-      </Grid>
-    </StartPage>
-  );
-};
-
-export default RegisterForm;
diff --git a/modern/src/components/registration/ResetPasswordForm.js b/modern/src/components/registration/ResetPasswordForm.js
deleted file mode 100644
index 6c41a9ea..00000000
--- a/modern/src/components/registration/ResetPasswordForm.js
+++ /dev/null
@@ -1,129 +0,0 @@
-import React, { useState } from 'react';
-import {
-  Grid, Button, TextField, Typography, Link, makeStyles, Snackbar,
-} from '@material-ui/core';
-import { useHistory } from 'react-router-dom';
-import ArrowBackIcon from '@material-ui/icons/ArrowBack';
-import StartPage from '../../StartPage';
-import { useTranslation } from '../../LocalizationProvider';
-import useQuery from '../../common/useQuery';
-import { snackBarDurationShortMs } from '../../common/duration';
-
-const useStyles = makeStyles((theme) => ({
-  title: {
-    fontSize: theme.spacing(3),
-    fontWeight: 500,
-    marginLeft: theme.spacing(2),
-    textTransform: 'uppercase',
-  },
-  link: {
-    fontSize: theme.spacing(3),
-    fontWeight: 500,
-    marginTop: theme.spacing(0.5),
-    cursor: 'pointer',
-  },
-}));
-
-const ResetPasswordForm = () => {
-  const classes = useStyles();
-  const history = useHistory();
-  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 = 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);
-    }
-  };
-
-  return (
-    <StartPage>
-      <Snackbar
-        anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
-        open={snackbarOpen}
-        onClose={() => history.push('/login')}
-        autoHideDuration={snackBarDurationShortMs}
-        message={!token ? t('loginResetSuccess') : t('loginUpdateSuccess')}
-      />
-      <Grid container direction="column" spacing={2}>
-        <Grid container item>
-          <Grid item>
-            <Typography className={classes.link} color="primary">
-              <Link onClick={() => history.push('/login')}>
-                <ArrowBackIcon />
-              </Link>
-            </Typography>
-          </Grid>
-          <Grid item xs>
-            <Typography className={classes.title} color="primary">
-              {t('loginReset')}
-            </Typography>
-          </Grid>
-        </Grid>
-        {!token
-          ? (
-            <Grid item>
-              <TextField
-                required
-                fullWidth
-                type="email"
-                label={t('userEmail')}
-                name="email"
-                value={email}
-                autoComplete="email"
-                onChange={(event) => setEmail(event.target.value)}
-                variant="filled"
-              />
-            </Grid>
-          )
-          : (
-            <Grid item>
-              <TextField
-                required
-                fullWidth
-                label={t('userPassword')}
-                name="password"
-                value={password}
-                type="password"
-                autoComplete="current-password"
-                onChange={(event) => setPassword(event.target.value)}
-                variant="filled"
-              />
-            </Grid>
-          )}
-        <Grid item>
-          <Button
-            variant="contained"
-            color="secondary"
-            onClick={handleSubmit}
-            disabled={!/(.+)@(.+)\.(.{2,})/.test(email) && !password}
-            fullWidth
-          >
-            {t('loginReset')}
-          </Button>
-        </Grid>
-      </Grid>
-    </StartPage>
-  );
-};
-
-export default ResetPasswordForm;