---
import GlossaryLayout from "../../layouts/GlossaryLayout.astro";
import GlossaryPortalAside from "../../components/GlossaryPortalAside.astro";
import GlossaryPortalHero from "../../components/GlossaryPortalHero.astro";
import GlossaryPortalSection from "../../components/GlossaryPortalSection.astro";
import GlossaryPortalStickySync from "../../components/GlossaryPortalStickySync.astro";
import GlossaryPortalPanel from "../../components/GlossaryPortalPanel.astro";
import { getCollection } from "astro:content";
import {
  buildGlossaryBySlug,
  hrefOfGlossaryEntry,
} from "../../lib/glossary";

const entries = await getCollection("glossaire");

const collator = new Intl.Collator("fr", {
  sensitivity: "base",
  numeric: true,
});

const bySlug = buildGlossaryBySlug(entries);
const hrefOf = hrefOfGlossaryEntry;
const slugOf = (entry) => String(entry.id).replace(/\.(md|mdx)$/i, "");

function sortByTerm(list = []) {
  return [...list].sort((a, b) => collator.compare(a.data.term, b.data.term));
}

function resolveEntries(slugs = []) {
  return slugs
    .map((slug) => bySlug.get(slug))
    .filter(Boolean);
}

function uniqueBySlug(list = []) {
  const seen = new Set();
  const out = [];

  for (const entry of list) {
    const slug = slugOf(entry);
    if (seen.has(slug)) continue;
    seen.add(slug);
    out.push(entry);
  }

  return out;
}

const obliteration = bySlug.get("obliteration-archicratique");
const autarchicratie = bySlug.get("autarchicratie");
const tension = bySlug.get("tension");
const sceneDepreuve = bySlug.get("scene-depreuve");
const archicration = bySlug.get("archicration");
const archicratie = bySlug.get("archicratie");

const diagnosisEntries = sortByTerm(
  [obliteration, autarchicratie].filter(Boolean)
);

const structuralEntries = sortByTerm(
  [tension, sceneDepreuve, archicration, archicratie].filter(Boolean)
);

const relatedEntries = sortByTerm(
  uniqueBySlug([
    ...resolveEntries(obliteration?.data?.related ?? []),
    ...resolveEntries(obliteration?.data?.seeAlso ?? []),
    ...resolveEntries(obliteration?.data?.opposedTo ?? []),
    ...resolveEntries(autarchicratie?.data?.related ?? []),
    ...resolveEntries(autarchicratie?.data?.seeAlso ?? []),
    ...resolveEntries(autarchicratie?.data?.opposedTo ?? []),
  ]).filter((entry) =>
    !["obliteration-archicratique", "autarchicratie"].includes(slugOf(entry))
  )
);

const paradigmEntries = sortByTerm(
  relatedEntries.filter((entry) => entry.data.kind === "paradigme")
);

const otherEntries = sortByTerm(
  relatedEntries.filter((entry) => entry.data.kind !== "paradigme")
);

const diagnosisCount = diagnosisEntries.length;
const structuralCount = structuralEntries.length;
const constellationCount = relatedEntries.length;
const otherCount = otherEntries.length;
const paradigmCount = paradigmEntries.length;

const pageItems = [
  { href: "#noyau-diagnostique", label: "Noyau diagnostique" },
  ...(structuralEntries.length > 0
    ? [{ href: "#articulations-essentielles", label: "Articulations essentielles" }]
    : []),
  ...(relatedEntries.length > 0
    ? [{ href: "#constellation-theorique", label: "Constellation théorique" }]
    : []),
  { href: "#prolonger-la-lecture", label: "Prolonger la lecture" },
];

const usefulLinks = [
  { href: "/glossaire/tension/", label: "Tension" },
  { href: "/glossaire/scene-depreuve/", label: "Scène d’épreuve" },
  { href: "/glossaire/archicration/", label: "Archicration" },
  { href: "/glossaire/archicratie/", label: "Archicratie" },
  { href: "/glossaire/tensions-irreductibles/", label: "Tensions irréductibles" },
];

