46 lines
1.1 KiB
TypeScript
46 lines
1.1 KiB
TypeScript
import Link from "next/link";
|
|
|
|
import { AppCard } from "@/components/ui/app-card";
|
|
import { CardContent } from "@/components/ui/card";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
type PortfolioSubnavProps = {
|
|
active: "projects" | "categories";
|
|
};
|
|
|
|
const items = [
|
|
{
|
|
key: "projects",
|
|
label: "Projekte",
|
|
href: "/root/portfolio",
|
|
},
|
|
{
|
|
key: "categories",
|
|
label: "Kategorien",
|
|
href: "/root/portfolio/categories",
|
|
},
|
|
] as const;
|
|
|
|
export function PortfolioSubnav({ active }: PortfolioSubnavProps) {
|
|
return (
|
|
<AppCard level={2}>
|
|
<CardContent className="flex flex-wrap gap-2 p-4">
|
|
{items.map((item) => (
|
|
<Link
|
|
key={item.key}
|
|
href={item.href}
|
|
className={cn(
|
|
"rounded-nested border px-4 py-2 text-sm transition-colors",
|
|
active === item.key
|
|
? "border-input bg-primary text-primary-foreground"
|
|
: "border-input bg-background text-foreground/75 hover:bg-accent hover:text-accent-foreground",
|
|
)}
|
|
>
|
|
{item.label}
|
|
</Link>
|
|
))}
|
|
</CardContent>
|
|
</AppCard>
|
|
);
|
|
}
|