import { Star } from "lucide-react";
import { cn } from "@/lib/cn";

/** Visual star rating (0–5). */
export function StarRating({
  rating,
  className,
}: {
  rating: number;
  className?: string;
}) {
  return (
    <div className={cn("flex items-center gap-0.5", className)}>
      {Array.from({ length: 5 }).map((_, index) => (
        <Star
          key={index}
          className={cn(
            "h-3.5 w-3.5",
            index < Math.round(rating)
              ? "fill-foreground text-foreground"
              : "text-muted/45",
          )}
        />
      ))}
    </div>
  );
}