68 lines
2.1 KiB
TypeScript
68 lines
2.1 KiB
TypeScript
"use client"
|
||
|
||
import Link from "next/link"
|
||
import { usePathname } from "next/navigation"
|
||
import { cn } from "@/lib/utils"
|
||
import { LayoutDashboard, Package, ShoppingCart, Users, Settings } from "lucide-react"
|
||
|
||
const sidebarItems = [
|
||
{
|
||
title: "Panel",
|
||
href: "/dashboard",
|
||
icon: LayoutDashboard,
|
||
},
|
||
{
|
||
title: "Ürünler",
|
||
href: "/dashboard/products",
|
||
icon: Package,
|
||
},
|
||
{
|
||
title: "Siparişler",
|
||
href: "/dashboard/orders",
|
||
icon: ShoppingCart,
|
||
},
|
||
{
|
||
title: "Kullanıcılar",
|
||
href: "/dashboard/users",
|
||
icon: Users,
|
||
},
|
||
{
|
||
title: "Ayarlar",
|
||
href: "/dashboard/settings",
|
||
icon: Settings,
|
||
},
|
||
]
|
||
|
||
interface SidebarProps extends React.HTMLAttributes<HTMLDivElement> { }
|
||
|
||
export function Sidebar({ className }: SidebarProps) {
|
||
const pathname = usePathname()
|
||
|
||
return (
|
||
<div className={cn("pb-12", className)}>
|
||
<div className="space-y-4 py-4">
|
||
<div className="px-3 py-2">
|
||
<h2 className="mb-2 px-4 text-lg font-semibold tracking-tight">
|
||
Yönetim
|
||
</h2>
|
||
<div className="space-y-1">
|
||
{sidebarItems.map((item) => (
|
||
<Link
|
||
key={item.href}
|
||
href={item.href}
|
||
className={cn(
|
||
"flex items-center rounded-md px-3 py-2 text-sm font-medium hover:bg-slate-100 dark:hover:bg-slate-800 transition-colors",
|
||
pathname === item.href ? "bg-slate-100 dark:bg-slate-800 text-primary" : "text-slate-500 dark:text-slate-400"
|
||
)}
|
||
>
|
||
<item.icon className="mr-2 h-4 w-4" />
|
||
{item.title}
|
||
</Link>
|
||
))}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|