This commit is contained in:
binwiederhier 2022-12-14 23:11:22 -05:00
parent c35e5b33d1
commit c2f16f740b
21 changed files with 332 additions and 547 deletions

View file

@ -1,24 +1,27 @@
import * as React from 'react';
import {Avatar, Checkbox, FormControlLabel, Grid, Link, Stack} from "@mui/material";
import Typography from "@mui/material/Typography";
import Container from "@mui/material/Container";
import LockOutlinedIcon from '@mui/icons-material/LockOutlined';
import {Avatar, Link} from "@mui/material";
import TextField from "@mui/material/TextField";
import Button from "@mui/material/Button";
import Box from "@mui/material/Box";
import api from "../app/Api";
import {useNavigate} from "react-router-dom";
import routes from "./routes";
import session from "../app/Session";
import logo from "../img/ntfy2.svg";
import Typography from "@mui/material/Typography";
import {NavLink} from "react-router-dom";
const Signup = () => {
const handleSubmit = async (event) => {
event.preventDefault();
const data = new FormData(event.currentTarget);
const username = data.get('username');
const password = data.get('password');
const user = {
username: data.get('username'),
password: data.get('password'),
}
username: username,
password: password
}; // FIXME omg so awful
await api.createAccount("http://localhost:2586"/*window.location.origin*/, username, password);
const token = await api.login("http://localhost:2586"/*window.location.origin*/, user);
console.log(`[Api] User auth for user ${user.username} successful, token is ${token}`);
session.store(user.username, token);
@ -26,68 +29,69 @@ const Signup = () => {
};
return (
<>
<Box
sx={{
marginTop: 8,
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
}}
>
<Avatar sx={{m: 1, bgcolor: 'secondary.main'}}>
<LockOutlinedIcon/>
</Avatar>
<Typography component="h1" variant="h5">
Sign in
</Typography>
<Box component="form" onSubmit={handleSubmit} noValidate sx={{mt: 1}}>
<TextField
margin="normal"
required
fullWidth
id="username"
label="Username"
name="username"
autoFocus
/>
<TextField
margin="normal"
required
fullWidth
name="password"
label="Password"
type="password"
id="password"
autoComplete="current-password"
/>
<FormControlLabel
control={<Checkbox value="remember" color="primary"/>}
label="Remember me"
/>
<Button
type="submit"
fullWidth
variant="contained"
sx={{mt: 3, mb: 2}}
>
Sign up
</Button>
<Grid container>
<Grid item xs>
<Link href="#" variant="body2">
Forgot password?
</Link>
</Grid>
<Grid item>
<Link to={routes.signup} variant="body2">
{"Don't have an account? Sign Up"}
</Link>
</Grid>
</Grid>
</Box>
<Box
sx={{
display: 'flex',
flexGrow: 1,
justifyContent: 'center',
flexDirection: 'column',
alignContent: 'center',
alignItems: 'center',
height: '100vh'
}}
>
<Avatar
sx={{ m: 2, width: 64, height: 64, borderRadius: 3 }}
src={logo}
variant="rounded"
/>
<Typography sx={{ typography: 'h6' }}>
Create a ntfy account
</Typography>
<Box component="form" onSubmit={handleSubmit} noValidate sx={{mt: 1, maxWidth: 400}}>
<TextField
margin="dense"
required
fullWidth
id="username"
label="Username"
name="username"
autoFocus
/>
<TextField
margin="dense"
required
fullWidth
name="password"
label="Password"
type="password"
id="password"
autoComplete="current-password"
/>
<TextField
margin="dense"
required
fullWidth
name="confirm-password"
label="Confirm password"
type="password"
id="confirm-password"
/>
<Button
type="submit"
fullWidth
variant="contained"
sx={{mt: 2, mb: 2}}
>
Sign up
</Button>
</Box>
</>
<Typography sx={{mb: 4}}>
<NavLink to={routes.login} variant="body1">
Already have an account? Sign in
</NavLink>
</Typography>
</Box>
);
}