add anchor links

website/src/components/BlogPost.astro

@@ -12,7 +12,7 @@ const { Content } = await post.render();
 >
   <div class="pb-2">
     <div class="md:flex justify-between">
-      <h1 class="mb-4">{post.title}</h1>
+      <h1 class="mb-4" id={post.slug}>{post.title}</h1>
     </div>
   </div>
   <div>

website/src/pages/blog.astro

@@ -36,7 +36,13 @@ const posts = (await getCollection('blog')).sort((a, b) => compareDesc(a.data.da
             {posts.map((post) => <BlogPost post={post} />)}
           </PageContent>
           <aside class="fixed right-0 h-full overflow-auto pr-4 pl-0 pb-16 hidden xl:block" title="Table of Contents">
-            <RightSidebar headings={[]} />
+            <RightSidebar
+              headings={posts.map((post) => ({
+                depth: 1,
+                slug: post.slug,
+                text: post.data.title,
+              }))}
+            />
           </aside>
         </div>
       </main>