32 lines
1.1 KiB
TypeScript
32 lines
1.1 KiB
TypeScript
// components/layouts/DashboardLayout.tsx
|
|
'use client';
|
|
|
|
import { useSelector } from 'react-redux';
|
|
import { IRootState } from '@/store';
|
|
import Sidebar from '@/components/layouts/sidebar';
|
|
import Header from '@/components/layouts/header'; // Correctly import the consolidated Header
|
|
import Footer from '@/components/layouts/footer';
|
|
|
|
const DashboardLayout = ({ children }: { children: React.ReactNode }) => {
|
|
const themeConfig = useSelector((state: IRootState) => state.themeConfig);
|
|
const semidark = useSelector((state: IRootState) => state.themeConfig.semidark);
|
|
|
|
return (
|
|
<div className={`${semidark ? 'dark' : ''} ${themeConfig.sidebar ? 'toggle-sidebar' : ''}`}>
|
|
{/* Only render the single, consolidated Header component */}
|
|
<Header/>
|
|
<Sidebar />
|
|
|
|
<div className="main-content">
|
|
{/* This is where your page content will be injected */}
|
|
<div className="p-6 space-y-4 min-h-screen">
|
|
{children}
|
|
</div>
|
|
</div>
|
|
<Footer/>
|
|
</div>
|
|
|
|
);
|
|
};
|
|
|
|
export default DashboardLayout; |