import { Outlet } from "react-router-dom";
import Logo from "./Logo";
import Location from "./Location";
import Auth from "./Auth";
import Navbar from "./Navbar";
import useModal from "../../store/useModal";

const Header = () => {
  const { modal } = useModal();
  return (
    <>
      {modal}
      <header className="bg-white w-full text-white grid grid-cols-6 text-sm">
        <div className="flex gap-4 col-span-2">
          <Logo />
          <Location />
        </div>
        <Navbar />
        <Auth />
      </header>
      <Outlet />
    </>
  );
};

export default Header;