51 lines
1.2 KiB
TypeScript
51 lines
1.2 KiB
TypeScript
import { appRoutes } from "@/config";
|
|
import { Category } from "@/server/db/schema";
|
|
import Link from "next/link";
|
|
import React from "react";
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardDescription,
|
|
CardFooter,
|
|
CardHeader,
|
|
CardTitle,
|
|
} from "@/components/ui/card";
|
|
import { AspectRatio } from "../ui/aspect-ratio";
|
|
import { CATEGORY_BANNER_ASPECT_RATIO } from "./category-form";
|
|
import Image from "next/image";
|
|
import { Icons } from "../icons";
|
|
|
|
function CategoryCard({
|
|
name,
|
|
slug,
|
|
createdAt,
|
|
image,
|
|
}: Pick<Category, "name" | "slug" | "createdAt" | "image">) {
|
|
return (
|
|
<Link href={appRoutes.category(slug)}>
|
|
<Card className="overflow-hidden">
|
|
{/* <AspectRatio
|
|
className="flex items-center justify-center bg-muted text-muted-foreground"
|
|
ratio={CATEGORY_BANNER_ASPECT_RATIO}
|
|
>
|
|
{image?.length ? (
|
|
<Image
|
|
src={image}
|
|
alt="Kategorie-bild"
|
|
fill
|
|
className="object-cover"
|
|
/>
|
|
) : (
|
|
<Icons.logo />
|
|
)}
|
|
</AspectRatio> */}
|
|
<CardHeader>
|
|
<CardTitle>{name}</CardTitle>
|
|
</CardHeader>
|
|
</Card>
|
|
</Link>
|
|
);
|
|
}
|
|
|
|
export default CategoryCard;
|