import { Star } from "lucide-react";

interface RatingStarsProps {
    rating: number;
    textColor?: string;
}

export default function RatingStars({ rating, textColor = "text-gray-500" }: RatingStarsProps) {
    const fullStars = Math.floor(rating);
    const emptyStars = 5 - fullStars;

    return (
        <div className="flex items-center">
            {Array.from({ length: fullStars }).map((_, i) => (
                <Star
                    key={`full-${i}`}
                    fill="rgb(250 204 21)"
                    stroke="rgb(250 204 21)"
                    className="w-4 h-4"
                />
            ))}
            {Array.from({ length: emptyStars }).map((_, i) => (
                <Star
                    key={`empty-${i}`}
                    className="w-4 h-4 fill-none"
                />
            ))}
            <span className={`ml-2 text-sm ${textColor}`}>({rating}/5)</span>
        </div>
    );
}