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 dark:bg-rtgray-900">
 | |
|                     {children}
 | |
|                 </div>
 | |
|             </div>
 | |
|             <Footer/>
 | |
|         </div>
 | |
|         
 | |
|     );
 | |
| };
 | |
| 
 | |
| export default DashboardLayout; |