import { resolvePublicMediaUrl } from "@/lib/public-product";
import { cn } from "@/lib/utils";

type ProductThumbProps = {
  src?: string | null;
  alt?: string;
  size?: "sm" | "md";
  className?: string;
};

const sizeClass = {
  sm: "h-8 w-8",
  md: "h-10 w-10",
} as const;

export default function ProductThumb({
  src,
  alt = "",
  size = "sm",
  className,
}: ProductThumbProps) {
  const url = resolvePublicMediaUrl(src);

  return (
    <div
      className={cn(
        "shrink-0 overflow-hidden rounded bg-muted",
        sizeClass[size],
        className
      )}
    >
      {url ? (
        // eslint-disable-next-line @next/next/no-img-element
        <img src={url} alt={alt} className="h-full w-full object-cover" />
      ) : null}
    </div>
  );
}