react/src/pages/Signup.js
import React from 'react';
import CssBaseline from '@material-ui/core/CssBaseline';
import Typography from '@material-ui/core/Typography';
import { makeStyles } from '@material-ui/core/styles';
import Container from '@material-ui/core/Container';
import logo from '../logo.svg';
import { UserForm } from '../components/UserForm'
import { Link } from 'react-router-dom';
import routes from '../routes';
import { reverse as url } from 'named-urls'
const useStyles = makeStyles((theme) => ({
paper: {
marginTop: theme.spacing(8),
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
},
avatar: {
margin: theme.spacing(1),
backgroundColor: theme.palette.secondary.main,
},
form: {
width: '100%', // Fix IE 11 issue.
marginTop: theme.spacing(1),
},
submit: {
margin: theme.spacing(3, 0, 2),
},
}));
export default function Signup() {
const classes = useStyles();
return (
<Container component="main" maxWidth="xs">
<CssBaseline />
<div className={classes.paper}>
<img src={logo} alt="Logo"/>
<Typography component="h1" variant="h2">
Archivist
</Typography>
<Typography component="h2" variant="h5">
Sign up
</Typography>
<UserForm user={{}} />
</div>
or <Link to={url(routes.login)}>Login</Link> here
</Container>
);
}