84 lines
2.5 KiB
JavaScript
84 lines
2.5 KiB
JavaScript
import React, { useState } from "react";
|
|
import { useLocation } from "react-router-dom";
|
|
import AdminNavbar from "components/Navbars/AdminNavbar.js";
|
|
import AdminFooter from "components/Footers/AdminFooter.js";
|
|
import Sidebar from "components/Sidebar/Sidebar.js";
|
|
import { useSystemParameters } from "../context/SystemParameterContext";
|
|
import { Outlet } from "react-router-dom"; // Import Outlet for nested routing
|
|
import routes from "routes.js";
|
|
|
|
const Admin = (props) => {
|
|
const mainContent = React.useRef(null);
|
|
const location = useLocation();
|
|
// Add state for sidebar collapse
|
|
const [sidebarCollapsed, setSidebarCollapsed] = useState(false);
|
|
|
|
// Scroll to top on location change
|
|
React.useEffect(() => {
|
|
document.documentElement.scrollTop = 0;
|
|
document.scrollingElement.scrollTop = 0;
|
|
mainContent.current.scrollTop = 0;
|
|
}, [location]);
|
|
|
|
// Get the current page's brand text
|
|
const getBrandText = (path) => {
|
|
for (let i = 0; i < routes.length; i++) {
|
|
if (
|
|
path.indexOf(routes[i].layout + routes[i].path) !== -1
|
|
) {
|
|
return routes[i].name;
|
|
}
|
|
}
|
|
return "Brand";
|
|
};
|
|
|
|
// Handle sidebar toggle
|
|
const handleSidebarToggle = (collapsed) => {
|
|
setSidebarCollapsed(collapsed);
|
|
};
|
|
|
|
// Check if the current page is an admin page
|
|
const isAdminPage = location.pathname.startsWith("/admin");
|
|
const { systemParameters, loading, error } = useSystemParameters();
|
|
return (
|
|
<>
|
|
{/* Render Navbar only on admin pages */}
|
|
{isAdminPage && (
|
|
<div className="navbar-container">
|
|
<AdminNavbar
|
|
{...props}
|
|
brandText={systemParameters ? systemParameters.company_Display_Name : "Loading..."}
|
|
/>
|
|
</div>
|
|
)}
|
|
{/* Render Sidebar only on admin pages */}
|
|
{isAdminPage && (
|
|
<Sidebar
|
|
{...props}
|
|
routes={routes}
|
|
onSidebarToggle={handleSidebarToggle}
|
|
logo={{
|
|
innerLink: "/admin/index",
|
|
imgSrc: require("../assets/img/brand/argon-react.png"),
|
|
imgAlt: "Logo",
|
|
}}
|
|
/>
|
|
)}
|
|
<div
|
|
className={`main-content ${sidebarCollapsed ? 'sidebar-collapsed-main' : ''}`}
|
|
ref={mainContent}
|
|
>
|
|
|
|
{/* This is where the nested routes will render */}
|
|
<div className="px-0" style={{ marginTop: "7rem" }}>
|
|
<Outlet />
|
|
</div>
|
|
|
|
{/* Render Footer only on admin pages */}
|
|
{/* {isAdminPage && <AdminFooter />} */}
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default Admin; |