import Header from "@/components/layouts/Header";
import Footer from "@/components/layouts/Footer";
import { useState } from "react";

type ChildrenContainer = Pick<JSX.IntrinsicElements["div"], "children">;

function Layout({ children }: ChildrenContainer) {
  const [sidebarView, setSideBarView] = useState(false);
  const toggleSideBar = () => {
    setSideBarView(!sidebarView);
  };

  return (
    <div id="main-wrapper">
      <Header toggleSideBar={toggleSideBar} />
      <main>{children}</main>
      <Footer />
    </div>
  );
}
export default Layout;