feat: 이전 패키지 삭제 및 toast-editor viewer를 이용해 전 상세페이지 적용

ssu-student-union · Oct 27, 2024 · e290266 · e290266
1 parent fd5171f
commit e290266
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 827 deletions.
diff --git a/.yarn/install-state.gz b/.yarn/install-state.gz
diff --git a/package.json b/package.json
@@ -45,12 +45,10 @@
     "react-dom": "^18.2.0",
     "react-dropzone": "^14.2.3",
     "react-hook-form": "^7.51.2",
-    "react-markdown": "^9.0.1",
     "react-router-dom": "^6.22.3",
     "react-slick": "0.30.2",
     "recoil": "^0.7.7",
     "recoil-persist": "5.1.0",
-    "rehype-sanitize": "^6.0.0",
     "slick-carousel": "^1.8.1",
     "sonner": "^1.4.41",
     "tailwind-merge": "^2.2.2",

diff --git a/src/pages/audit/auditDetail/container/auditDetailContentSection.tsx b/src/pages/audit/auditDetail/container/auditDetailContentSection.tsx
@@ -1,5 +1,4 @@
-import ReactMarkdown from 'react-markdown';
-import rehypeSanitize from 'rehype-sanitize';
+import { Viewer } from '@toast-ui/react-editor';
 
 interface AuditDetailContentProps {
   content: string;
@@ -9,9 +8,7 @@ interface AuditDetailContentProps {
 export function AuditDetailContentSection({ content, images = [] }: AuditDetailContentProps) {
   return (
     <div className="pt-[32px]">
-      <ReactMarkdown rehypePlugins={[rehypeSanitize]} className="font-sm text-[#484848]">
-        {content}
-      </ReactMarkdown>
+      <Viewer initialValue={content} />
       <div className="h-[32px]" />
       {images?.map((image, index) => (
         <div key={image + index}>

diff --git a/src/pages/notice/noticeDetail/container/noticeDetailContentSection.tsx b/src/pages/notice/noticeDetail/container/noticeDetailContentSection.tsx
@@ -1,3 +1,5 @@
+import { Viewer } from '@toast-ui/react-editor';
+
 interface NoticeDetailContentProps {
   content: string;
   images?: string[];
@@ -6,7 +8,7 @@ interface NoticeDetailContentProps {
 export function NoticeDetailContentSection({ content, images = [] }: NoticeDetailContentProps) {
   return (
     <div className="pt-[32px]">
-      <div className="font-sm text-[#484848]">{content}</div>
+      <Viewer initialValue={content} />
       <div className="h-[32px]" />
       {images?.map((image, index) => (
         <div key={image + index}>

diff --git a/src/pages/partnership/partnershipDetail/container/PartnershipDetailContentSection.tsx b/src/pages/partnership/partnershipDetail/container/PartnershipDetailContentSection.tsx
@@ -1,3 +1,5 @@
+import { Viewer } from '@toast-ui/react-editor';
+
 interface PartnershipDetailContentProps {
   content: string;
   images?: string[];
@@ -6,7 +8,7 @@ interface PartnershipDetailContentProps {
 export function PartnershipDetailContentSection({ content, images = [] }: PartnershipDetailContentProps) {
   return (
     <div className="pt-[32px]">
-      <div className="font-sm text-[#484848]">{content}</div>
+      <Viewer initialValue={content} />
       <div className="h-[32px]" />
       {images?.map((image, index) => (
         <div key={index}>

diff --git a/src/pages/router.tsx b/src/pages/router.tsx
@@ -63,7 +63,7 @@ export function MainRouter() {
         <Route path="/audit/:id" element={<AuditDetailPage />} />
         <Route path="/audit/edit" element={<AuditEditPage />} />
         <Route path="/audit/:id/patch" element={<AuditPatchPage />} />
-        {/*자료집 임시 제거*/}
+        {/*자료집 임시 제거-*/}
         {/* <Route path="/data" element={<Data />} />
         <Route path="/data/edit" element={<Data />} /> */}
         {/*개인정보이용약관*/}