import React, { useState, useEffect } from 'react'; import { NavLink, useLocation, useNavigate } from 'react-router-dom'; import { LayoutDashboard, Users, UserCircle, Bell, Search, Menu, X, LogOut, Hexagon, Settings, Building2 } from 'lucide-react'; import { getAttendances, getUsers, getUserById } from '../services/dataService'; import { User } from '../types'; const SidebarItem = ({ to, icon: Icon, label, collapsed }: { to: string, icon: any, label: string, collapsed: boolean }) => ( `flex items-center gap-3 px-4 py-3 rounded-xl transition-all duration-200 group ${ isActive ? 'bg-yellow-400 text-slate-900 font-semibold shadow-md shadow-yellow-400/20' : 'text-slate-500 hover:bg-slate-100 hover:text-slate-900' }` } > {!collapsed && {label}} ); export const Layout: React.FC<{ children: React.ReactNode }> = ({ children }) => { const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); const location = useLocation(); const navigate = useNavigate(); const [currentUser, setCurrentUser] = useState(null); useEffect(() => { const fetchUser = async () => { const storedUserId = localStorage.getItem('ctms_user_id'); if (!storedUserId) { navigate('/login'); return; } const user = await getUserById(storedUserId); if (user) { setCurrentUser(user); } else { navigate('/login'); } }; fetchUser(); }, [navigate]); const handleLogout = () => { localStorage.removeItem('ctms_user_id'); localStorage.removeItem('ctms_tenant_id'); navigate('/login'); }; if (!currentUser) return null; // Brief null return while navigating or fetching const isSuperAdmin = currentUser.role === 'super_admin'; return (
{/* Sidebar */} {/* Main Content */}
{/* Header */}

{getPageTitle()}

{/* Search Bar */}
{/* Notifications */}
{/* Scrollable Content Area */}
{children}
{/* Overlay for mobile */} {isMobileMenuOpen && (
setIsMobileMenuOpen(false)} /> )}
); };