lotsa refactoring on that :3

web/src/components/post/postInfo.astro

@@ -0,0 +1,17 @@
+---
+import { getFormattedDate } from '@utils/date'
+const { publishDate, readTime, tags } = Astro.props
+---
+
+<time datetime={publishDate}>{getFormattedDate(publishDate)}</time> |
+{readTime} min. read |
+{
+    tags.map((tag, i) => (
+    <>
+    <a class="b1-no-underline" href={`/posts/tag/${tag}/`}>
+        #{tag}
+    </a>
+    {i < tags.length - 1 && ", "}
+    </>
+    ))
+}

web/src/components/post/toc.astro

@@ -0,0 +1,56 @@
+---
+
+---
+
+<div id="toc-container" class="hidden">
+    <p class="text-lg mt-4">Table of Contents</p>
+    <ul id="toc" class="text-md"/>
+</div>
+
+<script>
+    function addLink(tag: Element, depth: number) {
+        let lnk = document.createElement('a')
+        lnk.href=`#${tag.id}`
+        lnk.className = 'b1-no-underline'
+        lnk.innerHTML = `<span class="mr-1">${"#".repeat(depth)}</span>${tag.innerHTML}`
+
+        let li = document.createElement('li')
+        li.className = 'line-clamp-1'
+        li.appendChild(lnk)
+
+        toc?.appendChild(li)
+    }
+
+    // get all titles in the page
+    const titles = document.querySelectorAll('h2, h3')
+    const toc = document.getElementById('toc') as Element
+    const toc_cnt = document.getElementById('toc-container') as Element
+
+    console.log(titles)
+
+    // if there's more than two titles (ie, there's more than just the article title and TOC title, then appropriate to show)
+    if (titles.length > 2) {
+        toc_cnt.classList.add('lg:block')
+    }
+
+    for (let i = 0; i < titles.length; i++) {
+        const t = titles[i] as Element
+
+        // Assign IDs in case they haven't been (by me)
+        t.id = t.innerHTML
+
+        let depth = 1
+
+        // determine what depth to use
+        switch (t.tagName) {
+            case 'H2':
+                depth = 1
+                break
+            case 'H3':
+                depth = 2
+                break
+        }
+
+        addLink(t, depth)
+    }
+</script>