53 lines
1.0 KiB
TypeScript
53 lines
1.0 KiB
TypeScript
"use client";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { Clapperboard, History, UploadCloud } from "lucide-react";
|
|
import Link from "next/link";
|
|
import { usePathname } from "next/navigation";
|
|
|
|
const items = [
|
|
{
|
|
href: "/admin/upload",
|
|
label: "Upload",
|
|
icon: UploadCloud,
|
|
},
|
|
{
|
|
href: "/admin/upload/video",
|
|
label: "Recent videos",
|
|
icon: Clapperboard,
|
|
},
|
|
{
|
|
href: "/admin/upload/history",
|
|
label: "History",
|
|
icon: History,
|
|
},
|
|
] as const;
|
|
|
|
export function UploadNavigation() {
|
|
const pathname = usePathname();
|
|
|
|
return (
|
|
<nav
|
|
aria-label="Upload sections"
|
|
className="grid w-full grid-cols-3 gap-2 md:w-fit"
|
|
>
|
|
{items.map(({ href, label, icon: Icon }) => {
|
|
const active = pathname === href;
|
|
|
|
return (
|
|
<Button
|
|
key={href}
|
|
asChild
|
|
variant={active ? "default" : "outline"}
|
|
>
|
|
<Link href={href} aria-current={active ? "page" : undefined}>
|
|
<Icon data-icon="inline-start" />
|
|
{label}
|
|
</Link>
|
|
</Button>
|
|
);
|
|
})}
|
|
</nav>
|
|
);
|
|
}
|