51 lines
1.3 KiB
JavaScript
51 lines
1.3 KiB
JavaScript
import React from "react";
|
|
import PropTypes from "prop-types";
|
|
import clsx from "clsx";
|
|
import { makeStyles } from "@material-ui/core/styles";
|
|
import { AppBar, Toolbar, Typography, IconButton } from "@material-ui/core";
|
|
import MenuIcon from "@material-ui/icons/Menu";
|
|
import ProfileButton from "./ProfileButton";
|
|
import LightDarkToggle from "./LightDarkToggle";
|
|
import styles from "./styles";
|
|
|
|
const useStyles = makeStyles(styles);
|
|
|
|
const TopBar = ({ open, handleDrawerOpen }) => {
|
|
const classes = useStyles();
|
|
|
|
return (
|
|
<AppBar
|
|
position="fixed"
|
|
className={clsx(classes.appBar, {
|
|
[classes.appBarShift]: open
|
|
})}
|
|
>
|
|
<Toolbar>
|
|
<IconButton
|
|
color="inherit"
|
|
aria-label="open drawer"
|
|
onClick={handleDrawerOpen}
|
|
edge="start"
|
|
className={clsx(classes.menuButton, {
|
|
[classes.hide]: open
|
|
})}
|
|
>
|
|
<MenuIcon />
|
|
</IconButton>
|
|
<Typography variant="h6" noWrap className={classes.title}>
|
|
Network resurrector
|
|
</Typography>
|
|
<LightDarkToggle />
|
|
<ProfileButton />
|
|
</Toolbar>
|
|
</AppBar>
|
|
);
|
|
};
|
|
|
|
TopBar.propTypes = {
|
|
open: PropTypes.bool.isRequired,
|
|
handleDrawerOpen: PropTypes.func.isRequired
|
|
};
|
|
|
|
export default TopBar;
|