feature/upgrade

* ✨ Experiment w/ server islands and content layer

* ⬆️ Astro 5.0 beta

* ✨ Migrate Blog Posts to Content Layer API

* ✨ Continue the Content Layer API Migration

* ✨ Migrate to astro-icon

* ⬇️ Back to 4x for now...

* 🐛 Wrong path

.vscode/settings.json

@@ -1,3 +1,4 @@
 {
-  "typescript.tsdk": "node_modules/typescript/lib"
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "astro.content-intellisense": true
 }

alpine.config.ts

@@ -6,12 +6,6 @@ import focus from '@alpinejs/focus';
 
 export default (Alpine: Alpine) => {
   Alpine.plugin([collapse, focus]);
-
-  Alpine.magic('fetch', () => async (...props: Parameters<typeof fetch>) => {
-    if (props[1]?.body) props[1].body = JSON.stringify(props[1].body);
-    return await fetch(...props).then((res) => res.json());
-  });
-
   Alpine.data('partial', (url: string) => ({
     loading: false,
     failed: false,

astro.config.ts

@@ -4,6 +4,7 @@ import mdx from '@astrojs/mdx';
 import sitemap from '@astrojs/sitemap';
 import tailwind from '@astrojs/tailwind';
 import vercel from '@astrojs/vercel/serverless';
+import icon from 'astro-icon';
 import robotsTxt from 'astro-robots-txt';
 import { defineConfig, envField } from 'astro/config';
 import { toString } from 'mdast-util-to-string';
@@ -28,6 +29,8 @@ export default defineConfig({
     ],
   },
   experimental: {
+    serverIslands: true,
+    contentLayer: true,
     env: {
       schema: {
         LOCATION: envField.string({ context: 'server', access: 'public' }),
@@ -48,6 +51,7 @@ export default defineConfig({
     tailwind(),
     mdx(),
     db(),
+    icon(),
     alpine({ entrypoint: '/alpine.config.ts' }),
     sitemap({ changefreq: 'daily', lastmod: new Date(), filter: (page) => !/\/blog\/results/.test(page) }),
     robotsTxt({ policy: [{ userAgent: '*', disallow: ['/404', '/blog/results'] }] }),

db/seed.prod.ts

@@ -5,8 +5,8 @@ import { readFile, readdir } from 'node:fs/promises';
 
 export default async function () {
   const posts = await Promise.all(
-    (await readdir('src/content/posts', { withFileTypes: true })).map(async (file) => {
-      const post = (await readFile(`src/content/posts/${file.name}`, 'utf-8')).replace(/---[\s\S]*?---/, '');
+    (await readdir('src/data/posts', { withFileTypes: true })).map(async (file) => {
+      const post = (await readFile(`src/data/posts/${file.name}`, 'utf-8')).replace(/---[\s\S]*?---/, '');
       const body = toString(fromMarkdown(post), { includeHtml: false }).replaceAll('\n', ' ');
       return sql`(${file.name.replace(/\.mdx$/, '')}, ${body})`;
     }),

db/seed.ts

@@ -1,18 +1,22 @@
-import { getCollection } from 'astro:content';
-import { PostView, db, sql } from 'astro:db';
+import { db, PostView, sql } from 'astro:db';
 import { fromMarkdown } from 'mdast-util-from-markdown';
 import { toString } from 'mdast-util-to-string';
+import { readdir, readFile } from 'node:fs/promises';
 
 export default async function () {
-  const posts = await getCollection('posts');
-  const postsSearches = posts
-    .map((post) => ({ slug: post.slug, body: toString(fromMarkdown(post.body), { includeHtml: false }) }))
-    .map((post) => sql`(${post.slug}, ${post.body.replaceAll('\n', ' ')})`);
+  const postsFileNames = await readdir('src/data/posts', { withFileTypes: true });
+  const postsContents = await Promise.all(
+    postsFileNames.map(async (file) => {
+      const post = (await readFile(`src/data/posts/${file.name}`, 'utf-8')).replace(/---[\s\S]*?---/, '');
+      const body = toString(fromMarkdown(post), { includeHtml: false }).replaceAll('\n', ' ');
+      return sql`(${file.name.replace(/\.mdx$/, '')}, ${body})`;
+    }),
+  );
 
   await db.batch([
-    db.insert(PostView).values(posts.map((post) => ({ post: post.slug }))),
+    db.insert(PostView).values(postsFileNames.map((post) => ({ post: post.name.replace(/\.mdx$/, '') }))),
     db.run(sql`drop table if exists PostSearch`),
     db.run(sql`create virtual table PostSearch using fts5(slug unindexed, body)`),
-    db.run(sql.join([sql`insert into PostSearch (slug, body) values `, sql.join(postsSearches, sql`,`)])),
+    db.run(sql.join([sql`insert into PostSearch (slug, body) values `, sql.join(postsContents, sql`,`)])),
   ]);
 }

package.json

@@ -11,40 +11,41 @@
     "astro": "astro"
   },
   "dependencies": {
-    "@alpinejs/collapse": "^3.14.0",
-    "@alpinejs/focus": "^3.14.0",
-    "@astrojs/db": "^0.11.6",
-    "alpinejs": "^3.14.0",
-    "astro": "^4.10.3"
+    "@alpinejs/collapse": "^3.14.1",
+    "@alpinejs/focus": "^3.14.1",
+    "@astrojs/db": "0.14.1",
+    "alpinejs": "^3.14.1",
+    "astro": "4.15.9"
   },
   "devDependencies": {
     "@astrojs/alpinejs": "^0.4.0",
-    "@astrojs/mdx": "^3.1.1",
-    "@astrojs/rss": "^4.0.6",
+    "@astrojs/mdx": "3.1.7",
+    "@astrojs/rss": "^4.0.7",
     "@astrojs/sitemap": "^3.1.6",
-    "@astrojs/tailwind": "^5.1.0",
-    "@astrojs/vercel": "^7.7.1",
-    "@fontsource/inter": "^5.0.18",
-    "@octokit/rest": "^20.1.1",
+    "@astrojs/tailwind": "^5.1.1",
+    "@astrojs/vercel": "7.8.1",
+    "@fontsource/inter": "^5.1.0",
+    "@iconify-json/lucide": "^1.2.5",
+    "@octokit/rest": "^21.0.2",
     "@types/alpinejs": "^3.13.10",
-    "astro-og-canvas": "^0.5.1",
+    "astro-icon": "^1.1.1",
+    "astro-og-canvas": "^0.5.3",
     "astro-robots-txt": "^1.0.0",
     "canvaskit-wasm": "^0.39.1",
-    "lucide-astro": "^0.395.0",
     "mdast-util-from-markdown": "^2.0.1",
     "mdast-util-to-string": "^4.0.0",
-    "prettier": "3.3.2",
-    "prettier-plugin-astro": "0.14.0",
-    "prettier-plugin-tailwindcss": "^0.6.5",
+    "prettier": "3.3.3",
+    "prettier-plugin-astro": "0.14.1",
+    "prettier-plugin-tailwindcss": "^0.6.8",
     "reading-time": "^1.5.0",
-    "rehype-pretty-code": "^0.13.2",
-    "sass": "^1.77.6",
-    "sharp": "^0.33.4",
-    "shiki": "^1.7.0",
-    "tailwind-merge": "^2.3.0",
+    "rehype-pretty-code": "^0.14.0",
+    "sass": "^1.79.3",
+    "sharp": "^0.33.5",
+    "shiki": "^1.18.0",
+    "tailwind-merge": "^2.5.2",
     "tailwind-scrollbar": "^3.1.0",
     "tailwind-variants": "^0.2.1",
-    "tailwindcss": "^3.4.4",
+    "tailwindcss": "^3.4.13",
     "tailwindcss-animate": "^1.0.7",
     "tailwindcss-fluid-type": "^2.0.6"
   }