From 5b44e46d312cc16b77f963602b76cf27fcf73368 Mon Sep 17 00:00:00 2001
From: Felix Albrigtsen <felixalbrigtsen@gmail.com>
Date: Sun, 24 Apr 2022 14:48:38 +0200
Subject: [PATCH] Visual updates

---
 src/client/src/LoginPage.js           |  2 +-
 src/client/src/ProfilePage.js         | 30 ++++++++++++---------------
 src/client/src/components/AsuraBar.js |  2 +-
 3 files changed, 15 insertions(+), 19 deletions(-)

diff --git a/src/client/src/LoginPage.js b/src/client/src/LoginPage.js
index b99e863..6f075a3 100644
--- a/src/client/src/LoginPage.js
+++ b/src/client/src/LoginPage.js
@@ -11,7 +11,7 @@ export default function LoginPage(props) {
         window.location.href = "/";
         return;
     }
-
+    
     return (
         <>
             <Appbar user={props.user} pageTitle="Login" /> 
diff --git a/src/client/src/ProfilePage.js b/src/client/src/ProfilePage.js
index ea63454..16f1ee2 100644
--- a/src/client/src/ProfilePage.js
+++ b/src/client/src/ProfilePage.js
@@ -1,32 +1,28 @@
 import * as React from "react";
 import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
 import Appbar from "./components/AsuraBar";
+import LoginPage from "./LoginPage";
 import ErrorSnackbar from "./components/ErrorSnackbar";
 import { Button, TextField, Stack, InputLabel, Select, Container, Slider, Paper, Box, Grid, Typography } from '@mui/material';
 
 export default function ProfilePage(props) {
     let user = props.user;
+
+    if (!props.user.isLoggedIn) { return <LoginPage user={props.user} />; }
+
     return (<>
         <Appbar user={props.user} pageTitle="Profile" />
         <Container sx={{minHeight: "30vh", width: "90vw", padding: "20px 20px"}} component={Container} direction="column" align="center">
-            {user.isLoggedIn ? <>
-                <Paper sx={{minHeight: "30vh", width: "90vw", margin: "10px auto"}} component={Stack} direction="column" justifyContent="center">
-                    <div align="center">
-                    <h2><b>Your profile</b></h2>
-                    <Box>
-                        <h3><b>Name: </b> {user.name}</h3>
-                        <h3><b>Email: </b> {user.email}</h3>
-                        <h3><b>Role: </b> {user.isManager ? "Manager" : "Administrator"}</h3>
-                        <h3><b>Picture: </b> <img src={user.imgURL} alt="Your profile"></img></h3>
-                    </Box>
-                    </div>
-                </Paper>
-            </> : <>
-                <Box sx={{ padding: "20px", width: "90vw", height: "30vh", display: "flex", flexDirection: "column", justifyContent: "space-between", alignItems: "center", alignContent: "center", flexGrow: 1}}>
-                    You are not logged in.
+            <Paper sx={{minHeight: "30vh", width: "90vw", margin: "10px auto"}} component={Stack} direction="column" justifyContent="center">
+                <div align="center">
+                <h2><b>Your profile</b></h2>
+                <Box>
+                    <h3><b>Name: </b> {user.name}</h3>
+                    <h3><b>Email: </b> {user.email}</h3>
+                    <h3><b>Role: </b> {user.isManager ? "Manager" : "Administrator"}</h3>
                 </Box>
-            </>}
-
+                </div>
+            </Paper>
         </Container>
     </>)
 }
\ No newline at end of file
diff --git a/src/client/src/components/AsuraBar.js b/src/client/src/components/AsuraBar.js
index 0bfeef5..6d935bf 100644
--- a/src/client/src/components/AsuraBar.js
+++ b/src/client/src/components/AsuraBar.js
@@ -29,7 +29,7 @@ function LoggedInMenu(props) {
         <MenuIcon />
         </IconButton>
         <Menu anchorEl={anchorEl} open={open} onClose={handleClose} MenuListProps={{'aria-labelledby': 'basic-button',}} sx={{position:"absolute"}}>
-          <Link to="/" style={{color:"black"}}><MenuItem onClick={handleClose}><Button endIcon={<AccountCircleIcon />}>Profile</Button></MenuItem></Link>
+          <Link to="/profile" style={{color:"black"}}><MenuItem onClick={handleClose}><Button endIcon={<AccountCircleIcon />}>Profile</Button></MenuItem></Link>
           <Link to="/history" style={{color:"black"}}><MenuItem onClick={handleClose}><Button endIcon={<HistoryIcon />}>History</Button></MenuItem></Link>
           <Link to="/api/logout" style={{color:"black"}}><MenuItem onClick={logout}><Button endIcon={<LogoutIcon />} >Logout</Button></MenuItem></Link>
           { props.user.isManager &&