'use client';

import Image from 'next/image';

interface StarRatingProps {
  rating: number;
}

export function StarRating({ rating }: StarRatingProps) {
  return (
    <div className="flex gap-0.5">
      {[1, 2, 3, 4, 5].map((star) => (
        <Image
          key={star}
          src={star <= rating ? '/assets/icons/star-filled-icon.svg' : '/assets/icons/star-empty-icon.svg'}
          alt={star <= rating ? 'Filled star' : 'Empty star'}
          width={16}
          height={16}
        />
      ))}
    </div>
  );
}