feat: add filter to main page

pages/blog.vue

@@ -9,6 +9,14 @@ const docs = await queryContent<BlogParsedContent>("/blog")
   .sort({ date: -1 })
   .where({ _draft: false })
   .find();
+
+const tags = new Set(
+  docs
+    .map((p) => p.tags)
+    .flat()
+    .filter((p) => !p.includes(" "))
+    .sort()
+);
 </script>
 
 <template>
@@ -16,6 +24,16 @@ const docs = await queryContent<BlogParsedContent>("/blog")
     class="flex flex-col grow prose dark:prose-invert max-w-3xl gap-6 transition"
   >
     <h1 class="mb-0">Blog</h1>
+    <div class="m-0">
+      Filter:
+      <Tag
+        :dest="`/tags/blog/${tag}`"
+        v-for="(tag, index) in tags"
+        :key="index"
+      >
+        {{ tag }}
+      </Tag>
+    </div>
     <PostPreviewCard
       v-for="(post, index) in docs"
       :key="index"

pages/stories.vue

@@ -9,6 +9,14 @@ const docs = await queryContent<StoryParsedContent>("/stories")
   .sort({ date: -1 })
   .where({ _draft: false })
   .find();
+
+const tags = new Set(
+  docs
+    .map((p) => p.tags)
+    .flat()
+    .filter((p) => !p.includes(" ")) // do not include AO3-style tags
+    .sort()
+);
 </script>
 
 <template>
@@ -16,6 +24,16 @@ const docs = await queryContent<StoryParsedContent>("/stories")
     class="flex flex-col grow prose dark:prose-invert max-w-3xl gap-6 transition"
   >
     <h1 class="mb-0">Stories</h1>
+    <div class="m-0">
+      Filter:
+      <Tag
+        :dest="`/tags/stories/${tag}`"
+        v-for="(tag, index) in tags"
+        :key="index"
+      >
+        {{ tag }}
+      </Tag>
+    </div>
     <PostPreviewCard
       v-for="(story, index) in docs"
       :key="index"