'use client';

/**
 * Affiche un média image en optimisant via next/image quand c'est sûr.
 *
 * - visibility === 'public' → next/image (srcset AVIF/WebP, lazy, cache CDN).
 * - sinon → <img> natif. Les médias privés ne doivent JAMAIS passer par
 *   /_next/image : l'optimiseur cache la réponse par URL et la servirait
 *   ensuite à n'importe quel visiteur, contournant la vérification de session
 *   faite par /zen/api/media/file/:slug.
 */

import NextImage from 'next/image';

export default function MediaImage({
  media,
  alt,
  width,
  height,
  className,
  sizes,
  fill = false,
  priority = false,
}) {
  const url = `/zen/api/media/file/${media.slug}`;
  const altText = alt ?? media.alt_text ?? media.original_name ?? '';

  if (media.visibility !== 'public') {
    // En mode `fill`, next/image se positionne en absolute pour remplir le
    // parent relatif. On reproduit ce comportement avec `<img>` natif pour que
    // les classes utilitaires (object-cover, object-contain) s'appliquent à
    // l'image privée comme à la publique.
    const fillClass = fill ? 'absolute inset-0 w-full h-full' : '';
    // eslint-disable-next-line @next/next/no-img-element
    return (
      <img
        src={url}
        alt={altText}
        className={[fillClass, className].filter(Boolean).join(' ')}
        loading={priority ? 'eager' : 'lazy'}
      />
    );
  }

  if (fill) {
    return (
      <NextImage
        src={url}
        alt={altText}
        fill
        sizes={sizes ?? '(max-width: 768px) 50vw, 25vw'}
        className={className}
        priority={priority}
      />
    );
  }

  return (
    <NextImage
      src={url}
      alt={altText}
      width={width}
      height={height}
      sizes={sizes}
      className={className}
      priority={priority}
    />
  );
}
