refactor: post content has markdown instead of html

src/interfaces.ts

@@ -30,7 +30,7 @@ export type Post = {
 };
 
 export type PostContent = {
-  html: string;
+  markdown: string;
   images?: Map<string, string>;
 };
 

src/markdown.ts

@@ -0,0 +1,23 @@
+import rehypeKatex from "rehype-katex";
+import rehypeMermaid from "rehype-mermaid";
+import rehypePrism from "rehype-prism-plus";
+import rehypeStringify from "rehype-stringify";
+import remarkGfm from "remark-gfm";
+import remarkMath from "remark-math";
+import remarkParse from "remark-parse";
+import remarkRehype from "remark-rehype";
+import { unified } from "unified";
+
+export const md2html = unified()
+  .use(remarkParse)
+  .use(remarkGfm)
+  .use(remarkMath)
+  .use(remarkRehype)
+  .use(rehypeKatex)
+  .use(rehypeMermaid, { strategy: "pre-mermaid" })
+  .use(rehypePrism)
+  .use(rehypeStringify);
+
+export async function markdownToHTML(md: string): Promise<string> {
+  return String(await md2html.process(md));
+}

src/notion/client.ts

@@ -11,7 +11,6 @@ import { debug } from "../utils";
 
 import { buildDatabase, buildPost, isValidPage } from "./conv";
 import {
-  md2html,
   transformMdBlocks,
   transformMdImageBlock,
   transformMdLinkBlock,
@@ -105,10 +104,9 @@ export class Client implements ClientType {
       (block) => transformMdLinkBlock(block, posts),
     );
 
-    const mdString = this.n2m.toMarkdownString(transformed);
-    const file = await md2html.process(mdString.parent);
+    const markdown = this.n2m.toMarkdownString(transformed);
     return {
-      html: String(file),
+      markdown: markdown.parent,
       images,
     };
   }

src/notion/markdown.ts

@@ -1,28 +1,9 @@
 import type { MdBlock } from "notion-to-md/build/types";
-import rehypeKatex from "rehype-katex";
-import rehypeMermaid from "rehype-mermaid";
-import rehypePrism from "rehype-prism-plus";
-import rehypeStringify from "rehype-stringify";
-import remarkGfm from "remark-gfm";
-import remarkMath from "remark-math";
-import remarkParse from "remark-parse";
-import remarkRehype from "remark-rehype";
-import { unified } from "unified";
 
 import type { Post } from "../interfaces";
 
 import { fileUrlToAssetUrl } from "./utils";
 
-export const md2html = unified()
-  .use(remarkParse)
-  .use(remarkGfm)
-  .use(remarkMath)
-  .use(remarkRehype)
-  .use(rehypeKatex)
-  .use(rehypeMermaid, { strategy: "pre-mermaid" })
-  .use(rehypePrism)
-  .use(rehypeStringify);
-
 export function transformMdBlocks(
   blocks: MdBlock[],
   ...transformers: ((block: MdBlock) => MdBlock)[]

src/pages/posts/[slug].astro

@@ -3,6 +3,7 @@ import config from "../../config";
 import PostFooter from "../../customization/PostFooter.astro";
 import { downloadImages } from "../../download";
 import Layout from "../../layouts/Layout.astro";
+import { markdownToHTML } from "../../markdown";
 import client from "../../notion";
 import { postUrl, formatPostDate } from "../../utils";
 
@@ -18,6 +19,7 @@ const post = slug ? await client.getPostBySlug(slug) : undefined;
 if (!post) throw new Error(`Post not found: ${slug}`);
 
 const content = post ? await client.getPostContent(post.id) : undefined;
+const html = content ? await markdownToHTML(content.markdown) : undefined;
 await downloadImages(content?.images, post?.images, database?.images);
 ---
 
@@ -53,7 +55,7 @@ await downloadImages(content?.images, post?.images, database?.images);
           "max-w-3xl mx-auto py-6 lg:py-12 markdown post",
           config.post?.classes,
         ]}
-        set:html={content?.html}
+        set:html={html}
       />
       <PostFooter post={post} database={database} />
     </article>