import { NavLink } from 'react-router-dom';
import { LayoutDashboard, Users, BriefcaseMedical, Factory, ShieldCheck, Library, Settings, LogOut } from 'lucide-react';
import { useAuth } from '@/lib/AuthContext';
import { getLicenseStatus } from '@/lib/license';
import { runtimeConfig } from '@/lib/runtime-config';
import StudioLogo from './StudioLogo';
const links = [['/','Studio',LayoutDashboard],['/patients','Patients',Users],['/cases','Cases',BriefcaseMedical],['/manufacturing','Manufacturing',Factory],['/quality','Quality Control',ShieldCheck],['/libraries','Libraries',Library],['/settings','System',Settings]];
const StudioSidebar = () => { const { logout } = useAuth(); const license=getLicenseStatus(runtimeConfig.mode); return <aside className="hidden w-60 shrink-0 border-r border-white/[.06] bg-black/20 p-4 md:flex md:flex-col">
  <StudioLogo />
  <nav className="mt-10 space-y-1">{links.map(([to,label,Icon]) => <NavLink key={to} to={to} end={to === '/'} className={({isActive}) => `flex items-center gap-3 rounded-lg px-3 py-2.5 text-xs transition ${isActive ? 'bg-cyan-400/10 text-cyan-300' : 'text-slate-500 hover:bg-white/[.03] hover:text-white'}`}><Icon className="h-4 w-4" />{label}</NavLink>)}</nav>
  <div className="mt-auto rounded-xl border border-white/[.06] bg-white/[.02] p-3">
    <div className="text-[9px] uppercase tracking-widest text-slate-600">License</div><div className="mt-1 text-xs text-slate-300">{license.plan}</div>
    <button onClick={() => logout(true)} className="mt-4 flex items-center gap-2 text-[10px] text-slate-600 hover:text-white"><LogOut className="h-3.5 w-3.5" />Sign out</button>
  </div>
</aside>; };
export default StudioSidebar;