// -----------------------------------------------------------------------------
// Food-Ka — Agrégateur de produits d'épicerie (province de Québec)
// Auteur : Simon-Pierre Boucher — contact@spboucher.ai
// components/SourceLogo.tsx : logo de bannière (frontend/public/logos/<id>.png)
//   Vignette arrondie sur fond blanc + nom optionnel (court ou complet).
//   Logo introuvable : repli sur la pastille texte historique (ou rien).
// -----------------------------------------------------------------------------
import { useState } from "react";
import { sourceName, sourceShort } from "../api";

interface SourceLogoProps {
  source: string;
  /** Côté du logo en px (défaut 22). */
  size?: number;
  /** Libellé affiché à côté du logo. */
  name?: "none" | "short" | "full";
  /** Comportement quand le PNG n'existe pas : pastille texte ou rien. */
  fallback?: "chip" | "hide";
  className?: string;
}

export default function SourceLogo({
  source,
  size = 22,
  name = "none",
  fallback = "chip",
  className = "",
}: SourceLogoProps) {
  // mémorise l'id dont le logo a échoué (résiste au changement de `source`)
  const [failedFor, setFailedFor] = useState<string | null>(null);
  const failed = failedFor === source;

  if (failed) {
    if (fallback === "hide") return null;
    return <span className={`source-tag ${className}`}>{sourceName(source)}</span>;
  }

  const label = name === "full" ? sourceName(source) : sourceShort(source);
  return (
    <span className={`src-logo ${className}`} title={sourceName(source)}>
      <img
        src={`/logos/${source}.png`}
        alt={name === "none" ? sourceName(source) : ""}
        width={size}
        height={size}
        loading="lazy"
        onError={() => setFailedFor(source)}
      />
      {name !== "none" && <span className="src-logo-name">{label}</span>}
    </span>
  );
}