const prolongerLinks = [
  {
    href: "/glossaire/",
    title: "Accueil du glossaire",
    text: "Revenir à la cartographie générale du système archicratique.",
  },
  {
    href: "/glossaire/archicrations/",
    title: "Méta-régimes archicratiques",
    text:
      "Parcourir les grandes formes de co-viabilité dans lesquelles les tensions sont stabilisées.",
  },
  {
    href: "/glossaire/tensions-irreductibles/",
    title: "Tensions irréductibles",
    text:
      "Explorer les tensions fondatrices à partir desquelles les dynamiques de régulation deviennent lisibles.",
  },
  {
    href: "/glossaire/index-complet/",
    title: "Index complet",
    text:
      "Retrouver l’ensemble des entrées du glossaire dans une navigation alphabétique intégrale.",
  },
];
---

<GlossaryLayout
  title="Dynamiques archicratiques"
  version="1.0"
  stickyMode="glossary-portal"
>
  <Fragment slot="aside">
    <GlossaryPortalAside
      ariaLabel="Navigation des dynamiques archicratiques"
      title="Dynamiques archicratiques"
      meta={
        diagnosisCount > 0
          ? `${diagnosisCount} diagnostic${diagnosisCount > 1 ? "s" : ""} central${diagnosisCount > 1 ? "ux" : ""}`
          : "Portail en cours de constitution"
      }
      pageItems={pageItems}
      usefulLinks={usefulLinks}
    />
  </Fragment>

  <section class="dyna-page">
    <GlossaryPortalHero
      prefix="dyna"
      kicker="Parcours du glossaire"
      title="Dynamiques archicratiques"
      intro="Les dynamiques archicratiques désignent les processus par lesquels une régulation se déplace, se ferme, se rigidifie ou se soustrait à sa propre révisabilité. Elles permettent de penser non seulement la tenue d’un régime, mais aussi ses dérives, ses opacifications et ses pathologies."
      moreParagraphs={[
        "Elles décrivent ainsi le versant processuel de l’archicratie : non plus seulement ce qui tient, mais la manière dont cela se transforme, s’altère, s’autonomise ou devient de moins en moins exposable à l’épreuve collective.",
      ]}
      introMaxWidth="72ch"
      followIntroMaxWidth="68ch"
      moreMaxHeight="18rem"
    />

    <GlossaryPortalSection
      id="noyau-diagnostique"
      title="Noyau diagnostique"
      count={
        diagnosisEntries.length > 0
          ? `${diagnosisEntries.length} entrée${diagnosisEntries.length > 1 ? "s" : ""}`
          : undefined
      }
      intro="Cette page rassemble les diagnostics déjà stabilisés dans le glossaire pour penser les dérives internes de la régulation archicratique : l’oblitération archicratique, comme processus d’effacement de la visibilité régulatrice, et l’autarchicratie, comme forme de fermeture croissante des architectures sur elles-mêmes."
    >
      {diagnosisEntries.length > 0 ? (
        <div class="dyna-focus-grid">
          {diagnosisEntries.map((entry) => (
            <article class="dyna-focus-card">
              <div class="dyna-focus-card__eyebrow">Diagnostic central</div>
              <h3>
                <a href={hrefOf(entry)}>{entry.data.term}</a>
              </h3>
              <p class="dyna-focus-card__def">{entry.data.definitionShort}</p>

              {((entry.data.comparisonTraditions?.length ?? 0) > 0 ||
                (entry.data.mobilizedAuthors?.length ?? 0) > 0) && (
                <div class="dyna-focus-card__meta">
                  {(entry.data.comparisonTraditions?.length ?? 0) > 0 && (
                    <p>
                      <strong>Traditions de comparaison :</strong>{" "}
                      {entry.data.comparisonTraditions.join(" / ")}
                    </p>
                  )}

                  {(entry.data.mobilizedAuthors?.length ?? 0) > 0 && (
                    <p>
                      <strong>Auteurs mobilisés :</strong>{" "}
                      {entry.data.mobilizedAuthors.join(" / ")}
                    </p>
                  )}
                </div>
              )}
            </article>
          ))}
        </div>
      ) : (
        <p class="dyna-empty">
          Les fiches principales ne sont pas encore disponibles dans la collection.
        </p>
      )}
    </GlossaryPortalSection>

    {structuralEntries.length > 0 && (
      <GlossaryPortalSection
        id="articulations-essentielles"
        title="Articulations essentielles"
        count={`${structuralCount} notion${structuralCount > 1 ? "s" : ""}`}
        intro="Les dynamiques archicratiques ne peuvent pas être pensées isolément : elles prennent sens à partir des tensions, de la scène d’épreuve, de l’archicration et du méta-régime d’archicratie lui-même."
      >
        <div class="dyna-cards">
          {structuralEntries.map((entry) => (
            <a class="dyna-card" href={hrefOf(entry)}>
              <strong>{entry.data.term}</strong>
              <span>{entry.data.definitionShort}</span>

              {(entry.data.comparisonTraditions?.length ?? 0) > 0 && (
                <small>
                  Traditions de comparaison : {entry.data.comparisonTraditions.join(" / ")}
                </small>
              )}
            </a>
          ))}
        </div>
      </GlossaryPortalSection>
    )}

    {relatedEntries.length > 0 && (
      <GlossaryPortalSection
        id="constellation-theorique"
        title="Constellation théorique"
        count={`${constellationCount} entrée${constellationCount > 1 ? "s" : ""}`}
        intro="Ces diagnostics entrent en résonance avec d’autres notions et paradigmes qui permettent de préciser les mécanismes de fermeture, de capture, d’opacification ou de désajustement de la régulation."
      >
        {otherEntries.length > 0 && (
          <GlossaryPortalPanel
            id="notions-et-diagnostics-lies"
            title="Notions et diagnostics liés"
            count={`${otherCount} entrée${otherCount > 1 ? "s" : ""}`}
            intro="Ces entrées prolongent l’analyse des dérives archicratiques vers des questions d’empêchement, d’invisibilisation, de fermeture ou de capture de la scène régulatrice."
            surface={true}
            className="dyna-block"
          >
            <div class="dyna-cards">
              {otherEntries.map((entry) => (
                <a class="dyna-card" href={hrefOf(entry)}>
                  <strong>{entry.data.term}</strong>
                  <span>{entry.data.definitionShort}</span>

                  {(entry.data.comparisonTraditions?.length ?? 0) > 0 && (
                    <small>
                      Traditions de comparaison : {entry.data.comparisonTraditions.join(" / ")}
                    </small>
                  )}
                </a>
              ))}
            </div>
          </GlossaryPortalPanel>
        )}

        {paradigmEntries.length > 0 && (
          <GlossaryPortalPanel
            id="paradigmes-mobilises"
            title="Paradigmes mobilisés"
            count={`${paradigmCount} paradigme${paradigmCount > 1 ? "s" : ""}`}
            intro="Ces paradigmes servent de ressources comparatives pour penser les processus de rigidification, d’autonomisation et d’opacification des régimes de régulation."
            surface={true}
            className="dyna-block"
          >
            <div class="dyna-cards">
              {paradigmEntries.map((entry) => (
                <a class="dyna-card" href={hrefOf(entry)}>
                  <strong>{entry.data.term}</strong>
                  <span>{entry.data.definitionShort}</span>

                  {(entry.data.mobilizedAuthors?.length ?? 0) > 0 && (
                    <small>
                      Auteurs mobilisés : {entry.data.mobilizedAuthors.join(" / ")}
                    </small>
                  )}
                </a>
              ))}
            </div>
          </GlossaryPortalPanel>
        )}
      </GlossaryPortalSection>
    )}

    <GlossaryPortalSection
      id="prolonger-la-lecture"
      title="Prolonger la lecture"
      intro="Cette page sert de portail thématique entre l’accueil général du glossaire et les fiches détaillées. Elle sera amenée à s’étoffer à mesure que le chantier des tensions et des dynamiques sera approfondi."
    >
      <div class="dyna-cards">
        {prolongerLinks.map((item) => (
          <a class="dyna-card" href={item.href}>
            <strong>{item.title}</strong>
            <span>{item.text}</span>
          </a>
        ))}
      </div>
    </GlossaryPortalSection>

    <GlossaryPortalSection
      id="portee-densemble"
      title="Portée d’ensemble"
      final={true}
    >
      <p>
        Les dynamiques archicratiques permettent de penser la régulation non
        comme une forme immobile, mais comme un devenir. Elles montrent comment
        une architecture peut continuer d’opérer tout en devenant de moins en
        moins visible, de moins en moins discutable et de moins en moins
        révisable. Elles éclairent ainsi le passage entre simple tenue du
        collectif et dérive d’un régime vers l’opacité, la fermeture ou la
        captation de sa propre scène d’épreuve.
      </p>
    </GlossaryPortalSection>
  </section>

  <GlossaryPortalStickySync
    heroMoreId="dyna-hero-more"
    heroToggleId="dyna-hero-toggle"
  />
