import React from "react";
import MenuIcon from "@mui/icons-material/Menu";
import Weather from "../pages/main/Weather.jsx";
import PersonIcon from "@mui/icons-material/Person";
import { useNavigate } from "react-router";

function Header({ title }) {
  const navigate = useNavigate();
  const [headerData, setHeaderData] = React.useState(0);

  return (
    <header>
      <div className="header-flex flex flex-align">
        <span className="page-title-span">{title}</span>
        <div className="page-title flex flex-align">
          {/* <MenuIcon /> */}
          <div className="info-wrap flex">
            <div className="usericon"><PersonIcon sx={{ width:48, height:48,}} /></div>
            <p className="header-info-id">admin1</p>            
          </div>
        <Weather />
        </div>
      </div>
    </header>
  );
}

export default Header;