61 lines
No EOL
1.8 KiB
TypeScript
61 lines
No EOL
1.8 KiB
TypeScript
"use client"
|
|
|
|
import Link from "next/link"
|
|
import { usePathname } from "next/navigation"
|
|
import { Library, MessageSquare, Settings2 } from "lucide-react"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
export function Navigation() {
|
|
const pathname = usePathname()
|
|
|
|
const routes = [
|
|
{
|
|
label: "Chat",
|
|
icon: MessageSquare,
|
|
href: "/chat",
|
|
active: pathname === "/" || pathname === "/chat",
|
|
},
|
|
{
|
|
label: "Knowledge",
|
|
icon: Library,
|
|
href: "/knowledge",
|
|
active: pathname === "/knowledge",
|
|
},
|
|
{
|
|
label: "Settings",
|
|
icon: Settings2,
|
|
href: "/settings",
|
|
active: pathname === "/settings",
|
|
},
|
|
]
|
|
|
|
return (
|
|
<div className="space-y-4 py-4 flex flex-col h-full bg-background">
|
|
<div className="px-3 py-2 flex-1">
|
|
<div className="space-y-1">
|
|
{routes.map((route) => (
|
|
<div key={route.href}>
|
|
<Link
|
|
href={route.href}
|
|
className={cn(
|
|
"text-sm group flex p-3 w-full justify-start font-medium cursor-pointer hover:bg-accent hover:text-accent-foreground rounded-lg transition-all",
|
|
route.active
|
|
? "bg-accent text-accent-foreground shadow-sm"
|
|
: "text-foreground hover:text-accent-foreground",
|
|
)}
|
|
>
|
|
<div className="flex items-center flex-1">
|
|
<route.icon className={cn("h-4 w-4 mr-3 shrink-0", route.active ? "text-accent-foreground" : "text-muted-foreground group-hover:text-foreground")} />
|
|
{route.label}
|
|
</div>
|
|
</Link>
|
|
{route.label === "Settings" && (
|
|
<div className="mx-3 my-2 border-t border-border/40" />
|
|
)}
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
} |