🏗️ Markdown in Posts

ThijmenGThN · Dec 16, 2023 · e4fad08 · e4fad08
1 parent a2b3491
commit e4fad08
Show file tree

Hide file tree

Showing 5 changed files with 1,615 additions and 53 deletions.
diff --git a/app/[locale]/[category]/[post]/page.tsx b/app/[locale]/[category]/[post]/page.tsx
@@ -1,3 +1,6 @@
+import Markdown from 'react-markdown'
+import remarkGfm from 'remark-gfm'
+
 import pb from "@/helpers/pocketbase"
 import { Link } from "@/helpers/navigation"
 
@@ -23,9 +26,11 @@ export default async function Page({ params }: { params: { post: string } }) {
                     </p>
                 </div>
 
-                <div className="rounded border shadow-sm p-8 bg-gradient-to-tr from-gray-50 to-white"
-                    dangerouslySetInnerHTML={{ __html: post.content }}
-                />
+                <div className="rounded border shadow-sm p-8 bg-gradient-to-tr from-gray-50 to-white">
+                    <Markdown remarkPlugins={[remarkGfm]} className='prose prose-sm min-w-full'>
+                        {post.content}
+                    </Markdown>
+                </div>
 
                 <div className="mx-auto mt-16">
                     <Link href={'/' + category.slug}>