'use client' import Link from 'next/link' import { usePathname } from 'next/navigation' import { useState, useEffect } from 'react' import { navigation, metaModules, NavCategory, CategoryId } from '@/lib/navigation' import { RoleId, getStoredRole, isCategoryVisibleForRole } from '@/lib/roles' import { RoleIndicator } from './RoleIndicator' // Icons mapping const categoryIcons: Record = { 'shield-check': ( ), 'clipboard-check': ( ), shield: ( ), brain: ( ), server: ( ), graduation: ( ), mail: ( ), code: ( ), } const metaIcons: Record = { dashboard: ( ), architecture: ( ), onboarding: ( ), backlog: ( ), rbac: ( ), } interface SidebarProps { onRoleChange?: () => void } export function Sidebar({ onRoleChange }: SidebarProps) { const pathname = usePathname() const [collapsed, setCollapsed] = useState(false) const [expandedCategories, setExpandedCategories] = useState>(new Set()) const [currentRole, setCurrentRole] = useState(null) useEffect(() => { const role = getStoredRole() setCurrentRole(role) // Auto-expand category based on current path if (role) { const category = navigation.find(cat => cat.modules.some(m => pathname.startsWith(m.href.split('/')[1] ? `/${m.href.split('/')[1]}` : m.href)) ) if (category) { setExpandedCategories(new Set([category.id])) } } }, [pathname]) const toggleCategory = (categoryId: CategoryId) => { setExpandedCategories(prev => { const newSet = new Set(prev) if (newSet.has(categoryId)) { newSet.delete(categoryId) } else { newSet.add(categoryId) } return newSet }) } const isModuleActive = (href: string) => { if (href === '/dashboard') { return pathname === '/dashboard' } return pathname.startsWith(href) } const visibleCategories = currentRole ? navigation.filter(cat => isCategoryVisibleForRole(cat.id, currentRole)) : navigation return ( ) }