import StyledLink from "@/components/gallery/StyledLink";
import { cn } from "@/lib/utils";

export function DescItem({ name, children, className }: {
    name: string;
    className?: string;
    children?: React.ReactNode;
}) {
    return <div className={cn("grid content-start", className)}>
        <span className="text-muted-foreground text-sm">{name}</span>
        <span className="text-primary leading-4 font-medium">{children}</span>
    </div>;
}
export function DescTagItem({
    items, name, className,
}: {
    name: string;
    items: string[];
    className?: string;
}) {
    return <DescItem name={name} className={className}>
        {items.length === 0 ? "N/A" : items.map(
            (x) => <StyledLink key={x} to={`/search?allow_tag=${name}:${x}`}>{x}</StyledLink>
        )}
    </DescItem>;
}