import { ShoppingBasket, Person, Menu } from "@mui/icons-material"
import { AppBar, IconButton, Toolbar, Link, Box, Badge, Button, Typography } from "@mui/material"
import { Link as RouterLink } from "react-router-dom"
import { useSelector, useDispatch } from "react-redux"
import { setCloseAdminMenu, setIsOpenAdminMenu } from "../../store/adminMenuSlice"




const AdminHeader = ({ handleCart, orderLenght }) => {

    const dispatch = useDispatch()


    return (

        <AppBar position="static" sx={{ mb: 2}}>
            <Toolbar sx={{justifyContent: "space-between"}} >
                <Box display={"flex"} alignItems={"center"}>
                    <IconButton
                        color="inherit"
                        onClick={() => dispatch(setIsOpenAdminMenu())}
                        sx={{ mr: 1 }}>
                        <Menu />

                    </IconButton>
                    <Box sx={{ flexGrow: 1 }}>
                        <Link to="/admin" underline="none" variant="h5" sx={{ color: "white" }} component={RouterLink} >
                            My Shop <Typography component={'p'}>(панель администратора)</Typography>
                        </Link>
                    </Box>
                </Box>
                <Box>
                <Link to="/" underline="none" variant="h5" sx={{ color: "white" }} component={RouterLink} >
                            <Button size="small" variant="contained" color="secondary">магазин</Button>
                        </Link>
                </Box>
            </Toolbar>
        </AppBar>

    )
}

export default AdminHeader