add account overview, cleanup
Change-Id: I176af7a7688f38cb30eb7d65fa3e00e55f10da6f
diff --git a/client/src/components/Header.js b/client/src/components/Header.js
index c0408a1..c621b56 100644
--- a/client/src/components/Header.js
+++ b/client/src/components/Header.js
@@ -1,45 +1,33 @@
-import React from 'react'
-import Button from '@material-ui/core/Button';
-import Menu from '@material-ui/core/Menu';
-import MenuItem from '@material-ui/core/MenuItem';
-//import { useHistory } from "react-router-dom";
+import React, { useState } from 'react'
+import { Box, Button, Menu, MenuItem } from '@material-ui/core'
+import { useHistory, useParams } from "react-router-dom"
import authManager from '../AuthManager'
export default function Header() {
- //const history = useHistory();
+ const history = useHistory()
+ const [anchorEl, setAnchorEl] = useState(null)
+ const handleClick = (event) => setAnchorEl(event.currentTarget)
+ const handleClose = () => setAnchorEl(null)
+ const params = useParams()
- const [anchorEl, setAnchorEl] = React.useState(null);
+ const goToAccountSelection = () => history.push(`/account`)
+ const goToAccountSettings = () => history.push(`/account/${params.accountId}/settings`)
- const handleClick = (event) => {
- setAnchorEl(event.currentTarget);
- };
-
- const handleClose = () => {
- setAnchorEl(null);
- };
-
- const disconnect = () => {
- authManager.disconnect()
- //let path = `/`;
- //history.push(path);
- }
-
- return (
- <div>
- <Button aria-controls="simple-menu" aria-haspopup="true" onClick={handleClick}>
- Menu
- </Button>
- <Menu
- id="simple-menu"
- anchorEl={anchorEl}
-
- open={Boolean(anchorEl)}
- onClose={handleClose}
- >
- <MenuItem onClick={handleClose}>Profile</MenuItem>
- <MenuItem onClick={handleClose}>Mon compte</MenuItem>
- <MenuItem onClick={disconnect}>Déconnexion</MenuItem>
- </Menu>
- </div>
- );
+ return (
+ <Box>
+ <Button aria-controls="simple-menu" aria-haspopup="true" onClick={handleClick}>
+ Menu
+ </Button>
+ <Menu
+ id="simple-menu"
+ anchorEl={anchorEl}
+ open={Boolean(anchorEl)}
+ onClose={handleClose}
+ >
+ <MenuItem onClick={goToAccountSelection}>Change account</MenuItem>
+ {params.accountId && <MenuItem onClick={goToAccountSettings}>Account settings</MenuItem>}
+ <MenuItem onClick={() => authManager.disconnect()}>Log out</MenuItem>
+ </Menu>
+ </Box>
+ )
}
\ No newline at end of file