feat(rss): spec-consistent rss feed

package.json

@@ -34,9 +34,11 @@
         "canvaskit-wasm": "^0.39.1",
         "dayjs": "^1.11.13",
         "fdir": "^6.4.2",
+        "markdown-it": "^14.1.0",
         "picomatch": "^4.0.2",
         "react": "^19.0.0",
         "react-dom": "^19.0.0",
+        "sanitize-html": "^2.14.0",
         "tailwindcss": "^3.4.17",
         "tailwindcss-animate": "^1.0.7"
     },
@@ -45,7 +47,9 @@
         "@commitlint/config-conventional": "^19.6.0",
         "@commitlint/types": "^19.5.0",
         "@types/bun": "^1.1.14",
+        "@types/markdown-it": "^14.1.2",
         "@types/react": "^19.0.2",
+        "@types/sanitize-html": "^2.13.0",
         "husky": "^9.1.7",
         "lint-staged": "^15.2.11",
         "mdast": "^3.0.0",

src/layouts/Layout.astro

@@ -102,7 +102,7 @@ export interface Props {
             rel="alternate"
             type="application/rss+xml"
             title="Thoughts by Ray (@rayhanadev)"
-            href={`${import.meta.env.SITE}/feed.xml`}
+            href={`${import.meta.env.SITE}/rss.xml`}
         />
 
         <meta name="author" content={`${FULL_NAME}, ${EMAIL_ADDRESS}`} />

src/layouts/PostLayout.astro

@@ -112,7 +112,7 @@ export interface Props {
             rel="alternate"
             type="application/rss+xml"
             title="Thoughts by Ray (@rayhanadev)"
-            href={`${import.meta.env.SITE}/feed.xml`}
+            href={`${import.meta.env.SITE}/rss.xml`}
         />
 
         <meta name="author" content="Rayhan Noufal Arayilakath" />

src/pages/rss.xml.ts

@@ -0,0 +1,96 @@
+import fs from "node:fs/promises";
+import path from "node:path";
+
+import type { APIRoute } from "astro";
+import { getCollection } from "astro:content";
+
+import rss, { type RSSFeedItem } from "@astrojs/rss";
+import sanitizeHtml from "sanitize-html";
+import MarkdownIt from "markdown-it";
+const parser = new MarkdownIt();
+
+import {
+    BLOG_TITLE,
+    BLOG_DESCRIPTION,
+    EMAIL_ADDRESS,
+    FULL_NAME,
+} from "lib/consts";
+import { parseDateFromFilePath } from "lib/blog/utils";
+
+const BLOG_CUSTOM_DATA = `
+<atom:link href="${import.meta.env.SITE}/rss.xml" rel="self" type="application/rss+xml" />
+<category>Technology</category>
+<copyright>Copyright ${new Date().getUTCFullYear()} Rayhan Noufal Arayilakath</copyright>
+<docs>https://www.rssboard.org/rss-specification</docs>
+<generator>@astrojs/rss</generator>
+<image>
+  <link>https://www.rayhanadev.com/</link>
+  <title>RAYHANADEV</title>
+  <url>https://www.rayhanadev.com/favicon-32x32.png</url>
+  <description>Various pieces written and composed by Ray, related to software engineering and life.</description>
+  <height>32</height>
+  <width>32</width>
+</image>
+<language>en-US</language>
+<lastBuildDate>${new Date().toUTCString()}</lastBuildDate>
+<managingEditor>${EMAIL_ADDRESS} (${FULL_NAME})</managingEditor>
+<pubDate>${new Date().toUTCString()}</pubDate>
+<ttl>60</ttl>
+<webMaster>${EMAIL_ADDRESS}</webMaster>
+`;
+
+export const GET: APIRoute = async () => {
+    const blog = await getCollection("blog");
+    return rss({
+        xmlns: {
+            atom: "http://www.w3.org/2005/Atom",
+        },
+        title: BLOG_TITLE,
+        description: BLOG_DESCRIPTION,
+        site: import.meta.env.SITE,
+        customData: BLOG_CUSTOM_DATA,
+        items: await Promise.all(
+            blog.map(async (post): Promise<RSSFeedItem> => {
+                const date = parseDateFromFilePath(post.filePath!);
+
+                const ogImagePath = path.resolve(
+                    process.cwd(),
+                    `./dist/open-graph/${post.id}.png`,
+                );
+                const ogImageFile = await fs
+                    .readFile(ogImagePath)
+                    .catch(() => undefined);
+
+                return {
+                    author: `${EMAIL_ADDRESS} (${FULL_NAME})`,
+                    categories: post.data.tags,
+                    description: post.data.description,
+                    enclosure: ogImageFile && {
+                        length: ogImageFile.byteLength,
+                        type: "image/png",
+                        url: `${import.meta.env.SITE}/open-graph/${post.id}.png`,
+                    },
+                    link: `${import.meta.env.SITE}/thoughts/${post.id}/`,
+                    pubDate: date,
+                    title: post.data.title,
+                    content:
+                        post.body &&
+                        sanitizeHtml(parser.render(post.body), {
+                            allowedTags:
+                                sanitizeHtml.defaults.allowedTags.concat([
+                                    "img",
+                                    "figure",
+                                ]),
+                        }),
+                    customData: `<guid>${import.meta.env.SITE}/thoughts/${post.id}/</guid>`,
+                };
+            }),
+        ).then((items) =>
+            items.sort(
+                (a, b) =>
+                    new Date(b.pubDate!).getTime() -
+                    new Date(a.pubDate!).getTime(),
+            ),
+        ),
+    });
+};