// Auteur : Simon-Pierre Boucher — contact@spboucher.ai
// ka-ui/react/KaFooter.tsx — footer commun Groupe KA (fond encre), à vendorer
// dans chaque app Vite/React sous frontend/src/ka/. Consomme ecosystem.json :
// toute modification des infos de contact se fait dans ka-ui/ecosystem.json
// puis se resynchronise sur les 12 sites (voir ka-ui/README.md).
import eco from "./ecosystem.json";

type LocalLink = { label: string; href: string };

export default function KaFooter({
  siteId,
  localLegal = [],
}: {
  /** id du site courant dans ecosystem.json (ex. "resto-ka") */
  siteId: string;
  /** pages légales PROPRES au site (ex. /conditions), affichées avant celles du hub */
  localLegal?: LocalLink[];
}) {
  const year = new Date().getFullYear();
  const site = eco.sites.find((s) => s.id === siteId);
  const others = eco.sites.filter((s) => s.id !== siteId);
  return (
    <footer className="ka-footer" id="contact">
      <div className="container">
        <a
          className="wordmark"
          href={eco.hub.url}
          target={siteId === "groupe-ka" ? undefined : "_blank"}
          rel="noopener noreferrer"
          aria-label="Groupe KA — le portail de l'écosystème"
        >
          Groupe <span className="ka">KA</span>
        </a>
        <p className="desc">
          {eco.org.tagline} Des centaines de connecteurs lisent les sites à la
          source, normalisent la donnée et se resynchronisent seuls.{" "}
          {site ? (
            <>
              <b style={{ color: "var(--paper)" }}>{site.wordmark}</b> —{" "}
              {site.tagline} — est un service Groupe KA.
            </>
          ) : null}
        </p>
        <p className="notice">
          <b>{eco.org.disclaimer}</b>
        </p>
        <ul className="sites">
          {others.map((s) => (
            <li key={s.id}>
              <a href={`https://${s.domain}`} target="_blank" rel="noopener noreferrer">
                {s.wordmark}
              </a>
            </li>
          ))}
          {eco.extraFooterLinks.map((l) => (
            <li key={l.href}>
              <a href={l.href} target="_blank" rel="noopener noreferrer">
                {l.label}
              </a>
            </li>
          ))}
        </ul>
        <div className="contacts">
          {eco.contacts.map((c) => (
            <p key={c.email} style={{ margin: 0 }}>
              <a href={`mailto:${c.email}`}>{c.email}</a>
              <span>{c.role}</span>
            </p>
          ))}
        </div>
        <p className="legal">
          © {year} {eco.org.copyrightHolder}
          {localLegal.map((l) => (
            <span key={l.href}>
              {" · "}
              <a href={l.href}>{l.label}</a>
            </span>
          ))}
          {eco.legal.map((l) => (
            <span key={l.href}>
              {" · "}
              <a href={l.href} target="_blank" rel="noopener noreferrer">
                {l.label}
              </a>
            </span>
          ))}
        </p>
      </div>
    </footer>
  );
}