From d0e55c05cba82227dc996831ae72578b416cb418 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Fri, 3 Jan 2025 02:20:26 +0900
Subject: [PATCH 1/2] =?UTF-8?q?=F0=9F=9A=91=20=EB=8B=B5=EB=B3=80=20?=
 =?UTF-8?q?=EB=A1=9C=EB=94=A9=EC=8B=9C=EC=97=90=20NSFW=20=EA=B9=9C?=
 =?UTF-8?q?=EB=B9=A1=EC=9D=B4=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20=ED=95=B4?=
 =?UTF-8?q?=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx                 |  5 ++---
 src/app/main/user/[handle]/[answer]/answer.tsx | 13 +++++++++----
 src/app/main/user/[handle]/[answer]/page.tsx   |  4 ++--
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index b31aa9a..011d58c 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -41,12 +41,11 @@ export default function Answer({ value, idState, ref }: askProps) {
 
   useEffect(() => {
     fetchProfile(value).then((r) => setUserInfo(r));
-    setShowNsfw(!value.nsfwedAnswer);
   }, [value]);
 
   return (
     <div className="w-full glass rounded-box px-2 desktop:px-8 py-4 mb-2 shadow">
-      {!showNsfw && (
+      {!showNsfw && value.nsfwedAnswer && (
         <div className="fixed top-0 left-0 z-10 gap-2 w-full h-full flex flex-col justify-center items-center">
           <span>답변자가 NSFW로 체크한 질문이에요!</span>
           <button className="btn" onClick={() => setShowNsfw(!showNsfw)}>
@@ -55,7 +54,7 @@ export default function Answer({ value, idState, ref }: askProps) {
         </div>
       )}
 
-      <div className={`${!showNsfw && 'blur'} w-full h-full`}>
+      <div className={`${!showNsfw && value.nsfwedAnswer && 'blur'} w-full h-full`}>
         <div className="chat chat-start flex ml-2 desktop:ml-0 justify-between">
           <div className="w-full">
             <div className="chat-header dark:text-white">
diff --git a/src/app/main/user/[handle]/[answer]/answer.tsx b/src/app/main/user/[handle]/[answer]/answer.tsx
index 453c8f7..70bb07b 100644
--- a/src/app/main/user/[handle]/[answer]/answer.tsx
+++ b/src/app/main/user/[handle]/[answer]/answer.tsx
@@ -2,12 +2,13 @@
 
 import Answer from '@/app/_components/answer';
 import { useParams } from 'next/navigation';
-import { useRef } from 'react';
-import { AnswerDto } from '@/app/_dto/answers/Answers.dto';
+import { useEffect, useRef, useState } from 'react';
+import { AnswerWithProfileDto } from '@/app/_dto/answers/Answers.dto';
 import DialogModalTwoButton from '@/app/_components/modalTwoButton';
 import { onApiError } from '@/utils/api-error/onApiError';
 
-export default function SingleAnswer({ answerBody }: { answerBody: AnswerDto }) {
+export default function SingleAnswer({ answerBody }: { answerBody: AnswerWithProfileDto }) {
+  const [answerBodyState, setAnswerBodyState] = useState<AnswerWithProfileDto | undefined>();
   const singleQuestionDeleteModalRef = useRef<HTMLDialogElement>(null);
   const { userHandle } = useParams() as { userHandle: string };
 
@@ -22,9 +23,13 @@ export default function SingleAnswer({ answerBody }: { answerBody: AnswerDto })
     }
   };
 
+  useEffect(() => {
+    setAnswerBodyState(answerBody);
+  }, [answerBody]);
+
   return (
     <div className="flex w-[90%] window:w-[80%] desktop:w-[70%]">
-      {answerBody !== undefined ? (
+      {answerBodyState ? (
         <>
           <Answer value={answerBody} id={answerBody.id} ref={singleQuestionDeleteModalRef} />
           <DialogModalTwoButton
diff --git a/src/app/main/user/[handle]/[answer]/page.tsx b/src/app/main/user/[handle]/[answer]/page.tsx
index 1abbab0..53cd246 100644
--- a/src/app/main/user/[handle]/[answer]/page.tsx
+++ b/src/app/main/user/[handle]/[answer]/page.tsx
@@ -28,13 +28,13 @@ export async function generateMetadata({
   };
 }
 
-async function fetchAnswer(userHandle: string, id: string) {
+async function fetchAnswer(userHandle: string, id: string): Promise<AnswerWithProfileDto | undefined> {
   const url = process.env.WEB_URL;
   const res = await fetch(`${url}/api/db/answers/${userHandle}/${id}`, {
     method: 'GET',
   });
   if (res.status === 404) {
-    return null;
+    return undefined;
   } else if (!res.ok) {
     throw new Error(`Fail to fetch answer! ${await res.text()}`);
   }

From 2958e74923c5fcd525e28cf1b4ff1eb043d0cabd Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Fri, 3 Jan 2025 02:22:17 +0900
Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=9A=91=20=EB=A9=94=ED=83=80=EB=8D=B0?=
 =?UTF-8?q?=EC=9D=B4=ED=84=B0=EC=97=90=20Q=EC=99=80=20A=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/user/[handle]/[answer]/page.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/main/user/[handle]/[answer]/page.tsx b/src/app/main/user/[handle]/[answer]/page.tsx
index 53cd246..0f4791a 100644
--- a/src/app/main/user/[handle]/[answer]/page.tsx
+++ b/src/app/main/user/[handle]/[answer]/page.tsx
@@ -21,8 +21,8 @@ export async function generateMetadata({
   return {
     title: answerBody.question,
     openGraph: {
-      title: answerBody.question,
-      description: answerBody.answer,
+      title: `Q. ${answerBody.question}`,
+      description: `A. ${answerBody.answer}`,
       images: answerBody.answeredPerson?.avatarUrl,
     },
   };