</GlossaryLayout>

<style>
  .dyna-page{
    padding: 8px 0 24px;
  }

  .dyna-focus-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 12px;
    margin-top: 14px;
  }

  .dyna-focus-card{
    padding: 18px 20px;
    border: 1px solid rgba(127,127,127,0.22);
    border-radius: 18px;
    background: rgba(127,127,127,0.05);
  }

  .dyna-focus-card__eyebrow{
    margin-bottom: 10px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    opacity: .72;
  }

  .dyna-focus-card h3{
    margin: 0 0 10px;
    font-size: clamp(1.35rem, 2vw, 1.7rem);
    line-height: 1.15;
  }

  .dyna-focus-card h3 a{
    text-decoration: none;
  }

  .dyna-focus-card__def{
    margin: 0;
    font-size: 1rem;
    line-height: 1.55;
    opacity: .95;
  }

  .dyna-focus-card__meta{
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(127,127,127,0.18);
  }

  .dyna-focus-card__meta p{
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    opacity: .9;
  }

  .dyna-focus-card__meta p + p{
    margin-top: 6px;
  }

  .dyna-block{
    margin-top: 18px;
  }

  .dyna-block + .dyna-block{
    margin-top: 22px;
  }

  .dyna-cards{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 12px;
    margin-top: 14px;
  }

  .dyna-card{
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    border: 1px solid rgba(127,127,127,0.22);
    border-radius: 16px;
    background: rgba(127,127,127,0.05);
    text-decoration: none;
    transition:
      transform 120ms ease,
      background 120ms ease,
      border-color 120ms ease;
  }

  .dyna-card:hover{
    transform: translateY(-1px);
    background: rgba(127,127,127,0.08);
    border-color: rgba(0,217,255,0.16);
    text-decoration: none;
  }

  .dyna-card strong{
    font-size: 15px;
    line-height: 1.3;
  }

  .dyna-card span{
    font-size: 14px;
    line-height: 1.45;
    opacity: .92;
  }

  .dyna-card small{
    font-size: 12px;
    line-height: 1.4;
    opacity: .72;
  }

  .dyna-empty{
    margin: 0;
    font-style: italic;
    opacity: .82;
  }

  @media (max-width: 720px){
    .dyna-block.glossary-portal-panel--surface{
      padding: 16px;
      border-radius: 16px;
    }
  }

  @media (prefers-color-scheme: dark){
    .dyna-focus-card,
    .dyna-block.glossary-portal-panel--surface,
    .dyna-card{
      background: rgba(255,255,255,0.04);
    }

    .dyna-card:hover{
      background: rgba(255,255,255,0.07);
    }
  }
</style>