Registration and login pages link to each other.

client/src/components/windows/login/LoginWindow.tsx

@@ -4,6 +4,7 @@ import { Box, Paper, Typography, TextField, Button } from "@material-ui/core";
 import { useHistory, useLocation } from 'react-router';
 import { useAuth, Auth } from '../../../lib/useAuth';
 import Alert from '@material-ui/lab/Alert';
+import { Link } from 'react-router-dom';
 
 export enum LoginStatus {
     NoneSubmitted = 0,
@@ -70,6 +71,7 @@ export function LoginWindowControlled(props: {
         <Box
             m={1}
             mt={4}
+            width="500px"
         >
             <Paper>
                 <Box p={3}>
@@ -113,6 +115,15 @@ export function LoginWindowControlled(props: {
                             variant="outlined"
                             color="primary"
                         >Sign in</Button>
+                        <Box display="flex" alignItems="center" mt={2}>
+                            <Typography>Need an account?</Typography>
+                            <Box flexGrow={1} ml={2}><Button
+                                onClick={() => history.replace("/register")}
+                                fullWidth
+                                variant="outlined"
+                                color="primary"
+                            >Sign up</Button></Box>
+                        </Box>
                     </form>
                 </Box>
             </Paper>

client/src/components/windows/register/RegisterWindow.tsx

@@ -76,6 +76,7 @@ export function RegisterWindowControlled(props: {
         <Box
             m={1}
             mt={4}
+            width="500px"
         >
             <Paper>
                 <Box p={3}>
@@ -118,11 +119,20 @@ export function RegisterWindowControlled(props: {
                             </Alert>
                         }
                         {props.state.status !== RegistrationStatus.Successful && <Button
-                            type="submit"
-                            fullWidth
-                            variant="outlined"
-                            color="primary"
-                        >Sign up</Button>}
+                                type="submit"
+                                fullWidth
+                                variant="outlined"
+                                color="primary"
+                            >Sign up</Button>}
+                        <Box display="flex" alignItems="center" mt={2}>
+                            <Typography>Already have an account?</Typography>
+                            <Box flexGrow={1} ml={2}><Button
+                                onClick={() => history.replace("/login")}
+                                fullWidth
+                                variant="outlined"
+                                color="primary"
+                            >Sign in</Button></Box>
+                        </Box>
                     </form>
                 </Box>
             </Paper>