75 lines
2.4 KiB
TypeScript
75 lines
2.4 KiB
TypeScript
"use client"
|
|
|
|
import Link from "next/link"
|
|
import { usePathname } from "next/navigation"
|
|
import { cn } from "@/lib/utils"
|
|
import { useAuth } from "@/lib/auth-context"
|
|
import { LayoutDashboard, FolderKanban, Layers, LogOut, Terminal, ExternalLink } from "lucide-react"
|
|
import { Button } from "@/components/ui/button"
|
|
|
|
const navItems = [
|
|
{ href: "/admin", label: "Dashboard", icon: LayoutDashboard },
|
|
{ href: "/admin/projects", label: "Projects", icon: FolderKanban },
|
|
{ href: "/admin/stack", label: "Tech Stack", icon: Layers },
|
|
]
|
|
|
|
export function AdminSidebar() {
|
|
const pathname = usePathname()
|
|
const { logout } = useAuth()
|
|
|
|
return (
|
|
<aside className="w-64 bg-card border-r border-border flex flex-col">
|
|
{/* Header */}
|
|
<div className="p-6 border-b border-border">
|
|
<Link href="/admin" className="flex items-center gap-2 text-primary">
|
|
<Terminal size={20} />
|
|
<span className="font-mono font-semibold">atticl</span>
|
|
<span className="text-xs font-mono text-muted-foreground bg-secondary px-1.5 py-0.5 rounded">admin</span>
|
|
</Link>
|
|
</div>
|
|
|
|
{/* Navigation */}
|
|
<nav className="flex-1 p-4 space-y-1">
|
|
{navItems.map((item) => {
|
|
const isActive = pathname === item.href
|
|
return (
|
|
<Link
|
|
key={item.href}
|
|
href={item.href}
|
|
className={cn(
|
|
"flex items-center gap-3 px-3 py-2 rounded-md text-sm font-mono transition-colors",
|
|
isActive
|
|
? "bg-primary/10 text-primary"
|
|
: "text-muted-foreground hover:text-foreground hover:bg-secondary",
|
|
)}
|
|
>
|
|
<item.icon size={16} />
|
|
{item.label}
|
|
</Link>
|
|
)
|
|
})}
|
|
</nav>
|
|
|
|
{/* Footer */}
|
|
<div className="p-4 border-t border-border space-y-2">
|
|
<Link
|
|
href="/"
|
|
target="_blank"
|
|
className="flex items-center gap-2 px-3 py-2 text-sm font-mono text-muted-foreground hover:text-foreground transition-colors"
|
|
>
|
|
<ExternalLink size={14} />
|
|
View site
|
|
</Link>
|
|
<Button
|
|
variant="ghost"
|
|
onClick={logout}
|
|
className="w-full justify-start gap-2 font-mono text-muted-foreground hover:text-destructive"
|
|
>
|
|
<LogOut size={14} />
|
|
Logout
|
|
</Button>
|
|
</div>
|
|
</aside>
|
|
)
|
|
}
|