110 lines
3.3 KiB
TypeScript
110 lines
3.3 KiB
TypeScript
'use client'
|
|
|
|
import Link from 'next/link'
|
|
import { usePathname } from 'next/navigation'
|
|
import { cn } from '@/lib/utils'
|
|
import { Button } from '@/components/ui/button'
|
|
import { ScrollArea } from '@/components/ui/scroll-area'
|
|
import { Separator } from '@/components/ui/separator'
|
|
import {
|
|
LayoutDashboard,
|
|
LogOut,
|
|
Sparkles,
|
|
Target
|
|
} from 'lucide-react'
|
|
|
|
interface SidebarProps {
|
|
productName?: string
|
|
}
|
|
|
|
export function Sidebar({ productName }: SidebarProps) {
|
|
const pathname = usePathname()
|
|
|
|
const routes = [
|
|
{
|
|
label: 'Overview',
|
|
icon: LayoutDashboard,
|
|
href: '/dashboard',
|
|
active: pathname === '/dashboard',
|
|
},
|
|
]
|
|
|
|
return (
|
|
<div className="flex h-full w-64 flex-col border-r border-border bg-card">
|
|
{/* Logo */}
|
|
<div className="flex h-14 items-center border-b border-border px-4">
|
|
<Link href="/" className="flex items-center gap-2">
|
|
<div className="flex h-8 w-8 items-center justify-center rounded-lg bg-primary text-primary-foreground">
|
|
<Sparkles className="h-4 w-4" />
|
|
</div>
|
|
<span className="font-semibold">Sanati</span>
|
|
</Link>
|
|
</div>
|
|
|
|
{/* Product Name */}
|
|
{productName && (
|
|
<div className="px-4 py-3 border-b border-border">
|
|
<p className="text-xs text-muted-foreground uppercase tracking-wide">Analyzing</p>
|
|
<p className="text-sm font-medium truncate">{productName}</p>
|
|
</div>
|
|
)}
|
|
|
|
{/* Main Nav */}
|
|
<ScrollArea className="flex-1 py-4">
|
|
<nav className="space-y-1 px-2">
|
|
{routes.map((route) => (
|
|
<Link
|
|
key={route.href}
|
|
href={route.href}
|
|
className={cn(
|
|
'flex items-center gap-3 rounded-md px-3 py-2 text-sm font-medium transition-colors',
|
|
route.active
|
|
? 'bg-primary text-primary-foreground'
|
|
: 'text-muted-foreground hover:bg-muted hover:text-foreground'
|
|
)}
|
|
>
|
|
<route.icon className="h-4 w-4" />
|
|
{route.label}
|
|
</Link>
|
|
))}
|
|
<Link
|
|
href="/opportunities"
|
|
className={cn(
|
|
'flex items-center gap-3 rounded-md px-3 py-2 text-sm font-medium transition-colors',
|
|
pathname === '/opportunities'
|
|
? 'bg-primary text-primary-foreground'
|
|
: 'text-muted-foreground hover:bg-muted hover:text-foreground'
|
|
)}
|
|
>
|
|
<Target className="h-4 w-4" />
|
|
Search
|
|
</Link>
|
|
<Link
|
|
href="/leads"
|
|
className={cn(
|
|
'flex items-center rounded-md px-3 py-2 pl-9 text-sm font-medium transition-colors',
|
|
pathname === '/leads'
|
|
? 'bg-primary text-primary-foreground'
|
|
: 'text-muted-foreground hover:bg-muted hover:text-foreground'
|
|
)}
|
|
>
|
|
Inbox
|
|
</Link>
|
|
</nav>
|
|
|
|
<Separator className="my-4" />
|
|
</ScrollArea>
|
|
|
|
{/* Bottom */}
|
|
<div className="border-t border-border p-4">
|
|
<Link href="/">
|
|
<Button variant="ghost" className="w-full justify-start gap-2 text-muted-foreground">
|
|
<LogOut className="h-4 w-4" />
|
|
Exit
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|