From b7e9e1c7e33966ffbcdb18bdcc29e5a529778033 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=A1=B0=EA=B3=84=EC=A7=84?= <whrpwls96@naver.com>
Date: Wed, 16 Oct 2024 12:28:58 +0900
Subject: [PATCH] Refactor <Prose> component (#1352)

---
 app/[page]/page.tsx  |  2 +-
 components/prose.tsx | 10 ++--------
 2 files changed, 3 insertions(+), 9 deletions(-)

diff --git a/app/[page]/page.tsx b/app/[page]/page.tsx
index 60bcc892c..aa0c15603 100644
--- a/app/[page]/page.tsx
+++ b/app/[page]/page.tsx
@@ -32,7 +32,7 @@ export default async function Page(props: { params: Promise<{ page: string }> })
   return (
     <>
       <h1 className="mb-8 text-5xl font-bold">{page.title}</h1>
-      <Prose className="mb-8" html={page.body as string} />
+      <Prose className="mb-8" html={page.body} />
       <p className="text-sm italic">
         {`This document was last updated on ${new Intl.DateTimeFormat(undefined, {
           year: 'numeric',
diff --git a/components/prose.tsx b/components/prose.tsx
index f910d2296..0cf460f8b 100644
--- a/components/prose.tsx
+++ b/components/prose.tsx
@@ -1,19 +1,13 @@
 import clsx from 'clsx';
-import type { FunctionComponent } from 'react';
 
-interface TextProps {
-  html: string;
-  className?: string;
-}
-
-const Prose: FunctionComponent<TextProps> = ({ html, className }) => {
+const Prose = ({ html, className }: { html: string; className?: string }) => {
   return (
     <div
       className={clsx(
         'prose mx-auto max-w-6xl text-base leading-7 text-black prose-headings:mt-8 prose-headings:font-semibold prose-headings:tracking-wide prose-headings:text-black prose-h1:text-5xl prose-h2:text-4xl prose-h3:text-3xl prose-h4:text-2xl prose-h5:text-xl prose-h6:text-lg prose-a:text-black prose-a:underline hover:prose-a:text-neutral-300 prose-strong:text-black prose-ol:mt-8 prose-ol:list-decimal prose-ol:pl-6 prose-ul:mt-8 prose-ul:list-disc prose-ul:pl-6 dark:text-white dark:prose-headings:text-white dark:prose-a:text-white dark:prose-strong:text-white',
         className
       )}
-      dangerouslySetInnerHTML={{ __html: html as string }}
+      dangerouslySetInnerHTML={{ __html: html }}
     />
   );
 };