Add TOC and Layout components; update pages

src/components/ContentTOC.astro

@@ -0,0 +1,21 @@
+---
+import { getCollection } from "astro:content";
+
+const { sectionName } = Astro.props;
+
+const entries = (await getCollection(sectionName)).sort((a, b) =>
+  a.data.title.localeCompare(b.data.title),
+);
+
+const articles = entries.filter((entry) => entry.id !== "index");
+---
+
+<ul>
+    {articles.map((entry) => (
+        <li>
+            <a href={`/${sectionName}/${entry.id}`}>
+                {entry.data.title}
+            </a>
+        </li>
+    ))}
+</ul>

src/components/TOC.astro

@@ -0,0 +1,49 @@
+---
+import { getCollection } from "astro:content";
+import { collectionNames } from "../config/content";
+
+const sections = await Promise.all(
+    collectionNames.map(async (name) => {
+        const entries = (await getCollection(name)).sort((a, b) =>
+            a.data.title.localeCompare(b.data.title),
+        );
+
+        const indexEntry = entries.find((entry) => entry.id === "index");
+        const articles = entries.filter((entry) => entry.id !== "index");
+
+        return {
+            name,
+            indexEntry,
+            articles,
+        };
+    }),
+);
+---
+
+<ul>
+    {
+        sections.map((section) => (
+            <li>
+                {section.indexEntry ? (
+                    <a href={`/${section.name}`}>
+                        {section.indexEntry.data.title}
+                    </a>
+                ) : (
+                    section.name
+                )}
+
+                {section.articles.length > 0 && (
+                    <ul>
+                        {section.articles.map((entry) => (
+                            <li>
+                                <a href={`/${section.name}/${entry.id}`}>
+                                    {entry.data.title}
+                                </a>
+                            </li>
+                        ))}
+                    </ul>
+                )}
+            </li>
+        ))
+    }
+</ul>