improve build-time tags collection

* works better with types
* works with Vite hot reload!

src/Blog/SearchHeader/TagCloud/TagCloud.tsx

@@ -1,5 +1,15 @@
 import Box from "@mui/material/Box";
+import { tags } from "../../../tags.js";
 
 export function TagCloud() {
-  return <Box class="tag-cloud">Tags</Box>;
+  return (
+    <Box class="tag-cloud">
+      Tags
+      <ul>
+        {[...tags.values()].map((tag) => (
+          <li key={tag}>{tag}</li>
+        ))}
+      </ul>
+    </Box>
+  );
 }

src/tags.ts

@@ -0,0 +1,16 @@
+const modules = import.meta.glob<Array<string>>("./articles/*", {
+  import: "tags",
+  eager: true,
+});
+
+export const tags = Object.entries(modules).reduce(
+  (tagsSet, [modulePath, moduleTags]) => {
+    if (moduleTags) {
+      for (const tag of moduleTags) {
+        tagsSet.add(tag);
+      }
+    }
+    return tagsSet;
+  },
+  new Set<string>()
+);

vite-plugin-tags.mjs

@@ -1,35 +0,0 @@
-import fs from "node:fs";
-import path from "node:path";
-import { tsImport } from "tsx/esm/api";
-
-export default function tagsPlugin() {
-  return {
-    name: "tags-plugin",
-    enforce: "post",
-    async buildStart() {
-      const articlesDir = path.resolve(process.cwd(), "src/articles");
-      const allTags = new Set();
-
-      for (const file of fs.readdirSync(articlesDir)) {
-        const filePath = path.join(articlesDir, file);
-        if (filePath.endsWith(".tsx") || filePath.endsWith(".ts")) {
-          try {
-            const module = await tsImport(filePath, import.meta.url);
-            if (module.tags) {
-              for (const tag of module.tags) {
-                allTags.add(tag);
-              }
-            }
-          } catch (e) {
-            console.error(`Error importing ${file}:`, e);
-          }
-        }
-      }
-
-      fs.writeFileSync(
-        path.resolve(process.cwd(), "tags.js"),
-        `export const tags = ${JSON.stringify([...allTags.values()])};`
-      );
-    },
-  };
-}

vite.config.ts

@@ -1,12 +1,7 @@
 import { defineConfig } from "vite";
 import preact from "@preact/preset-vite";
-// import tagsPlugin from "./vite-plugin-tags.mjs";
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [
-    preact(),
-    //@ ts-expect-error
-    // tagsPlugin(),
-  ],
+  plugins: [preact()],
 });