feat(blog): add blog package with MDX support

.gitignore

@@ -103,3 +103,6 @@ sst-env.d.ts
 .aider*
 .cursorrules
 
+# content-collections
+.content-collections
+

apps/www/--noEmit/types.json

@@ -0,0 +1,89 @@
+[{"id":1,"intrinsicName":"any","recursionId":0,"flags":["Any"]},
+{"id":2,"intrinsicName":"any","recursionId":1,"flags":["Any"]},
+{"id":3,"intrinsicName":"any","recursionId":2,"flags":["Any"]},
+{"id":4,"intrinsicName":"any","recursionId":3,"flags":["Any"]},
+{"id":5,"intrinsicName":"error","recursionId":4,"flags":["Any"]},
+{"id":6,"intrinsicName":"unresolved","recursionId":5,"flags":["Any"]},
+{"id":7,"intrinsicName":"any","recursionId":6,"flags":["Any"]},
+{"id":8,"intrinsicName":"intrinsic","recursionId":7,"flags":["Any"]},
+{"id":9,"intrinsicName":"unknown","recursionId":8,"flags":["Unknown"]},
+{"id":10,"intrinsicName":"undefined","recursionId":9,"flags":["Undefined"]},
+{"id":11,"intrinsicName":"undefined","recursionId":10,"flags":["Undefined"]},
+{"id":12,"intrinsicName":"undefined","recursionId":11,"flags":["Undefined"]},
+{"id":13,"intrinsicName":"null","recursionId":12,"flags":["Null"]},
+{"id":14,"intrinsicName":"string","recursionId":13,"flags":["String"]},
+{"id":15,"intrinsicName":"number","recursionId":14,"flags":["Number"]},
+{"id":16,"intrinsicName":"bigint","recursionId":15,"flags":["BigInt"]},
+{"id":17,"intrinsicName":"false","recursionId":16,"flags":["BooleanLiteral"],"display":"false"},
+{"id":18,"intrinsicName":"false","recursionId":17,"flags":["BooleanLiteral"],"display":"false"},
+{"id":19,"intrinsicName":"true","recursionId":18,"flags":["BooleanLiteral"],"display":"true"},
+{"id":20,"intrinsicName":"true","recursionId":19,"flags":["BooleanLiteral"],"display":"true"},
+{"id":21,"intrinsicName":"boolean","recursionId":20,"unionTypes":[18,20],"flags":["Boolean","BooleanLike","PossiblyFalsy","Union"]},
+{"id":22,"intrinsicName":"symbol","recursionId":21,"flags":["ESSymbol"]},
+{"id":23,"intrinsicName":"void","recursionId":22,"flags":["Void"]},
+{"id":24,"intrinsicName":"never","recursionId":23,"flags":["Never"]},
+{"id":25,"intrinsicName":"never","recursionId":24,"flags":["Never"]},
+{"id":26,"intrinsicName":"never","recursionId":25,"flags":["Never"]},
+{"id":27,"intrinsicName":"never","recursionId":26,"flags":["Never"]},
+{"id":28,"intrinsicName":"object","recursionId":27,"flags":["NonPrimitive"]},
+{"id":29,"recursionId":28,"unionTypes":[14,15],"flags":["Union"]},
+{"id":30,"recursionId":29,"unionTypes":[14,15,22],"flags":["Union"]},
+{"id":31,"recursionId":30,"unionTypes":[15,16],"flags":["Union"]},
+{"id":32,"recursionId":31,"unionTypes":[10,13,14,15,16,18,20],"flags":["Union"]},
+{"id":33,"recursionId":32,"flags":["TemplateLiteral"]},
+{"id":34,"intrinsicName":"never","recursionId":33,"flags":["Never"]},
+{"id":35,"recursionId":34,"flags":["Object"],"display":"{}"},
+{"id":36,"recursionId":35,"flags":["Object"],"display":"{}"},
+{"id":37,"recursionId":36,"flags":["Object"],"display":"{}"},
+{"id":38,"symbolName":"__type","recursionId":37,"flags":["Object"],"display":"{}"},
+{"id":39,"recursionId":38,"flags":["Object"],"display":"{}"},
+{"id":40,"recursionId":39,"unionTypes":[10,13,39],"flags":["Union"]},
+{"id":41,"recursionId":40,"flags":["Object"],"display":"{}"},
+{"id":42,"recursionId":41,"flags":["Object"],"display":"{}"},
+{"id":43,"recursionId":42,"flags":["Object"],"display":"{}"},
+{"id":44,"recursionId":43,"flags":["Object"],"display":"{}"},
+{"id":45,"recursionId":44,"flags":["Object"],"display":"{}"},
+{"id":46,"flags":["TypeParameter","IncludesMissingType"]},
+{"id":47,"flags":["TypeParameter","IncludesMissingType"]},
+{"id":48,"flags":["TypeParameter","IncludesMissingType"]},
+{"id":49,"flags":["TypeParameter","IncludesMissingType"]},
+{"id":50,"flags":["TypeParameter","IncludesMissingType"]},
+{"id":51,"recursionId":45,"flags":["StringLiteral"],"display":"\"\""},
+{"id":52,"recursionId":46,"flags":["NumberLiteral"],"display":"0"},
+{"id":53,"recursionId":47,"flags":["BigIntLiteral"],"display":"0n"},
+{"id":54,"recursionId":48,"flags":["StringLiteral"],"display":"\"string\""},
+{"id":55,"recursionId":49,"flags":["StringLiteral"],"display":"\"number\""},
+{"id":56,"recursionId":50,"flags":["StringLiteral"],"display":"\"bigint\""},
+{"id":57,"recursionId":51,"flags":["StringLiteral"],"display":"\"boolean\""},
+{"id":58,"recursionId":52,"flags":["StringLiteral"],"display":"\"symbol\""},
+{"id":59,"recursionId":53,"flags":["StringLiteral"],"display":"\"undefined\""},
+{"id":60,"recursionId":54,"flags":["StringLiteral"],"display":"\"object\""},
+{"id":61,"recursionId":55,"flags":["StringLiteral"],"display":"\"function\""},
+{"id":62,"recursionId":56,"unionTypes":[54,55,56,57,58,59,60,61],"flags":["Union"]},
+{"id":63,"symbolName":"IArguments","recursionId":57,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":402,"character":2},"end":{"line":408,"character":2}},"flags":["Object"]},
+{"id":64,"symbolName":"globalThis","recursionId":58,"flags":["Object"],"display":"typeof globalThis"},
+{"id":65,"symbolName":"Array","recursionId":59,"instantiatedType":65,"typeArguments":[66],"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1323,"character":2},"end":{"line":1511,"character":2}},"flags":["Object"]},
+{"id":66,"symbolName":"T","recursionId":60,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1325,"character":17},"end":{"line":1325,"character":18}},"flags":["TypeParameter","IncludesMissingType"]},
+{"id":67,"symbolName":"Array","recursionId":59,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1323,"character":2},"end":{"line":1511,"character":2}},"flags":["TypeParameter","IncludesMissingType"]},
+{"id":68,"symbolName":"Object","recursionId":61,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":121,"character":2},"end":{"line":153,"character":2}},"flags":["Object"]},
+{"id":69,"symbolName":"Function","recursionId":62,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":270,"character":39},"end":{"line":307,"character":2}},"flags":["Object"]},
+{"id":70,"symbolName":"CallableFunction","recursionId":63,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":329,"character":136},"end":{"line":366,"character":2}},"flags":["Object"]},
+{"id":71,"symbolName":"NewableFunction","recursionId":64,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":366,"character":2},"end":{"line":402,"character":2}},"flags":["Object"]},
+{"id":72,"symbolName":"String","recursionId":65,"instantiatedType":72,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":408,"character":2},"end":{"line":532,"character":2}},"flags":["Object"]},
+{"id":73,"symbolName":"RelativeIndexable","recursionId":66,"instantiatedType":73,"typeArguments":[74],"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/@types+node@22.17.1/node_modules/@types/node/compatibility/indexable.d.ts","start":{"line":1,"character":1},"end":{"line":5,"character":2}},"flags":["Object"]},
+{"id":74,"symbolName":"T","recursionId":67,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/@types+node@22.17.1/node_modules/@types/node/compatibility/indexable.d.ts","start":{"line":3,"character":29},"end":{"line":3,"character":30}},"flags":["TypeParameter","IncludesMissingType"]},
+{"id":75,"symbolName":"RelativeIndexable","recursionId":66,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/@types+node@22.17.1/node_modules/@types/node/compatibility/indexable.d.ts","start":{"line":1,"character":1},"end":{"line":5,"character":2}},"flags":["TypeParameter","IncludesMissingType"]},
+{"id":76,"symbolName":"String","recursionId":65,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":408,"character":2},"end":{"line":532,"character":2}},"flags":["TypeParameter","IncludesMissingType"]},
+{"id":77,"symbolName":"Number","recursionId":68,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":557,"character":41},"end":{"line":586,"character":2}},"flags":["Object"]},
+{"id":78,"symbolName":"Boolean","recursionId":69,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":544,"character":39},"end":{"line":549,"character":2}},"flags":["Object"]},
+{"id":79,"symbolName":"RegExp","recursionId":70,"instantiatedType":79,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":991,"character":2},"end":{"line":1023,"character":2}},"flags":["Object"]},
+{"id":80,"symbolName":"RegExp","recursionId":70,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":991,"character":2},"end":{"line":1023,"character":2}},"flags":["TypeParameter","IncludesMissingType"]},
+{"id":81,"symbolName":"Array","recursionId":59,"instantiatedType":65,"typeArguments":[1],"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1323,"character":2},"end":{"line":1511,"character":2}},"flags":["Object"]},
+{"id":82,"symbolName":"Array","recursionId":59,"instantiatedType":65,"typeArguments":[2],"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1323,"character":2},"end":{"line":1511,"character":2}},"flags":["Object"]},
+{"id":83,"symbolName":"ReadonlyArray","recursionId":71,"instantiatedType":83,"typeArguments":[84],"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1185,"character":24},"end":{"line":1316,"character":2}},"flags":["Object"]},
+{"id":84,"symbolName":"T","recursionId":72,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1191,"character":25},"end":{"line":1191,"character":26}},"flags":["TypeParameter","IncludesMissingType"]},
+{"id":85,"symbolName":"ReadonlyArray","recursionId":71,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1185,"character":24},"end":{"line":1316,"character":2}},"flags":["TypeParameter","IncludesMissingType"]},
+{"id":86,"symbolName":"ReadonlyArray","recursionId":71,"instantiatedType":83,"typeArguments":[1],"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1185,"character":24},"end":{"line":1316,"character":2}},"flags":["Object"]},
+{"id":87,"symbolName":"ThisType","recursionId":73,"instantiatedType":87,"typeArguments":[88],"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1680,"character":29},"end":{"line":1685,"character":25}},"flags":["Object"]},
+{"id":88,"symbolName":"T","recursionId":74,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1685,"character":20},"end":{"line":1685,"character":21}},"flags":["TypeParameter","IncludesMissingType"]},
+{"id":89,"symbolName":"ThisType","recursionId":73,"firstDeclaration":{"path":"/users/winston/documents/monorepo-template/.conductor/hartford/node_modules/.pnpm/typescript@5.9.2/node_modules/typescript/lib/lib.es5.d.ts","start":{"line":1680,"character":29},"end":{"line":1685,"character":25}},"flags":["TypeParameter","IncludesMissingType"]}]

apps/www/package.json

@@ -21,6 +21,7 @@
   "dependencies": {
     "@rectangular-labs/api": "workspace:*",
     "@rectangular-labs/auth": "workspace:*",
+    "@rectangular-labs/blog": "workspace:*",
     "@rectangular-labs/ui": "workspace:*",
     "@simplewebauthn/browser": "^13.1.2",
     "@t3-oss/env-core": "^0.13.8",

apps/www/src/routes/blog/$slug.tsx

@@ -0,0 +1,52 @@
+import { allPosts, MDXContent, type Post } from "@rectangular-labs/blog";
+import { createFileRoute, notFound } from "@tanstack/react-router";
+
+export const Route = createFileRoute("/blog/$slug" as any)({
+  component: BlogPost,
+  loader: ({ params }: { params: { slug: string } }) => {
+    const post = allPosts.find((p: Post) => p.slug === params.slug);
+    if (!post) throw notFound();
+    return post;
+  },
+});
+
+function BlogPost() {
+  const post = Route.useLoaderData() as Post;
+
+  return (
+    <article className="max-w-none">
+      <header className="mb-8 space-y-4">
+        <h1 className="text-4xl font-bold tracking-tight text-foreground">
+          {post.title}
+        </h1>
+        <p className="text-xl text-muted-foreground">{post.description}</p>
+        <div className="flex items-center space-x-4 text-sm text-muted-foreground border-t border-border pt-4">
+          <time dateTime={post.date}>
+            {new Date(post.date).toLocaleDateString("en-US", {
+              year: "numeric",
+              month: "long", 
+              day: "numeric",
+            })}
+          </time>
+          {post.author && <span>By {post.author}</span>}
+        </div>
+        {post.tags && post.tags.length > 0 && (
+          <div className="flex flex-wrap gap-2">
+            {post.tags.map((tag) => (
+              <span
+                key={tag}
+                className="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-secondary text-secondary-foreground"
+              >
+                {tag}
+              </span>
+            ))}
+          </div>
+        )}
+      </header>
+
+      <div className="prose prose-neutral dark:prose-invert max-w-none">
+        <MDXContent code={post.mdx} />
+      </div>
+    </article>
+  );
+}

apps/www/src/routes/blog/index.tsx

@@ -0,0 +1,62 @@
+import { allPosts, type Post } from "@rectangular-labs/blog";
+import { createFileRoute, Link } from "@tanstack/react-router";
+
+export const Route = createFileRoute("/blog/" as any)({
+  component: BlogIndex,
+});
+
+function BlogIndex() {
+  const posts = allPosts.sort(
+    (a: Post, b: Post) => new Date(b.date).getTime() - new Date(a.date).getTime(),
+  );
+
+  return (
+    <div className="space-y-8">
+      {posts.length === 0 ? (
+        <div className="text-center py-12">
+          <p className="text-muted-foreground">No blog posts yet.</p>
+        </div>
+      ) : (
+        posts.map((post: Post) => (
+          <article
+            key={post.slug}
+            className="border-b border-border pb-8 last:border-b-0"
+          >
+            <div className="space-y-3">
+              <div>
+                <h2 className="text-2xl font-semibold text-foreground hover:text-primary transition-colors">
+                  <Link to={"/blog/$slug" as any} params={{ slug: post.slug } as any}>
+                    {post.title}
+                  </Link>
+                </h2>
+                <p className="text-muted-foreground mt-2">{post.description}</p>
+              </div>
+              <div className="flex items-center space-x-4 text-sm text-muted-foreground">
+                <time dateTime={post.date}>
+                  {new Date(post.date).toLocaleDateString("en-US", {
+                    year: "numeric",
+                    month: "long",
+                    day: "numeric",
+                  })}
+                </time>
+                {post.author && <span>By {post.author}</span>}
+              </div>
+              {post.tags && post.tags.length > 0 && (
+                <div className="flex flex-wrap gap-2">
+                  {post.tags.map((tag: string) => (
+                    <span
+                      key={tag}
+                      className="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-secondary text-secondary-foreground"
+                    >
+                      {tag}
+                    </span>
+                  ))}
+                </div>
+              )}
+            </div>
+          </article>
+        ))
+      )}
+    </div>
+  );
+}

apps/www/src/routes/blog/route.tsx

@@ -0,0 +1,23 @@
+import { createFileRoute, Outlet } from "@tanstack/react-router";
+
+export const Route = createFileRoute("/blog" as any)({
+  component: BlogLayout,
+});
+
+function BlogLayout() {
+  return (
+    <div className="min-h-screen bg-background">
+      <div className="container mx-auto max-w-4xl px-4 py-8">
+        <header className="mb-8">
+          <h1 className="text-4xl font-bold tracking-tight text-foreground">
+            Blog
+          </h1>
+          <p className="mt-2 text-muted-foreground">
+            Thoughts, tutorials, and insights from our team
+          </p>
+        </header>
+        <Outlet />
+      </div>
+    </div>
+  );
+}

biome.json

@@ -102,7 +102,8 @@
       "!**/.nitro",
       "!**/routeTree.gen.ts",
       "!**/sst-env.d.ts",
-      "!**/_renderer.tsx"
+      "!**/_renderer.tsx",
+      "!**/.content-collections"
     ]
   }
 }

packages/blog/content-collections.ts

@@ -0,0 +1,30 @@
+import { defineCollection, defineConfig } from "@content-collections/core";
+import { compileMDX } from "@content-collections/mdx";
+import { type } from "arktype";
+
+const postSchema = type({
+  title: "string",
+  description: "string",
+  date: "string",
+  "author?": "string",
+  "tags?": "string[]",
+});
+
+const posts = defineCollection({
+  name: "posts",
+  directory: "content",
+  include: "*.mdx",
+  schema: postSchema,
+  transform: async (document, context) => {
+    const mdx = await compileMDX(context, document);
+    return {
+      ...document,
+      mdx,
+      slug: document._meta.path.replace(/\.mdx$/, ""),
+    };
+  },
+});
+
+export default defineConfig({
+  collections: [posts],
+});