86 lines
2.7 KiB
TypeScript
86 lines
2.7 KiB
TypeScript
import { Link, useLocation } from 'react-router-dom'
|
|
import {
|
|
LayoutDashboard,
|
|
Building2,
|
|
Ticket,
|
|
FileText,
|
|
Gauge,
|
|
ToggleLeft,
|
|
Settings,
|
|
FolderTree,
|
|
ClipboardList,
|
|
MessageSquareText,
|
|
LayoutGrid,
|
|
ArrowLeft,
|
|
} from 'lucide-react'
|
|
import { cn } from '@/lib/utils'
|
|
|
|
const navItems = [
|
|
{ path: '/admin', label: 'Dashboard', icon: LayoutDashboard, end: true },
|
|
{ path: '/admin/accounts', label: 'Accounts', icon: Building2 },
|
|
{ path: '/admin/invite-codes', label: 'Invite Codes', icon: Ticket },
|
|
{ path: '/admin/audit-logs', label: 'Audit Logs', icon: FileText },
|
|
{ path: '/admin/plan-limits', label: 'Plan Limits', icon: Gauge },
|
|
{ path: '/admin/feature-flags', label: 'Feature Flags', icon: ToggleLeft },
|
|
{ path: '/admin/settings', label: 'Settings', icon: Settings },
|
|
{ path: '/admin/categories', label: 'Categories', icon: FolderTree },
|
|
{ path: '/admin/survey-invites', label: 'Survey Invites', icon: ClipboardList },
|
|
{ path: '/admin/survey-responses', label: 'Survey Responses', icon: MessageSquareText },
|
|
{ path: '/admin/gallery', label: 'Gallery', icon: LayoutGrid },
|
|
]
|
|
|
|
interface AdminSidebarProps {
|
|
className?: string
|
|
onNavigate?: () => void
|
|
}
|
|
|
|
export function AdminSidebar({ className, onNavigate }: AdminSidebarProps) {
|
|
const location = useLocation()
|
|
|
|
const isActive = (path: string, end?: boolean) => {
|
|
if (end) return location.pathname === path
|
|
return location.pathname.startsWith(path)
|
|
}
|
|
|
|
return (
|
|
<aside className={cn('flex h-full flex-col', className)}>
|
|
<div className="p-4">
|
|
<h2 className="text-lg font-bold text-foreground">Admin Panel</h2>
|
|
</div>
|
|
<nav className="flex-1 space-y-1 px-3">
|
|
{navItems.map((item) => (
|
|
<Link
|
|
key={item.path}
|
|
to={item.path}
|
|
onClick={onNavigate}
|
|
className={cn(
|
|
'flex items-center gap-3 rounded-md px-3 py-2 text-sm font-medium transition-colors',
|
|
isActive(item.path, item.end)
|
|
? 'bg-accent text-foreground'
|
|
: 'text-muted-foreground hover:bg-accent hover:text-foreground'
|
|
)}
|
|
>
|
|
<item.icon className="h-4 w-4" />
|
|
{item.label}
|
|
</Link>
|
|
))}
|
|
</nav>
|
|
<div className="border-t border-border p-3">
|
|
<Link
|
|
to="/trees"
|
|
onClick={onNavigate}
|
|
className={cn(
|
|
'flex items-center gap-3 rounded-md px-3 py-2 text-sm font-medium',
|
|
'text-muted-foreground hover:bg-accent hover:text-foreground'
|
|
)}
|
|
>
|
|
<ArrowLeft className="h-4 w-4" />
|
|
Back to App
|
|
</Link>
|
|
</div>
|
|
</aside>
|
|
)
|
|
}
|
|
|
|
export default AdminSidebar
|