summaryrefslogtreecommitdiff
path: root/components/layout/sidebar-nav.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'components/layout/sidebar-nav.tsx')
-rw-r--r--components/layout/sidebar-nav.tsx44
1 files changed, 44 insertions, 0 deletions
diff --git a/components/layout/sidebar-nav.tsx b/components/layout/sidebar-nav.tsx
new file mode 100644
index 00000000..addcfefd
--- /dev/null
+++ b/components/layout/sidebar-nav.tsx
@@ -0,0 +1,44 @@
+"use client"
+
+import Link from "next/link"
+import { usePathname } from "next/navigation"
+
+import { cn } from "@/lib/utils"
+import { buttonVariants } from "@/components/ui/button"
+
+interface SidebarNavProps extends React.HTMLAttributes<HTMLElement> {
+ items: {
+ href: string
+ title: string
+ }[]
+}
+
+export function SidebarNav({ className, items, ...props }: SidebarNavProps) {
+ const pathname = usePathname()
+
+ return (
+ <nav
+ className={cn(
+ "flex space-x-2 lg:flex-col lg:space-x-0 lg:space-y-1",
+ className
+ )}
+ {...props}
+ >
+ {items.map((item) => (
+ <Link
+ key={item.href}
+ href={item.href}
+ className={cn(
+ buttonVariants({ variant: "ghost" }),
+ pathname === item.href
+ ? "bg-muted hover:bg-muted"
+ : "hover:bg-transparent hover:underline",
+ "justify-start"
+ )}
+ >
+ {item.title}
+ </Link>
+ ))}
+ </nav>
+ )
+}