From 0ff28cb59b415ab7d2be4a22382dceae9230aed9 Mon Sep 17 00:00:00 2001
From: Peter Cruckshank <petecruckshank@gmail.com>
Date: Sat, 26 Oct 2024 12:32:48 -0400
Subject: [PATCH 1/2] fixed errors on /app/articles/app/page and added types

---
 app/(app)/articles/[slug]/page.tsx | 10 +++++++---
 package-lock.json                  |  2 +-
 package.json                       |  1 +
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/app/(app)/articles/[slug]/page.tsx b/app/(app)/articles/[slug]/page.tsx
index 88a8f58d..9541f4b7 100644
--- a/app/(app)/articles/[slug]/page.tsx
+++ b/app/(app)/articles/[slug]/page.tsx
@@ -14,7 +14,7 @@ import ArticleAdminPanel from "@/components/ArticleAdminPanel/ArticleAdminPanel"
 import { type Metadata } from "next";
 import { getPost } from "@/server/lib/posts";
 import { getCamelCaseFromLower } from "@/utils/utils";
-import { generateHTML } from "@tiptap/html";
+import { generateHTML } from "@tiptap/core";
 import { TiptapExtensions } from "@/components/editor/editor/extensions";
 import DOMPurify from "isomorphic-dompurify";
 import type { JSONContent } from "@tiptap/core";
@@ -119,11 +119,15 @@ const ArticlePage = async ({ params }: Props) => {
 
           {isTiptapContent ? (
             <div
-              dangerouslySetInnerHTML={{ __html: renderedContent }}
+              dangerouslySetInnerHTML={{ __html: renderedContent ?? "" }}
               className="tiptap-content"
             />
           ) : (
-            <div>{renderedContent}</div>
+            <div>
+              {Markdoc.renderers.react(renderedContent, React, {
+                components: markdocComponents,
+              })}
+            </div>
           )}
         </article>
         {post.tags.length > 0 && (
diff --git a/package-lock.json b/package-lock.json
index fa5fb01c..37e073df 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -99,6 +99,7 @@
         "@svgr/webpack": "^8.1.0",
         "@tailwindcss/typography": "^0.5.13",
         "@types/chance": "^1.1.6",
+        "@types/dompurify": "^3.0.5",
         "@types/node": "^22.7.5",
         "@types/nodemailer": "^6.4.15",
         "@types/pg": "^8.11.5",
@@ -8634,7 +8635,6 @@
       "version": "3.0.5",
       "resolved": "https://registry.npmjs.org/@types/dompurify/-/dompurify-3.0.5.tgz",
       "integrity": "sha512-1Wg0g3BtQF7sSb27fJQAKck1HECM6zV1EB66j8JH9i3LCjYabJa0FSdiSgsD5K/RbrsR0SiraKacLB+T8ZVYAg==",
-      "license": "MIT",
       "dependencies": {
         "@types/trusted-types": "*"
       }
diff --git a/package.json b/package.json
index b687eea3..96a67dd0 100644
--- a/package.json
+++ b/package.json
@@ -117,6 +117,7 @@
     "@svgr/webpack": "^8.1.0",
     "@tailwindcss/typography": "^0.5.13",
     "@types/chance": "^1.1.6",
+    "@types/dompurify": "^3.0.5",
     "@types/node": "^22.7.5",
     "@types/nodemailer": "^6.4.15",
     "@types/pg": "^8.11.5",

From 867914034135eff52bd6aa8d160ce7d3f094b70d Mon Sep 17 00:00:00 2001
From: Peter Cruckshank <petecruckshank@gmail.com>
Date: Sun, 27 Oct 2024 19:51:30 -0400
Subject: [PATCH 2/2] Imported <NotFound /> and replace empty string eorr with
 it.

---
 app/(app)/articles/[slug]/page.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/app/(app)/articles/[slug]/page.tsx b/app/(app)/articles/[slug]/page.tsx
index 9541f4b7..614e9f6e 100644
--- a/app/(app)/articles/[slug]/page.tsx
+++ b/app/(app)/articles/[slug]/page.tsx
@@ -18,6 +18,7 @@ import { generateHTML } from "@tiptap/core";
 import { TiptapExtensions } from "@/components/editor/editor/extensions";
 import DOMPurify from "isomorphic-dompurify";
 import type { JSONContent } from "@tiptap/core";
+import NotFound from "@/components/NotFound/NotFound";
 
 type Props = { params: { slug: string } };
 
@@ -119,7 +120,9 @@ const ArticlePage = async ({ params }: Props) => {
 
           {isTiptapContent ? (
             <div
-              dangerouslySetInnerHTML={{ __html: renderedContent ?? "" }}
+              dangerouslySetInnerHTML={{
+                __html: renderedContent ?? <NotFound />,
+              }}
               className="tiptap-content"
             />
           ) : (