type SlotImageProps = {
  url: string;
  title?: string | null;
  linkUrl?: string | null;
  alt?: string;
  className?: string;
  imgClassName?: string;
};

export function SlotImage({
  url,
  title,
  linkUrl,
  alt,
  className,
  imgClassName = "block h-full w-full object-cover",
}: SlotImageProps) {
  const img = (
    // Meshkee slot URLs are used as-is; do not route through next/image.
    // eslint-disable-next-line @next/next/no-img-element
    <img src={url} alt={alt ?? title ?? ""} className={imgClassName} />
  );

  if (linkUrl) {
    return (
      <a href={linkUrl} className={className}>
        {img}
      </a>
    );
  }

  if (className) {
    return <div className={className}>{img}</div>;
  }

  return img;
}