add automated linting for roadmap markdown files

Author: ChaosExAnima

lint-staged.config.mjs

@@ -2,6 +2,7 @@ const config = {
   "*": "prettier --ignore-unknown --write",
   "*.{js,jsx,ts,tsx}": "eslint --fix",
   "**/*.ts?(x)": () => "tsc -p tsconfig.json --noEmit",
+  "data/roadmap/*.md": "tsx scripts/lint-roadmap.ts",
 }
 
 export default config

package.json

@@ -9,8 +9,9 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "yarn typecheck && yarn lint-js",
+    "lint": "yarn typecheck && yarn lint-js && yarn lint-roadmap",
     "lint-js": "eslint .",
+    "lint-roadmap": "tsx scripts/lint-roadmap.ts",
     "fix": "yarn lint --fix",
     "format": "prettier --write --log-level warn --ignore-unknown .",
     "update-sponsors": "node --experimental-fetch patreon.mjs",
@@ -49,7 +50,7 @@
     "@tanstack/react-query-devtools": "^5.75.2",
     "@types/lodash": "^4.17.16",
     "@types/node": "^22.15.6",
-    "@types/react": "18.3.25",
+    "@types/react": "^19.2.2",
     "@types/react-dom": "^19.1.2",
     "@typescript-eslint/eslint-plugin": "^8.32.0",
     "@typescript-eslint/parser": "^8.32.0",
@@ -64,6 +65,7 @@
     "prettier-plugin-tailwindcss": "^0.6.11",
     "tailwindcss": "^3.4.17",
     "tailwindcss-logical": "^3.0.1",
+    "tsx": "^4.20.6",
     "typescript": "^5.8.3"
   },
   "packageManager": "[email protected]"

pages/roadmap.tsx

@@ -1,16 +1,13 @@
 import Head from "next/head"
-import { resolve } from "node:path"
-import { readdir, readFile } from "node:fs/promises"
 import { FormattedMessage, useIntl } from "react-intl"
-import matter from "gray-matter"
 import { InferGetStaticPropsType } from "next"
-import z from "zod"
 import Markdown from "react-markdown"
 
 import Hero from "../components/Hero"
 import Layout from "../components/Layout"
 import { RoadmapStatus } from "../components/RoadmapStatus"
 import { withDefaultStaticProps } from "../utils/defaultStaticProps"
+import { loadRoadmap } from "../utils/roadmap"
 
 const Roadmap = ({
   features,
@@ -102,27 +99,8 @@ const allowedElements: ReadonlyArray<string> = [
   "li",
 ]
 
-const featureSchema = z.object({
-  data: z.object({
-    title: z.string(),
-    status: z.enum(["exploring", "working", "next", "released"]),
-  }),
-  content: z.string().trim(),
-})
-
 export const getStaticProps = withDefaultStaticProps(async () => {
-  const files = await readdir(resolve(process.cwd(), "data/roadmap"))
-  const features = await Promise.all(
-    files
-      .filter((file) => file.endsWith(".md"))
-      .map(async (file) => {
-        const contents = await readFile(
-          resolve(process.cwd(), "data/roadmap", file),
-          "utf-8"
-        )
-        return featureSchema.parse(matter(contents))
-      })
-  )
+  const features = await loadRoadmap()
   return {
     props: { features },
   }

scripts/lint-roadmap.ts

@@ -0,0 +1,13 @@
+import { loadRoadmap } from "../utils/roadmap"
+
+async function main() {
+  const features = await loadRoadmap()
+  console.log(`Validated ${features.length} features from the roadmap.`)
+}
+
+main()
+  .then(() => process.exit())
+  .catch((error) => {
+    console.error(error)
+    process.exit(1)
+  })

utils/roadmap.ts

@@ -0,0 +1,40 @@
+import { readdir, readFile } from "node:fs/promises"
+import { resolve } from "node:path"
+
+import matter from "gray-matter"
+import z from "zod"
+
+export const featureSchema = z.object({
+  data: z.object({
+    title: z.string(),
+    status: z.enum(["exploring", "working", "next", "released"]),
+  }),
+  content: z.string().trim(),
+})
+
+export async function loadRoadmap(root = process.cwd()) {
+  const files = await readdir(resolve(root, "data/roadmap"))
+  return Promise.all(
+    files
+      .filter((file) => file.endsWith(".md"))
+      .map(async (file) => {
+        const contents = await readFile(
+          resolve(root, "data/roadmap", file),
+          "utf-8"
+        )
+        try {
+          return featureSchema.parse(matter(contents))
+        } catch (err: unknown) {
+          if (err instanceof z.ZodError) {
+            const issues = err.issues.reduce(
+              (acc, issue) =>
+                acc + `- [${issue.path.join(".")}]: ${issue.message}\n`,
+              ""
+            )
+            throw new Error(`Invalid feature ${file}:\n${issues}`)
+          }
+          throw new Error(`Invalid feature ${file}: ${err}`)
+        }
+      })
+  )
+}