refactor(glossaire): extract entry relations rendering

src/pages/glossaire/[...slug].astro

@@ -1,13 +1,13 @@
 ---
 import GlossaryLayout from "../../layouts/GlossaryLayout.astro";
 import GlossaryAside from "../../components/GlossaryAside.astro";
+import GlossaryRelationCards from "../../components/GlossaryRelationCards.astro";
 import { getCollection, render } from "astro:content";
 import {
   getDisplayDomain,
   getDisplayFamily,
   getDisplayLevel,
   getRelationBlocks,
-  hrefOfGlossaryEntry,
   normalizeGlossarySlug,
 } from "../../lib/glossary";
 
@@ -133,27 +133,7 @@ const hasScholarlyMeta =
     <Content />
   </div>
 
-  {relationBlocks.length > 0 && (
-    <section class="glossary-relations" aria-label="Relations conceptuelles">
-      <h2>Relations conceptuelles</h2>
-
-      <div class="glossary-relations-grid">
-        {relationBlocks.map((block) => (
-          <section class={`glossary-relations-card ${block.className}`}>
-            <h3>{block.title}</h3>
-            <ul>
-              {block.items.map((item) => (
-                <li>
-                  <a href={hrefOfGlossaryEntry(item)}>{item.data.term}</a>
-                  <span> — {item.data.definitionShort}</span>
-                </li>
-              ))}
-            </ul>
-          </section>
-        ))}
-      </div>
-    </section>
-  )}
+  <GlossaryRelationCards relationBlocks={relationBlocks} />
 </GlossaryLayout>
 
 <script is:inline>