From 1c1aaf28e61f921446fbdf89e7d87c28e8bc3101 Mon Sep 17 00:00:00 2001
From: thiloho <123883702+thiloho@users.noreply.github.com>
Date: Sun, 25 Aug 2024 14:35:57 +0200
Subject: [PATCH] Generate nested table of contents

---
 nix/module.nix           |  3 ---
 web-app/src/lib/utils.ts | 47 +++++++++++++++++++++++++++++-----------
 2 files changed, 34 insertions(+), 16 deletions(-)

diff --git a/nix/module.nix b/nix/module.nix
index e1bdb6e..5865077 100644
--- a/nix/module.nix
+++ b/nix/module.nix
@@ -164,9 +164,6 @@ in
               alias = "/var/www/archtika-websites/previews/";
               index = "index.html";
               tryFiles = "$uri $uri/ $uri/index.html =404";
-              extraConfig = ''
-                autoindex on;
-              '';
             };
             "/api/" = {
               proxyPass = "http://localhost:${toString cfg.port}/";
diff --git a/web-app/src/lib/utils.ts b/web-app/src/lib/utils.ts
index 96d28c7..9800499 100644
--- a/web-app/src/lib/utils.ts
+++ b/web-app/src/lib/utils.ts
@@ -94,20 +94,41 @@ const createMarkdownParser = (showToc = true) => {
         postprocess(html: string) {
           const closingRemainingSection = "</section>".repeat(sectionStack.length);
 
-          const tableOfContents =
-            showToc && headings.length > 0
-              ? `<details class="table-of-contents">
+          let tableOfContents = "";
+          if (showToc && headings.length > 0) {
+            const tocItems = [];
+            let currentLevel = 0;
+
+            for (const { id, text, level } of headings) {
+              while (currentLevel < level - 1) {
+                tocItems.push("<ul>");
+                currentLevel++;
+              }
+              while (currentLevel > level - 1) {
+                tocItems.push("</ul>");
+                currentLevel--;
+              }
+              tocItems.push(`<li><a href="#${id}">${text}</a>`);
+              if (level > currentLevel) {
+                tocItems.push("<ul>");
+                currentLevel = level;
+              } else {
+                tocItems.push("</li>");
+              }
+            }
+
+            while (currentLevel > 0) {
+              tocItems.push("</ul></li>");
+              currentLevel--;
+            }
+
+            tableOfContents = `
+              <details class="table-of-contents">
                 <summary>Table of contents</summary>
-                <ul>
-                  ${headings
-                    .map(
-                      ({ id, text, level }) => `
-                      <li><a href="#${id}" class="h${level}">${text}</a></li>`
-                    )
-                    .join("")}
-                </ul>
-              </details>`
-              : "";
+                ${tocItems.join("")}
+              </details>
+            `;
+          }
 
           return `
             ${tableOfContents}