File size: 1,664 Bytes
de8e64f |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 |
import React from 'react';
import { AppBar, Toolbar, Typography, IconButton, Box, Button } from '@mui/material';
import MenuIcon from '@mui/icons-material/Menu';
import AccountCircleIcon from '@mui/icons-material/AccountCircle';
import NotificationsIcon from '@mui/icons-material/Notifications';
import SettingsIcon from '@mui/icons-material/Settings';
import { useNavigate } from 'react-router-dom';
const Header = ({ toggleSidebar, systemInfo }) => {
const navigate = useNavigate();
return (
<AppBar position="fixed" sx={{ zIndex: (theme) => theme.zIndex.drawer + 1 }}>
<Toolbar>
<IconButton
color="inherit"
aria-label="open drawer"
edge="start"
onClick={toggleSidebar}
sx={{ mr: 2 }}
>
<MenuIcon />
</IconButton>
<Typography variant="h6" noWrap component="div" sx={{ flexGrow: 1 }}>
AnnabanOS Enhanced
{systemInfo && ` - ${systemInfo.version}`}
</Typography>
<Box sx={{ display: 'flex', alignItems: 'center' }}>
<Button
color="inherit"
startIcon={<NotificationsIcon />}
sx={{ mr: 1 }}
>
Notifications
</Button>
<Button
color="inherit"
startIcon={<SettingsIcon />}
onClick={() => navigate('/settings')}
sx={{ mr: 1 }}
>
Settings
</Button>
<IconButton color="inherit">
<AccountCircleIcon />
</IconButton>
</Box>
</Toolbar>
</AppBar>
);
};
export default Header;
|