fix(glossaire): align reading follow top actions with glossary navigation

Reviewed-on: #303

src/components/GlossaryRelationCards.astro

@@ -7,12 +7,15 @@ interface Props {
 }
 
 const { relationBlocks = [] } = Astro.props;
+const relationsHeadingId = "relations-conceptuelles";
 ---
 
 {relationBlocks.length > 0 && (
-  <section class="glossary-relations" aria-label="Relations conceptuelles">
+  <section
-    <h2>Relations conceptuelles</h2>
+    class="glossary-relations"
-
+    aria-labelledby={relationsHeadingId}
+  >
+    <h2 id={relationsHeadingId}>Relations conceptuelles</h2>
     <div class="glossary-relations-grid">
       {relationBlocks.map((block) => (
         <section class={`glossary-relations-card ${block.className}`}>

src/layouts/EditionLayout.astro

@@ -1478,6 +1478,33 @@ const WHOAMI_FORCE_LOCALHOST = (import.meta.env.PUBLIC_WHOAMI_FORCE_LOCALHOST ??
 
     const h1 = reading.querySelector("h1");
 
+    const topChapterLabel =
+      isGlossaryEntryMode
+        ? "Haut de la fiche"
+        : isGlossaryEdition
+          ? "Haut de la page"
+          : "Haut du chapitre";
+
+    if (btnTopChapter) {
+      btnTopChapter.setAttribute("aria-label", topChapterLabel);
+      btnTopChapter.setAttribute("title", topChapterLabel);
+    }
+
+    function scrollToTopChapter(behavior = "smooth") {
+      if (isGlossaryEdition) {
+        window.scrollTo({ top: 0, behavior });
+        return;
+      }
+
+      if (h1) {
+        scrollToElWithOffset(h1, 12, behavior);
+      }
+    }
+
+    function getH2ScrollTarget(item) {
+      return item?.h2 || item?.anchor || item?.marker || null;
+    }
+
     const h2Anchors = Array.from(reading.querySelectorAll(".details-anchor[id]"))
       .map((s) => {
         const d = (s.nextElementSibling && s.nextElementSibling.tagName === "DETAILS")
@@ -1500,6 +1527,7 @@ const WHOAMI_FORCE_LOCALHOST = (import.meta.env.PUBLIC_WHOAMI_FORCE_LOCALHOST ??
       .filter(Boolean);
 
     const h2Plain = Array.from(reading.querySelectorAll("h2[id]"))
+      .filter((h2) => !h2.closest("details.details-section"))
       .map((h2) => ({
         id: h2.id,
         anchor: h2,
@@ -1508,7 +1536,7 @@ const WHOAMI_FORCE_LOCALHOST = (import.meta.env.PUBLIC_WHOAMI_FORCE_LOCALHOST ??
         h2,
       }));
 
-    const H2 = (h2Anchors.length ? h2Anchors : h2Plain)
+    const H2 = [...h2Anchors, ...h2Plain]
       .slice()
       .sort((a, b) => absTop(a.marker) - absTop(b.marker));
 
@@ -1700,7 +1728,12 @@ const WHOAMI_FORCE_LOCALHOST = (import.meta.env.PUBLIC_WHOAMI_FORCE_LOCALHOST ??
       syncGlossaryFollowState(followEl.classList.contains("is-on") && followH > 0);
 
       if (btnTopChapter) {
-        btnTopChapter.hidden = !(rfH1 && !rfH1.hidden);
+        const showTopChapter =
+          isGlossaryEdition
+            ? Boolean(followEl.classList.contains("is-on"))
+            : Boolean(rfH1 && !rfH1.hidden);
+
+        btnTopChapter.hidden = !showTopChapter;
       }
 
       if (btnTopSection) {
@@ -1736,8 +1769,11 @@ const WHOAMI_FORCE_LOCALHOST = (import.meta.env.PUBLIC_WHOAMI_FORCE_LOCALHOST ??
     if (rfH2) {
       rfH2.addEventListener("click", () => {
         if (!curH2) return;
-        openDetailsIfNeeded(curH2.anchor || curH2.h2 || curH2.marker);
+        const target = getH2ScrollTarget(curH2);
-        scrollToElWithOffset(curH2.marker, 12, "smooth");
+        if (!target) return;
+
+        openDetailsIfNeeded(target);
+        scrollToElWithOffset(target, 12, "smooth");
         history.replaceState(null, "", `${window.location.pathname}#${curH2.id}`);
       });
     }
@@ -1753,15 +1789,18 @@ const WHOAMI_FORCE_LOCALHOST = (import.meta.env.PUBLIC_WHOAMI_FORCE_LOCALHOST ??
 
     if (btnTopChapter) {
       btnTopChapter.addEventListener("click", () => {
-        if (h1) scrollToElWithOffset(h1, 12, "smooth");
+        scrollToTopChapter("smooth");
       });
     }
 
     if (btnTopSection) {
       btnTopSection.addEventListener("click", () => {
         if (!curH2) return;
-        openDetailsIfNeeded(curH2.anchor || curH2.h2 || curH2.marker);
+        const target = getH2ScrollTarget(curH2);
-        scrollToElWithOffset(curH2.marker, 12, "smooth");
+        if (!target) return;
+
+        openDetailsIfNeeded(target);
+        scrollToElWithOffset(target, 12, "smooth");
         history.replaceState(null, "", `${window.location.pathname}#${curH2.id}`);
       });
     }

src/lib/glossary.ts

@@ -201,6 +201,36 @@ export function uniqueGlossaryEntries(
   return out;
 }
 
+export function slugsOfGlossaryEntries(
+    entries: GlossaryEntry[] = [],
+  ): Set<string> {
+    const slugs = new Set<string>();
+  
+    for (const entry of entries) {
+      const slug = slugOfGlossaryEntry(entry);
+      if (!slug) continue;
+      slugs.add(slug);
+    }
+  
+    return slugs;
+  }
+  
+  export function excludeGlossaryEntries(
+    entries: GlossaryEntry[] = [],
+    excluded: Iterable<string> = [],
+  ): GlossaryEntry[] {
+    const excludedSlugs = new Set(
+      Array.from(excluded)
+        .map((value) => normalizeGlossarySlug(value))
+        .filter(Boolean),
+    );
+  
+    return entries.filter((entry) => {
+      const slug = slugOfGlossaryEntry(entry);
+      return Boolean(slug) && !excludedSlugs.has(slug);
+    });
+  }
+
 export function resolveGlossaryEntriesInSourceOrder(
   slugs: string[] = [],
   allEntries: GlossaryEntry[] = [],
@@ -504,11 +534,27 @@ export function getGlossaryEntryAsideData(
   allEntries: GlossaryEntry[] = [],
 ): GlossaryEntryAsideData {
   const currentFamily = familyOf(currentEntry);
+  const currentSlug = slugOfGlossaryEntry(currentEntry);
+
   const fondamentaux = getFondamentaux(allEntries);
-  const sameFamilyEntries = getEntriesOfSameFamily(currentEntry, allEntries);
   const sameFamilyTitle = getSameFamilyTitle(currentEntry);
   const relationSections = getRelationSections(currentEntry, allEntries);
-  const contextualTheory = getContextualTheory(currentEntry, allEntries);
+
+  const relationEntries = uniqueGlossaryEntries(
+    relationSections.flatMap((section) => section.items),
+  );
+  const relationSlugs = slugsOfGlossaryEntries(relationEntries);
+
+  const contextualTheory = excludeGlossaryEntries(
+    getContextualTheory(currentEntry, allEntries),
+    new Set([currentSlug, ...relationSlugs]),
+  ).slice(0, 6);
+  const contextualTheorySlugs = slugsOfGlossaryEntries(contextualTheory);
+
+  const sameFamilyEntries = excludeGlossaryEntries(
+    getEntriesOfSameFamily(currentEntry, allEntries),
+    new Set([currentSlug, ...relationSlugs, ...contextualTheorySlugs]),
+  ).slice(0, 8);
 
   const showNoyau =
     currentFamily !== "concept-fondamental" &&