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

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

function Layout({ children,notify = false, setnotifys = () => undefined }: ChildrenContainer) {
  
  const [sidebarView, setSideBarView] = useState(false);
  const toggleSideBar = () => {
    setSideBarView(!sidebarView);
  };
  
  
  return (
    <>
      <div id="main-wrapper">
        <Header toggleSideBar={toggleSideBar} notify={notify} setNotify={setnotifys} />

        <Sidebar sidebarView={sidebarView} />
        <main className="main-section">{children}</main>
        <Footer />
      </div>
    </>
  );
}
export default Layout;