wip: move workstation

2023-10-21 10:17:10 +11:00
parent 08db8ef124
commit 6d3dab582a
11 changed files with 760 additions and 6 deletions
--- a/app/post/[slug]/page.tsx
+++ b/app/post/[slug]/page.tsx
@@ -1,3 +1,65 @@
-export default function Post({ params }: { params: { slug: string } }) {
-  return <div>My Post: {params.slug}</div>;
+import { getPost } from "@/backend/post";
+import DOMPurify from "dompurify";
+import { JSDOM } from "jsdom";
+import {nunito_sans, raleway} from "@/app/fonts";
+import parse, {domToReact, Element, HTMLReactParserOptions} from "html-react-parser";
+import { DummyPostSlug, DummyPostString } from "@/components/dummyPost";
+
+const options: HTMLReactParserOptions = {
+  replace: (domNode) => {
+    if (domNode instanceof Element && domNode.attribs) {
+      // console.log(domNode.attribs)
+      if (domNode.name === 'h1') {
+        if (domNode.attribs.class === 'title') {
+          return (
+              <div className={`flex flex-row justify-stretch`}>
+                <h1 className={`${raleway.className} mx-auto max-w-4xl text-4xl`}>{domToReact(domNode.children)}</h1>
+              </div>
+          )
+        } else {
+          return (
+              <div className={`flex flex-row justify-stretch`}>
+                <h1 className={`${raleway.className} max-w-4xl mx-auto text-3xl`}>{domToReact(domNode.children)}</h1>
+              </div>
+          )
+        }
+      } else if (domNode.name === 'h2') {
+
+      } else if (domNode.name === 'h3') {
+
+      } else if (domNode.name === 'p') {
+        if (domNode.attribs.class === 'paragraph') {
+          return (
+              <div className={`flex flex-row justify-center`}>
+                <h1 className={`${nunito_sans.className} w-224`}>{domToReact(domNode.children)}</h1>
+              </div>
+          )
+        } else if (domNode.attribs.class === 'code') {
+
+        }
+      }
+    }
+  }
+}
+
+export default async function Post({ params }: { params: { slug: string } }) {
+  let content = ""
+
+  const dummySlug = await DummyPostSlug()
+  if (dummySlug === params.slug) {
+    content = await DummyPostString()
+    console.log(content)
+  } else {
+    content = await getPost(params.slug);
+  }
+
+  content = DOMPurify(new JSDOM("<!DOCTYPE html>").window).sanitize(content);
+  // console.log(content)
+  const elem = parse(content, options);
+
+  return (
+    <div className={`flex flex-col`}>
+      {elem}
+    </div>
+  );
 }