51 lines
1.5 KiB
JavaScript
51 lines
1.5 KiB
JavaScript
import { useState } from "react";
|
|
import FullPageLayout from "../FullPageLayout";
|
|
import Header from "./header";
|
|
import Sidebar from "./sidebar";
|
|
import { Toolbar } from "@mui/material";
|
|
import BreadCrumbs from "./breadcrumbs";
|
|
import { ToastContainer } from "react-toastify";
|
|
import "react-toastify/dist/ReactToastify.css";
|
|
import useDirection from "@/lib/app/hooks/useDirection";
|
|
|
|
const drawerWidth = 240;
|
|
|
|
const DashboardLayouts = (props) => {
|
|
const { directionApp } = useDirection();
|
|
const { window } = props;
|
|
const [mobileOpen, setMobileOpen] = useState(false);
|
|
const container =
|
|
window !== undefined ? () => window().document.body : undefined;
|
|
|
|
const handleDrawerToggle = () => {
|
|
setMobileOpen(!mobileOpen);
|
|
};
|
|
return (
|
|
<FullPageLayout direction="row">
|
|
<Header
|
|
handleDrawerToggle={handleDrawerToggle}
|
|
drawerWidth={drawerWidth}
|
|
/>
|
|
<Sidebar
|
|
container={container}
|
|
mobileOpen={mobileOpen}
|
|
handleDrawerToggle={handleDrawerToggle}
|
|
drawerWidth={drawerWidth}
|
|
/>
|
|
<FullPageLayout
|
|
component="main"
|
|
sx={{ flexGrow: 1, width: { sm: `calc(100% - ${drawerWidth}px)` } }}
|
|
>
|
|
<Toolbar />
|
|
<FullPageLayout sx={{ mt: 3 }}>
|
|
<BreadCrumbs isVisible={true} />
|
|
{props.children}
|
|
</FullPageLayout>
|
|
</FullPageLayout>
|
|
{directionApp === "rtl" ? <ToastContainer rtl /> : <ToastContainer ltr />}
|
|
</FullPageLayout>
|
|
);
|
|
};
|
|
|
|
export default DashboardLayouts;
|