Fix: memo viewer Server content 데이터 적용하기 (tiptap/html generateHTML활용)

Funssion-SWM · Dec 6, 2023 · 57b7839 · 57b7839
1 parent 18b1b2b
commit 57b7839
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 2 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -27,6 +27,7 @@
     "@tiptap/extension-task-list": "^2.0.3",
     "@tiptap/extension-text-style": "^2.0.3",
     "@tiptap/extension-underline": "^2.0.3",
+    "@tiptap/html": "^2.1.13",
     "@tiptap/pm": "^2.0.3",
     "@tiptap/react": "^2.0.3",
     "@tiptap/starter-kit": "^2.0.3",

diff --git a/src/components/memo/MemoViewer.tsx b/src/components/memo/MemoViewer.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { generateHTML } from '@tiptap/react';
+import { generateHTML } from '@tiptap/html';
 import MemoViewerHeader from './MemoViewerHeader';
 import { handleTiptapExtensions } from '@/components/editor/extensions';
 import TagView from '../shared/TagView';
@@ -77,7 +77,9 @@ export default function MemoViewer({
       <div className="h-[0.5px] mx-3 my-4 bg-soma-grey-49"></div>
       <div
         className="flex-grow max-w-full px-4 prose-sm break-all sm:prose-lg prose-headings:my-2 prose-p:my-0 prose-stone dark:prose-invert prose-headings:font-display font-default focus:outline-none"
-        dangerouslySetInnerHTML={{ __html: output }}
+        dangerouslySetInnerHTML={{
+          __html: output,
+        }}
       ></div>
       <div className="flex flex-wrap gap-1 mx-2 mt-10 mb-1">
         {memoTags.map((tag, idx) => (