From 1ac4f397278c7857cb0c7d937ef348c7c9510d14 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sat, 16 Nov 2024 14:41:09 +0900
Subject: [PATCH 01/89] =?UTF-8?q?=F0=9F=92=84=20=EC=84=A4=EC=A0=95=20UI=20?=
 =?UTF-8?q?=EA=B0=9C=ED=8E=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/settings/page.tsx | 123 ++++++++++++---------------------
 1 file changed, 46 insertions(+), 77 deletions(-)

diff --git a/src/app/main/settings/page.tsx b/src/app/main/settings/page.tsx
index 3903342..22b85c1 100644
--- a/src/app/main/settings/page.tsx
+++ b/src/app/main/settings/page.tsx
@@ -62,86 +62,55 @@ export default function Settings() {
         </div>
       </div>
       <div className="flex flex-col items-center">
-        <span className="text-3xl mb-4">우리만의 비밀설정창</span>
+        <div className="text-3xl flex justify-center m-4 pb-4 border-b w-full window:w-[90%] desktop:w-full">
+          <span>우리만의 비밀설정창</span>
+        </div>
         <div className="w-full window:w-[70%] desktop:w-full">
           {userInfo ? (
             <form onSubmit={handleSubmit(onSubmit)}>
-              <table className="table-fixed border-separate border-spacing-4">
-                <tbody>
-                  <tr>
-                    <td className="font-thin desktop:text-xl">
-                      익명 질문을 받지 않기
-                    </td>
-                    <td>
-                      <input
-                        {...register("stopAnonQuestion")}
-                        type="checkbox"
-                        className="toggle toggle-success"
-                        defaultChecked={userInfo.stopAnonQuestion}
-                      />
-                    </td>
-                  </tr>
-                  <tr>
-                    <td className="font-thin desktop:text-xl">
-                      더 이상 질문을 받지 않기
-                    </td>
-                    <td>
-                      <input
-                        {...register("stopAnonQuestion")}
-                        type="checkbox"
-                        className="toggle toggle-success"
-                        defaultChecked={userInfo.stopNewQuestion}
-                      />
-                    </td>
-                  </tr>
-                  <tr>
-                    <td className="font-thin desktop:text-xl">
-                      새 질문 DM으로 받지 않기
-                    </td>
-                    <td>
-                      <input
-                        {...register("stopNewQuestion")}
-                        type="checkbox"
-                        className="toggle toggle-success"
-                        defaultChecked={userInfo.stopNotiNewQuestion}
-                      />
-                    </td>
-                  </tr>
-                  <tr>
-                    <td className="font-thin desktop:text-xl">
-                      내 답변을 올리지 않기
-                    </td>
-                    <td>
-                      <input
-                        {...register("stopNotiNewQuestion")}
-                        type="checkbox"
-                        className="toggle toggle-success"
-                        defaultChecked={userInfo.stopPostAnswer}
-                      />
-                    </td>
-                  </tr>
-                  <tr>
-                    <td className="font-thin desktop:text-xl">
-                      질문함 이름 (10글자 이내)
-                    </td>
-                    <td>
-                      <input
-                        {...register("questionBoxName", {
-                          maxLength: 10,
-                        })}
-                        type="text"
-                        placeholder={userInfo?.questionBoxName}
-                        className={`input input-bordered input-sm max-w-44 min-w-full mr-2 ${
-                          errors.questionBoxName?.type === "maxLength" &&
-                          "input-error"
-                        }`}
-                      />
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
-
-              <div className="mr-2 flex desktop:justify-end">
+              <div className="grid grid-cols-2 gap-2">
+                <span className="font-thin">익명 질문을 받지 않기</span>
+                <input
+                  {...register("stopAnonQuestion")}
+                  type="checkbox"
+                  className="toggle toggle-success"
+                  defaultChecked={userInfo.stopAnonQuestion}
+                />
+                <span className="font-thin">더 이상 질문을 받지 않기</span>
+                <input
+                  {...register("stopAnonQuestion")}
+                  type="checkbox"
+                  className="toggle toggle-success"
+                  defaultChecked={userInfo.stopNewQuestion}
+                />
+                <span className="font-thin">새 질문 DM으로 받지 않기</span>
+                <input
+                  {...register("stopNewQuestion")}
+                  type="checkbox"
+                  className="toggle toggle-success"
+                  defaultChecked={userInfo.stopNotiNewQuestion}
+                />
+                <span className="font-thin">내 답변을 올리지 않기</span>
+                <input
+                  {...register("stopNotiNewQuestion")}
+                  type="checkbox"
+                  className="toggle toggle-success"
+                  defaultChecked={userInfo.stopPostAnswer}
+                />
+                <span className="font-thin">질문함 이름 (10글자 이내)</span>
+                <input
+                  {...register("questionBoxName", {
+                    maxLength: 10,
+                  })}
+                  type="text"
+                  placeholder={userInfo?.questionBoxName}
+                  className={`input input-bordered input-sm max-w-full min-w-40 ${
+                    errors.questionBoxName?.type === "maxLength" &&
+                    "input-error"
+                  }`}
+                />
+              </div>
+              <div className="flex justify-end mt-2">
                 <button
                   type="submit"
                   className={`btn ${

From 94411c9da2d615bad6396fff8856a02dbd41ab25 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sat, 16 Nov 2024 14:47:51 +0900
Subject: [PATCH 02/89] =?UTF-8?q?=F0=9F=90=9B=20=EC=84=A4=EC=A0=95=20?=
 =?UTF-8?q?=EC=97=85=EB=8D=B0=EC=9D=B4=ED=8A=B8=20=EC=95=88=EB=90=98?=
 =?UTF-8?q?=EB=8A=94=20=EB=B2=84=EA=B7=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/settings/page.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/app/main/settings/page.tsx b/src/app/main/settings/page.tsx
index 22b85c1..9e9a6b9 100644
--- a/src/app/main/settings/page.tsx
+++ b/src/app/main/settings/page.tsx
@@ -78,21 +78,21 @@ export default function Settings() {
                 />
                 <span className="font-thin">더 이상 질문을 받지 않기</span>
                 <input
-                  {...register("stopAnonQuestion")}
+                  {...register("stopNewQuestion")}
                   type="checkbox"
                   className="toggle toggle-success"
                   defaultChecked={userInfo.stopNewQuestion}
                 />
                 <span className="font-thin">새 질문 DM으로 받지 않기</span>
                 <input
-                  {...register("stopNewQuestion")}
+                  {...register("stopNotiNewQuestion")}
                   type="checkbox"
                   className="toggle toggle-success"
                   defaultChecked={userInfo.stopNotiNewQuestion}
                 />
                 <span className="font-thin">내 답변을 올리지 않기</span>
                 <input
-                  {...register("stopNotiNewQuestion")}
+                  {...register("stopPostAnswer")}
                   type="checkbox"
                   className="toggle toggle-success"
                   defaultChecked={userInfo.stopPostAnswer}

From 7ab094ebf0d8433b7dc73ce880984e15c9b24ed0 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sat, 16 Nov 2024 17:16:36 +0900
Subject: [PATCH 03/89] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20JWT=20=EA=B2=80?=
 =?UTF-8?q?=EC=A6=9D=20=ED=95=A8=EC=88=98=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/functions/web/verify-jwt.ts | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/app/api/functions/web/verify-jwt.ts b/src/app/api/functions/web/verify-jwt.ts
index d5dcf3b..26dafd2 100644
--- a/src/app/api/functions/web/verify-jwt.ts
+++ b/src/app/api/functions/web/verify-jwt.ts
@@ -13,10 +13,13 @@ type jwtPayload = {
  * @returns JWT payload
  * @throws JWT validation error
  */
-export async function verifyToken(token: string) {
+export async function verifyToken(token: string | null | undefined) {
   const secret = new TextEncoder().encode(process.env.JWT_SECRET);
 
   try {
+    if (typeof token !== "string") {
+      throw new Error("token is not string");
+    }
     const { payload } = await jwtVerify(token, secret);
     const data: jwtPayload = {
       handle: "",

From 2ceaf08bd6e1cb78b4d17e597e35430d5b344638 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sat, 16 Nov 2024 17:17:37 +0900
Subject: [PATCH 04/89] =?UTF-8?q?=F0=9F=94=92=EF=B8=8F=20=EC=A7=88?=
 =?UTF-8?q?=EB=AC=B8=20=EC=82=AD=EC=A0=9C=EC=8B=9C=20JWT=20=EA=B2=80?=
 =?UTF-8?q?=EC=A6=9D=20=EB=8B=A8=EA=B3=84=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/questions/action.ts | 85 +++++++++++++++++++-------------
 1 file changed, 52 insertions(+), 33 deletions(-)

diff --git a/src/app/main/questions/action.ts b/src/app/main/questions/action.ts
index 0771c9d..05bdc2e 100644
--- a/src/app/main/questions/action.ts
+++ b/src/app/main/questions/action.ts
@@ -1,8 +1,10 @@
 "use server";
 
 import type { typedAnswer } from "@/app";
+import { verifyToken } from "@/app/api/functions/web/verify-jwt";
 import { PrismaClient, question } from "@prisma/client";
 import { createHash } from "crypto";
+import { cookies } from "next/headers";
 
 export async function getQuestion(id: number) {
   const prisma = new PrismaClient();
@@ -18,7 +20,7 @@ export async function getQuestion(id: number) {
 
 export async function postAnswer(
   question: question | null,
-  answer: typedAnswer,
+  answer: typedAnswer
 ) {
   const prisma = new PrismaClient();
 
@@ -62,37 +64,45 @@ export async function postAnswer(
       const baseUrl = process.env.WEB_URL;
       const answerUrl = `${baseUrl}/main/user/${answer.answeredPersonHandle}/${postWithAnswer.id}`;
 
-    if (answeredUser && server) {
-      const i = createHash("sha256")
-        .update(answeredUser.token + server.appSecret, "utf-8")
-        .digest("hex");
-      const host = answeredUser.hostName;
-      if (answer.nsfwedAnswer === true && answer.questioner === null) {
-        const title =  `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
-        const text =  `Q: ${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`
-        await mkMisskeyNode(i, title, text, host);
-      } else if (answer.nsfwedAnswer === false && answer.questioner !== null) {
-        const title = `Q: ${question.question} #neo-quesdon`;
-        const text = `질문자:${answer.questioner}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-        await mkMisskeyNode(i, title, text, host);
-      } else if (answer.nsfwedAnswer === true && answer.questioner !== null) {
-        const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
-        const text = `질문자:${answer.questioner}\nQ:${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-        await mkMisskeyNode(i, title, text, host);
+      if (answeredUser && server) {
+        const i = createHash("sha256")
+          .update(answeredUser.token + server.appSecret, "utf-8")
+          .digest("hex");
+        const host = answeredUser.hostName;
+        if (answer.nsfwedAnswer === true && answer.questioner === null) {
+          const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
+          const text = `Q: ${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
+          await mkMisskeyNode(i, title, text, host);
+        } else if (
+          answer.nsfwedAnswer === false &&
+          answer.questioner !== null
+        ) {
+          const title = `Q: ${question.question} #neo-quesdon`;
+          const text = `질문자:${answer.questioner}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
+          await mkMisskeyNode(i, title, text, host);
+        } else if (answer.nsfwedAnswer === true && answer.questioner !== null) {
+          const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
+          const text = `질문자:${answer.questioner}\nQ:${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
+          await mkMisskeyNode(i, title, text, host);
+        } else {
+          const title = `Q: ${question.question} #neo-quesdon`;
+          const text = `A: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
+          await mkMisskeyNode(i, title, text, host);
+        }
       } else {
-        const title = `Q: ${question.question} #neo-quesdon`;
-        const text = `A: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-        await mkMisskeyNode(i, title, text, host);
+        console.log("user not found");
       }
-    } else {
-      console.log("user not found");
-    }
-      console.log('Created new answer:', answerUrl);
+      console.log("Created new answer:", answerUrl);
     }
   }
 }
 
-async function mkMisskeyNode(i: string, title: string, text: string, hostname: string) {
+async function mkMisskeyNode(
+  i: string,
+  title: string,
+  text: string,
+  hostname: string
+) {
   const res = await fetch(`https://${hostname}/api/notes/create`, {
     method: "POST",
     headers: {
@@ -105,15 +115,24 @@ async function mkMisskeyNode(i: string, title: string, text: string, hostname: s
     }),
   });
   if (!res.ok) {
-    console.warn(`Note create fail! `, res.status, res.statusText)
+    console.warn(`Note create fail! `, res.status, res.statusText);
   }
 }
 export async function deleteQuestion(id: number) {
-  const prisma = new PrismaClient();
+  const cookieStore = await cookies();
+  const jwtToken = cookieStore.get("jwtToken")?.value;
 
-  const deleteQuestion = await prisma.question.delete({
-    where: {
-      id: id,
-    },
-  });
+  try {
+    await verifyToken(jwtToken);
+
+    const prisma = new PrismaClient();
+
+    const deleteQuestion = await prisma.question.delete({
+      where: {
+        id: id,
+      },
+    });
+  } catch (err) {
+    throw new Error(`JWT Token Verification Error: ${err}`);
+  }
 }

From b67e4a86177687ec02e1803d4dad70db5b7ed4f3 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sat, 16 Nov 2024 17:19:20 +0900
Subject: [PATCH 05/89] =?UTF-8?q?=E2=9A=A1=EF=B8=8F=20=EB=8B=B5=EA=B8=80?=
 =?UTF-8?q?=20=EA=B2=8C=EC=8B=9C,=20=EC=A7=88=EB=AC=B8=20=EC=82=AD?=
 =?UTF-8?q?=EC=A0=9C=20=EC=86=8D=EB=8F=84=20=ED=96=A5=EC=83=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

🐛 질문 삭제시 다른게 지워질 수 있는 버그 수정
---
 src/app/_components/question.tsx | 33 +++++++++++++++++++++---------
 src/app/main/questions/page.tsx  | 35 ++++++++++++++++++--------------
 2 files changed, 43 insertions(+), 25 deletions(-)

diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index c80cfce..45c24f4 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -8,10 +8,18 @@ interface formValue {
 }
 
 interface askProps {
-  value: questions;
+  singleQuestion: questions;
+  multipleQuestions: questions[];
+  setState: React.Dispatch<React.SetStateAction<questions[]>>;
+  id: number;
 }
 
-export default function Question({ value }: askProps) {
+export default function Question({
+  singleQuestion,
+  multipleQuestions,
+  setState,
+  id,
+}: askProps) {
   const {
     register,
     handleSubmit,
@@ -42,7 +50,7 @@ export default function Question({ value }: askProps) {
   const nsfwedAnswer = watch("nsfw");
 
   const onSubmit: SubmitHandler<formValue> = async (e) => {
-    const question = await getQuestion(value.id);
+    const question = await getQuestion(singleQuestion.id);
     const typedAnswer = {
       question: question!.question,
       questioner: question!.questioner,
@@ -50,27 +58,32 @@ export default function Question({ value }: askProps) {
       answeredPersonHandle: question!.questioneeHandle,
       nsfwedAnswer: e.nsfw,
     };
+    const filteredQuestions = multipleQuestions.filter(
+      (el) => el.id !== singleQuestion.id
+    );
 
-    postAnswer(question, typedAnswer).then(() => {
-      document.getElementById("my_modal_1")?.click();
-    });
+    setState(filteredQuestions);
+    postAnswer(question, typedAnswer);
+    document.getElementById("my_modal_1")?.click();
   };
 
   return (
     <div className="rounded-box p-2 desktop:p-4 mb-2 glass shadow">
       <div className="text-2xl chat chat-start">
         <div className="chat-header">
-          {value.questioner ? value.questioner : "익명의 질문자"}
+          {singleQuestion.questioner
+            ? singleQuestion.questioner
+            : "익명의 질문자"}
         </div>
         <div className="chat-bubble flex items-center text-sm window:text-xl desktop:text-2xl">
-          {value.question}
+          {singleQuestion.question}
         </div>
         <div className="chat-footer opacity-50">
-          {value.questionedAt.toLocaleString()}
+          {singleQuestion.questionedAt.toLocaleString()}
           <span
             className="text-red-500 font-bold ml-2 cursor-pointer"
             onClick={() =>
-              document.getElementById("question_delete_modal")?.click()
+              document.getElementById(`question_delete_modal_${id}`)?.click()
             }
           >
             삭제
diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index 7fccb5c..d7f761d 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -12,7 +12,7 @@ const fetchQuestions = async () => {
 };
 
 export default function Questions() {
-  const [questions, setQuestions] = useState<questions[]>();
+  const [questions, setQuestions] = useState<questions[]>([]);
 
   useEffect(() => {
     fetchQuestions().then((r) => setQuestions(r));
@@ -30,10 +30,15 @@ export default function Questions() {
             <div>
               {questions.map((el) => (
                 <div key={el.id}>
-                  <Question value={el} />
+                  <Question
+                    singleQuestion={el}
+                    multipleQuestions={questions}
+                    setState={setQuestions}
+                    id={el.id}
+                  />
                   <input
                     type="checkbox"
-                    id="question_delete_modal"
+                    id={`question_delete_modal_${el.id}`}
                     className="modal-toggle"
                   />
                   <div className="modal" role="dialog">
@@ -41,17 +46,23 @@ export default function Questions() {
                       <h3 className="py-4 text-2xl">질문을 지울까요...?</h3>
                       <div className="modal-action">
                         <label
-                          htmlFor="question_delete_modal"
+                          htmlFor={`question_delete_modal_${el.id}`}
                           className="btn btn-error"
                           onClick={() => {
-                            deleteQuestion(el.id).then(() =>
-                              fetchQuestions().then((r) => setQuestions(r))
-                            );
+                            deleteQuestion(el.id);
+                            setQuestions((prevQuestions) => [
+                              ...prevQuestions.filter(
+                                (prev) => prev.id !== el.id
+                              ),
+                            ]);
                           }}
                         >
                           확인
                         </label>
-                        <label htmlFor="question_delete_modal" className="btn">
+                        <label
+                          htmlFor={`question_delete_modal_${el.id}`}
+                          className="btn"
+                        >
                           취소
                         </label>
                       </div>
@@ -72,13 +83,7 @@ export default function Questions() {
         <div className="modal-box">
           <h3 className="py-4 text-2xl">답변했어요!</h3>
           <div className="modal-action">
-            <label
-              htmlFor="my_modal_1"
-              className="btn"
-              onClick={() => {
-                fetchQuestions().then((r) => setQuestions(r));
-              }}
-            >
+            <label htmlFor="my_modal_1" className="btn">
               닫기
             </label>
           </div>

From 17068d9ba1abe71bc95f498d7d3233456d35123c Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 16 Nov 2024 18:40:08 +0900
Subject: [PATCH 06/89] =?UTF-8?q?API=20DTO=EA=B2=80=EC=A6=9D=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80,=20=EC=97=90=EB=9F=AC=EC=9D=91=EB=8B=B5=20=EB=8F=84?=
 =?UTF-8?q?=EA=B5=AC=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 next.config.ts                                |  6 ++-
 package-lock.json                             | 41 +++++++++++++++++++
 package.json                                  |  3 ++
 .../create_question/create-question.dto.ts    | 10 ++++-
 src/app/api/db/create-question/route.ts       | 32 ++++++++++-----
 src/utils/apiErrorResponse/sendApiError.ts    |  5 +++
 src/utils/validator/strictValidator.ts        | 17 ++++++++
 tsconfig.json                                 |  3 ++
 8 files changed, 104 insertions(+), 13 deletions(-)
 create mode 100644 src/utils/apiErrorResponse/sendApiError.ts
 create mode 100644 src/utils/validator/strictValidator.ts

diff --git a/next.config.ts b/next.config.ts
index 7410cae..7932926 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -1,8 +1,12 @@
 import type { NextConfig } from "next";
+import "reflect-metadata";
 
 const nextConfig: NextConfig = {
   output: "standalone",
-  reactStrictMode: false,
+  reactStrictMode: true,
+  experimental: {
+    forceSwcTransforms: true,
+  }
 };
 
 export default nextConfig;
diff --git a/package-lock.json b/package-lock.json
index 8b813de..e66029e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,6 +9,8 @@
       "version": "0.1.0",
       "dependencies": {
         "@prisma/client": "^5.19.1",
+        "class-transformer": "^0.5.1",
+        "class-validator": "^0.14.1",
         "daisyui": "^4.12.14",
         "jose": "^5.9.6",
         "next": "15.0.3",
@@ -18,6 +20,7 @@
         "react-dom": "^18.3.1",
         "react-hook-form": "^7.53.1",
         "react-icons": "^5.3.0",
+        "reflect-metadata": "^0.2.2",
         "uuid": "^11.0.2"
       },
       "devDependencies": {
@@ -575,6 +578,11 @@
         "@types/react": "*"
       }
     },
+    "node_modules/@types/validator": {
+      "version": "13.12.2",
+      "resolved": "https://registry.npmjs.org/@types/validator/-/validator-13.12.2.tgz",
+      "integrity": "sha512-6SlHBzUW8Jhf3liqrGGXyTJSIFe4nqlJ5A5KaMZ2l/vbM3Wh3KSybots/wfWVzNLK4D1NZluDlSQIbIEPx6oyA=="
+    },
     "node_modules/@typescript-eslint/eslint-plugin": {
       "version": "8.14.0",
       "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.14.0.tgz",
@@ -1263,6 +1271,21 @@
         "node": ">= 6"
       }
     },
+    "node_modules/class-transformer": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/class-transformer/-/class-transformer-0.5.1.tgz",
+      "integrity": "sha512-SQa1Ws6hUbfC98vKGxZH3KFY0Y1lm5Zm0SY8XX9zbK7FJCyVEac3ATW0RIpwzW+oOfmHE5PMPufDG9hCfoEOMw=="
+    },
+    "node_modules/class-validator": {
+      "version": "0.14.1",
+      "resolved": "https://registry.npmjs.org/class-validator/-/class-validator-0.14.1.tgz",
+      "integrity": "sha512-2VEG9JICxIqTpoK1eMzZqaV+u/EiwEJkMGzTrZf6sU/fwsnOITVgYJ8yojSy6CaXtO9V0Cc6ZQZ8h8m4UBuLwQ==",
+      "dependencies": {
+        "@types/validator": "^13.11.8",
+        "libphonenumber-js": "^1.10.53",
+        "validator": "^13.9.0"
+      }
+    },
     "node_modules/client-only": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/client-only/-/client-only-0.0.1.tgz",
@@ -3202,6 +3225,11 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/libphonenumber-js": {
+      "version": "1.11.14",
+      "resolved": "https://registry.npmjs.org/libphonenumber-js/-/libphonenumber-js-1.11.14.tgz",
+      "integrity": "sha512-sexvAfwcW1Lqws4zFp8heAtAEXbEDnvkYCEGzvOoMgZR7JhXo/IkE9MkkGACgBed5fWqh3ShBGnJBdDnU9N8EQ=="
+    },
     "node_modules/lilconfig": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz",
@@ -4132,6 +4160,11 @@
         "node": ">=8.10.0"
       }
     },
+    "node_modules/reflect-metadata": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz",
+      "integrity": "sha512-urBwgfrvVP/eAyXx4hluJivBKzuEbSQs9rKWCrCkbSxNv8mxPcUZKeuoF3Uy4mJl3Lwprp6yy5/39VWigZ4K6Q=="
+    },
     "node_modules/reflect.getprototypeof": {
       "version": "1.0.6",
       "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.6.tgz",
@@ -5065,6 +5098,14 @@
         "uuid": "dist/esm/bin/uuid"
       }
     },
+    "node_modules/validator": {
+      "version": "13.12.0",
+      "resolved": "https://registry.npmjs.org/validator/-/validator-13.12.0.tgz",
+      "integrity": "sha512-c1Q0mCiPlgdTVVVIJIrBuxNicYE+t/7oKeI9MWLj3fh/uq2Pxh/3eeWbVZ4OcGW1TUf53At0njHw5SMdA3tmMg==",
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
     "node_modules/which": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
diff --git a/package.json b/package.json
index 836c0bd..e8f7de6 100644
--- a/package.json
+++ b/package.json
@@ -13,6 +13,8 @@
   },
   "dependencies": {
     "@prisma/client": "^5.19.1",
+    "class-transformer": "^0.5.1",
+    "class-validator": "^0.14.1",
     "daisyui": "^4.12.14",
     "jose": "^5.9.6",
     "next": "15.0.3",
@@ -22,6 +24,7 @@
     "react-dom": "^18.3.1",
     "react-hook-form": "^7.53.1",
     "react-icons": "^5.3.0",
+    "reflect-metadata": "^0.2.2",
     "uuid": "^11.0.2"
   },
   "devDependencies": {
diff --git a/src/app/_dto/create_question/create-question.dto.ts b/src/app/_dto/create_question/create-question.dto.ts
index 9a71819..67de6fd 100644
--- a/src/app/_dto/create_question/create-question.dto.ts
+++ b/src/app/_dto/create_question/create-question.dto.ts
@@ -1,5 +1,13 @@
-export interface CreateQuestionDto {
+import { IsString, ValidateIf } from "class-validator";
+
+export class CreateQuestionDto {
+  @IsString()
   question: string;
+
+  @ValidateIf((o,v) => v)
+  @IsString()
   questioner: string | null;
+
+  @IsString()
   questionee: string;
 }
diff --git a/src/app/api/db/create-question/route.ts b/src/app/api/db/create-question/route.ts
index c1e0d94..472024f 100644
--- a/src/app/api/db/create-question/route.ts
+++ b/src/app/api/db/create-question/route.ts
@@ -3,15 +3,25 @@ import { PrismaClient } from "@prisma/client";
 import type { user } from "@prisma/client";
 import { type NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
+import { validateStrict } from "@/utils/validator/strictValidator";
+import { ApiError } from "next/dist/server/api-utils";
+import { sendErrorResponse } from "../../functions/web/errorResponse";
 
 export async function POST(req: NextRequest) {
   const prisma = new PrismaClient();
 
   try {
-    const body: CreateQuestionDto = await req.json();
+    const body = await req.json();
+    let data;
+    try {
+      data = await validateStrict(CreateQuestionDto, body);
+    } catch (errors) {
+      return sendErrorResponse(400, `${errors}`);
+    }
+
     const questionee_user = await prisma.user.findUniqueOrThrow({
       where: {
-        handle: body.questionee,
+        handle: data.questionee,
       },
     });
     const questionee_profile = await prisma.profile.findUniqueOrThrow({
@@ -20,41 +30,41 @@ export async function POST(req: NextRequest) {
       }
     })
 
-    if (questionee_profile.stopAnonQuestion && !body.questioner) {
+    if (questionee_profile.stopAnonQuestion && !data.questioner) {
       throw new Error('The user has prohibits anonymous questions.');
     } else if (questionee_profile.stopNewQuestion) {
       throw new Error('User stops stopNewQuestion');
     }
 
     // 제시된 questioner 핸들이 JWT토큰의 핸들과 일치하는지 검사
-    if (body.questioner) {
+    if (data.questioner) {
       const token = req.cookies.get('jwtToken')?.value;
       try {
         if (typeof token !== 'string') {
-          throw new Error(`Token Error`);
+          throw new Error(`Token is not string!`);
         }
         const tokenPayload = await verifyToken(token);
-        if (tokenPayload.handle.toLowerCase() !== body.questioner.toLowerCase()) {
+        if (tokenPayload.handle.toLowerCase() !== data.questioner.toLowerCase()) {
           throw new Error(`Token and questioner not match`);
         }
       } catch (err) {
         console.log(`questioner verify ERROR! ${err}`);
-        throw(err);
+        return sendErrorResponse(403, `${err}`);
       }
     }
 
     //질문 생성
     const newQuestion = await prisma.question.create({
       data: {
-        question: body.question,
-        questioner: body.questioner,
-        questioneeHandle: body.questionee,
+        question: data.question,
+        questioner: data.questioner,
+        questioneeHandle: data.questionee,
       },
     });
   
     const userSettings = await prisma.profile.findUnique({
       where: {
-        handle: body.questionee,
+        handle: data.questionee,
       },
     });
 
diff --git a/src/utils/apiErrorResponse/sendApiError.ts b/src/utils/apiErrorResponse/sendApiError.ts
new file mode 100644
index 0000000..d6251ff
--- /dev/null
+++ b/src/utils/apiErrorResponse/sendApiError.ts
@@ -0,0 +1,5 @@
+import { NextResponse } from "next/server";
+
+export function sendApiError(code: number, message: string | string[]) {
+  return NextResponse.json({ code: code, message: message }, { status: code });
+}
diff --git a/src/utils/validator/strictValidator.ts b/src/utils/validator/strictValidator.ts
new file mode 100644
index 0000000..361e7aa
--- /dev/null
+++ b/src/utils/validator/strictValidator.ts
@@ -0,0 +1,17 @@
+import { ClassConstructor, plainToInstance } from "class-transformer";
+import { validate } from "class-validator";
+import { ApiError } from "next/dist/server/api-utils";
+
+export async function validateStrict<T extends object>(cls: ClassConstructor<T>, data: unknown): Promise<T> {
+    if (typeof data !== 'object') {
+        console.error('data is not object!');
+        throw new Error(`data is not object!`);
+    }
+    const instance = plainToInstance(cls, data);
+    const errors = await validate(instance, {});
+    if (errors.length > 0) {
+        console.error(errors);
+        throw errors;
+    }
+    return instance;
+}
\ No newline at end of file
diff --git a/tsconfig.json b/tsconfig.json
index 9bb32ec..331fe12 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -10,6 +10,9 @@
     "skipLibCheck": true,
     "strict": true,
     "noEmit": true,
+    "strictPropertyInitialization": false,
+    "experimentalDecorators": true,
+    "emitDecoratorMetadata": true,
     "esModuleInterop": true,
     "module": "esnext",
     "moduleResolution": "bundler",

From b11eccfd73768b9986339c792a21dee6c92e0b12 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sat, 16 Nov 2024 23:48:44 +0900
Subject: [PATCH 07/89] =?UTF-8?q?=F0=9F=92=84=20=EB=8B=B5=EB=B3=80?=
 =?UTF-8?q?=EC=9E=90=20=ED=95=B8=EB=93=A4=20=EC=83=89=EA=B9=94=20=EB=B3=80?=
 =?UTF-8?q?=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 395a688..dab90fc 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -56,7 +56,7 @@ export default function Answer({ value }: askProps) {
               </Link>
             </div>
           </div>
-          <div className="chat-header text-blue-500">
+          <div className="chat-header">
             <Link href={`/main/user/${value.answeredPersonHandle}`}>
               <NameComponents
                 username={userInfo?.name}

From d3ec187e7eb896f9d42445445dda769dc4b40e4a Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sat, 16 Nov 2024 23:49:54 +0900
Subject: [PATCH 08/89] =?UTF-8?q?=F0=9F=92=84=20=EC=A7=88=EB=AC=B8?=
 =?UTF-8?q?=ED=95=A8=20=ED=8E=98=EC=9D=B4=EC=A7=80=20=EA=B3=B5=EC=9C=A0=20?=
 =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

✨ 질문함 페이지 공유 기능 추가
---
 src/app/main/user/[handle]/page.tsx | 169 +++++++++++++++-------------
 1 file changed, 91 insertions(+), 78 deletions(-)

diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 0c65c53..8bf2134 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -91,6 +91,12 @@ export default function UserPage() {
     return res;
   };
 
+  const shareUrl = () => {
+    const server = localStorage.getItem("server");
+    const text = `저의 ${userInfo?.questionBoxName}이에요! #neo-quesdon ${location.origin}/main/user/${userInfo?.handle}`;
+    return `https://${server}/share?text=${encodeURIComponent(text)}`;
+  };
+
   const onSubmit: SubmitHandler<FormValue> = async (e) => {
     const user_handle = localStorage.getItem("user_handle");
 
@@ -195,92 +201,99 @@ export default function UserPage() {
         </div>
       ) : (
         <div className="w-full flex flex-col desktop:flex-row">
-          <div className="w-full desktop:w-[50%] h-fit desktop:sticky z-0 top-2 py-4 glass rounded-box flex flex-col items-center shadow mb-2">
-            <div className="flex flex-col items-center gap-2 py-2">
-              {userInfo && userInfo.avatarUrl ? (
-                <div className="flex w-full justify-center">
-                  <img
-                    src={userInfo.avatarUrl}
-                    alt="User Avatar"
-                    className="w-24 h-24 object-cover rounded-full"
-                  />
-                  {userInfo.stopAnonQuestion && (
-                    <div className="chat chat-start absolute left-[21rem] w-full">
-                      <div className="chat-bubble bg-base-100 text-slate-700">
-                        작성자 공개 질문만 받아요!
+          <div className="w-full h-fit desktop:sticky top-2 desktop:w-[50%] flex flex-col">
+            <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
+              <div className="flex flex-col items-center gap-2 py-2">
+                {userInfo && userInfo.avatarUrl ? (
+                  <div className="flex w-full justify-center">
+                    <img
+                      src={userInfo.avatarUrl}
+                      alt="User Avatar"
+                      className="w-24 h-24 object-cover rounded-full"
+                    />
+                    {userInfo.stopAnonQuestion && (
+                      <div className="chat chat-start absolute left-[21rem] w-full">
+                        <div className="chat-bubble bg-base-100 text-slate-700">
+                          작성자 공개 질문만 받아요!
+                        </div>
                       </div>
+                    )}
+                  </div>
+                ) : (
+                  <div className="skeleton h-24 w-24 rounded-full" />
+                )}
+                <div className="flex items-center text-xl">
+                  {userInfo?.stopNewQuestion ? (
+                    <div className="flex flex-col items-center desktop:flex-row">
+                      <NameComponents
+                        username={userInfo?.name}
+                        width={32}
+                        height={32}
+                      />
+                      <span>님은 지금 질문을 받지 않고 있어요...</span>
+                    </div>
+                  ) : (
+                    <div className="flex flex-col items-center desktop:flex-row window:flex-row window:text-2xl">
+                      <NameComponents
+                        username={userInfo?.name}
+                        width={32}
+                        height={32}
+                      />
+                      <span>님의 {userInfo?.questionBoxName}이에요!</span>
                     </div>
                   )}
                 </div>
-              ) : (
-                <div className="skeleton h-24 w-24 rounded-full" />
-              )}
-              <div className="flex items-center text-xl">
-                {userInfo?.stopNewQuestion ? (
-                  <div className="flex flex-col items-center desktop:flex-row">
-                    <NameComponents
-                      username={userInfo?.name}
-                      width={32}
-                      height={32}
+              </div>
+              <form
+                className="w-full flex flex-col items-center"
+                onSubmit={handleSubmit(onSubmit)}
+              >
+                <textarea
+                  {...register("question", {
+                    required: "required",
+                  })}
+                  placeholder="질문 내용을 입력해 주세요"
+                  className={`w-[90%] my-2 font-thin textarea ${
+                    errors.question ? "textarea-error" : "textarea-bordered"
+                  }`}
+                  onKeyDown={onCtrlEnter}
+                  disabled={userInfo?.stopNewQuestion === true ? true : false}
+                />
+                {errors.questioner &&
+                  errors.questioner.type === "stopAnonQuestion" && (
+                    <div
+                      className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
+                      data-tip={errors.questioner.message}
                     />
-                    <span>님은 지금 질문을 받지 않고 있어요...</span>
-                  </div>
-                ) : (
-                  <div className="flex flex-col items-center desktop:flex-col window:flex-row window:text-2xl">
-                    <NameComponents
-                      username={userInfo?.name}
-                      width={32}
-                      height={32}
+                  )}
+                {errors.questioner &&
+                  errors.questioner.type === "notLoggedIn" && (
+                    <div
+                      className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
+                      data-tip={errors.questioner.message}
+                    />
+                  )}
+                <div className="w-[90%] flex justify-between">
+                  <div className="flex gap-2 items-center">
+                    <input
+                      type="checkbox"
+                      className="toggle toggle-accent"
+                      onClick={() => setValue("questioner", !questioner)}
                     />
-                    <span>님의 {userInfo?.questionBoxName}이에요!</span>
+                    <input type="hidden" {...register("questioner")} />
+                    <span>작성자 공개</span>
                   </div>
-                )}
-              </div>
-            </div>
-            <form
-              className="w-full flex flex-col items-center"
-              onSubmit={handleSubmit(onSubmit)}
-            >
-              <textarea
-                {...register("question", {
-                  required: "required",
-                })}
-                placeholder="질문 내용을 입력해 주세요"
-                className={`w-[90%] my-2 font-thin textarea ${
-                  errors.question ? "textarea-error" : "textarea-bordered"
-                }`}
-                onKeyDown={onCtrlEnter}
-                disabled={userInfo?.stopNewQuestion === true ? true : false}
-              />
-              {errors.questioner &&
-                errors.questioner.type === "stopAnonQuestion" && (
-                  <div
-                    className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
-                    data-tip={errors.questioner.message}
-                  />
-                )}
-              {errors.questioner &&
-                errors.questioner.type === "notLoggedIn" && (
-                  <div
-                    className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
-                    data-tip={errors.questioner.message}
-                  />
-                )}
-              <div className="w-[90%] flex justify-between">
-                <div className="flex gap-2 items-center">
-                  <input
-                    type="checkbox"
-                    className="toggle toggle-accent"
-                    onClick={() => setValue("questioner", !questioner)}
-                  />
-                  <input type="hidden" {...register("questioner")} />
-                  <span>작성자 공개</span>
+                  <button type="submit" className="btn btn-primary">
+                    질문하기
+                  </button>
                 </div>
-                <button type="submit" className="btn btn-primary">
-                  질문하기
-                </button>
-              </div>
-            </form>
+              </form>
+            </div>
+            <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
+              <a className="link" href={shareUrl()} target="_blank">
+                Misskey에 질문상자 페이지를 공유
+              </a>
+            </div>
           </div>
           <div className="desktop:ml-2 desktop:w-[50%]">
             {answers !== null ? (

From 13954f764cd22cdaad3a0486972ed71437fef25a Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sat, 16 Nov 2024 23:56:04 +0900
Subject: [PATCH 09/89] =?UTF-8?q?=F0=9F=92=84=20=EC=A7=88=EB=AC=B8,=20?=
 =?UTF-8?q?=EB=8B=B5=EB=B3=80=20=EB=A7=90=ED=92=8D=EC=84=A0=20=EC=83=89?=
 =?UTF-8?q?=EA=B9=94=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx   | 2 +-
 src/app/_components/question.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index dab90fc..9dde36d 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -65,7 +65,7 @@ export default function Answer({ value }: askProps) {
               />
             </Link>
           </div>
-          <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble bg-green-700">
+          <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble bg-green-600">
             <Link href={`/main/user/${value.answeredPersonHandle}`}>
               {value.answer}
             </Link>
diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 45c24f4..7878d1f 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -91,7 +91,7 @@ export default function Question({
         </div>
       </div>
       <div className="text-2xl chat chat-end">
-        <div className="chat-bubble bg-green-700">
+        <div className="chat-bubble bg-green-600">
           <form
             onSubmit={handleSubmit(onSubmit)}
             className="flex flex-col gap-2 py-2"

From e78f0beda1655f14088cfeb81d6cc85d0ce0092f Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sun, 17 Nov 2024 00:13:58 +0900
Subject: [PATCH 10/89] =?UTF-8?q?=EB=A6=AC=ED=8C=A9=ED=86=A0=EB=A7=81:=20A?=
 =?UTF-8?q?PI=EC=9E=85=EB=A0=A5=ED=98=95=EC=8B=9D=20=EA=B2=80=EC=82=AC=20?=
 =?UTF-8?q?=EA=B8=B0=ED=83=80=20=EC=9D=B4=EA=B2=83=EC=A0=80=EA=B2=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

-
---
 .../migration.sql                             |   2 +
 .../migration.sql                             |   2 +
 prisma/schema.prisma                          |   2 +-
 .../fetch-all-answers.dto.ts                  |  27 +++-
 .../fetch-name-with-emoji.dto.ts              |   8 +-
 .../fetch-user-answers.dto.ts                 |  20 ++-
 src/app/_dto/web/login/login.dto.ts           |  20 ++-
 src/app/api/db/create-question/route.ts       |  43 +++---
 src/app/api/db/fetch-all-answers/route.ts     |  21 ++-
 src/app/api/db/fetch-my-profile/route.ts      |  11 +-
 src/app/api/db/fetch-my-questions/route.ts    |   7 +-
 .../api/db/fetch-profile/[handle]/route.ts    |   7 +-
 src/app/api/db/fetch-user-answers/route.ts    |  23 +++-
 src/app/api/functions/web/detectInstance.ts   |   4 +-
 src/app/api/misskey-entities/user.ts          |   2 +-
 .../api/web/fetch-name-with-emoji/route.ts    |  14 +-
 src/app/api/web/login/route.ts                | 127 +++++++++++++-----
 src/app/index.d.ts                            |  23 +++-
 src/app/misskey-callback/actions.ts           |   6 +-
 src/app/misskey-callback/page.tsx             |   2 +-
 src/app/page.tsx                              |  27 +++-
 src/utils/validator/strictValidator.ts        |   3 +-
 22 files changed, 295 insertions(+), 106 deletions(-)
 create mode 100644 prisma/migrations/20241116135920_app_secret_nullable/migration.sql
 create mode 100644 prisma/migrations/20241116140748_app_secret_not_unique/migration.sql

diff --git a/prisma/migrations/20241116135920_app_secret_nullable/migration.sql b/prisma/migrations/20241116135920_app_secret_nullable/migration.sql
new file mode 100644
index 0000000..7a6843f
--- /dev/null
+++ b/prisma/migrations/20241116135920_app_secret_nullable/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "server" ALTER COLUMN "appSecret" DROP NOT NULL;
diff --git a/prisma/migrations/20241116140748_app_secret_not_unique/migration.sql b/prisma/migrations/20241116140748_app_secret_not_unique/migration.sql
new file mode 100644
index 0000000..782e961
--- /dev/null
+++ b/prisma/migrations/20241116140748_app_secret_not_unique/migration.sql
@@ -0,0 +1,2 @@
+-- DropIndex
+DROP INDEX "server_appSecret_key";
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 5417e50..c54e7be 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -60,5 +60,5 @@ model question {
 model server {
     id              Int         @default(autoincrement())   @id
     instances       String      @unique
-    appSecret       String      @unique
+    appSecret       String?
 }
\ No newline at end of file
diff --git a/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts b/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts
index db64884..8cb9ef1 100644
--- a/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts
+++ b/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts
@@ -1,6 +1,21 @@
-export interface FetchAllAnswersDto {
-    sinceId?: string;
-    untilId?: string;
-    sort?: 'ASC' | 'DESC'
-    limit?: number;
-}
\ No newline at end of file
+import { IsEnum, IsInt, IsOptional, IsString, Max, Min } from "class-validator";
+
+export class FetchAllAnswersDto {
+  @IsOptional()
+  @IsString()
+  sinceId?: string;
+
+  @IsOptional()
+  @IsString()
+  untilId?: string;
+
+  @IsOptional()
+  @IsEnum(["ASC", "DESC"])
+  sort?: "ASC" | "DESC";
+
+  @IsOptional()
+  @IsInt()
+  @Min(1)
+  @Max(100)
+  limit?: number;
+}
diff --git a/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts b/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts
index 9746c5b..6154b53 100644
--- a/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts
+++ b/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts
@@ -1,5 +1,11 @@
-export interface fetchNameWithEmojiReqDto {
+import { IsString, ValidateIf } from "class-validator";
+
+export class fetchNameWithEmojiReqDto {
+  @ValidateIf((o, v) => v !== null)
+  @IsString()
   name: string | null;
+
+  @IsString()
   misskeyBaseUrl: string;
 };
 
diff --git a/src/app/_dto/fetch-user-answers/fetch-user-answers.dto.ts b/src/app/_dto/fetch-user-answers/fetch-user-answers.dto.ts
index 132b20d..8b9f84c 100644
--- a/src/app/_dto/fetch-user-answers/fetch-user-answers.dto.ts
+++ b/src/app/_dto/fetch-user-answers/fetch-user-answers.dto.ts
@@ -1,7 +1,25 @@
-export interface FetchUserAnswersDto {
+import { IsEnum, IsIn, IsInt, IsNotEmpty, IsOptional, IsString, Max, Min } from "class-validator";
+
+export class FetchUserAnswersDto {
+    @IsOptional()
+    @IsString()
     sinceId?: string;
+
+    @IsOptional()
+    @IsString()
     untilId?: string;
+
+    @IsOptional()
+    @IsEnum(['ASC', 'DESC'])
     sort?: 'ASC' | 'DESC'
+
+    @IsOptional()
+    @IsInt()
+    @Min(1)
+    @Max(100)
     limit?: number;
+
+    @IsString()
+    @IsNotEmpty()
     answeredPersonHandle: string;
 }
\ No newline at end of file
diff --git a/src/app/_dto/web/login/login.dto.ts b/src/app/_dto/web/login/login.dto.ts
index c85d7d5..f9b8c36 100644
--- a/src/app/_dto/web/login/login.dto.ts
+++ b/src/app/_dto/web/login/login.dto.ts
@@ -1,3 +1,21 @@
-export interface loginReqDto {
+import { Transform } from "class-transformer";
+import { IsNotEmpty, IsString } from "class-validator";
+
+export class loginReqDto {
+  @Transform((param) => {
+    // https://example.com/ 같은 형식으로 온 경우 Host 형식으로 변환
+    if (typeof param.value === 'string') {
+      const v = param.value;
+      const re = /\/\/[^/@\s]+(:[0-9]{1,5})?\/?/;
+      const matched_str = v.match(re)?.[0];
+      if (matched_str) {
+        console.log(`URL ${param.value} replaced with ${matched_str.replaceAll('/', '')}`);
+        return matched_str.replaceAll('/', '');
+      }
+      return v;
+    }
+  })
+  @IsString()
+  @IsNotEmpty()
   misskeyHost: string;
 }
\ No newline at end of file
diff --git a/src/app/api/db/create-question/route.ts b/src/app/api/db/create-question/route.ts
index 472024f..c8981a4 100644
--- a/src/app/api/db/create-question/route.ts
+++ b/src/app/api/db/create-question/route.ts
@@ -4,7 +4,6 @@ import type { user } from "@prisma/client";
 import { type NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
 import { validateStrict } from "@/utils/validator/strictValidator";
-import { ApiError } from "next/dist/server/api-utils";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
 
 export async function POST(req: NextRequest) {
@@ -27,24 +26,26 @@ export async function POST(req: NextRequest) {
     const questionee_profile = await prisma.profile.findUniqueOrThrow({
       where: {
         handle: questionee_user?.handle,
-      }
-    })
+      },
+    });
 
     if (questionee_profile.stopAnonQuestion && !data.questioner) {
-      throw new Error('The user has prohibits anonymous questions.');
+      throw new Error("The user has prohibits anonymous questions.");
     } else if (questionee_profile.stopNewQuestion) {
-      throw new Error('User stops stopNewQuestion');
+      throw new Error("User stops NewQuestion");
     }
 
     // 제시된 questioner 핸들이 JWT토큰의 핸들과 일치하는지 검사
     if (data.questioner) {
-      const token = req.cookies.get('jwtToken')?.value;
+      const token = req.cookies.get("jwtToken")?.value;
       try {
-        if (typeof token !== 'string') {
+        if (typeof token !== "string") {
           throw new Error(`Token is not string!`);
         }
         const tokenPayload = await verifyToken(token);
-        if (tokenPayload.handle.toLowerCase() !== data.questioner.toLowerCase()) {
+        if (
+          tokenPayload.handle.toLowerCase() !== data.questioner.toLowerCase()
+        ) {
           throw new Error(`Token and questioner not match`);
         }
       } catch (err) {
@@ -61,7 +62,7 @@ export async function POST(req: NextRequest) {
         questioneeHandle: data.questionee,
       },
     });
-  
+
     const userSettings = await prisma.profile.findUnique({
       where: {
         handle: data.questionee,
@@ -69,24 +70,27 @@ export async function POST(req: NextRequest) {
     });
 
     if (userSettings && userSettings.stopNotiNewQuestion === true) {
-      return NextResponse.json({ status: 200 });
+      // 알림 전송 스킵
     } else {
-      //알림 전송
+      // 알림 전송
       const url = `${process.env.WEB_URL}/main/questions`;
       setImmediate(() => {
         sendNotify(questionee_user, newQuestion.question, url);
       });
     }
-    
+
     // notify send 기다라지 않고 200반환
-    return NextResponse.json({ status: 200 });
+    return NextResponse.json({}, { status: 200 });
   } catch (err) {
     return NextResponse.json(`Error! ${err}`, { status: 500 });
   }
 }
 
-
-async function sendNotify(questionee: user, question: string, url: string): Promise<void> {
+async function sendNotify(
+  questionee: user,
+  question: string,
+  url: string
+): Promise<void> {
   const notify_host = process.env.NOTI_HOST;
   console.log(`try to send notification to ${questionee.handle}`);
   try {
@@ -102,11 +106,10 @@ async function sendNotify(questionee: user, question: string, url: string): Prom
         text: `${questionee.handle} <네오-퀘스돈> 새로운 질문이에요!\nQ. ${question}\n ${url}`,
       }),
     });
-    if (res.status !== 200){
+    if (res.ok === false) {
       throw new Error(`Note create error`);
     }
+  } catch (error) {
+    console.error("Post-question: fail to send notify: ", error);
   }
-  catch (error) {
-    console.error('Post-question: fail to send notify: ', error);
-  }
-}
\ No newline at end of file
+}
diff --git a/src/app/api/db/fetch-all-answers/route.ts b/src/app/api/db/fetch-all-answers/route.ts
index 889a41b..cfc6df5 100644
--- a/src/app/api/db/fetch-all-answers/route.ts
+++ b/src/app/api/db/fetch-all-answers/route.ts
@@ -1,20 +1,27 @@
 import { FetchAllAnswersDto } from "@/app/_dto/fetch-all-answers/fetch-all-answers.dto";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { validateStrict } from "@/utils/validator/strictValidator";
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 
 export async function POST(req: NextRequest) {
-  const body: FetchAllAnswersDto = await req.json();
-  if (typeof body !== 'object') {
-    return NextResponse.error();
+  const body = await req.json();
+  let data;
+  try {
+    data = await validateStrict(FetchAllAnswersDto, body);
+  } catch (err) {
+    return sendApiError(400, `${err}`);
   }
 
-  const query_limit = body.limit ? Math.max(1, Math.min(body.limit, 100)) : 100;
+
+
+  const query_limit = data.limit ? Math.max(1, Math.min(data.limit, 100)) : 100;
   const prisma = new PrismaClient();
-  const sinceId = body.sinceId;
-  const untilId = body.untilId;
+  const sinceId = data.sinceId;
+  const untilId = data.untilId;
 
   //내림차순이 기본값
-  const orderBy = (body.sort === 'ASC') ? 'asc' : 'desc';
+  const orderBy = (data.sort === 'ASC') ? 'asc' : 'desc';
 
   const questions = await prisma.answer.findMany({
     where: {
diff --git a/src/app/api/db/fetch-my-profile/route.ts b/src/app/api/db/fetch-my-profile/route.ts
index 1f8a444..2011c38 100644
--- a/src/app/api/db/fetch-my-profile/route.ts
+++ b/src/app/api/db/fetch-my-profile/route.ts
@@ -2,6 +2,7 @@ import { userProfileDto } from "@/app/_dto/fetch-profile/Profile.dto";
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 
 export async function GET(req: NextRequest) {
   const prisma = new PrismaClient();
@@ -9,9 +10,15 @@ export async function GET(req: NextRequest) {
 
   try {
     if (!token) {
-      throw new Error("No token");
+      return sendApiError(401, 'No Auth Token');
     }
-    const { handle } = await verifyToken(token);
+    let handle: string;
+    try {
+      handle = (await verifyToken(token)).handle;
+    } catch {
+      return sendApiError(403, 'Token Verify Error');
+    }
+
     const userProfile = await prisma.profile.findUnique({
       where: {
         handle: handle,
diff --git a/src/app/api/db/fetch-my-questions/route.ts b/src/app/api/db/fetch-my-questions/route.ts
index 33e2517..7a19885 100644
--- a/src/app/api/db/fetch-my-questions/route.ts
+++ b/src/app/api/db/fetch-my-questions/route.ts
@@ -1,6 +1,7 @@
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 
 export async function GET(req: NextRequest) {
   const cookie = req.cookies.get("jwtToken");
@@ -17,12 +18,12 @@ export async function GET(req: NextRequest) {
         });
         return NextResponse.json(questions);
       } else {
-        return NextResponse.json({ status: 401, message: "Unauthorized" }, {status: 401});
+        return sendApiError(400, 'Bad Request');
       }
     } else {
-      return NextResponse.json({ status: 400, message: "Bad Request" }, {status: 400});
+      return sendApiError(401, 'Unauthorized');
     }
   } catch (err) {
-    return NextResponse.json(err, {status: 500});
+    return sendApiError(500, `${err}`);
   }
 }
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index d250350..1a7c23f 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -1,15 +1,14 @@
 import { userProfileDto } from "@/app/_dto/fetch-profile/Profile.dto";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 
-export const revalidate = 60;
-
 export async function GET(req: NextRequest, { params }: { params: Promise<{handle?: string}> }) {
   const prisma = new PrismaClient();
   const userHandle = (await params).handle;
   try {
     if (!userHandle) { 
-      throw new Error('userHandle empty');
+      return sendApiError(400, 'userHandle empty');
     }
     const profile = await prisma.profile.findUnique({
       where: {
@@ -38,6 +37,6 @@ export async function GET(req: NextRequest, { params }: { params: Promise<{handl
       }
     });
   } catch (err) {
-    return NextResponse.json({}, {status: 400});
+    return sendApiError(500, 'Error');
   }
 }
diff --git a/src/app/api/db/fetch-user-answers/route.ts b/src/app/api/db/fetch-user-answers/route.ts
index 48f67b2..698b1d5 100644
--- a/src/app/api/db/fetch-user-answers/route.ts
+++ b/src/app/api/db/fetch-user-answers/route.ts
@@ -1,24 +1,33 @@
 import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
+import { validateStrict } from "@/utils/validator/strictValidator";
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
+import { sendErrorResponse } from "../../functions/web/errorResponse";
 
 export async function POST(req: NextRequest) {
   try {
-    const body:FetchUserAnswersDto = await req.json();
+    const body = await req.json();
+    let data;
+    try {
+      data = await validateStrict(FetchUserAnswersDto, body);
+    } catch (err) {
+      return sendErrorResponse(400, `${err}`);
+    }
+
     const prisma = new PrismaClient();
-    const query_limit = body.limit ? Math.max(1, Math.min(body.limit, 100)) : 100;
-    const sinceId = body.sinceId;
-    const untilId = body.untilId;
+    const query_limit = data.limit ? Math.max(1, Math.min(data.limit, 100)) : 100;
+    const sinceId = data.sinceId;
+    const untilId = data.untilId;
   
     //내림차순이 기본값
-    const orderBy = (body.sort === 'ASC') ? 'asc' : 'desc';
+    const orderBy = (data.sort === 'ASC') ? 'asc' : 'desc';
 
-    if (!body.answeredPersonHandle) {
+    if (!data.answeredPersonHandle) {
       throw new Error(`answeredPersonHandle is null`);
     }
     const res = await prisma.answer.findMany({
       where: {
-        answeredPersonHandle: body.answeredPersonHandle,
+        answeredPersonHandle: data.answeredPersonHandle,
         id: {
           ...(typeof sinceId === 'string' ? { gt: sinceId } : {}),
           ...(typeof untilId === 'string' ? { lt: untilId } : {}),
diff --git a/src/app/api/functions/web/detectInstance.ts b/src/app/api/functions/web/detectInstance.ts
index ec1246a..8cdd7d3 100644
--- a/src/app/api/functions/web/detectInstance.ts
+++ b/src/app/api/functions/web/detectInstance.ts
@@ -12,8 +12,8 @@ type nodeinfo = {
   software: { name: string; version: string };
 };
 
-export default async function detectInstance(url: string) {
-  const parsedUrl = new URL(`https://${url}`);
+export default async function detectInstance(host: string) {
+  const parsedUrl = new URL(`https://${host}`);
   const nodeInfoMeta: nodeinfoMeta = await fetch(
     `${parsedUrl.origin}/.well-known/nodeinfo`
   ).then((r) => r.json());
diff --git a/src/app/api/misskey-entities/user.ts b/src/app/api/misskey-entities/user.ts
index f800260..7ec012b 100644
--- a/src/app/api/misskey-entities/user.ts
+++ b/src/app/api/misskey-entities/user.ts
@@ -1,4 +1,4 @@
-export type User = {
+export type MiUser = {
   id: string;
   username: string;
   name: string | null;
diff --git a/src/app/api/web/fetch-name-with-emoji/route.ts b/src/app/api/web/fetch-name-with-emoji/route.ts
index cd49323..b494f76 100644
--- a/src/app/api/web/fetch-name-with-emoji/route.ts
+++ b/src/app/api/web/fetch-name-with-emoji/route.ts
@@ -1,9 +1,19 @@
 import { fetchNameWithEmojiReqDto, fetchNameWithEmojiResDto } from "@/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto";
+import { validateStrict } from "@/utils/validator/strictValidator";
 import { NextRequest, NextResponse } from "next/server";
+import { sendErrorResponse } from "../../functions/web/errorResponse";
 
 
-export async function POST(req: NextRequest): Promise<NextResponse<fetchNameWithEmojiResDto>> {
-  const { name, misskeyBaseUrl }: fetchNameWithEmojiReqDto = await req.json();
+export async function POST(req: NextRequest): Promise<NextResponse> {
+  let data;
+  const body = await req.json();
+  try {
+    data = await validateStrict(fetchNameWithEmojiReqDto, body);
+  } catch (err) {
+    return sendErrorResponse(400, `${err}`);
+  }
+
+  const { name, misskeyBaseUrl }: fetchNameWithEmojiReqDto = data;
   const usernameIndex: number[] = [];
   const usernameEmojiAddress: string[] = [];
   if (!name) {
diff --git a/src/app/api/web/login/route.ts b/src/app/api/web/login/route.ts
index 5d0e017..a2ad7fa 100644
--- a/src/app/api/web/login/route.ts
+++ b/src/app/api/web/login/route.ts
@@ -1,19 +1,31 @@
 import { loginReqDto } from "@/app/_dto/web/login/login.dto";
+import { validateStrict } from "@/utils/validator/strictValidator";
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
+import { sendErrorResponse } from "../../functions/web/errorResponse";
+import { MiApiError, MiAuthSession } from "@/app";
 
 export async function POST(req: NextRequest) {
-  const { misskeyHost } = await req.json() as loginReqDto;
+  let data: loginReqDto;
+  const body = await req.json();
+  try {
+    data = await validateStrict(loginReqDto, body);
+  } catch (err) {
+    return sendErrorResponse(400, `${err}`);
+  }
+
+  const { misskeyHost } = data;
   const prisma = new PrismaClient();
 
   try {
-    const checkInstances = await prisma.server.findFirst({
+    const serverInfo = await prisma.server.findFirst({
       where: {
         instances: misskeyHost,
       },
     });
 
-    if (checkInstances === null) {
+    // 인스턴스의 첫 번째 로그인이거나, 앱시크릿이 유효하지 않은 경우
+    if (serverInfo === null || serverInfo.appSecret === null) {
       const payload = {
         name: "Neo-Quesdon",
         description: "새로운 퀘스돈, 네오-퀘스돈입니다.",
@@ -21,51 +33,96 @@ export async function POST(req: NextRequest) {
         callbackUrl: `${process.env.WEB_URL}/misskey-callback`,
       };
 
-      const appSecret = await fetch(`https://${misskeyHost}/api/app/create`, {
+      // Create New App in instance
+      const res = await fetch(`https://${misskeyHost}/api/app/create`, {
         method: "POST",
         headers: {
           "Content-Type": "application/json",
         },
         body: JSON.stringify(payload),
-      }).then((r) => r.json());
+      });
+      if (!res.ok) {
+        return sendErrorResponse(
+          500,
+          `Login Error! From Remote: ${await res.text()}`
+        );
+      }
+      const data = await res.json();
+      const appSecret = data.secret;
+      console.log('New Misskey APP created!', data);
 
-      const storeAppSecret = await prisma.server.create({
-        data: {
-          appSecret: appSecret.secret,
+      await prisma.server.upsert({
+        where: {
+          instances: misskeyHost,
+        },
+        update: {
+          appSecret: appSecret,
+        },
+        create: {
+          appSecret: appSecret,
           instances: misskeyHost,
         },
       });
-
-      const misskeyAuthSession = await fetch(
-        `https://${misskeyHost}/api/auth/session/generate`,
-        {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify({
-            appSecret: appSecret.secret,
-          }),
-        }
-      ).then((r) => r.json());
-      console.log(misskeyAuthSession);
+      const authRes = await initiateMisskeyAuthSession(
+        misskeyHost,
+        appSecret
+      );
+      if (!authRes.ok) {
+        return sendErrorResponse(
+          500,
+          `Fail to Create Auth Session: ${await authRes.text()}`
+        );
+      }
+      const misskeyAuthSession = (await authRes.json()) as MiAuthSession;
+      console.log(`New Misskey Auth Session Created: `, misskeyAuthSession);
       return NextResponse.json(misskeyAuthSession);
-    } else if (checkInstances !== null) {
-      const misskeyAuthSession = await fetch(
-        `https://${misskeyHost}/api/auth/session/generate`,
-        {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify({
-            appSecret: checkInstances.appSecret,
-          }),
+    }
+    // 앱 시크릿 존재하는 경우
+    else {
+      const res = await initiateMisskeyAuthSession(
+        misskeyHost,
+        serverInfo.appSecret
+      );
+      if (!res.ok) {
+        const data = (await res.json()) as MiApiError;
+        if (data.error.code === "NO_SUCH_APP") {
+          // 어라라...? 앱 스크릿 무효화
+          console.log(`Misskey response NO_SUCH_APP, delete invalid appSecret from DB`);
+          await prisma.server.update({
+            where: { instances: misskeyHost },
+            data: { appSecret: null },
+          });
         }
-      ).then((r) => r.json());
+        return sendErrorResponse(
+          500,
+          `Fail to Create Misskey Auth Session`
+        );
+      }
+      const misskeyAuthSession = (await res.json()) as MiAuthSession;
       return NextResponse.json(misskeyAuthSession);
     }
   } catch (err) {
-    return NextResponse.json({ error: err }, {status: 500});
+    return sendErrorResponse(500, `login error... ${err}`);
   }
 }
+
+/**
+ * initiate Misskey App Auth Session
+ * @param host misskey host
+ * @param appSecret Misskey AppSecret
+ * @returns Misskey API Response
+ */
+async function initiateMisskeyAuthSession(
+  host: string,
+  appSecret: string
+): Promise<Response> {
+  return await fetch(`https://${host}/api/auth/session/generate`, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+    },
+    body: JSON.stringify({
+      appSecret: appSecret,
+    }),
+  });
+}
diff --git a/src/app/index.d.ts b/src/app/index.d.ts
index 7417562..ac60b8b 100644
--- a/src/app/index.d.ts
+++ b/src/app/index.d.ts
@@ -1,5 +1,5 @@
 import type { profile, user } from "@prisma/client";
-import { User } from "./api/misskey-entities/user";
+import { MiUser } from "./api/misskey-entities/user";
 
 export interface callbackTokenClaimPayload {
   //Misskey Access key 를 요청할 misskey의 host (예: serafuku.moe)
@@ -9,9 +9,28 @@ export interface callbackTokenClaimPayload {
   callback_token: string;
 }
 export interface userInfoPayload {
-  user: User;
+  user: MiUser;
 }
 
+interface MiAuthSession {
+  token: string;
+  url: string;
+}
+
+interface MiApiError {
+  error: {
+    message: string;
+    code: string;
+    id: string;
+    kind: "client" | "server";
+  };
+}
+
+/** Misskey 의 /api/auth/session/userkey 에서 돌아오는 형식 */
+export interface misskeyAccessKeyApiResponse {
+  accessToken: string;
+  user: MiUser;
+}
 
 export interface questions {
   id: number;
diff --git a/src/app/misskey-callback/actions.ts b/src/app/misskey-callback/actions.ts
index 906339d..0f64414 100644
--- a/src/app/misskey-callback/actions.ts
+++ b/src/app/misskey-callback/actions.ts
@@ -4,15 +4,15 @@ import { PrismaClient } from "@prisma/client";
 import { DBpayload } from "./page";
 import { cookies } from "next/headers";
 import { SignJWT } from "jose";
-import { callbackTokenClaimPayload, userInfoPayload } from "..";
-import { User as MiUser } from "../api/misskey-entities/user";
+import { callbackTokenClaimPayload, misskeyAccessKeyApiResponse, userInfoPayload } from "..";
+import { MiUser } from "../api/misskey-entities/user";
 import { fetchNameWithEmoji } from "../api/functions/web/fetchUsername";
 
 
 export async function login(loginReq: callbackTokenClaimPayload): Promise<userInfoPayload> {
 
   // 미스키 App 인증 API에서 액세스토큰과 MiUser 정보를 받아오기
-  const misskeyApiResponse = await requestMiAccessTokenAndUserInfo(loginReq);
+  const misskeyApiResponse: misskeyAccessKeyApiResponse = await requestMiAccessTokenAndUserInfo(loginReq);
   if (misskeyApiResponse === null) {
     throw new Error(`misskey token get fail!`);
   }
diff --git a/src/app/misskey-callback/page.tsx b/src/app/misskey-callback/page.tsx
index c8776a5..e2d2509 100644
--- a/src/app/misskey-callback/page.tsx
+++ b/src/app/misskey-callback/page.tsx
@@ -4,7 +4,7 @@ import { useEffect, useState } from "react";
 import Image from "next/image";
 import { useRouter } from "next/navigation";
 import { login } from "./actions";
-import { User as MiUser } from "../api/misskey-entities/user";
+import { MiUser as MiUser } from "../api/misskey-entities/user";
 import { callbackTokenClaimPayload, userInfoPayload } from "..";
 
 export type DBpayload = {
diff --git a/src/app/page.tsx b/src/app/page.tsx
index a600037..561f9d7 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -28,6 +28,22 @@ const misskeyAuth = async ({ misskeyHost }: loginReqDto) => {
   return await res.json();
 };
 
+/**
+ * https://example.com/ 같은 URL 형식으로 온 경우 Host 형식으로 변환
+ * host형식으로 온 경우 그대로 반환
+ * @param urlOrHost 
+ * @returns 
+ */
+function urlToHost(urlOrHost: string) {
+  const re = /\/\/[^/@\s]+(:[0-9]{1,5})?\/?/;
+  const matched_str = urlOrHost.match(re)?.[0];
+  if (matched_str) {
+    console.log(`URL ${urlOrHost} replaced with ${matched_str.replaceAll('/', '')}`);
+    return matched_str.replaceAll('/', '');
+  }
+  return urlOrHost;
+}
+
 export default function Home() {
   const [isLoading, setIsLoading] = useState<boolean>(false);
   const [hosts, setHosts] = useState<hosts>({ protocol: "", host: "" });
@@ -42,23 +58,24 @@ export default function Home() {
 
   const onSubmit: SubmitHandler<FormValue> = async (e) => {
     setIsLoading(true);
-    localStorage.setItem("server", e.address);
+    const host = urlToHost(e.address);
+    localStorage.setItem("server", host);
 
     const payload: loginReqDto = {
-      misskeyHost: e.address,
+      misskeyHost: host,
     };
 
-    detectInstance(e.address).then((r) => {
+    detectInstance(host).then((r) => {
       switch (r) {
         case "misskey":
-          localStorage.setItem("server", e.address);
+          localStorage.setItem("server", host);
           misskeyAuth(payload).then((r) => {
             setIsLoading(false);
             router.replace(r.url);
           });
           break;
         case "cherrypick":
-          localStorage.setItem("server", e.address);
+          localStorage.setItem("server", host);
           misskeyAuth(payload).then((r) => {
             setIsLoading(false);
             router.replace(r.url);
diff --git a/src/utils/validator/strictValidator.ts b/src/utils/validator/strictValidator.ts
index 361e7aa..9bec377 100644
--- a/src/utils/validator/strictValidator.ts
+++ b/src/utils/validator/strictValidator.ts
@@ -1,6 +1,5 @@
 import { ClassConstructor, plainToInstance } from "class-transformer";
 import { validate } from "class-validator";
-import { ApiError } from "next/dist/server/api-utils";
 
 export async function validateStrict<T extends object>(cls: ClassConstructor<T>, data: unknown): Promise<T> {
     if (typeof data !== 'object') {
@@ -8,7 +7,7 @@ export async function validateStrict<T extends object>(cls: ClassConstructor<T>,
         throw new Error(`data is not object!`);
     }
     const instance = plainToInstance(cls, data);
-    const errors = await validate(instance, {});
+    const errors = await validate(instance, { whitelist: true, forbidNonWhitelisted: true });
     if (errors.length > 0) {
         console.error(errors);
         throw errors;

From 9dfd9593834dddd6013a5e8ccfd02eab8f936b2e Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sun, 17 Nov 2024 00:45:23 +0900
Subject: [PATCH 11/89] =?UTF-8?q?=E2=9C=A8=20=EB=8B=B5=EB=B3=80=20?=
 =?UTF-8?q?=EA=B3=B5=EA=B0=9C=EB=B2=94=EC=9C=84=20=EC=84=A4=EC=A0=95=20?=
 =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/question.tsx | 34 ++++++++++++++++++++++----------
 src/app/index.d.ts               |  8 +++++++-
 src/app/main/questions/action.ts | 25 ++++++++++++-----------
 3 files changed, 45 insertions(+), 22 deletions(-)

diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 7878d1f..6ff9728 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -1,10 +1,11 @@
 import { SubmitHandler, useForm } from "react-hook-form";
-import type { questions } from "..";
+import type { questions, typedAnswer } from "..";
 import { getQuestion, postAnswer } from "../main/questions/action";
 
 interface formValue {
   answer: string;
   nsfw: boolean;
+  visibility: "public" | "home" | "followers";
 }
 
 interface askProps {
@@ -32,6 +33,7 @@ export default function Question({
     defaultValues: {
       answer: "",
       nsfw: false,
+      visibility: "public",
     },
   });
 
@@ -51,12 +53,13 @@ export default function Question({
 
   const onSubmit: SubmitHandler<formValue> = async (e) => {
     const question = await getQuestion(singleQuestion.id);
-    const typedAnswer = {
+    const typedAnswer: typedAnswer = {
       question: question!.question,
       questioner: question!.questioner,
       answer: e.answer,
       answeredPersonHandle: question!.questioneeHandle,
       nsfwedAnswer: e.nsfw,
+      visibility: e.visibility,
     };
     const filteredQuestions = multipleQuestions.filter(
       (el) => el.id !== singleQuestion.id
@@ -105,14 +108,25 @@ export default function Question({
               onKeyDown={onCtrlEnter}
             />
             <div className="w-full flex justify-between items-center">
-              <div className="flex gap-2 items-center text-xl">
-                <input
-                  type="checkbox"
-                  className="toggle toggle-accent"
-                  onClick={() => setValue("nsfw", !nsfwedAnswer)}
-                />
-                <input type="hidden" {...register("nsfw")} />
-                <span className="text-lg desktop:text-2xl">NSFW로 체크</span>
+              <div className="flex gap-6">
+                <div className="flex gap-2 items-center text-xl">
+                  <input
+                    type="checkbox"
+                    className="toggle toggle-accent"
+                    onClick={() => setValue("nsfw", !nsfwedAnswer)}
+                  />
+                  <input type="hidden" {...register("nsfw")} />
+                  <span className="text-lg desktop:text-xl">NSFW로 체크</span>
+                </div>
+                <select
+                  {...register("visibility")}
+                  className="select select-ghost select-sm"
+                  defaultValue={"public"}
+                >
+                  <option value="public">공개</option>
+                  <option value="home">홈</option>
+                  <option value="followers">팔로워</option>
+                </select>
               </div>
               <button type={"submit"} className="btn btn-outline">
                 답변
diff --git a/src/app/index.d.ts b/src/app/index.d.ts
index 7417562..dddfeec 100644
--- a/src/app/index.d.ts
+++ b/src/app/index.d.ts
@@ -12,7 +12,6 @@ export interface userInfoPayload {
   user: User;
 }
 
-
 export interface questions {
   id: number;
   question: string;
@@ -28,6 +27,13 @@ export interface typedAnswer {
   answer: string;
   answeredPersonHandle: string;
   nsfwedAnswer: boolean;
+  visibility: "public" | "home" | "followers";
+}
+
+export interface MkNoteAnswers {
+  cw: string;
+  text: string;
+  visibility: "public" | "home" | "followers";
 }
 
 export interface postQuestion {
diff --git a/src/app/main/questions/action.ts b/src/app/main/questions/action.ts
index 05bdc2e..caefdeb 100644
--- a/src/app/main/questions/action.ts
+++ b/src/app/main/questions/action.ts
@@ -1,6 +1,6 @@
 "use server";
 
-import type { typedAnswer } from "@/app";
+import type { MkNoteAnswers, typedAnswer } from "@/app";
 import { verifyToken } from "@/app/api/functions/web/verify-jwt";
 import { PrismaClient, question } from "@prisma/client";
 import { createHash } from "crypto";
@@ -72,22 +72,22 @@ export async function postAnswer(
         if (answer.nsfwedAnswer === true && answer.questioner === null) {
           const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
           const text = `Q: ${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-          await mkMisskeyNode(i, title, text, host);
+          await mkMisskeyNote(i, title, text, host, answer.visibility);
         } else if (
           answer.nsfwedAnswer === false &&
           answer.questioner !== null
         ) {
           const title = `Q: ${question.question} #neo-quesdon`;
           const text = `질문자:${answer.questioner}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-          await mkMisskeyNode(i, title, text, host);
+          await mkMisskeyNote(i, title, text, host, answer.visibility);
         } else if (answer.nsfwedAnswer === true && answer.questioner !== null) {
           const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
           const text = `질문자:${answer.questioner}\nQ:${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-          await mkMisskeyNode(i, title, text, host);
+          await mkMisskeyNote(i, title, text, host, answer.visibility);
         } else {
           const title = `Q: ${question.question} #neo-quesdon`;
           const text = `A: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-          await mkMisskeyNode(i, title, text, host);
+          await mkMisskeyNote(i, title, text, host, answer.visibility);
         }
       } else {
         console.log("user not found");
@@ -97,22 +97,25 @@ export async function postAnswer(
   }
 }
 
-async function mkMisskeyNode(
+async function mkMisskeyNote(
   i: string,
   title: string,
   text: string,
-  hostname: string
+  hostname: string,
+  visibility: "public" | "home" | "followers"
 ) {
+  const newAnswerNote: MkNoteAnswers = {
+    cw: title,
+    text: text,
+    visibility: visibility,
+  };
   const res = await fetch(`https://${hostname}/api/notes/create`, {
     method: "POST",
     headers: {
       Authorization: `Bearer ${i}`,
       "Content-Type": "application/json",
     },
-    body: JSON.stringify({
-      cw: title,
-      text: text,
-    }),
+    body: JSON.stringify(newAnswerNote),
   });
   if (!res.ok) {
     console.warn(`Note create fail! `, res.status, res.statusText);

From e2bf4b597f6f2dc9c7a573503cc245a6e6f713d8 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <kw7551@gmail.com>
Date: Sun, 17 Nov 2024 01:03:57 +0900
Subject: [PATCH 12/89] =?UTF-8?q?=E2=9A=A1=EF=B8=8F=20=EC=A7=88=EB=AC=B8?=
 =?UTF-8?q?=20=EC=98=AC=EB=A6=BC=EA=B3=BC=20=EB=8F=99=EC=8B=9C=EC=97=90=20?=
 =?UTF-8?q?=ED=85=8D=EC=8A=A4=ED=8A=B8=EB=B0=95=EC=8A=A4=20=EC=A6=89?=
 =?UTF-8?q?=EC=8B=9C=20=EC=82=AD=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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

diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 8bf2134..49d303c 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -116,6 +116,7 @@ export default function UserPage() {
       const res = await mkQuestionCreateApi(req);
 
       if (res.status === 200) {
+        reset();
         document.getElementById("my_modal_2")?.click();
       }
     }
@@ -134,6 +135,7 @@ export default function UserPage() {
         };
         const res = await mkQuestionCreateApi(req);
         if (res.status === 200) {
+          reset();
           document.getElementById("my_modal_2")?.click();
         }
       }
@@ -343,7 +345,6 @@ export default function UserPage() {
               className="btn"
               onClick={() => {
                 document.getElementById("my_modal_2")?.click();
-                reset();
               }}
             >
               닫기

From f16167c46c12960ea0a8b57fef6dbfb01e583e3b Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sun, 17 Nov 2024 01:53:18 +0900
Subject: [PATCH 13/89] =?UTF-8?q?UI=EA=B0=9C=EC=84=A0:=20=EC=9E=90?=
 =?UTF-8?q?=EB=8F=99=EB=A1=9C=EA=B7=B8=EC=95=84=EC=9B=83/=EB=A1=9C?=
 =?UTF-8?q?=EA=B7=B8=EC=9D=B8=ED=99=94=EB=A9=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 토큰이 만료되어서 로그아웃 될 경우에 알림과 함께 리디렉션 하도록
- 마지막으로 사용한 인스턴스를 로그인창에 미리 입력해 놓도록
---
 src/app/api/db/fetch-my-profile/route.ts |  2 +-
 src/app/main/_header.tsx                 | 28 +++++++++++++++++++-----
 src/app/page.tsx                         | 13 ++++++-----
 3 files changed, 31 insertions(+), 12 deletions(-)

diff --git a/src/app/api/db/fetch-my-profile/route.ts b/src/app/api/db/fetch-my-profile/route.ts
index 2011c38..bf5d3cb 100644
--- a/src/app/api/db/fetch-my-profile/route.ts
+++ b/src/app/api/db/fetch-my-profile/route.ts
@@ -16,7 +16,7 @@ export async function GET(req: NextRequest) {
     try {
       handle = (await verifyToken(token)).handle;
     } catch {
-      return sendApiError(403, 'Token Verify Error');
+      return sendApiError(401, 'Token Verify Error');
     }
 
     const userProfile = await prisma.profile.findUnique({
diff --git a/src/app/main/_header.tsx b/src/app/main/_header.tsx
index 623edf7..124c87f 100644
--- a/src/app/main/_header.tsx
+++ b/src/app/main/_header.tsx
@@ -9,18 +9,23 @@ const fetchMyProfile = async () => {
   const user_handle = localStorage.getItem("user_handle");
 
   if (user_handle) {
-    const res: userProfileDto = await fetch("/api/db/fetch-my-profile", {
+    const res = await fetch("/api/db/fetch-my-profile", {
       method: "GET",
-    }).then((r) => r.json());
-
-    return res;
+    });
+    if(!res.ok) {
+      if (res.status === 401) {
+        document.getElementById('forceLogoutNoteModal')?.click();
+      }
+      return;
+    }
+    const data = await res.json();
+    return data;
   }
 };
 
 const logout = async () => {
   await fetch("/api/web/logout");
-
-  localStorage.clear();
+  localStorage.removeItem('user_handle');
   window.location.replace("/");
 };
 
@@ -113,6 +118,17 @@ export default function MainHeader() {
           </div>
         </div>
       </div>
+      <input type="checkbox" id="forceLogoutNoteModal" className="modal-toggle" />
+      <div className="modal" role="dialog">
+        <div className="modal-box">
+          <h3 className="py-4 text-2xl">로그인 유효시간이 만료되어서 로그아웃 되었어요!</h3>
+          <div className="modal-action">
+            <label htmlFor="forceLogoutNoteModal" className="btn btn-primary" onClick={logout}>
+              홈으로 돌아가기
+            </label>
+          </div>
+        </div>
+      </div>
     </div>
   );
 }
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 561f9d7..cc04036 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -47,14 +47,12 @@ function urlToHost(urlOrHost: string) {
 export default function Home() {
   const [isLoading, setIsLoading] = useState<boolean>(false);
   const [hosts, setHosts] = useState<hosts>({ protocol: "", host: "" });
-
   const router = useRouter();
-
   const {
     register,
     formState: { errors },
     handleSubmit,
-  } = useForm<FormValue>();
+  } = useForm<FormValue>({defaultValues: {address: ''}});
 
   const onSubmit: SubmitHandler<FormValue> = async (e) => {
     setIsLoading(true);
@@ -94,7 +92,12 @@ export default function Home() {
   useEffect(() => {
     const protocol = window.location.protocol;
     const host = window.location.host;
-
+    const lastUsedHost = localStorage.getItem('server');
+    const ele = document.getElementById('serverNameInput') as HTMLInputElement;
+    if (lastUsedHost && ele) {
+      ele.value = lastUsedHost;
+      ele.focus();
+    }
     setHosts({ protocol: protocol, host: host });
   }, []);
 
@@ -133,7 +136,7 @@ export default function Home() {
                   data-tip="URL을 입력해주세요"
                 />
               )}
-              <input
+              <input id="serverNameInput"
                 {...register("address", {
                   pattern: /\./,
                   required: "required",

From fea28e99d280b2f04a9ebd0f92294b55899aba0d Mon Sep 17 00:00:00 2001
From: kdh8219 <kdh8219@monamo.dev>
Date: Sat, 16 Nov 2024 23:19:39 +0900
Subject: [PATCH 14/89] =?UTF-8?q?Feat:=20=EC=A7=88=EB=AC=B8=EC=9E=90?=
 =?UTF-8?q?=EC=9D=98=20=ED=85=8C=EA=B7=B8=EB=A5=BC=20=EC=A7=88=EB=AC=B8?=
 =?UTF-8?q?=EC=9E=90=EC=9D=98=20=EC=A7=88=EB=AC=B8=ED=95=A8=EC=97=90=20?=
 =?UTF-8?q?=EB=A7=81=ED=81=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx   | 2 +-
 src/app/_components/question.tsx | 5 +++--
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 395a688..0a502b6 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -42,7 +42,7 @@ export default function Answer({ value }: askProps) {
       <div className={`${!showNsfw && "blur"} w-full h-full`}>
         <div className="chat chat-start">
           <div className="chat-header">
-            {value.questioner ? value.questioner : "익명의 질문자"}
+            {value.questioner ? <Link href={`/main/user/${value.questioner}`}>{value.questioner}</Link> : "익명의 질문자"}
           </div>
           <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble">
             {value.question}
diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 45c24f4..b9773ea 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -1,3 +1,4 @@
+import Link from "next/link";
 import { SubmitHandler, useForm } from "react-hook-form";
 import type { questions } from "..";
 import { getQuestion, postAnswer } from "../main/questions/action";
@@ -72,9 +73,9 @@ export default function Question({
       <div className="text-2xl chat chat-start">
         <div className="chat-header">
           {singleQuestion.questioner
-            ? singleQuestion.questioner
+            ? <Link href={`/main/user/${singleQuestion.questioner}`}>{singleQuestion.questioner}</Link>
             : "익명의 질문자"}
-        </div>
+        </div>  
         <div className="chat-bubble flex items-center text-sm window:text-xl desktop:text-2xl">
           {singleQuestion.question}
         </div>

From 1cb05aa60470dffdeccff4b2fd57688ad46657fa Mon Sep 17 00:00:00 2001
From: Squarecat-meow <Yozumina@serafuku.moe>
Date: Sun, 17 Nov 2024 02:59:23 +0900
Subject: [PATCH 15/89] =?UTF-8?q?=E2=9A=A1=EF=B8=8F=20=EA=B8=B0=EB=8A=A5?=
 =?UTF-8?q?=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 빈 칸 질문일 때 Validation으로 막기
- Esc로 모달 닫기
- 내 프로필에서만 질문상자 공유 보여주기
---
 src/app/main/user/[handle]/page.tsx | 73 ++++++++++++++++++++++++-----
 1 file changed, 60 insertions(+), 13 deletions(-)

diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 49d303c..19110dd 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -28,6 +28,7 @@ async function fetchProfile(handle: string) {
 export default function UserPage() {
   const { handle } = useParams() as { handle: string };
   const [userInfo, setUserInfo] = useState<userProfileDto>();
+  const [localHandle, setLocalHandle] = useState<string>("");
   const [answers, setAnswers] = useState<AnswerDto[]>([]);
   const [untilId, setUntilId] = useState<string | null>(null);
   const [loading, setLoading] = useState<boolean>(true);
@@ -56,16 +57,28 @@ export default function UserPage() {
 
   const onCtrlEnter = async (e: React.KeyboardEvent) => {
     if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
-      trigger();
+      const isValid = await trigger();
 
-      const value = getValues();
-
-      if (value) {
-        await onSubmit(value);
+      if (isValid === false) {
+        return;
+      } else {
+        const value = getValues();
+        if (value) {
+          await onSubmit(value);
+        }
       }
     }
   };
 
+  const onEscape = (e: React.KeyboardEvent) => {
+    const modalState = document.getElementById(
+      "my_modal_2"
+    ) as HTMLInputElement;
+    if (e.key === "Escape") {
+      modalState.click();
+    }
+  };
+
   const fetchUserAnswers = async (
     q: FetchUserAnswersDto
   ): Promise<AnswerDto[]> => {
@@ -99,6 +112,7 @@ export default function UserPage() {
 
   const onSubmit: SubmitHandler<FormValue> = async (e) => {
     const user_handle = localStorage.getItem("user_handle");
+    const detectWhiteSpaces = new RegExp(/^\s+$/);
 
     // 작성자 공개
     if (questioner === true) {
@@ -107,7 +121,18 @@ export default function UserPage() {
           type: "notLoggedIn",
           message: "작성자 공개를 하려면 로그인을 해주세요!",
         });
+        return;
       }
+      if (detectWhiteSpaces.test(e.question) === true) {
+        setError("question", {
+          type: "questionOnlyWhiteSpace",
+          message: "아무것도 없는 질문을 보내시려구요...?",
+        });
+        return;
+      }
+
+      document.getElementById("my_modal_2")?.click();
+
       const req: CreateQuestionDto = {
         question: e.question,
         questioner: user_handle,
@@ -117,7 +142,6 @@ export default function UserPage() {
 
       if (res.status === 200) {
         reset();
-        document.getElementById("my_modal_2")?.click();
       }
     }
     // 작성자 비공개
@@ -127,7 +151,18 @@ export default function UserPage() {
           type: "stopAnonQuestion",
           message: "익명 질문은 받지 않고 있어요...",
         });
+        return;
       } else {
+        if (detectWhiteSpaces.test(e.question) === true) {
+          setError("question", {
+            type: "questionOnlyWhiteSpace",
+            message: "아무것도 없는 질문을 보내시려구요...?",
+          });
+          return;
+        }
+
+        document.getElementById("my_modal_2")?.click();
+
         const req: CreateQuestionDto = {
           question: e.question,
           questioner: null,
@@ -136,7 +171,6 @@ export default function UserPage() {
         const res = await mkQuestionCreateApi(req);
         if (res.status === 200) {
           reset();
-          document.getElementById("my_modal_2")?.click();
         }
       }
     }
@@ -146,6 +180,7 @@ export default function UserPage() {
     fetchProfile(profileHandle).then((r) => {
       setUserInfo(r);
     });
+    setLocalHandle(localStorage.getItem("user_handle") ?? "");
   }, [profileHandle]);
 
   useEffect(() => {
@@ -195,7 +230,10 @@ export default function UserPage() {
   }, [mounted, untilId]);
 
   return (
-    <div className="w-[90%] window:w-[80%] desktop:w-[70%]">
+    <div
+      className="w-[90%] window:w-[80%] desktop:w-[70%]"
+      onKeyDown={onEscape}
+    >
       {userInfo === null ? (
         <div className="w-full flex flex-col justify-center items-center glass text-4xl rounded-box shadow p-2">
           <FaUserSlash />
@@ -275,6 +313,13 @@ export default function UserPage() {
                       data-tip={errors.questioner.message}
                     />
                   )}
+                {errors.question &&
+                  errors.question.type === "questionOnlyWhiteSpace" && (
+                    <div
+                      className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
+                      data-tip={errors.question.message}
+                    />
+                  )}
                 <div className="w-[90%] flex justify-between">
                   <div className="flex gap-2 items-center">
                     <input
@@ -291,11 +336,13 @@ export default function UserPage() {
                 </div>
               </form>
             </div>
-            <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
-              <a className="link" href={shareUrl()} target="_blank">
-                Misskey에 질문상자 페이지를 공유
-              </a>
-            </div>
+            {localHandle === profileHandle && (
+              <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
+                <a className="link" href={shareUrl()} target="_blank">
+                  Misskey에 질문상자 페이지를 공유
+                </a>
+              </div>
+            )}
           </div>
           <div className="desktop:ml-2 desktop:w-[50%]">
             {answers !== null ? (

From 02d59c68c2d8f4467c60afded9abcbfcc52f90fe Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sun, 17 Nov 2024 03:22:02 +0900
Subject: [PATCH 16/89] =?UTF-8?q?Feat:=20=EB=8B=B5=EB=B3=80=20=EC=82=AD?=
 =?UTF-8?q?=EC=A0=9C=20API=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../_dto/delete-answer/delete-answer.dto.ts   |  6 +++
 src/app/api/db/delete-answer/route.ts         | 41 +++++++++++++++++++
 2 files changed, 47 insertions(+)
 create mode 100644 src/app/_dto/delete-answer/delete-answer.dto.ts
 create mode 100644 src/app/api/db/delete-answer/route.ts

diff --git a/src/app/_dto/delete-answer/delete-answer.dto.ts b/src/app/_dto/delete-answer/delete-answer.dto.ts
new file mode 100644
index 0000000..36f63ba
--- /dev/null
+++ b/src/app/_dto/delete-answer/delete-answer.dto.ts
@@ -0,0 +1,6 @@
+import { IsString } from "class-validator";
+
+export class DeleteAnswerDto {
+  @IsString()
+  id: string;
+}
diff --git a/src/app/api/db/delete-answer/route.ts b/src/app/api/db/delete-answer/route.ts
new file mode 100644
index 0000000..ba67ce2
--- /dev/null
+++ b/src/app/api/db/delete-answer/route.ts
@@ -0,0 +1,41 @@
+import { DeleteAnswerDto } from "@/app/_dto/delete-answer/delete-answer.dto";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { validateStrict } from "@/utils/validator/strictValidator";
+import { PrismaClient } from "@prisma/client";
+import { cookies } from "next/headers";
+import { NextRequest } from "next/server";
+import { verifyToken } from "../../functions/web/verify-jwt";
+
+export async function POST(req: NextRequest) {
+  const body = await req.json();
+  let data: DeleteAnswerDto;
+  try {
+    data = await validateStrict(DeleteAnswerDto, body);
+  } catch (err) {
+    return sendApiError(400, `Bad Request ${err}`);
+  }
+  const prisma = new PrismaClient();
+  const cookieStore = await cookies();
+  const token = cookieStore.get("jwtToken")?.value;
+  let tokenPayload;
+  // JWT 토큰 검증
+  try {
+    tokenPayload = await verifyToken(token);
+  } catch (err) {
+    return sendApiError(401, "Unauthorized");
+  }
+  const willBeDeletedAnswer = await prisma.answer.findUnique({where: { id: data.id }});
+  if (!willBeDeletedAnswer) {
+    // 그런 답변이 없음
+    return sendApiError(404, 'Not Found');
+  }
+  if (willBeDeletedAnswer.answeredPersonHandle !== tokenPayload.handle) {
+    // 너의 답변이 아님
+    return sendApiError(403, 'This is Not Your Answer!');    
+  }
+  try {
+    await prisma.answer.delete({ where: { id: data.id } });
+  } catch (err) {
+    return sendApiError(500, `Error ${JSON.stringify(err)}`);
+  }
+}

From 2b75c5567ad538212b5ef4b27e20d72a893397ee Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sun, 17 Nov 2024 11:09:08 +0900
Subject: [PATCH 17/89] =?UTF-8?q?Fix:=20=EB=A1=9C=EA=B7=B8=20=EB=B9=A0?=
 =?UTF-8?q?=EC=A7=84=EA=B3=B3=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/web/login/route.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/app/api/web/login/route.ts b/src/app/api/web/login/route.ts
index a2ad7fa..22587b6 100644
--- a/src/app/api/web/login/route.ts
+++ b/src/app/api/web/login/route.ts
@@ -99,6 +99,7 @@ export async function POST(req: NextRequest) {
         );
       }
       const misskeyAuthSession = (await res.json()) as MiAuthSession;
+      console.log(`New Misskey Auth Session Created: `, misskeyAuthSession);
       return NextResponse.json(misskeyAuthSession);
     }
   } catch (err) {

From a906fd3297cca901699f0f1612bc3e1c2a1c1925 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <Yozumina@serafuku.moe>
Date: Sun, 17 Nov 2024 11:45:02 +0900
Subject: [PATCH 18/89] =?UTF-8?q?=F0=9F=92=84=20=EB=AA=A8=EB=B0=94?=
 =?UTF-8?q?=EC=9D=BC=20=EC=A7=88=EB=AC=B8=EC=B0=BD=20=EC=88=98=EC=A0=95,?=
 =?UTF-8?q?=20=EB=AF=B8=EB=8B=B5=EB=B3=80=20=EC=A7=88=EB=AC=B8=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/question.tsx | 31 ++++++++++++++++++++-----------
 src/app/main/questions/page.tsx  |  9 ++++++---
 2 files changed, 26 insertions(+), 14 deletions(-)

diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 8dbf8ac..fe5dfec 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -75,10 +75,14 @@ export default function Question({
     <div className="rounded-box p-2 desktop:p-4 mb-2 glass shadow">
       <div className="text-2xl chat chat-start">
         <div className="chat-header">
-          {singleQuestion.questioner
-            ? <Link href={`/main/user/${singleQuestion.questioner}`}>{singleQuestion.questioner}</Link>
-            : "익명의 질문자"}
-        </div>  
+          {singleQuestion.questioner ? (
+            <Link href={`/main/user/${singleQuestion.questioner}`}>
+              {singleQuestion.questioner}
+            </Link>
+          ) : (
+            "익명의 질문자"
+          )}
+        </div>
         <div className="chat-bubble flex items-center text-sm window:text-xl desktop:text-2xl">
           {singleQuestion.question}
         </div>
@@ -102,14 +106,14 @@ export default function Question({
           >
             <textarea
               {...register("answer", { required: "required" })}
-              className={`textarea textarea-sm text-sm window:text-xl desktop:text-2xl bg-transparent ${
+              className={`textarea textarea-sm text-sm h-24 desktop:h-32 window:text-xl desktop:text-2xl bg-transparent ${
                 errors.answer && "textarea-error"
               }`}
               placeholder="답변을 입력하세요..."
               onKeyDown={onCtrlEnter}
             />
-            <div className="w-full flex justify-between items-center">
-              <div className="flex gap-6">
+            <div className="w-full flex flex-col gap-3 desktop:flex-row justify-between items-center">
+              <div className="flex gap-6 mb-2 desktop:mb-0">
                 <div className="flex gap-2 items-center text-xl">
                   <input
                     type="checkbox"
@@ -117,7 +121,7 @@ export default function Question({
                     onClick={() => setValue("nsfw", !nsfwedAnswer)}
                   />
                   <input type="hidden" {...register("nsfw")} />
-                  <span className="text-lg desktop:text-xl">NSFW로 체크</span>
+                  <span className="text-sm desktop:text-xl">NSFW로 체크</span>
                 </div>
                 <select
                   {...register("visibility")}
@@ -129,9 +133,14 @@ export default function Question({
                   <option value="followers">팔로워</option>
                 </select>
               </div>
-              <button type={"submit"} className="btn btn-outline">
-                답변
-              </button>
+              <div className="w-full desktop:w-fit flex justify-center">
+                <button
+                  type={"submit"}
+                  className="btn btn-outline btn-sm h-10 w-16 desktop:btn-md"
+                >
+                  답변
+                </button>
+              </div>
             </div>
           </form>
         </div>
diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index d7f761d..c77816d 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -19,7 +19,8 @@ export default function Questions() {
   }, []);
 
   return (
-    <div className="w-[90%] window:w-[80%] desktop:w-[70%] flex justify-center">
+    <div className="w-[90%] window:w-[80%] desktop:w-[70%] flex flex-col justify-center">
+      <h3 className="text-3xl desktop:text-4xl mb-2">미답변 질문들</h3>
       {questions === undefined || null ? (
         <div>
           <span className="loading loading-infinity loading-lg" />
@@ -72,8 +73,10 @@ export default function Questions() {
               ))}
             </div>
           ) : (
-            <div className="w-full flex justify-center">
-              <h1 className="text-3xl">아무것도 없습니다!</h1>
+            <div className="h-fit p-4 glass rounded-box flex flex-col items-center shadow mb-2">
+              <h1 className="text-xl desktop:text-3xl">
+                👍 답변하지 않은 질문이 없어요!
+              </h1>
             </div>
           )}
         </div>

From 9686acff90d2066c8b1c589bb0ed7190c580e6a1 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sun, 17 Nov 2024 21:00:27 +0900
Subject: [PATCH 19/89] =?UTF-8?q?Fix:=20=EC=9D=B8=EC=8A=A4=ED=84=B4?=
 =?UTF-8?q?=EC=8A=A4=20host=EB=8A=94=20=EC=86=8C=EB=AC=B8=EC=9E=90?=
 =?UTF-8?q?=EB=A1=9C=EB=A7=8C=20=EC=9E=85=EB=A0=A5=EB=90=98=EB=8F=84?=
 =?UTF-8?q?=EB=A1=9D=20=EC=B2=98=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/web/login/route.ts      |  2 +-
 src/app/index.d.ts                  |  8 ++++++--
 src/app/misskey-callback/actions.ts | 12 ++++++++++--
 3 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/app/api/web/login/route.ts b/src/app/api/web/login/route.ts
index 22587b6..28f81dc 100644
--- a/src/app/api/web/login/route.ts
+++ b/src/app/api/web/login/route.ts
@@ -14,7 +14,7 @@ export async function POST(req: NextRequest) {
     return sendErrorResponse(400, `${err}`);
   }
 
-  const { misskeyHost } = data;
+  const misskeyHost = data.misskeyHost.toLowerCase();
   const prisma = new PrismaClient();
 
   try {
diff --git a/src/app/index.d.ts b/src/app/index.d.ts
index 4400683..10e369f 100644
--- a/src/app/index.d.ts
+++ b/src/app/index.d.ts
@@ -1,14 +1,18 @@
 import type { profile, user } from "@prisma/client";
 import { MiUser } from "./api/misskey-entities/user";
+import { IsString } from "class-validator";
 
-export interface callbackTokenClaimPayload {
+export class callbackTokenClaimPayload {
   //Misskey Access key 를 요청할 misskey의 host (예: serafuku.moe)
+  @IsString()
   misskeyHost: string;
 
   //callback으로 받은 토큰
+  @IsString()
   callback_token: string;
 }
-export interface userInfoPayload {
+export class userInfoPayload {
+  @IsString()
   user: MiUser;
 }
 interface MiAuthSession {
diff --git a/src/app/misskey-callback/actions.ts b/src/app/misskey-callback/actions.ts
index 0f64414..6524b0c 100644
--- a/src/app/misskey-callback/actions.ts
+++ b/src/app/misskey-callback/actions.ts
@@ -7,10 +7,18 @@ import { SignJWT } from "jose";
 import { callbackTokenClaimPayload, misskeyAccessKeyApiResponse, userInfoPayload } from "..";
 import { MiUser } from "../api/misskey-entities/user";
 import { fetchNameWithEmoji } from "../api/functions/web/fetchUsername";
+import { validateStrict } from "@/utils/validator/strictValidator";
 
 
-export async function login(loginReq: callbackTokenClaimPayload): Promise<userInfoPayload> {
-
+export async function login(loginReqestData: callbackTokenClaimPayload): Promise<userInfoPayload> {
+  let loginReq: callbackTokenClaimPayload;
+  try {
+    loginReq = await validateStrict(callbackTokenClaimPayload, loginReqestData);
+  } catch (err) {
+    throw new Error(JSON.stringify(err));
+  }
+  loginReq.misskeyHost = loginReq.misskeyHost.toLowerCase();
+  
   // 미스키 App 인증 API에서 액세스토큰과 MiUser 정보를 받아오기
   const misskeyApiResponse: misskeyAccessKeyApiResponse = await requestMiAccessTokenAndUserInfo(loginReq);
   if (misskeyApiResponse === null) {

From 46e5ebaa9570ddc4aac12d3df9e48a871b27180b Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sun, 17 Nov 2024 21:22:40 +0900
Subject: [PATCH 20/89] =?UTF-8?q?fix:=20=EB=B9=8C=EB=93=9C=EC=98=A4?=
 =?UTF-8?q?=EB=A5=98=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../misskey-callback/callback-token-claim.dto.ts   | 13 +++++++++++++
 src/app/_dto/misskey-callback/user-info.dto.ts     |  5 +++++
 src/app/index.d.ts                                 | 14 --------------
 src/app/misskey-callback/actions.ts                |  4 +++-
 src/app/misskey-callback/page.tsx                  |  3 ++-
 5 files changed, 23 insertions(+), 16 deletions(-)
 create mode 100644 src/app/_dto/misskey-callback/callback-token-claim.dto.ts
 create mode 100644 src/app/_dto/misskey-callback/user-info.dto.ts

diff --git a/src/app/_dto/misskey-callback/callback-token-claim.dto.ts b/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
new file mode 100644
index 0000000..f87b4bb
--- /dev/null
+++ b/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
@@ -0,0 +1,13 @@
+import { IsString } from "class-validator";
+
+export class callbackTokenClaimPayload {
+    //Misskey Access key 를 요청할 misskey의 host (예: serafuku.moe)
+    @IsString()
+    misskeyHost: string;
+  
+    //callback으로 받은 토큰
+    @IsString()
+    callback_token: string;
+  }
+  
+  
\ No newline at end of file
diff --git a/src/app/_dto/misskey-callback/user-info.dto.ts b/src/app/_dto/misskey-callback/user-info.dto.ts
new file mode 100644
index 0000000..a8f3b5f
--- /dev/null
+++ b/src/app/_dto/misskey-callback/user-info.dto.ts
@@ -0,0 +1,5 @@
+import type { MiUser } from "@/app/api/misskey-entities/user";
+
+export class userInfoPayload {
+  user: MiUser;
+}
diff --git a/src/app/index.d.ts b/src/app/index.d.ts
index 10e369f..9a0014c 100644
--- a/src/app/index.d.ts
+++ b/src/app/index.d.ts
@@ -1,20 +1,6 @@
 import type { profile, user } from "@prisma/client";
 import { MiUser } from "./api/misskey-entities/user";
-import { IsString } from "class-validator";
 
-export class callbackTokenClaimPayload {
-  //Misskey Access key 를 요청할 misskey의 host (예: serafuku.moe)
-  @IsString()
-  misskeyHost: string;
-
-  //callback으로 받은 토큰
-  @IsString()
-  callback_token: string;
-}
-export class userInfoPayload {
-  @IsString()
-  user: MiUser;
-}
 interface MiAuthSession {
   token: string;
   url: string;
diff --git a/src/app/misskey-callback/actions.ts b/src/app/misskey-callback/actions.ts
index 6524b0c..136556e 100644
--- a/src/app/misskey-callback/actions.ts
+++ b/src/app/misskey-callback/actions.ts
@@ -4,10 +4,12 @@ import { PrismaClient } from "@prisma/client";
 import { DBpayload } from "./page";
 import { cookies } from "next/headers";
 import { SignJWT } from "jose";
-import { callbackTokenClaimPayload, misskeyAccessKeyApiResponse, userInfoPayload } from "..";
+import { misskeyAccessKeyApiResponse } from "..";
 import { MiUser } from "../api/misskey-entities/user";
 import { fetchNameWithEmoji } from "../api/functions/web/fetchUsername";
 import { validateStrict } from "@/utils/validator/strictValidator";
+import { callbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
+import { userInfoPayload } from "../_dto/misskey-callback/user-info.dto";
 
 
 export async function login(loginReqestData: callbackTokenClaimPayload): Promise<userInfoPayload> {
diff --git a/src/app/misskey-callback/page.tsx b/src/app/misskey-callback/page.tsx
index e2d2509..5fa8e28 100644
--- a/src/app/misskey-callback/page.tsx
+++ b/src/app/misskey-callback/page.tsx
@@ -5,7 +5,8 @@ import Image from "next/image";
 import { useRouter } from "next/navigation";
 import { login } from "./actions";
 import { MiUser as MiUser } from "../api/misskey-entities/user";
-import { callbackTokenClaimPayload, userInfoPayload } from "..";
+import { callbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
+import { userInfoPayload } from "../_dto/misskey-callback/user-info.dto";
 
 export type DBpayload = {
   account: string;

From 9a32b84db3b2237a400ccc0f63b86e4d760ee3b4 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <Yozumina@serafuku.moe>
Date: Sun, 17 Nov 2024 21:55:14 +0900
Subject: [PATCH 21/89] =?UTF-8?q?=F0=9F=9A=A8=20=EB=93=A4=EC=97=AC?=
 =?UTF-8?q?=EC=93=B0=EA=B8=B0=20=EC=88=98=EC=A0=95,=20NextResponse=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/db/delete-answer/route.ts | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/app/api/db/delete-answer/route.ts b/src/app/api/db/delete-answer/route.ts
index ba67ce2..f775fe4 100644
--- a/src/app/api/db/delete-answer/route.ts
+++ b/src/app/api/db/delete-answer/route.ts
@@ -3,7 +3,7 @@ import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { validateStrict } from "@/utils/validator/strictValidator";
 import { PrismaClient } from "@prisma/client";
 import { cookies } from "next/headers";
-import { NextRequest } from "next/server";
+import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
 
 export async function POST(req: NextRequest) {
@@ -24,17 +24,24 @@ export async function POST(req: NextRequest) {
   } catch (err) {
     return sendApiError(401, "Unauthorized");
   }
-  const willBeDeletedAnswer = await prisma.answer.findUnique({where: { id: data.id }});
+  const willBeDeletedAnswer = await prisma.answer.findUnique({
+    where: { id: data.id },
+  });
   if (!willBeDeletedAnswer) {
     // 그런 답변이 없음
-    return sendApiError(404, 'Not Found');
+    return sendApiError(404, "Not Found");
   }
   if (willBeDeletedAnswer.answeredPersonHandle !== tokenPayload.handle) {
     // 너의 답변이 아님
-    return sendApiError(403, 'This is Not Your Answer!');    
+    return sendApiError(403, "This is Not Your Answer!");
   }
   try {
     await prisma.answer.delete({ where: { id: data.id } });
+
+    return NextResponse.json(
+      { message: "Delete Answer Successful" },
+      { status: 200 }
+    );
   } catch (err) {
     return sendApiError(500, `Error ${JSON.stringify(err)}`);
   }

From b18a2ad69e694362ec2e943c715cba9dcf4fd2b1 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <Yozumina@serafuku.moe>
Date: Sun, 17 Nov 2024 21:58:02 +0900
Subject: [PATCH 22/89] =?UTF-8?q?=E2=9C=A8=20=EB=8B=B5=EB=B3=80=20?=
 =?UTF-8?q?=EC=82=AD=EC=A0=9C=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx      | 45 ++++++++++++++++++++++++-----
 src/app/main/page.tsx               |  3 +-
 src/app/main/user/[handle]/page.tsx | 41 ++++++++++++++++++++++++--
 3 files changed, 78 insertions(+), 11 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 081efb1..07ecc87 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -5,9 +5,11 @@ import { useEffect, useState } from "react";
 import NameComponents from "./NameComponents";
 import { AnswerDto } from "../_dto/Answers.dto";
 import { userProfileDto } from "../_dto/fetch-profile/Profile.dto";
+import { useParams } from "next/navigation";
 
 interface askProps {
   value: AnswerDto;
+  id: string;
 }
 
 export async function fetchProfile(handle: string) {
@@ -19,9 +21,18 @@ export async function fetchProfile(handle: string) {
   }
 }
 
-export default function Answer({ value }: askProps) {
+export default function Answer({ value, id }: askProps) {
+  const { handle } = useParams() as { handle: string };
   const [showNsfw, setShowNsfw] = useState(false);
   const [userInfo, setUserInfo] = useState<userProfileDto>();
+  const [localHandle, setLocalHandle] = useState<string>("");
+
+  const profileHandle =
+    handle !== undefined ? handle.toString().replace(/(?:%40)/g, "@") : "";
+
+  useEffect(() => {
+    setLocalHandle(localStorage.getItem("user_handle") ?? "");
+  }, [profileHandle]);
 
   useEffect(() => {
     fetchProfile(value.answeredPersonHandle).then((r) => setUserInfo(r));
@@ -40,13 +51,33 @@ export default function Answer({ value }: askProps) {
       )}
 
       <div className={`${!showNsfw && "blur"} w-full h-full`}>
-        <div className="chat chat-start">
-          <div className="chat-header">
-            {value.questioner ? <Link href={`/main/user/${value.questioner}`}>{value.questioner}</Link> : "익명의 질문자"}
-          </div>
-          <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble">
-            {value.question}
+        <div className="chat chat-start flex justify-between">
+          <div className="w-full">
+            <div className="chat-header">
+              {value.questioner ? (
+                <Link href={`/main/user/${value.questioner}`}>
+                  {value.questioner}
+                </Link>
+              ) : (
+                "익명의 질문자"
+              )}
+            </div>
+            <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble">
+              {value.question}
+            </div>
           </div>
+          {localHandle === profileHandle && (
+            <div className="w-12 flex justify-end">
+              <a
+                className="link text-red-800"
+                onClick={() =>
+                  document.getElementById(`answer_delete_modal_${id}`)?.click()
+                }
+              >
+                삭제
+              </a>
+            </div>
+          )}
         </div>
         <div className="chat chat-end">
           <div className="chat-image avatar">
diff --git a/src/app/main/page.tsx b/src/app/main/page.tsx
index 873b708..17df9df 100644
--- a/src/app/main/page.tsx
+++ b/src/app/main/page.tsx
@@ -1,7 +1,6 @@
 "use client";
 
 import { useEffect, useState } from "react";
-import Question from "../_components/answer";
 import Answer from "../_components/answer";
 import { FaExclamationCircle } from "react-icons/fa";
 import { answer } from "@prisma/client";
@@ -78,7 +77,7 @@ export default function MainBody() {
             <div className="flex flex-col">
               {answers.map((r) => (
                 <div key={r.id}>
-                  <Answer value={r} />
+                  <Answer id={r.id} value={r} />
                 </div>
               ))}
               <div
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 19110dd..c4d23bc 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -4,7 +4,7 @@ import NameComponents from "@/app/_components/NameComponents";
 import { useParams } from "next/navigation";
 import { useEffect, useState } from "react";
 import { SubmitHandler, useForm } from "react-hook-form";
-import Question from "@/app/_components/answer";
+import Answer from "@/app/_components/answer";
 import { FaUserSlash } from "react-icons/fa";
 import { userProfileDto } from "@/app/_dto/fetch-profile/Profile.dto";
 import { CreateQuestionDto } from "@/app/_dto/create_question/create-question.dto";
@@ -94,6 +94,16 @@ export default function UserPage() {
       );
     }
   };
+
+  const handleDeleteAnswer = async (id: string) => {
+    await fetch("/api/db/delete-answer", {
+      method: "POST",
+      body: JSON.stringify({ id: id }),
+    });
+    const filteredAnswer = answers.filter((el) => el.id !== id);
+    setAnswers(filteredAnswer);
+  };
+
   const mkQuestionCreateApi = async (
     q: CreateQuestionDto
   ): Promise<Response> => {
@@ -351,7 +361,34 @@ export default function UserPage() {
                   <div className="flex flex-col">
                     {answers.map((el) => (
                       <div key={el.id}>
-                        <Question value={el} />
+                        <Answer value={el} id={el.id} />
+                        <input
+                          type="checkbox"
+                          id={`answer_delete_modal_${el.id}`}
+                          className="modal-toggle"
+                        />
+                        <div className="modal" role="dialog">
+                          <div className="modal-box">
+                            <h3 className="py-4 text-2xl">
+                              답변을 지울까요...?
+                            </h3>
+                            <div className="modal-action">
+                              <label
+                                htmlFor={`answer_delete_modal_${el.id}`}
+                                className="btn btn-error"
+                                onClick={() => handleDeleteAnswer(el.id)}
+                              >
+                                확인
+                              </label>
+                              <label
+                                htmlFor={`answer_delete_modal_${el.id}`}
+                                className="btn"
+                              >
+                                취소
+                              </label>
+                            </div>
+                          </div>
+                        </div>
                       </div>
                     ))}
                     <div

From b5578d99de0c200f3b2af590b43fe9671b092606 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sun, 17 Nov 2024 21:59:17 +0900
Subject: [PATCH 23/89] =?UTF-8?q?=EB=8B=B5=EB=B3=80=EC=82=AD=EC=A0=9C=20?=
 =?UTF-8?q?=EB=94=94=EB=B2=84=EA=B7=B8=EC=9A=A9=20=EB=A1=9C=EA=B7=B8=20?=
 =?UTF-8?q?=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/db/delete-answer/route.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/app/api/db/delete-answer/route.ts b/src/app/api/db/delete-answer/route.ts
index ba67ce2..097cc18 100644
--- a/src/app/api/db/delete-answer/route.ts
+++ b/src/app/api/db/delete-answer/route.ts
@@ -34,8 +34,10 @@ export async function POST(req: NextRequest) {
     return sendApiError(403, 'This is Not Your Answer!');    
   }
   try {
+    console.log(`Delete answer... : ${data.id}`);
     await prisma.answer.delete({ where: { id: data.id } });
   } catch (err) {
+    console.log('Error: Delete answer:', err);
     return sendApiError(500, `Error ${JSON.stringify(err)}`);
   }
 }

From a25b8374ec51f2ce2c764543c9c67161ccb5e32e Mon Sep 17 00:00:00 2001
From: Squarecat-meow <Yozumina@serafuku.moe>
Date: Sun, 17 Nov 2024 22:10:51 +0900
Subject: [PATCH 24/89] =?UTF-8?q?=F0=9F=90=9B=20=EB=AF=B8=EB=A1=9C?=
 =?UTF-8?q?=EA=B7=B8=EC=9D=B8=20=EC=83=81=ED=83=9C=EC=97=90=EC=84=9C=20?=
 =?UTF-8?q?=EB=8B=B5=EB=B3=80=20=EC=82=AD=EC=A0=9C=20=EB=B2=84=ED=8A=BC=20?=
 =?UTF-8?q?=EC=95=88=20=EB=B3=B4=EC=9D=B4=EA=B2=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 07ecc87..4e97e54 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -25,13 +25,13 @@ export default function Answer({ value, id }: askProps) {
   const { handle } = useParams() as { handle: string };
   const [showNsfw, setShowNsfw] = useState(false);
   const [userInfo, setUserInfo] = useState<userProfileDto>();
-  const [localHandle, setLocalHandle] = useState<string>("");
+  const [localHandle, setLocalHandle] = useState<string | null>();
 
   const profileHandle =
     handle !== undefined ? handle.toString().replace(/(?:%40)/g, "@") : "";
 
   useEffect(() => {
-    setLocalHandle(localStorage.getItem("user_handle") ?? "");
+    setLocalHandle(localStorage.getItem("user_handle"));
   }, [profileHandle]);
 
   useEffect(() => {
@@ -66,7 +66,7 @@ export default function Answer({ value, id }: askProps) {
               {value.question}
             </div>
           </div>
-          {localHandle === profileHandle && (
+          {localHandle !== null && localHandle === profileHandle && (
             <div className="w-12 flex justify-end">
               <a
                 className="link text-red-800"

From 0a7ccf83b10102a66b4cf4d40a1301ba3ec9c2d7 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <Yozumina@serafuku.moe>
Date: Sun, 17 Nov 2024 22:16:10 +0900
Subject: [PATCH 25/89] =?UTF-8?q?=F0=9F=92=84=20=EB=A1=9C=EA=B7=B8?=
 =?UTF-8?q?=EC=9D=B8=20=EC=97=86=EC=9D=B4=20=EC=A6=90=EA=B8=B0=EA=B8=B0=20?=
 =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

로그인 버튼 로딩 스피너 추가
---
 src/app/page.tsx | 40 +++++++++++++++++++++++++---------------
 1 file changed, 25 insertions(+), 15 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index cc04036..aed6163 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -31,15 +31,17 @@ const misskeyAuth = async ({ misskeyHost }: loginReqDto) => {
 /**
  * https://example.com/ 같은 URL 형식으로 온 경우 Host 형식으로 변환
  * host형식으로 온 경우 그대로 반환
- * @param urlOrHost 
- * @returns 
+ * @param urlOrHost
+ * @returns
  */
 function urlToHost(urlOrHost: string) {
   const re = /\/\/[^/@\s]+(:[0-9]{1,5})?\/?/;
   const matched_str = urlOrHost.match(re)?.[0];
   if (matched_str) {
-    console.log(`URL ${urlOrHost} replaced with ${matched_str.replaceAll('/', '')}`);
-    return matched_str.replaceAll('/', '');
+    console.log(
+      `URL ${urlOrHost} replaced with ${matched_str.replaceAll("/", "")}`
+    );
+    return matched_str.replaceAll("/", "");
   }
   return urlOrHost;
 }
@@ -52,7 +54,7 @@ export default function Home() {
     register,
     formState: { errors },
     handleSubmit,
-  } = useForm<FormValue>({defaultValues: {address: ''}});
+  } = useForm<FormValue>({ defaultValues: { address: "" } });
 
   const onSubmit: SubmitHandler<FormValue> = async (e) => {
     setIsLoading(true);
@@ -92,8 +94,8 @@ export default function Home() {
   useEffect(() => {
     const protocol = window.location.protocol;
     const host = window.location.host;
-    const lastUsedHost = localStorage.getItem('server');
-    const ele = document.getElementById('serverNameInput') as HTMLInputElement;
+    const lastUsedHost = localStorage.getItem("server");
+    const ele = document.getElementById("serverNameInput") as HTMLInputElement;
     if (lastUsedHost && ele) {
       ele.value = lastUsedHost;
       ele.focus();
@@ -136,7 +138,8 @@ export default function Home() {
                   data-tip="URL을 입력해주세요"
                 />
               )}
-              <input id="serverNameInput"
+              <input
+                id="serverNameInput"
                 {...register("address", {
                   pattern: /\./,
                   required: "required",
@@ -152,16 +155,23 @@ export default function Home() {
                   isLoading ? "btn-disabled" : "btn-primary"
                 }`}
               >
-                로그인
-              </button>
-
-              <button
-                className={`btn ${isLoading ? "btn-disabled" : "btn-outline"}`}
-              >
-                <Link href={"/main"}>로그인 없이 즐기기</Link>
+                {isLoading ? (
+                  <div>
+                    <span className="loading loading-spinner" />
+                  </div>
+                ) : (
+                  <div>
+                    <span>로그인</span>
+                  </div>
+                )}
               </button>
             </div>
           </form>
+          <button
+            className={`btn ${isLoading ? "btn-disabled" : "btn-outline"} ml-4`}
+          >
+            <Link href={"/main"}>로그인 없이 즐기기</Link>
+          </button>
         </div>
         <input type="checkbox" id="mastodon_modal" className="modal-toggle" />
         <div className="modal" role="dialog">

From 66199b8f14755b5affc109ca813e0a7d9cb08479 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sun, 17 Nov 2024 22:31:56 +0900
Subject: [PATCH 26/89] =?UTF-8?q?fix:=20=EB=88=84=EB=9D=BD=EB=90=9C=20Answ?=
 =?UTF-8?q?er=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=EC=9D=98=20=EC=86=8D?=
 =?UTF-8?q?=EC=84=B1=20=EC=B6=94=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 | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/main/user/[handle]/[answer]/page.tsx b/src/app/main/user/[handle]/[answer]/page.tsx
index 30de7d0..1711801 100644
--- a/src/app/main/user/[handle]/[answer]/page.tsx
+++ b/src/app/main/user/[handle]/[answer]/page.tsx
@@ -16,7 +16,7 @@ export default function SingleAnswer() {
 
   return (
     <div className="flex w-[90%] window:w-[80%] desktop:w-[70%]">
-      {answerBody && <Answer value={answerBody} />}
+      {answerBody && <Answer value={answerBody} id={answerBody.id} />}
     </div>
   );
 }

From 8b509dcaeb1cb35ec0394dcdefa6819498422ebd Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 08:46:38 +0900
Subject: [PATCH 27/89] =?UTF-8?q?=F0=9F=92=84=20=EB=A7=90=ED=92=8D?=
 =?UTF-8?q?=EC=84=A0=20=EC=82=90=EC=A0=B8=EB=82=98=EC=98=A4=EB=8A=94=20?=
 =?UTF-8?q?=EB=AC=B8=EC=A0=9C=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 4e97e54..08950ec 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -51,7 +51,7 @@ export default function Answer({ value, id }: askProps) {
       )}
 
       <div className={`${!showNsfw && "blur"} w-full h-full`}>
-        <div className="chat chat-start flex justify-between">
+        <div className="chat chat-start flex ml-2 desktop:ml-0 justify-between">
           <div className="w-full">
             <div className="chat-header">
               {value.questioner ? (

From 9d071eb1331fb8a8e0959de2f290f8e35f89e205 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 08:47:23 +0900
Subject: [PATCH 28/89] =?UTF-8?q?=F0=9F=90=9B=20=EA=B7=B8=EB=83=A5=20Esc?=
 =?UTF-8?q?=EB=A7=8C=20=EB=88=8C=EB=A0=80=EC=9D=84=20=EB=95=8C=20=EB=AA=A8?=
 =?UTF-8?q?=EB=8B=AC=20=EB=82=98=EC=98=A4=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/user/[handle]/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index c4d23bc..075881e 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -75,7 +75,7 @@ export default function UserPage() {
       "my_modal_2"
     ) as HTMLInputElement;
     if (e.key === "Escape") {
-      modalState.click();
+      modalState.checked = false;
     }
   };
 

From bb9cb7a7d740728a448c593eeffb79f80f9dbc6e Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 08:49:42 +0900
Subject: [PATCH 29/89] =?UTF-8?q?=F0=9F=90=9B=20Ctrl+Enter=20=EB=88=84?=
 =?UTF-8?q?=EB=A5=B4=EB=A9=B4=20=EB=B9=88=20=EB=8B=B5=EB=B3=80=20=EB=82=A0?=
 =?UTF-8?q?=EC=95=84=EA=B0=80=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/question.tsx | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index fe5dfec..ad83b55 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -40,12 +40,15 @@ export default function Question({
 
   const onCtrlEnter = async (e: React.KeyboardEvent) => {
     if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
-      trigger();
+      const isValid = await trigger();
 
-      const value = getValues();
-
-      if (value) {
-        await onSubmit(value);
+      if (isValid === false) {
+        return;
+      } else {
+        const value = getValues();
+        if (value) {
+          await onSubmit(value);
+        }
       }
     }
   };

From 2ddf69b3a628d7c7c6484b8884ce606ea27b58e2 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 08:50:30 +0900
Subject: [PATCH 30/89] =?UTF-8?q?=E2=9A=A1=EF=B8=8F=20=EB=AF=B8=EB=8B=B5?=
 =?UTF-8?q?=EB=B3=80=20=EC=A7=88=EB=AC=B8=EB=93=A4=EC=97=90=EC=84=9C?=
 =?UTF-8?q?=EB=8F=84=20=EB=AA=A8=EB=8B=AC=20Esc=EB=A1=9C=20=EB=8B=AB?=
 =?UTF-8?q?=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/questions/page.tsx | 24 ++++++++++++++++++++++--
 1 file changed, 22 insertions(+), 2 deletions(-)

diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index c77816d..e7ab924 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -2,7 +2,7 @@
 
 import { questions } from "@/app";
 import Question from "@/app/_components/question";
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { deleteQuestion } from "./action";
 
 const fetchQuestions = async () => {
@@ -13,11 +13,25 @@ const fetchQuestions = async () => {
 
 export default function Questions() {
   const [questions, setQuestions] = useState<questions[]>([]);
+  const parentDivRef = useRef<HTMLDivElement>(null);
+
+  const onEscape = (e: React.KeyboardEvent) => {
+    const modalState = document.getElementById(
+      "my_modal_1"
+    ) as HTMLInputElement;
+    if (e.key === "Escape") {
+      modalState.checked = false;
+    }
+  };
 
   useEffect(() => {
     fetchQuestions().then((r) => setQuestions(r));
   }, []);
 
+  useEffect(() => {
+    parentDivRef.current?.focus();
+  }, [questions]);
+
   return (
     <div className="w-[90%] window:w-[80%] desktop:w-[70%] flex flex-col justify-center">
       <h3 className="text-3xl desktop:text-4xl mb-2">미답변 질문들</h3>
@@ -82,7 +96,13 @@ export default function Questions() {
         </div>
       )}
       <input type="checkbox" id="my_modal_1" className="modal-toggle" />
-      <div className="modal" role="dialog">
+      <div
+        className="modal"
+        role="dialog"
+        onKeyDown={onEscape}
+        tabIndex={0}
+        ref={parentDivRef}
+      >
         <div className="modal-box">
           <h3 className="py-4 text-2xl">답변했어요!</h3>
           <div className="modal-action">

From 62a68734046bcdda243b08fd7c945c158197b7cf Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 08:57:56 +0900
Subject: [PATCH 31/89] =?UTF-8?q?=F0=9F=90=9B=20=EB=8B=B5=EB=B3=80?=
 =?UTF-8?q?=EB=8F=84=20Whitespace=20=EB=84=A3=EC=9D=84=20=EC=88=98=20?=
 =?UTF-8?q?=EC=9E=88=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/question.tsx | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index ad83b55..28447e7 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -29,6 +29,7 @@ export default function Question({
     getValues,
     setValue,
     watch,
+    setError,
     formState: { errors },
   } = useForm<formValue>({
     defaultValues: {
@@ -56,6 +57,16 @@ export default function Question({
   const nsfwedAnswer = watch("nsfw");
 
   const onSubmit: SubmitHandler<formValue> = async (e) => {
+    const detectWhiteSpaces = new RegExp(/^\s+$/);
+
+    if (detectWhiteSpaces.test(e.answer) === true) {
+      setError("answer", {
+        type: "answerOnlyWhiteSpace",
+        message: "답변에 아무말 안 하시게요...?",
+      });
+      return;
+    }
+
     const question = await getQuestion(singleQuestion.id);
     const typedAnswer: typedAnswer = {
       question: question!.question,
@@ -107,6 +118,12 @@ export default function Question({
             onSubmit={handleSubmit(onSubmit)}
             className="flex flex-col gap-2 py-2"
           >
+            {errors.answer && errors.answer.type === "answerOnlyWhiteSpace" && (
+              <div
+                className="tooltip tooltip-open tooltip-error transition-opacity"
+                data-tip={errors.answer.message}
+              />
+            )}
             <textarea
               {...register("answer", { required: "required" })}
               className={`textarea textarea-sm text-sm h-24 desktop:h-32 window:text-xl desktop:text-2xl bg-transparent ${
@@ -115,6 +132,7 @@ export default function Question({
               placeholder="답변을 입력하세요..."
               onKeyDown={onCtrlEnter}
             />
+
             <div className="w-full flex flex-col gap-3 desktop:flex-row justify-between items-center">
               <div className="flex gap-6 mb-2 desktop:mb-0">
                 <div className="flex gap-2 items-center text-xl">

From 7544e5019e5e64ed529d09cbbcb7a47d0298bce7 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 09:51:10 +0900
Subject: [PATCH 32/89] =?UTF-8?q?=F0=9F=92=84=20=EB=A9=94=EC=9D=B8?=
 =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=B2=84=ED=8A=BC=20=EC=9C=84?=
 =?UTF-8?q?=EC=B9=98=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/page.tsx | 98 +++++++++++++++++++++++++-----------------------
 1 file changed, 51 insertions(+), 47 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index aed6163..6642ea0 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -120,58 +120,62 @@ export default function Home() {
             Quesdon
           </span>
         </div>
-        <div className="flex">
+        <div className="flex flex-col desktop:flex-row items-center">
           <form
-            className="flex flex-col desktop:flex-row items-center"
+            className="flex flex-col desktop:flex-row"
             onSubmit={handleSubmit(onSubmit)}
+            id="urlInputForm"
           >
-            <div className="flex flex-col">
-              {errors.address && errors.address.type === "pattern" && (
-                <div
-                  className="tooltip tooltip-open tooltip-error transition-opacity"
-                  data-tip="올바른 URL을 입력해주세요"
-                />
-              )}
-              {errors.address && errors.address.message === "required" && (
-                <div
-                  className="tooltip tooltip-open tooltip-error transition-opacity"
-                  data-tip="URL을 입력해주세요"
-                />
-              )}
-              <input
-                id="serverNameInput"
-                {...register("address", {
-                  pattern: /\./,
-                  required: "required",
-                })}
-                placeholder="serafuku.moe"
-                className="input input-bordered text-lg desktop:text-3xl mb-4 desktop:mb-0"
+            {errors.address && errors.address.type === "pattern" && (
+              <div
+                className="tooltip tooltip-open tooltip-error transition-opacity"
+                data-tip="올바른 URL을 입력해주세요"
               />
-            </div>
-            <div className="flex gap-4">
-              <button
-                type="submit"
-                className={`btn ml-4 ${
-                  isLoading ? "btn-disabled" : "btn-primary"
-                }`}
-              >
-                {isLoading ? (
-                  <div>
-                    <span className="loading loading-spinner" />
-                  </div>
-                ) : (
-                  <div>
-                    <span>로그인</span>
-                  </div>
-                )}
-              </button>
-            </div>
+            )}
+            {errors.address && errors.address.message === "required" && (
+              <div
+                className="tooltip tooltip-open tooltip-error transition-opacity"
+                data-tip="URL을 입력해주세요"
+              />
+            )}
+            <input
+              id="serverNameInput"
+              {...register("address", {
+                pattern: /\./,
+                required: "required",
+              })}
+              placeholder="serafuku.moe"
+              className="input input-bordered text-lg desktop:text-3xl mb-4 desktop:mb-0"
+            />
           </form>
-          <button
-            className={`btn ${isLoading ? "btn-disabled" : "btn-outline"} ml-4`}
-          >
-            <Link href={"/main"}>로그인 없이 즐기기</Link>
-          </button>
+          <div>
+            <button
+              type="submit"
+              className={`btn ml-4 ${
+                isLoading ? "btn-disabled" : "btn-primary"
+              }`}
+              form="urlInputForm"
+            >
+              {isLoading ? (
+                <div>
+                  <span className="loading loading-spinner" />
+                </div>
+              ) : (
+                <div>
+                  <span>로그인</span>
+                </div>
+              )}
+            </button>
+            <button
+              type="button"
+              className={`btn ml-4 ${
+                isLoading ? "btn-disabled" : "btn-outline"
+              }`}
+              onClick={() => (window.location.href = "/main")}
+            >
+              로그인 없이 즐기기
+            </button>
+          </div>
         </div>
         <input type="checkbox" id="mastodon_modal" className="modal-toggle" />
         <div className="modal" role="dialog">

From efb2ced201f047708a4f3ee7718ab0ce0c85e16b Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 09:55:37 +0900
Subject: [PATCH 33/89] =?UTF-8?q?=F0=9F=90=9B=20=ED=81=B4=EB=A6=AD?=
 =?UTF-8?q?=ED=95=98=EB=A9=B4=20=EC=9C=84=EC=B9=98=20=EB=B0=94=EB=80=8C?=
 =?UTF-8?q?=EB=8A=94=20=EA=B1=B0=20=EC=88=98=EC=A0=95=F0=9F=92=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 6642ea0..5631e73 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -148,7 +148,7 @@ export default function Home() {
               className="input input-bordered text-lg desktop:text-3xl mb-4 desktop:mb-0"
             />
           </form>
-          <div>
+          <div className="flex flex-row items-center">
             <button
               type="submit"
               className={`btn ml-4 ${

From ad90725dda31164c008ebbc0a63b2c71b63cca3e Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 10:22:51 +0900
Subject: [PATCH 34/89] =?UTF-8?q?=E2=9C=A8=20=EB=8B=B5=EB=B3=80=20?=
 =?UTF-8?q?=EA=B0=9C=EC=88=98=20=ED=91=9C=EC=8B=9C=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/db/fetch-user-answers/route.ts | 37 ++++++++++++++++------
 src/app/main/user/[handle]/page.tsx        | 28 +++++++++++-----
 2 files changed, 47 insertions(+), 18 deletions(-)

diff --git a/src/app/api/db/fetch-user-answers/route.ts b/src/app/api/db/fetch-user-answers/route.ts
index 698b1d5..6cca2c7 100644
--- a/src/app/api/db/fetch-user-answers/route.ts
+++ b/src/app/api/db/fetch-user-answers/route.ts
@@ -15,12 +15,14 @@ export async function POST(req: NextRequest) {
     }
 
     const prisma = new PrismaClient();
-    const query_limit = data.limit ? Math.max(1, Math.min(data.limit, 100)) : 100;
+    const query_limit = data.limit
+      ? Math.max(1, Math.min(data.limit, 100))
+      : 100;
     const sinceId = data.sinceId;
     const untilId = data.untilId;
-  
+
     //내림차순이 기본값
-    const orderBy = (data.sort === 'ASC') ? 'asc' : 'desc';
+    const orderBy = data.sort === "ASC" ? "asc" : "desc";
 
     if (!data.answeredPersonHandle) {
       throw new Error(`answeredPersonHandle is null`);
@@ -29,18 +31,33 @@ export async function POST(req: NextRequest) {
       where: {
         answeredPersonHandle: data.answeredPersonHandle,
         id: {
-          ...(typeof sinceId === 'string' ? { gt: sinceId } : {}),
-          ...(typeof untilId === 'string' ? { lt: untilId } : {}),
+          ...(typeof sinceId === "string" ? { gt: sinceId } : {}),
+          ...(typeof untilId === "string" ? { lt: untilId } : {}),
         },
       },
       orderBy: {
-        id: orderBy
-      }, 
-      take: query_limit
+        id: orderBy,
+      },
+      take: query_limit,
+    });
+
+    const answerCount = await prisma.profile.findMany({
+      where: {
+        handle: data.answeredPersonHandle,
+      },
+      select: {
+        _count: {
+          select: {
+            answer: true,
+          },
+        },
       },
-    );
+    });
 
-    return NextResponse.json(res);
+    return NextResponse.json({
+      answers: res,
+      count: answerCount[0]._count.answer,
+    });
   } catch (err) {
     console.log(err);
   }
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 075881e..2d27801 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -16,6 +16,11 @@ type FormValue = {
   questioner: boolean;
 };
 
+type ResponseType = {
+  answers: AnswerDto[];
+  count: number;
+};
+
 async function fetchProfile(handle: string) {
   const profile = await fetch(`/api/db/fetch-profile/${handle}`);
   if (profile && profile.ok) {
@@ -30,6 +35,7 @@ export default function UserPage() {
   const [userInfo, setUserInfo] = useState<userProfileDto>();
   const [localHandle, setLocalHandle] = useState<string>("");
   const [answers, setAnswers] = useState<AnswerDto[]>([]);
+  const [count, setCount] = useState<number>(0);
   const [untilId, setUntilId] = useState<string | null>(null);
   const [loading, setLoading] = useState<boolean>(true);
   const [mounted, setMounted] = useState<HTMLDivElement | null>(null);
@@ -81,7 +87,7 @@ export default function UserPage() {
 
   const fetchUserAnswers = async (
     q: FetchUserAnswersDto
-  ): Promise<AnswerDto[]> => {
+  ): Promise<ResponseType> => {
     const res = await fetch("/api/db/fetch-user-answers", {
       method: "POST",
       body: JSON.stringify(q),
@@ -102,6 +108,7 @@ export default function UserPage() {
     });
     const filteredAnswer = answers.filter((el) => el.id !== id);
     setAnswers(filteredAnswer);
+    setCount((prevCount) => prevCount - 1);
   };
 
   const mkQuestionCreateApi = async (
@@ -199,13 +206,14 @@ export default function UserPage() {
         answeredPersonHandle: userInfo.handle,
         sort: "DESC",
         limit: 20,
-      }).then((r: AnswerDto[]) => {
-        if (r.length === 0) {
+      }).then(({ answers, count }: ResponseType) => {
+        if (answers.length === 0) {
           setLoading(false);
           return;
         }
-        setAnswers(r);
-        setUntilId(r[r.length - 1].id);
+        setAnswers(answers);
+        setCount(count);
+        setUntilId(answers[answers.length - 1].id);
       });
     }
   }, [profileHandle, userInfo]);
@@ -220,12 +228,12 @@ export default function UserPage() {
             untilId: untilId,
             answeredPersonHandle: profileHandle,
           }).then((r) => {
-            if (r.length === 0) {
+            if (r.answers.length === 0) {
               setLoading(false);
               return;
             }
-            setAnswers((prev_answers) => [...prev_answers, ...r]);
-            setUntilId(r[r.length - 1].id);
+            setAnswers((prev_answers) => [...prev_answers, ...r.answers]);
+            setUntilId(r.answers[r.answers.length - 1].id);
           });
         }
       },
@@ -355,6 +363,10 @@ export default function UserPage() {
             )}
           </div>
           <div className="desktop:ml-2 desktop:w-[50%]">
+            <div className="flex items-center gap-2 my-2 text-2xl">
+              <span>답변</span>
+              <span className="badge badge-ghost">{count}</span>
+            </div>
             {answers !== null ? (
               <div>
                 {answers.length > 0 ? (

From de0a5032c59c74f7b646551531fc94a8a0cb35ad Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 10:42:11 +0900
Subject: [PATCH 35/89] =?UTF-8?q?=E2=9A=A1=EF=B8=8F=20=EB=A1=9C=EB=94=A9?=
 =?UTF-8?q?=EC=8B=9C=EC=97=90=20=EB=A1=9C=EB=94=A9=20=EC=8A=A4=ED=94=BC?=
 =?UTF-8?q?=EB=84=88=20=EC=A0=9C=EB=8C=80=EB=A1=9C=20=EB=82=98=EC=98=A4?=
 =?UTF-8?q?=EB=8F=84=EB=A1=9D=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/question.tsx    |   2 +-
 src/app/main/page.tsx               |   9 ++-
 src/app/main/questions/page.tsx     | 102 ++++++++++++++++------------
 src/app/main/user/[handle]/page.tsx |  29 ++++----
 4 files changed, 81 insertions(+), 61 deletions(-)

diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 28447e7..304c1ef 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -12,7 +12,7 @@ interface formValue {
 interface askProps {
   singleQuestion: questions;
   multipleQuestions: questions[];
-  setState: React.Dispatch<React.SetStateAction<questions[]>>;
+  setState: React.Dispatch<React.SetStateAction<questions[] | null>>;
   id: number;
 }
 
diff --git a/src/app/main/page.tsx b/src/app/main/page.tsx
index 17df9df..9ab8295 100644
--- a/src/app/main/page.tsx
+++ b/src/app/main/page.tsx
@@ -22,7 +22,7 @@ async function fetchAllAnswers(req: FetchAllAnswersDto) {
   }
 }
 export default function MainBody() {
-  const [answers, setAnswers] = useState<answer[]>([]);
+  const [answers, setAnswers] = useState<answer[] | null>(null);
   const [mounted, setMounted] = useState<HTMLDivElement | null>(null);
   const [untilId, setUntilId] = useState<string | null>(null);
   const [loading, setLoading] = useState<boolean>(true);
@@ -31,6 +31,7 @@ export default function MainBody() {
     fetchAllAnswers({ sort: "DESC", limit: 25 }).then((r) => {
       if (r.length === 0) {
         setLoading(false);
+        setAnswers([]);
         return;
       }
       setAnswers(r);
@@ -48,7 +49,9 @@ export default function MainBody() {
                 setLoading(false);
                 return;
               }
-              setAnswers((prev_answers) => [...prev_answers, ...r]);
+              setAnswers((prev_answers) =>
+                prev_answers ? [...prev_answers, ...r] : null
+              );
               setUntilId(r[r.length - 1].id);
             }
           );
@@ -67,7 +70,7 @@ export default function MainBody() {
   return (
     <div className="w-[90%] window:w-[80%] desktop:w-[70%]">
       <h3 className="text-3xl desktop:text-4xl mb-2">최근 올라온 답변들</h3>
-      {answers === undefined ? (
+      {answers === null ? (
         <div className="flex justify-center">
           <span className="loading loading-spinner loading-lg" />
         </div>
diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index e7ab924..ab5aefd 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -12,7 +12,7 @@ const fetchQuestions = async () => {
 };
 
 export default function Questions() {
-  const [questions, setQuestions] = useState<questions[]>([]);
+  const [questions, setQuestions] = useState<questions[] | null>(null);
   const parentDivRef = useRef<HTMLDivElement>(null);
 
   const onEscape = (e: React.KeyboardEvent) => {
@@ -41,56 +41,68 @@ export default function Questions() {
         </div>
       ) : (
         <div className="w-full">
-          {questions.length > 0 ? (
+          {questions ? (
             <div>
-              {questions.map((el) => (
-                <div key={el.id}>
-                  <Question
-                    singleQuestion={el}
-                    multipleQuestions={questions}
-                    setState={setQuestions}
-                    id={el.id}
-                  />
-                  <input
-                    type="checkbox"
-                    id={`question_delete_modal_${el.id}`}
-                    className="modal-toggle"
-                  />
-                  <div className="modal" role="dialog">
-                    <div className="modal-box">
-                      <h3 className="py-4 text-2xl">질문을 지울까요...?</h3>
-                      <div className="modal-action">
-                        <label
-                          htmlFor={`question_delete_modal_${el.id}`}
-                          className="btn btn-error"
-                          onClick={() => {
-                            deleteQuestion(el.id);
-                            setQuestions((prevQuestions) => [
-                              ...prevQuestions.filter(
-                                (prev) => prev.id !== el.id
-                              ),
-                            ]);
-                          }}
-                        >
-                          확인
-                        </label>
-                        <label
-                          htmlFor={`question_delete_modal_${el.id}`}
-                          className="btn"
-                        >
-                          취소
-                        </label>
+              {questions.length > 0 ? (
+                <div>
+                  {questions.map((el) => (
+                    <div key={el.id}>
+                      <Question
+                        singleQuestion={el}
+                        multipleQuestions={questions}
+                        setState={setQuestions}
+                        id={el.id}
+                      />
+                      <input
+                        type="checkbox"
+                        id={`question_delete_modal_${el.id}`}
+                        className="modal-toggle"
+                      />
+                      <div className="modal" role="dialog">
+                        <div className="modal-box">
+                          <h3 className="py-4 text-2xl">질문을 지울까요...?</h3>
+                          <div className="modal-action">
+                            <label
+                              htmlFor={`question_delete_modal_${el.id}`}
+                              className="btn btn-error"
+                              onClick={() => {
+                                deleteQuestion(el.id);
+                                setQuestions((prevQuestions) =>
+                                  prevQuestions
+                                    ? [
+                                        ...prevQuestions.filter(
+                                          (prev) => prev.id !== el.id
+                                        ),
+                                      ]
+                                    : null
+                                );
+                              }}
+                            >
+                              확인
+                            </label>
+                            <label
+                              htmlFor={`question_delete_modal_${el.id}`}
+                              className="btn"
+                            >
+                              취소
+                            </label>
+                          </div>
+                        </div>
                       </div>
                     </div>
-                  </div>
+                  ))}
                 </div>
-              ))}
+              ) : (
+                <div className="h-fit p-4 glass rounded-box flex flex-col items-center shadow mb-2">
+                  <h1 className="text-xl desktop:text-3xl">
+                    👍 답변하지 않은 질문이 없어요!
+                  </h1>
+                </div>
+              )}
             </div>
           ) : (
-            <div className="h-fit p-4 glass rounded-box flex flex-col items-center shadow mb-2">
-              <h1 className="text-xl desktop:text-3xl">
-                👍 답변하지 않은 질문이 없어요!
-              </h1>
+            <div className="w-full flex justify-center">
+              <span className="loading loading-spinner loading-lg" />
             </div>
           )}
         </div>
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 2d27801..0881cf1 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -34,8 +34,8 @@ export default function UserPage() {
   const { handle } = useParams() as { handle: string };
   const [userInfo, setUserInfo] = useState<userProfileDto>();
   const [localHandle, setLocalHandle] = useState<string>("");
-  const [answers, setAnswers] = useState<AnswerDto[]>([]);
-  const [count, setCount] = useState<number>(0);
+  const [answers, setAnswers] = useState<AnswerDto[] | null>(null);
+  const [count, setCount] = useState<number | null>(0);
   const [untilId, setUntilId] = useState<string | null>(null);
   const [loading, setLoading] = useState<boolean>(true);
   const [mounted, setMounted] = useState<HTMLDivElement | null>(null);
@@ -106,9 +106,11 @@ export default function UserPage() {
       method: "POST",
       body: JSON.stringify({ id: id }),
     });
-    const filteredAnswer = answers.filter((el) => el.id !== id);
-    setAnswers(filteredAnswer);
-    setCount((prevCount) => prevCount - 1);
+    if (answers && count) {
+      const filteredAnswer = answers.filter((el) => el.id !== id);
+      setAnswers(filteredAnswer);
+      setCount((prevCount) => (prevCount ? prevCount - 1 : null));
+    }
   };
 
   const mkQuestionCreateApi = async (
@@ -209,6 +211,7 @@ export default function UserPage() {
       }).then(({ answers, count }: ResponseType) => {
         if (answers.length === 0) {
           setLoading(false);
+          setAnswers([]);
           return;
         }
         setAnswers(answers);
@@ -221,7 +224,7 @@ export default function UserPage() {
   useEffect(() => {
     const observer = new IntersectionObserver(
       ([e]) => {
-        if (e.isIntersecting && untilId !== null) {
+        if (e.isIntersecting && untilId !== null && answers !== null) {
           fetchUserAnswers({
             sort: "DESC",
             limit: 20,
@@ -232,7 +235,9 @@ export default function UserPage() {
               setLoading(false);
               return;
             }
-            setAnswers((prev_answers) => [...prev_answers, ...r.answers]);
+            setAnswers((prev_answers) =>
+              prev_answers ? [...prev_answers, ...r.answers] : null
+            );
             setUntilId(r.answers[r.answers.length - 1].id);
           });
         }
@@ -363,12 +368,12 @@ export default function UserPage() {
             )}
           </div>
           <div className="desktop:ml-2 desktop:w-[50%]">
-            <div className="flex items-center gap-2 my-2 text-2xl">
-              <span>답변</span>
-              <span className="badge badge-ghost">{count}</span>
-            </div>
             {answers !== null ? (
               <div>
+                <div className="flex items-center gap-2 my-2 text-2xl">
+                  <span>답변</span>
+                  <span className="badge badge-ghost">{count}</span>
+                </div>
                 {answers.length > 0 ? (
                   <div className="flex flex-col">
                     {answers.map((el) => (
@@ -425,7 +430,7 @@ export default function UserPage() {
                 )}
               </div>
             ) : (
-              <div>
+              <div className="w-full flex justify-center">
                 <span className="loading loading-spinner loading-lg" />
               </div>
             )}

From e556b553cba15bfcb485e4f5934add6ccbb8cd43 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Mon, 18 Nov 2024 11:16:11 +0900
Subject: [PATCH 36/89] =?UTF-8?q?=E2=9C=A8=20=ED=97=A4=EB=8D=94=20?=
 =?UTF-8?q?=EC=95=84=EB=B0=94=ED=83=80=EC=97=90=20=EC=83=88=20=EC=A7=88?=
 =?UTF-8?q?=EB=AC=B8=20=EC=9E=87=EC=9C=BC=EB=A9=B4=20=ED=91=9C=EC=8B=9C=20?=
 =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_dto/fetch-profile/Profile.dto.ts |  1 +
 src/app/api/db/fetch-my-profile/route.ts  | 18 +++++++++++++--
 src/app/main/_header.tsx                  | 28 ++++++++++++++++-------
 3 files changed, 37 insertions(+), 10 deletions(-)

diff --git a/src/app/_dto/fetch-profile/Profile.dto.ts b/src/app/_dto/fetch-profile/Profile.dto.ts
index 7eca4ac..7debd99 100644
--- a/src/app/_dto/fetch-profile/Profile.dto.ts
+++ b/src/app/_dto/fetch-profile/Profile.dto.ts
@@ -1,6 +1,7 @@
 export interface userProfileDto {
   handle: string;
   name: string[];
+  questions: number;
   stopNewQuestion: boolean;
   stopAnonQuestion: boolean;
   stopNotiNewQuestion: boolean;
diff --git a/src/app/api/db/fetch-my-profile/route.ts b/src/app/api/db/fetch-my-profile/route.ts
index bf5d3cb..5bb62d8 100644
--- a/src/app/api/db/fetch-my-profile/route.ts
+++ b/src/app/api/db/fetch-my-profile/route.ts
@@ -10,13 +10,13 @@ export async function GET(req: NextRequest) {
 
   try {
     if (!token) {
-      return sendApiError(401, 'No Auth Token');
+      return sendApiError(401, "No Auth Token");
     }
     let handle: string;
     try {
       handle = (await verifyToken(token)).handle;
     } catch {
-      return sendApiError(401, 'Token Verify Error');
+      return sendApiError(401, "Token Verify Error");
     }
 
     const userProfile = await prisma.profile.findUnique({
@@ -27,6 +27,19 @@ export async function GET(req: NextRequest) {
     if (!userProfile) {
       return NextResponse.json({ message: `User not found` }, { status: 404 });
     }
+
+    const questionCount = await prisma.profile.findMany({
+      where: {
+        handle: handle,
+      },
+      select: {
+        _count: {
+          select: {
+            questions: true,
+          },
+        },
+      },
+    });
     const res: userProfileDto = {
       handle: userProfile.handle,
       name: userProfile.name,
@@ -36,6 +49,7 @@ export async function GET(req: NextRequest) {
       questionBoxName: userProfile.questionBoxName,
       stopNotiNewQuestion: userProfile.stopNotiNewQuestion,
       stopPostAnswer: userProfile.stopPostAnswer,
+      questions: questionCount[0]._count.questions,
     };
 
     return NextResponse.json(res);
diff --git a/src/app/main/_header.tsx b/src/app/main/_header.tsx
index 124c87f..c92d59a 100644
--- a/src/app/main/_header.tsx
+++ b/src/app/main/_header.tsx
@@ -12,9 +12,9 @@ const fetchMyProfile = async () => {
     const res = await fetch("/api/db/fetch-my-profile", {
       method: "GET",
     });
-    if(!res.ok) {
+    if (!res.ok) {
       if (res.status === 401) {
-        document.getElementById('forceLogoutNoteModal')?.click();
+        document.getElementById("forceLogoutNoteModal")?.click();
       }
       return;
     }
@@ -25,7 +25,7 @@ const fetchMyProfile = async () => {
 
 const logout = async () => {
   await fetch("/api/web/logout");
-  localStorage.removeItem('user_handle');
+  localStorage.removeItem("user_handle");
   window.location.replace("/");
 };
 
@@ -34,7 +34,7 @@ export default function MainHeader() {
 
   useEffect(() => {
     fetchMyProfile().then((r) => setUser(r));
-  }, [fetchMyProfile]);
+  }, []);
 
   return (
     <div className="w-[90%] window:w-[80%] desktop:w-[70%] navbar bg-base-100 shadow rounded-box my-4">
@@ -47,7 +47,9 @@ export default function MainHeader() {
         <div
           tabIndex={0}
           role="button"
-          className="btn btn-ghost btn-circle avatar"
+          className={`btn btn-ghost btn-circle avatar ${
+            user?.questions && user?.questions > 0 && "online"
+          }`}
         >
           <div className="w-10 rounded-full">
             {user?.avatarUrl ? (
@@ -118,12 +120,22 @@ export default function MainHeader() {
           </div>
         </div>
       </div>
-      <input type="checkbox" id="forceLogoutNoteModal" className="modal-toggle" />
+      <input
+        type="checkbox"
+        id="forceLogoutNoteModal"
+        className="modal-toggle"
+      />
       <div className="modal" role="dialog">
         <div className="modal-box">
-          <h3 className="py-4 text-2xl">로그인 유효시간이 만료되어서 로그아웃 되었어요!</h3>
+          <h3 className="py-4 text-2xl">
+            로그인 유효시간이 만료되어서 로그아웃 되었어요!
+          </h3>
           <div className="modal-action">
-            <label htmlFor="forceLogoutNoteModal" className="btn btn-primary" onClick={logout}>
+            <label
+              htmlFor="forceLogoutNoteModal"
+              className="btn btn-primary"
+              onClick={logout}
+            >
               홈으로 돌아가기
             </label>
           </div>

From f450b412e02bd47b275468300dd93e93c5aed892 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Tue, 19 Nov 2024 01:48:55 +0900
Subject: [PATCH 37/89] =?UTF-8?q?=F0=9F=9A=A8=20=EB=B9=8C=EB=93=9C=20?=
 =?UTF-8?q?=EC=97=90=EB=9F=AC=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_dto/fetch-profile/Profile.dto.ts     |  5 +++-
 src/app/api/db/fetch-my-profile/route.ts      |  8 +++----
 .../api/db/fetch-profile/[handle]/route.ts    | 23 +++++++++++--------
 src/app/api/web/login/route.ts                | 16 +++++--------
 src/app/main/_header.tsx                      |  4 ++--
 src/app/main/user/[handle]/[answer]/page.tsx  |  2 +-
 6 files changed, 31 insertions(+), 27 deletions(-)

diff --git a/src/app/_dto/fetch-profile/Profile.dto.ts b/src/app/_dto/fetch-profile/Profile.dto.ts
index 7debd99..58f0ba5 100644
--- a/src/app/_dto/fetch-profile/Profile.dto.ts
+++ b/src/app/_dto/fetch-profile/Profile.dto.ts
@@ -1,7 +1,6 @@
 export interface userProfileDto {
   handle: string;
   name: string[];
-  questions: number;
   stopNewQuestion: boolean;
   stopAnonQuestion: boolean;
   stopNotiNewQuestion: boolean;
@@ -9,3 +8,7 @@ export interface userProfileDto {
   avatarUrl: string;
   questionBoxName: string;
 }
+
+export interface userProfileWithCountDto extends userProfileDto {
+  questions: number | null;
+}
diff --git a/src/app/api/db/fetch-my-profile/route.ts b/src/app/api/db/fetch-my-profile/route.ts
index 5bb62d8..c1004e1 100644
--- a/src/app/api/db/fetch-my-profile/route.ts
+++ b/src/app/api/db/fetch-my-profile/route.ts
@@ -1,4 +1,4 @@
-import { userProfileDto } from "@/app/_dto/fetch-profile/Profile.dto";
+import { userProfileWithCountDto } from "@/app/_dto/fetch-profile/Profile.dto";
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
@@ -28,7 +28,7 @@ export async function GET(req: NextRequest) {
       return NextResponse.json({ message: `User not found` }, { status: 404 });
     }
 
-    const questionCount = await prisma.profile.findMany({
+    const questionCount = await prisma.profile.findUnique({
       where: {
         handle: handle,
       },
@@ -40,7 +40,7 @@ export async function GET(req: NextRequest) {
         },
       },
     });
-    const res: userProfileDto = {
+    const res: userProfileWithCountDto = {
       handle: userProfile.handle,
       name: userProfile.name,
       stopNewQuestion: userProfile.stopNewQuestion,
@@ -49,7 +49,7 @@ export async function GET(req: NextRequest) {
       questionBoxName: userProfile.questionBoxName,
       stopNotiNewQuestion: userProfile.stopNotiNewQuestion,
       stopPostAnswer: userProfile.stopPostAnswer,
-      questions: questionCount[0]._count.questions,
+      questions: questionCount ? questionCount._count.questions : null,
     };
 
     return NextResponse.json(res);
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index 1a7c23f..a74e0d4 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -3,12 +3,15 @@ import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 
-export async function GET(req: NextRequest, { params }: { params: Promise<{handle?: string}> }) {
+export async function GET(
+  req: NextRequest,
+  { params }: { params: Promise<{ handle?: string }> }
+) {
   const prisma = new PrismaClient();
   const userHandle = (await params).handle;
   try {
-    if (!userHandle) { 
-      return sendApiError(400, 'userHandle empty');
+    if (!userHandle) {
+      return sendApiError(400, "userHandle empty");
     }
     const profile = await prisma.profile.findUnique({
       where: {
@@ -16,7 +19,10 @@ export async function GET(req: NextRequest, { params }: { params: Promise<{handl
       },
     });
     if (!profile) {
-      return NextResponse.json({ message: `profile ${profile} not found`}, {status: 404});
+      return NextResponse.json(
+        { message: `profile ${profile} not found` },
+        { status: 404 }
+      );
     }
     const resBody: userProfileDto = {
       handle: profile.handle,
@@ -27,16 +33,15 @@ export async function GET(req: NextRequest, { params }: { params: Promise<{handl
       questionBoxName: profile.questionBoxName,
       stopNotiNewQuestion: profile.stopNotiNewQuestion,
       stopPostAnswer: profile.stopPostAnswer,
-    }
-
+    };
 
     return NextResponse.json(resBody, {
       status: 200,
       headers: {
-        'Cache-Control': 'public, max-age=10',
-      }
+        "Cache-Control": "public, max-age=10",
+      },
     });
   } catch (err) {
-    return sendApiError(500, 'Error');
+    return sendApiError(500, "Error");
   }
 }
diff --git a/src/app/api/web/login/route.ts b/src/app/api/web/login/route.ts
index 28f81dc..05f3a1c 100644
--- a/src/app/api/web/login/route.ts
+++ b/src/app/api/web/login/route.ts
@@ -49,7 +49,7 @@ export async function POST(req: NextRequest) {
       }
       const data = await res.json();
       const appSecret = data.secret;
-      console.log('New Misskey APP created!', data);
+      console.log("New Misskey APP created!", data);
 
       await prisma.server.upsert({
         where: {
@@ -63,10 +63,7 @@ export async function POST(req: NextRequest) {
           instances: misskeyHost,
         },
       });
-      const authRes = await initiateMisskeyAuthSession(
-        misskeyHost,
-        appSecret
-      );
+      const authRes = await initiateMisskeyAuthSession(misskeyHost, appSecret);
       if (!authRes.ok) {
         return sendErrorResponse(
           500,
@@ -87,16 +84,15 @@ export async function POST(req: NextRequest) {
         const data = (await res.json()) as MiApiError;
         if (data.error.code === "NO_SUCH_APP") {
           // 어라라...? 앱 스크릿 무효화
-          console.log(`Misskey response NO_SUCH_APP, delete invalid appSecret from DB`);
+          console.log(
+            `Misskey response NO_SUCH_APP, delete invalid appSecret from DB`
+          );
           await prisma.server.update({
             where: { instances: misskeyHost },
             data: { appSecret: null },
           });
         }
-        return sendErrorResponse(
-          500,
-          `Fail to Create Misskey Auth Session`
-        );
+        return sendErrorResponse(500, `Fail to Create Misskey Auth Session`);
       }
       const misskeyAuthSession = (await res.json()) as MiAuthSession;
       console.log(`New Misskey Auth Session Created: `, misskeyAuthSession);
diff --git a/src/app/main/_header.tsx b/src/app/main/_header.tsx
index c92d59a..d7fcf7b 100644
--- a/src/app/main/_header.tsx
+++ b/src/app/main/_header.tsx
@@ -3,7 +3,7 @@
 import Link from "next/link";
 import { useCallback, useEffect, useState } from "react";
 import { FaUser } from "react-icons/fa";
-import { userProfileDto } from "../_dto/fetch-profile/Profile.dto";
+import { userProfileWithCountDto } from "../_dto/fetch-profile/Profile.dto";
 
 const fetchMyProfile = async () => {
   const user_handle = localStorage.getItem("user_handle");
@@ -30,7 +30,7 @@ const logout = async () => {
 };
 
 export default function MainHeader() {
-  const [user, setUser] = useState<userProfileDto>();
+  const [user, setUser] = useState<userProfileWithCountDto>();
 
   useEffect(() => {
     fetchMyProfile().then((r) => setUser(r));
diff --git a/src/app/main/user/[handle]/[answer]/page.tsx b/src/app/main/user/[handle]/[answer]/page.tsx
index 30de7d0..1711801 100644
--- a/src/app/main/user/[handle]/[answer]/page.tsx
+++ b/src/app/main/user/[handle]/[answer]/page.tsx
@@ -16,7 +16,7 @@ export default function SingleAnswer() {
 
   return (
     <div className="flex w-[90%] window:w-[80%] desktop:w-[70%]">
-      {answerBody && <Answer value={answerBody} />}
+      {answerBody && <Answer value={answerBody} id={answerBody.id} />}
     </div>
   );
 }

From 851c62d49c42af45c4e48e4be542fca9c987bc29 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Tue, 19 Nov 2024 03:13:00 +0900
Subject: [PATCH 38/89] =?UTF-8?q?fix:=20=EC=A7=88=EB=AC=B8,=20=EB=8B=B5?=
 =?UTF-8?q?=EB=B3=80=20=EC=9E=91=EC=84=B1=EC=8B=9C=EA=B0=84=20=ED=8F=AC?=
 =?UTF-8?q?=EB=A7=B7=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx                 | 2 +-
 src/app/_components/question.tsx               | 2 +-
 src/app/api/db/fetch-profile/[handle]/route.ts | 1 +
 3 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 08950ec..5eeb21d 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -103,7 +103,7 @@ export default function Answer({ value, id }: askProps) {
           </div>
           <div className="chat-footer font-thin text-xs mt-2 underline text-blue-900">
             <Link href={`/main/user/${value.answeredPersonHandle}/${value.id}`}>
-              {value.answeredAt.toLocaleString()}
+              {new Date(value.answeredAt).toLocaleString('ko-kr', {hour12: false})}
             </Link>
           </div>
         </div>
diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 304c1ef..ae7cf1b 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -101,7 +101,7 @@ export default function Question({
           {singleQuestion.question}
         </div>
         <div className="chat-footer opacity-50">
-          {singleQuestion.questionedAt.toLocaleString()}
+          {new Date(singleQuestion.questionedAt).toLocaleString('ko-KR', {hour12: false})}
           <span
             className="text-red-500 font-bold ml-2 cursor-pointer"
             onClick={() =>
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index a74e0d4..cf15c95 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -42,6 +42,7 @@ export async function GET(
       },
     });
   } catch (err) {
+    console.log(err);
     return sendApiError(500, "Error");
   }
 }

From c5ac3f68dc184ce61ca3e316661f91e09acac62f Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Tue, 19 Nov 2024 10:01:42 +0900
Subject: [PATCH 39/89] =?UTF-8?q?=F0=9F=9A=A8=20linter=EC=97=90=EC=84=9C?=
 =?UTF-8?q?=20img=ED=83=9C=EA=B7=B8=20=EC=84=A4=EC=A0=95=20=EB=B3=80?=
 =?UTF-8?q?=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .eslintrc.json | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/.eslintrc.json b/.eslintrc.json
index 798d8cb..50efe77 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -1,6 +1,7 @@
 {
   "extends": ["next/core-web-vitals", "next/typescript"],
   "rules": {
-    "@typescript-eslint/no-unused-vars": "off"
+    "@typescript-eslint/no-unused-vars": "off",
+    "@next/next/no-img-element": "off"
   }
 }

From 139972ac508d149ffa1979476f0df69e9c7fe5ce Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Tue, 19 Nov 2024 10:02:19 +0900
Subject: [PATCH 40/89] =?UTF-8?q?=F0=9F=94=A7=20reactStrictMode=20?=
 =?UTF-8?q?=EB=8B=A4=EC=8B=9C=20true=EB=A1=9C=20=EC=84=A4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 next.config.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/next.config.ts b/next.config.ts
index 7932926..fe0761f 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -3,10 +3,9 @@ import "reflect-metadata";
 
 const nextConfig: NextConfig = {
   output: "standalone",
-  reactStrictMode: true,
   experimental: {
     forceSwcTransforms: true,
-  }
+  },
 };
 
 export default nextConfig;

From 2d750a525e0aee6e8905abf1022d67b60bcb4e7a Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Tue, 19 Nov 2024 10:02:54 +0900
Subject: [PATCH 41/89] =?UTF-8?q?=E2=9C=A8=20=EC=A7=88=EB=AC=B8=ED=95=A8?=
 =?UTF-8?q?=EC=97=90=20=EB=B0=9B=EC=B9=A8=20=EA=B2=80=EC=82=AC=ED=95=B4?=
 =?UTF-8?q?=EC=84=9C=20=EB=A7=9E=EC=B6=A4=EB=B2=95=20=EB=A7=9E=EC=B6=94?=
 =?UTF-8?q?=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/functions/josa.ts       | 10 ++++++++++
 src/app/main/user/[handle]/page.tsx | 12 ++++++++++--
 2 files changed, 20 insertions(+), 2 deletions(-)
 create mode 100644 src/app/api/functions/josa.ts

diff --git a/src/app/api/functions/josa.ts b/src/app/api/functions/josa.ts
new file mode 100644
index 0000000..f831944
--- /dev/null
+++ b/src/app/api/functions/josa.ts
@@ -0,0 +1,10 @@
+export default function josa(
+  str: string | undefined,
+  whenTrue: string,
+  whenFalse: string
+) {
+  if (str)
+    return (str.charCodeAt(str.length - 1) - "가".charCodeAt(0)) % 28 > 0
+      ? str + whenTrue
+      : str + whenFalse;
+}
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 0881cf1..e037775 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -10,6 +10,7 @@ import { userProfileDto } from "@/app/_dto/fetch-profile/Profile.dto";
 import { CreateQuestionDto } from "@/app/_dto/create_question/create-question.dto";
 import { AnswerDto } from "@/app/_dto/Answers.dto";
 import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
+import josa from "@/app/api/functions/josa";
 
 type FormValue = {
   question: string;
@@ -125,7 +126,11 @@ export default function UserPage() {
 
   const shareUrl = () => {
     const server = localStorage.getItem("server");
-    const text = `저의 ${userInfo?.questionBoxName}이에요! #neo-quesdon ${location.origin}/main/user/${userInfo?.handle}`;
+    const text = `저의 ${josa(
+      userInfo?.questionBoxName,
+      "이에요!",
+      "예요!"
+    )} #neo-quesdon ${location.origin}/main/user/${userInfo?.handle}`;
     return `https://${server}/share?text=${encodeURIComponent(text)}`;
   };
 
@@ -302,7 +307,10 @@ export default function UserPage() {
                         width={32}
                         height={32}
                       />
-                      <span>님의 {userInfo?.questionBoxName}이에요!</span>
+                      <span>
+                        님의{" "}
+                        {josa(userInfo?.questionBoxName, "이에요!", "예요!")}
+                      </span>
                     </div>
                   )}
                 </div>

From 78b3aafebffa788316b71731cdd62f0c4b1a2773 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Tue, 19 Nov 2024 10:59:46 +0900
Subject: [PATCH 42/89] =?UTF-8?q?=E2=9C=A8=20=ED=94=84=EB=A1=9C=ED=95=84?=
 =?UTF-8?q?=EC=82=AC=EC=A7=84=20=EB=88=84=EB=A5=B4=EB=A9=B4=20=EC=9C=A0?=
 =?UTF-8?q?=EC=A0=80=20=ED=94=84=EB=A1=9C=ED=95=84=20=EB=B3=B4=EC=97=AC?=
 =?UTF-8?q?=EC=A3=BC=EA=B8=B0=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_dto/fetch-profile/Profile.dto.ts     |  4 ++
 .../api/db/fetch-profile/[handle]/route.ts    | 23 +++++++-
 src/app/main/user/[handle]/page.tsx           | 59 +++++++++++--------
 3 files changed, 58 insertions(+), 28 deletions(-)

diff --git a/src/app/_dto/fetch-profile/Profile.dto.ts b/src/app/_dto/fetch-profile/Profile.dto.ts
index 58f0ba5..1cd53f9 100644
--- a/src/app/_dto/fetch-profile/Profile.dto.ts
+++ b/src/app/_dto/fetch-profile/Profile.dto.ts
@@ -12,3 +12,7 @@ export interface userProfileDto {
 export interface userProfileWithCountDto extends userProfileDto {
   questions: number | null;
 }
+
+export interface userProfileWithHostnameDto extends userProfileDto {
+  hostname: string;
+}
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index a74e0d4..b16890e 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -1,4 +1,7 @@
-import { userProfileDto } from "@/app/_dto/fetch-profile/Profile.dto";
+import {
+  userProfileDto,
+  userProfileWithHostnameDto,
+} from "@/app/_dto/fetch-profile/Profile.dto";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
@@ -17,6 +20,21 @@ export async function GET(
       where: {
         handle: userHandle,
       },
+      select: {
+        user: {
+          select: {
+            hostName: true,
+          },
+        },
+        handle: true,
+        name: true,
+        stopNewQuestion: true,
+        stopAnonQuestion: true,
+        avatarUrl: true,
+        questionBoxName: true,
+        stopNotiNewQuestion: true,
+        stopPostAnswer: true,
+      },
     });
     if (!profile) {
       return NextResponse.json(
@@ -24,7 +42,7 @@ export async function GET(
         { status: 404 }
       );
     }
-    const resBody: userProfileDto = {
+    const resBody: userProfileWithHostnameDto = {
       handle: profile.handle,
       name: profile.name,
       stopNewQuestion: profile.stopNewQuestion,
@@ -33,6 +51,7 @@ export async function GET(
       questionBoxName: profile.questionBoxName,
       stopNotiNewQuestion: profile.stopNotiNewQuestion,
       stopPostAnswer: profile.stopPostAnswer,
+      hostname: profile.user.hostName,
     };
 
     return NextResponse.json(resBody, {
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index e037775..45796fb 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -6,11 +6,12 @@ import { useEffect, useState } from "react";
 import { SubmitHandler, useForm } from "react-hook-form";
 import Answer from "@/app/_components/answer";
 import { FaUserSlash } from "react-icons/fa";
-import { userProfileDto } from "@/app/_dto/fetch-profile/Profile.dto";
+import { userProfileWithHostnameDto } from "@/app/_dto/fetch-profile/Profile.dto";
 import { CreateQuestionDto } from "@/app/_dto/create_question/create-question.dto";
 import { AnswerDto } from "@/app/_dto/Answers.dto";
 import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
 import josa from "@/app/api/functions/josa";
+import Link from "next/link";
 
 type FormValue = {
   question: string;
@@ -25,7 +26,7 @@ type ResponseType = {
 async function fetchProfile(handle: string) {
   const profile = await fetch(`/api/db/fetch-profile/${handle}`);
   if (profile && profile.ok) {
-    return profile.json() as unknown as userProfileDto;
+    return profile.json() as unknown as userProfileWithHostnameDto;
   } else {
     return undefined;
   }
@@ -33,7 +34,7 @@ async function fetchProfile(handle: string) {
 
 export default function UserPage() {
   const { handle } = useParams() as { handle: string };
-  const [userInfo, setUserInfo] = useState<userProfileDto>();
+  const [userProfile, setUserProfile] = useState<userProfileWithHostnameDto>();
   const [localHandle, setLocalHandle] = useState<string>("");
   const [answers, setAnswers] = useState<AnswerDto[] | null>(null);
   const [count, setCount] = useState<number | null>(0);
@@ -127,10 +128,10 @@ export default function UserPage() {
   const shareUrl = () => {
     const server = localStorage.getItem("server");
     const text = `저의 ${josa(
-      userInfo?.questionBoxName,
+      userProfile?.questionBoxName,
       "이에요!",
       "예요!"
-    )} #neo-quesdon ${location.origin}/main/user/${userInfo?.handle}`;
+    )} #neo-quesdon ${location.origin}/main/user/${userProfile?.handle}`;
     return `https://${server}/share?text=${encodeURIComponent(text)}`;
   };
 
@@ -170,7 +171,7 @@ export default function UserPage() {
     }
     // 작성자 비공개
     else {
-      if (userInfo?.stopAnonQuestion === true) {
+      if (userProfile?.stopAnonQuestion === true) {
         setError("questioner", {
           type: "stopAnonQuestion",
           message: "익명 질문은 받지 않고 있어요...",
@@ -202,15 +203,15 @@ export default function UserPage() {
 
   useEffect(() => {
     fetchProfile(profileHandle).then((r) => {
-      setUserInfo(r);
+      setUserProfile(r);
     });
     setLocalHandle(localStorage.getItem("user_handle") ?? "");
   }, [profileHandle]);
 
   useEffect(() => {
-    if (userInfo) {
+    if (userProfile) {
       fetchUserAnswers({
-        answeredPersonHandle: userInfo.handle,
+        answeredPersonHandle: userProfile.handle,
         sort: "DESC",
         limit: 20,
       }).then(({ answers, count }: ResponseType) => {
@@ -224,7 +225,7 @@ export default function UserPage() {
         setUntilId(answers[answers.length - 1].id);
       });
     }
-  }, [profileHandle, userInfo]);
+  }, [profileHandle, userProfile]);
 
   useEffect(() => {
     const observer = new IntersectionObserver(
@@ -262,7 +263,7 @@ export default function UserPage() {
       className="w-[90%] window:w-[80%] desktop:w-[70%]"
       onKeyDown={onEscape}
     >
-      {userInfo === null ? (
+      {userProfile === null ? (
         <div className="w-full flex flex-col justify-center items-center glass text-4xl rounded-box shadow p-2">
           <FaUserSlash />
           <span>그런 사용자는 없어요!</span>
@@ -272,16 +273,20 @@ export default function UserPage() {
           <div className="w-full h-fit desktop:sticky top-2 desktop:w-[50%] flex flex-col">
             <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
               <div className="flex flex-col items-center gap-2 py-2">
-                {userInfo && userInfo.avatarUrl ? (
-                  <div className="flex w-full justify-center">
-                    <img
-                      src={userInfo.avatarUrl}
-                      alt="User Avatar"
-                      className="w-24 h-24 object-cover rounded-full"
-                    />
-                    {userInfo.stopAnonQuestion && (
-                      <div className="chat chat-start absolute left-[21rem] w-full">
-                        <div className="chat-bubble bg-base-100 text-slate-700">
+                {userProfile && userProfile.avatarUrl ? (
+                  <div className="flex w-full h-24">
+                    <Link
+                      href={`https://${userProfile.hostname}/${userProfile.handle}`}
+                    >
+                      <img
+                        src={userProfile.avatarUrl}
+                        alt="User Avatar"
+                        className={`w-24 h-24 object-cover absolute left-[calc(50%-3rem)] rounded-full`}
+                      />
+                    </Link>
+                    {userProfile.stopAnonQuestion && (
+                      <div className="chat chat-start w-32 window:w-full desktop:w-full relative left-[68%] window:left-[60%] deskstop:left-[57%]">
+                        <div className="chat-bubble text-sm flex items-center bg-base-100 text-slate-700">
                           작성자 공개 질문만 받아요!
                         </div>
                       </div>
@@ -291,10 +296,10 @@ export default function UserPage() {
                   <div className="skeleton h-24 w-24 rounded-full" />
                 )}
                 <div className="flex items-center text-xl">
-                  {userInfo?.stopNewQuestion ? (
+                  {userProfile?.stopNewQuestion ? (
                     <div className="flex flex-col items-center desktop:flex-row">
                       <NameComponents
-                        username={userInfo?.name}
+                        username={userProfile.name}
                         width={32}
                         height={32}
                       />
@@ -303,13 +308,13 @@ export default function UserPage() {
                   ) : (
                     <div className="flex flex-col items-center desktop:flex-row window:flex-row window:text-2xl">
                       <NameComponents
-                        username={userInfo?.name}
+                        username={userProfile?.name}
                         width={32}
                         height={32}
                       />
                       <span>
                         님의{" "}
-                        {josa(userInfo?.questionBoxName, "이에요!", "예요!")}
+                        {josa(userProfile?.questionBoxName, "이에요!", "예요!")}
                       </span>
                     </div>
                   )}
@@ -328,7 +333,9 @@ export default function UserPage() {
                     errors.question ? "textarea-error" : "textarea-bordered"
                   }`}
                   onKeyDown={onCtrlEnter}
-                  disabled={userInfo?.stopNewQuestion === true ? true : false}
+                  disabled={
+                    userProfile?.stopNewQuestion === true ? true : false
+                  }
                 />
                 {errors.questioner &&
                   errors.questioner.type === "stopAnonQuestion" && (

From 346e6259ade77aae1eecff38e93ff570a816bc31 Mon Sep 17 00:00:00 2001
From: kdh8219 <kdh8219@monamo.dev>
Date: Tue, 19 Nov 2024 16:41:41 +0900
Subject: [PATCH 43/89] =?UTF-8?q?=F0=9F=90=9B=20Login=20Form=EC=97=90=20?=
 =?UTF-8?q?=EB=B0=94=EB=A1=9C=20enter=EC=B3=A4=EC=9D=84=EB=95=8C=EC=9D=98?=
 =?UTF-8?q?=20required=20=EC=97=90=EB=9F=AC=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/page.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 5631e73..8af7058 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -54,6 +54,7 @@ export default function Home() {
     register,
     formState: { errors },
     handleSubmit,
+    setValue: setFormValue
   } = useForm<FormValue>({ defaultValues: { address: "" } });
 
   const onSubmit: SubmitHandler<FormValue> = async (e) => {
@@ -97,11 +98,11 @@ export default function Home() {
     const lastUsedHost = localStorage.getItem("server");
     const ele = document.getElementById("serverNameInput") as HTMLInputElement;
     if (lastUsedHost && ele) {
-      ele.value = lastUsedHost;
+      setFormValue('address', lastUsedHost);
       ele.focus();
     }
     setHosts({ protocol: protocol, host: host });
-  }, []);
+  }, [ setFormValue ]);
 
   return (
     <div className="w-screen h-screen absolute flex items-center justify-center p-8">

From 8d105ed6b0792efd31ac9351e32c84dcc7992bd7 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Tue, 19 Nov 2024 17:56:58 +0900
Subject: [PATCH 44/89] =?UTF-8?q?=E2=9C=A8=20=EB=A7=88=EC=8A=A4=ED=86=A0?=
 =?UTF-8?q?=EB=8F=88=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20=EA=B8=B0=EB=8A=A5=20?=
 =?UTF-8?q?=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../migration.sql                             |   3 +
 prisma/schema.prisma                          |   2 +
 .../fetch-name-with-emoji.dto.ts              |  34 ++-
 .../callback-token-claim.dto.ts               |  15 ++
 .../callback-token-claim.dto.ts               |  20 +-
 .../_dto/misskey-callback/user-info.dto.ts    |   2 +-
 src/app/_dto/web/login/login.dto.ts           |  12 +-
 .../api/web/fetch-name-with-emoji/route.ts    | 130 +++++++++---
 src/app/api/web/mastodon-login/route.ts       |  99 +++++++++
 .../api/web/{login => misskey-login}/route.ts |   4 +-
 src/app/mastodon-callback/action.ts           | 193 ++++++++++++++++++
 src/app/mastodon-callback/page.tsx            |  79 +++++++
 src/app/misskey-callback/actions.ts           |  51 +++--
 src/app/misskey-callback/page.tsx             |  23 +--
 src/app/page.tsx                              |  54 +++--
 15 files changed, 615 insertions(+), 106 deletions(-)
 create mode 100644 prisma/migrations/20241119025447_mastodon_client/migration.sql
 create mode 100644 src/app/_dto/mastodon-callback/callback-token-claim.dto.ts
 create mode 100644 src/app/api/web/mastodon-login/route.ts
 rename src/app/api/web/{login => misskey-login}/route.ts (97%)
 create mode 100644 src/app/mastodon-callback/action.ts
 create mode 100644 src/app/mastodon-callback/page.tsx

diff --git a/prisma/migrations/20241119025447_mastodon_client/migration.sql b/prisma/migrations/20241119025447_mastodon_client/migration.sql
new file mode 100644
index 0000000..cd7b04a
--- /dev/null
+++ b/prisma/migrations/20241119025447_mastodon_client/migration.sql
@@ -0,0 +1,3 @@
+-- AlterTable
+ALTER TABLE "server" ADD COLUMN     "client_id" TEXT,
+ADD COLUMN     "client_secret" TEXT;
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index c54e7be..6e45757 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -61,4 +61,6 @@ model server {
     id              Int         @default(autoincrement())   @id
     instances       String      @unique
     appSecret       String?
+    client_id       String?
+    client_secret   String?
 }
\ No newline at end of file
diff --git a/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts b/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts
index 6154b53..6879b9f 100644
--- a/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts
+++ b/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts
@@ -1,4 +1,24 @@
-import { IsString, ValidateIf } from "class-validator";
+import {
+  IsArray,
+  IsBoolean,
+  IsOptional,
+  IsString,
+  ValidateIf,
+} from "class-validator";
+
+class mastodonEmojiModel {
+  @IsString()
+  shortcode: string;
+
+  @IsString()
+  url: string;
+
+  @IsString()
+  static_url: string;
+
+  @IsBoolean()
+  visible_in_picker: boolean;
+}
 
 export class fetchNameWithEmojiReqDto {
   @ValidateIf((o, v) => v !== null)
@@ -6,10 +26,16 @@ export class fetchNameWithEmojiReqDto {
   name: string | null;
 
   @IsString()
-  misskeyBaseUrl: string;
-};
+  baseUrl: string;
+
+  // 마스토돈의 경우 닉네임에 들어간 커모지를
+  // 배열로 따로 주기 때문에 그것에 대한 Validation이 필요함
+  @IsArray()
+  @IsOptional()
+  emojis: mastodonEmojiModel[] | null;
+}
 
 export interface fetchNameWithEmojiResDto {
   //Name array with emoji
   nameWithEmoji: string[];
-}
\ No newline at end of file
+}
diff --git a/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts b/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts
new file mode 100644
index 0000000..cb3ec44
--- /dev/null
+++ b/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts
@@ -0,0 +1,15 @@
+import { IsString } from "class-validator";
+
+export class mastodonCallbackTokenClaimPayload {
+  //Mastodon code를 요청할 mastodon의 host (예: planet.moe)
+  @IsString()
+  mastodonHost: string;
+
+  //callback으로 받은 토큰
+  @IsString()
+  callback_code: string;
+
+  //현재 로그인 state
+  @IsString()
+  state: string;
+}
diff --git a/src/app/_dto/misskey-callback/callback-token-claim.dto.ts b/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
index f87b4bb..a4cc0f7 100644
--- a/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
+++ b/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
@@ -1,13 +1,11 @@
 import { IsString } from "class-validator";
 
-export class callbackTokenClaimPayload {
-    //Misskey Access key 를 요청할 misskey의 host (예: serafuku.moe)
-    @IsString()
-    misskeyHost: string;
-  
-    //callback으로 받은 토큰
-    @IsString()
-    callback_token: string;
-  }
-  
-  
\ No newline at end of file
+export class misskeyCallbackTokenClaimPayload {
+  //Misskey Access key 를 요청할 misskey의 host (예: serafuku.moe)
+  @IsString()
+  misskeyHost: string;
+
+  //callback으로 받은 토큰
+  @IsString()
+  callback_token: string;
+}
diff --git a/src/app/_dto/misskey-callback/user-info.dto.ts b/src/app/_dto/misskey-callback/user-info.dto.ts
index a8f3b5f..5fb80e1 100644
--- a/src/app/_dto/misskey-callback/user-info.dto.ts
+++ b/src/app/_dto/misskey-callback/user-info.dto.ts
@@ -1,5 +1,5 @@
 import type { MiUser } from "@/app/api/misskey-entities/user";
 
-export class userInfoPayload {
+export class misskeyUserInfoPayload {
   user: MiUser;
 }
diff --git a/src/app/_dto/web/login/login.dto.ts b/src/app/_dto/web/login/login.dto.ts
index f9b8c36..b38e4cb 100644
--- a/src/app/_dto/web/login/login.dto.ts
+++ b/src/app/_dto/web/login/login.dto.ts
@@ -4,18 +4,20 @@ import { IsNotEmpty, IsString } from "class-validator";
 export class loginReqDto {
   @Transform((param) => {
     // https://example.com/ 같은 형식으로 온 경우 Host 형식으로 변환
-    if (typeof param.value === 'string') {
+    if (typeof param.value === "string") {
       const v = param.value;
       const re = /\/\/[^/@\s]+(:[0-9]{1,5})?\/?/;
       const matched_str = v.match(re)?.[0];
       if (matched_str) {
-        console.log(`URL ${param.value} replaced with ${matched_str.replaceAll('/', '')}`);
-        return matched_str.replaceAll('/', '');
+        console.log(
+          `URL ${param.value} replaced with ${matched_str.replaceAll("/", "")}`
+        );
+        return matched_str.replaceAll("/", "");
       }
       return v;
     }
   })
   @IsString()
   @IsNotEmpty()
-  misskeyHost: string;
-}
\ No newline at end of file
+  host: string;
+}
diff --git a/src/app/api/web/fetch-name-with-emoji/route.ts b/src/app/api/web/fetch-name-with-emoji/route.ts
index b494f76..7d48e6d 100644
--- a/src/app/api/web/fetch-name-with-emoji/route.ts
+++ b/src/app/api/web/fetch-name-with-emoji/route.ts
@@ -1,58 +1,128 @@
-import { fetchNameWithEmojiReqDto, fetchNameWithEmojiResDto } from "@/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto";
+import { fetchNameWithEmojiReqDto } from "@/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto";
 import { validateStrict } from "@/utils/validator/strictValidator";
 import { NextRequest, NextResponse } from "next/server";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
+import detectInstance from "../../functions/web/detectInstance";
 
-
-export async function POST(req: NextRequest): Promise<NextResponse> {
+export async function POST(req: NextRequest) {
   let data;
-  const body = await req.json();
+  const body: fetchNameWithEmojiReqDto = await req.json();
   try {
     data = await validateStrict(fetchNameWithEmojiReqDto, body);
   } catch (err) {
     return sendErrorResponse(400, `${err}`);
   }
 
-  const { name, misskeyBaseUrl }: fetchNameWithEmojiReqDto = data;
+  const { name, baseUrl }: fetchNameWithEmojiReqDto = data;
   const usernameIndex: number[] = [];
   const usernameEmojiAddress: string[] = [];
   if (!name) {
-    return NextResponse.json({ nameWithEmoji: []});
+    return NextResponse.json({ nameWithEmoji: [] });
   }
   const emojiInUsername = name
     .match(/:[\w]+:/g)
     ?.map((el) => el.replaceAll(":", ""));
   const nameArray = name.split(":").filter((el) => el !== "");
 
-  try {
-    if (emojiInUsername) {
-      for (let i = 0; i < emojiInUsername.length; i++) {
-        const emojiAddress = await fetch(`${misskeyBaseUrl}/api/emoji`, {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify({
-            name: emojiInUsername[i],
-          }),
-        }).then((r) => r.json());
-
-        usernameEmojiAddress.push(emojiAddress.url);
+  const instanceType = await detectInstance(baseUrl);
+
+  switch (instanceType) {
+    case "mastodon":
+      try {
+        if (emojiInUsername && body.emojis) {
+          for (let i = 0; i < emojiInUsername.length; i++) {
+            usernameEmojiAddress.push(body.emojis[i].url);
+          }
+
+          for (const el in nameArray) {
+            usernameIndex.push(nameArray.indexOf(emojiInUsername[el]));
+          }
+          const filteredIndex = usernameIndex.filter((value) => value >= 0);
+
+          for (let i = 0; i < usernameEmojiAddress.length; i++) {
+            nameArray.splice(filteredIndex[i], 1, usernameEmojiAddress[i]);
+          }
+        }
+        return NextResponse.json({ nameWithEmoji: nameArray });
+      } catch (err) {
+        return NextResponse.json({ asdf: "asdf" }, { status: 500 });
       }
 
-      for (const el in nameArray) {
-        usernameIndex.push(nameArray.indexOf(emojiInUsername[el]));
+    case "misskey":
+      try {
+        if (emojiInUsername) {
+          for (let i = 0; i < emojiInUsername.length; i++) {
+            const emojiAddress = await fetch(`https://${baseUrl}/api/emoji`, {
+              method: "POST",
+              headers: {
+                "Content-Type": "application/json",
+              },
+              body: JSON.stringify({
+                name: emojiInUsername[i],
+              }),
+            }).then((r) => r.json());
+
+            usernameEmojiAddress.push(emojiAddress.url);
+          }
+
+          for (const el in nameArray) {
+            usernameIndex.push(nameArray.indexOf(emojiInUsername[el]));
+          }
+          const filteredIndex = usernameIndex.filter((value) => value >= 0);
+
+          for (let i = 0; i < usernameEmojiAddress.length; i++) {
+            nameArray.splice(filteredIndex[i], 1, usernameEmojiAddress[i]);
+          }
+        }
+
+        return NextResponse.json({ nameWithEmoji: nameArray });
+      } catch (err) {
+        console.log(err);
+        return NextResponse.json(
+          { error: "Internal Server Error" },
+          { status: 500 }
+        );
       }
-      const filteredIndex = usernameIndex.filter((value) => value >= 0);
 
-      for (let i = 0; i < usernameEmojiAddress.length; i++) {
-        nameArray.splice(filteredIndex[i], 1, usernameEmojiAddress[i]);
+    case "cherrypick":
+      try {
+        if (emojiInUsername) {
+          for (let i = 0; i < emojiInUsername.length; i++) {
+            const emojiAddress = await fetch(`https://${baseUrl}/api/emoji`, {
+              method: "POST",
+              headers: {
+                "Content-Type": "application/json",
+              },
+              body: JSON.stringify({
+                name: emojiInUsername[i],
+              }),
+            }).then((r) => r.json());
+
+            usernameEmojiAddress.push(emojiAddress.url);
+          }
+
+          for (const el in nameArray) {
+            usernameIndex.push(nameArray.indexOf(emojiInUsername[el]));
+          }
+          const filteredIndex = usernameIndex.filter((value) => value >= 0);
+
+          for (let i = 0; i < usernameEmojiAddress.length; i++) {
+            nameArray.splice(filteredIndex[i], 1, usernameEmojiAddress[i]);
+          }
+        }
+
+        return NextResponse.json({ nameWithEmoji: nameArray });
+      } catch (err) {
+        console.log(err);
+        return NextResponse.json(
+          { error: "Internal Server Error" },
+          { status: 500 }
+        );
       }
-    }
 
-    return NextResponse.json({ nameWithEmoji: nameArray });
-  } catch (err) {
-    console.log(err);
-    throw (err);
+    default:
+      console.log("there is no matching instance type");
+
+      break;
   }
 }
diff --git a/src/app/api/web/mastodon-login/route.ts b/src/app/api/web/mastodon-login/route.ts
new file mode 100644
index 0000000..b0d6804
--- /dev/null
+++ b/src/app/api/web/mastodon-login/route.ts
@@ -0,0 +1,99 @@
+import { loginReqDto } from "@/app/_dto/web/login/login.dto";
+import { validateStrict } from "@/utils/validator/strictValidator";
+import { NextRequest, NextResponse } from "next/server";
+import { sendErrorResponse } from "../../functions/web/errorResponse";
+import { PrismaClient } from "@prisma/client";
+import { v4 as uuid } from "uuid";
+
+export async function POST(req: NextRequest) {
+  let data: loginReqDto;
+  const body = await req.json();
+
+  //일단은 미스키와 같은 Validate를 거침
+  try {
+    data = await validateStrict(loginReqDto, body);
+  } catch (err) {
+    return sendErrorResponse(400, `${err}`);
+  }
+
+  const mastodonHost = data.host.toLowerCase();
+  const prisma = new PrismaClient();
+
+  try {
+    const serverInfo = await prisma.server.findFirst({
+      where: {
+        instances: mastodonHost,
+      },
+    });
+
+    //인스턴스의 첫번째 로그인인 경우
+    if (!serverInfo) {
+      const res = await fetch(`https://${mastodonHost}/api/v1/apps`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({
+          client_name: "Neo-Quesdon",
+          redirect_uris: `${process.env.WEB_URL}/mastodon-callback`,
+          scopes: "read write",
+          website: `${process.env.WEB_URL}`,
+        }),
+      }).then((r) => r.json());
+
+      if (!res.id) {
+        return sendErrorResponse(500, `login error!`);
+      }
+
+      await prisma.server.upsert({
+        where: {
+          instances: mastodonHost,
+        },
+        update: {
+          client_secret: res.client_secret,
+        },
+        create: {
+          instances: mastodonHost,
+          client_id: res.client_id,
+          client_secret: res.client_secret,
+        },
+      });
+      const shit = await initiateMastodonAuthSession(
+        mastodonHost,
+        res.client_id
+      );
+      return NextResponse.json(shit);
+
+      // 클라이언트 시크릿이 존재하는 경우
+    } else if (serverInfo.client_id && serverInfo.client_secret) {
+      const shit = await initiateMastodonAuthSession(
+        mastodonHost,
+        serverInfo.client_id
+      );
+      return NextResponse.json(shit);
+    }
+  } catch (err) {
+    return sendErrorResponse(500, `login error... ${err}`);
+  }
+}
+
+async function initiateMastodonAuthSession(
+  hostname: string,
+  client_id: string
+) {
+  const loginState = `${uuid()}_${client_id}`;
+
+  const params: { [key: string]: string } = {
+    client_id: client_id,
+    scope: "read+write",
+    redirect_uri: `${process.env.WEB_URL}/mastodon-callback`,
+    response_type: "code",
+    state: loginState,
+  };
+
+  const url = `https://${hostname}/oauth/authorize?${Object.entries(params)
+    .map((v) => v.join("="))
+    .join("&")}`;
+
+  return url;
+}
diff --git a/src/app/api/web/login/route.ts b/src/app/api/web/misskey-login/route.ts
similarity index 97%
rename from src/app/api/web/login/route.ts
rename to src/app/api/web/misskey-login/route.ts
index 05f3a1c..17a89e0 100644
--- a/src/app/api/web/login/route.ts
+++ b/src/app/api/web/misskey-login/route.ts
@@ -14,7 +14,7 @@ export async function POST(req: NextRequest) {
     return sendErrorResponse(400, `${err}`);
   }
 
-  const misskeyHost = data.misskeyHost.toLowerCase();
+  const misskeyHost = data.host.toLowerCase();
   const prisma = new PrismaClient();
 
   try {
@@ -29,7 +29,7 @@ export async function POST(req: NextRequest) {
       const payload = {
         name: "Neo-Quesdon",
         description: "새로운 퀘스돈, 네오-퀘스돈입니다.",
-        permission: ["write:notes", "read:follower"],
+        permission: ["write:notes"],
         callbackUrl: `${process.env.WEB_URL}/misskey-callback`,
       };
 
diff --git a/src/app/mastodon-callback/action.ts b/src/app/mastodon-callback/action.ts
new file mode 100644
index 0000000..2456107
--- /dev/null
+++ b/src/app/mastodon-callback/action.ts
@@ -0,0 +1,193 @@
+"use server";
+
+import { validateStrict } from "@/utils/validator/strictValidator";
+import { mastodonCallbackTokenClaimPayload } from "../_dto/mastodon-callback/callback-token-claim.dto";
+import { PrismaClient } from "@prisma/client";
+import { fetchNameWithEmoji } from "../api/functions/web/fetchUsername";
+import { DBpayload } from "../misskey-callback/page";
+import { cookies } from "next/headers";
+import { SignJWT } from "jose";
+
+const prisma = new PrismaClient();
+
+export async function login(
+  loginReqestData: mastodonCallbackTokenClaimPayload
+) {
+  //Class Validator로 들어온 로그인 정보 검증
+  let loginReq: mastodonCallbackTokenClaimPayload;
+  try {
+    loginReq = await validateStrict(
+      mastodonCallbackTokenClaimPayload,
+      loginReqestData
+    );
+  } catch (err) {
+    throw new Error(JSON.stringify(err));
+  }
+  loginReq.mastodonHost = loginReq.mastodonHost.toLowerCase();
+
+  console.log(loginReq.mastodonHost);
+
+  const serverInfo = await prisma.server.findFirst({
+    where: {
+      instances: loginReq.mastodonHost,
+    },
+  });
+
+  if (serverInfo?.client_id && serverInfo?.client_secret) {
+    const mastodonApiResponse = await requestMastodonAccessCodeAndUserInfo(
+      loginReq,
+      serverInfo.client_id,
+      serverInfo.client_secret
+    );
+
+    const user_handle = `@${mastodonApiResponse.profile.username}@${loginReq.mastodonHost}`;
+
+    let nameWithEmoji = await fetchNameWithEmoji({
+      name:
+        mastodonApiResponse.profile.display_name ??
+        mastodonApiResponse.profile.username,
+      baseUrl: loginReq.mastodonHost,
+      emojis: mastodonApiResponse.profile.emojis,
+    });
+
+    if (nameWithEmoji.length === 0) {
+      nameWithEmoji = [`${mastodonApiResponse.profile.username}`];
+    }
+
+    const dbPayload: DBpayload = {
+      account: mastodonApiResponse.profile.username,
+      accountLower: mastodonApiResponse.profile.username.toLowerCase(),
+      hostName: loginReq.mastodonHost,
+      handle: user_handle,
+      name: nameWithEmoji,
+      avatarUrl: mastodonApiResponse.profile.avatar ?? "",
+      accessToken: mastodonApiResponse.token,
+      userId: mastodonApiResponse.profile.id,
+    };
+
+    try {
+      await pushDB(dbPayload);
+    } catch (err) {
+      console.error("Fail to push user to DB", err);
+      throw err;
+    }
+
+    try {
+      //프론트 쿠키스토어에 쿠키 저장
+      const cookieStore = await cookies();
+      const jwtToken = await generateJwt(loginReq.mastodonHost, user_handle);
+      console.log(`Send JWT to Frontend... ${jwtToken}`);
+      cookieStore.set("jwtToken", jwtToken, {
+        expires: Date.now() + 1000 * 60 * 60 * 6,
+        httpOnly: true,
+      });
+      cookieStore.set("server", loginReq.mastodonHost, {
+        expires: Date.now() + 1000 * 60 * 60 * 6,
+        httpOnly: true,
+      });
+    } catch (err) {
+      console.error("Make JWT or Set cookie Failed! ", err);
+      throw err;
+    }
+
+    return { user: mastodonApiResponse };
+  } else {
+    throw new Error("there is no server");
+  }
+}
+
+/**
+ * 마스토돈에서 유저 Token을 요청하는 함수
+ * @param payload
+ */
+async function requestMastodonAccessCodeAndUserInfo(
+  payload: mastodonCallbackTokenClaimPayload,
+  client_id: string,
+  client_secret: string
+) {
+  const checkInstances = await prisma.server.findFirst({
+    where: {
+      instances: payload.mastodonHost,
+    },
+  });
+
+  if (checkInstances) {
+    const res = await fetch(`https://${payload.mastodonHost}/oauth/token`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        grant_type: "authorization_code",
+        redirect_uri: `${process.env.WEB_URL}/mastodon-callback`,
+        client_id: client_id,
+        client_secret: client_secret,
+        code: payload.callback_code,
+        state: payload.state,
+      }),
+    }).then((r) => r.json());
+
+    const myProfile = await fetch(
+      `https://${payload.mastodonHost}/api/v1/accounts/verify_credentials`,
+      {
+        headers: { Authorization: `Bearer ${res.access_token}` },
+      }
+    ).then((r) => r.json());
+
+    return { profile: myProfile, token: res.access_token };
+  } else {
+    throw new Error("there is no instances");
+  }
+}
+
+async function generateJwt(hostname: string, handle: string) {
+  const alg = "HS256";
+  const secret = new TextEncoder().encode(process.env.JWT_SECRET);
+
+  const webUrl = process.env.WEB_URL;
+  const jwtToken = await new SignJWT({
+    server: hostname,
+    handle: handle,
+  })
+    .setProtectedHeader({ alg })
+    .setIssuedAt()
+    .setIssuer(`${webUrl}`)
+    .setAudience("urn:example:audience")
+    .setExpirationTime("6h")
+    .sign(secret);
+  return jwtToken;
+}
+
+async function pushDB(payload: DBpayload) {
+  const prisma = new PrismaClient();
+  await prisma.user.upsert({
+    where: {
+      handle: payload.handle,
+    },
+    update: {
+      name: payload.name,
+      token: payload.accessToken,
+      profile: {
+        update: {
+          account: payload.account,
+          avatarUrl: payload.avatarUrl,
+          name: payload.name,
+        },
+      },
+    },
+    create: {
+      account: payload.account,
+      accountLower: payload.accountLower,
+      hostName: payload.hostName,
+      handle: payload.handle,
+      name: payload.name,
+      token: payload.accessToken,
+      userId: payload.userId,
+      profile: {
+        create: {
+          account: payload.account,
+          avatarUrl: payload.avatarUrl,
+          name: payload.name,
+        },
+      },
+    },
+  });
+}
diff --git a/src/app/mastodon-callback/page.tsx b/src/app/mastodon-callback/page.tsx
new file mode 100644
index 0000000..3d3a595
--- /dev/null
+++ b/src/app/mastodon-callback/page.tsx
@@ -0,0 +1,79 @@
+"use client";
+
+import Image from "next/image";
+import { useEffect, useState } from "react";
+import { mastodonCallbackTokenClaimPayload } from "../_dto/mastodon-callback/callback-token-claim.dto";
+import { login } from "./action";
+import { useRouter } from "next/navigation";
+
+export default function CallbackPage() {
+  const [id, setId] = useState<number>(0);
+
+  const router = useRouter();
+
+  useEffect(() => {
+    const url = new URL(window.location.href);
+    const params = new URLSearchParams(url.search);
+
+    const server = localStorage.getItem("server");
+
+    const randomNumber = Math.ceil(Math.random() * 3);
+    setId(randomNumber);
+
+    const fn = async () => {
+      try {
+        if (server) {
+          const code = params.get("code");
+          const state = params.get("state");
+          if (code === null) {
+            throw new Error("User code is null?");
+          }
+          if (state === null) {
+            throw new Error("login state is null?");
+          }
+          const payload: mastodonCallbackTokenClaimPayload = {
+            mastodonHost: server,
+            callback_code: code,
+            state: state,
+          };
+
+          let res;
+          try {
+            res = await login(payload);
+          } catch (err) {
+            console.error(`login failed!`, err);
+            throw err;
+          }
+
+          const user = res.user;
+
+          const handle = `@${user.profile.username}@${server}`;
+          localStorage.setItem("user_handle", handle);
+
+          router.replace("/main");
+        }
+      } catch (err) {
+        console.error(err);
+        return (
+          <div className="w-full h-[100vh] flex flex-col gap-2 justify-center items-center text-3xl">
+            <span>로그인 중에 문제가 발생했어요... 다시 시도해 보세요</span>
+          </div>
+        );
+      }
+    };
+    fn();
+  }, []);
+
+  return (
+    <div className="w-full h-[100vh] flex flex-col gap-2 justify-center items-center text-3xl">
+      <Image
+        src={`/loading/${id}.gif`}
+        width={64}
+        height={64}
+        alt="Login Loading"
+        unoptimized
+      />
+      <span>로그인하고 있어요...</span>
+    </div>
+  );
+}
diff --git a/src/app/misskey-callback/actions.ts b/src/app/misskey-callback/actions.ts
index 136556e..1b39f42 100644
--- a/src/app/misskey-callback/actions.ts
+++ b/src/app/misskey-callback/actions.ts
@@ -8,28 +8,33 @@ import { misskeyAccessKeyApiResponse } from "..";
 import { MiUser } from "../api/misskey-entities/user";
 import { fetchNameWithEmoji } from "../api/functions/web/fetchUsername";
 import { validateStrict } from "@/utils/validator/strictValidator";
-import { callbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
-import { userInfoPayload } from "../_dto/misskey-callback/user-info.dto";
+import { misskeyCallbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
+import { misskeyUserInfoPayload } from "../_dto/misskey-callback/user-info.dto";
 
-
-export async function login(loginReqestData: callbackTokenClaimPayload): Promise<userInfoPayload> {
-  let loginReq: callbackTokenClaimPayload;
+export async function login(
+  loginReqestData: misskeyCallbackTokenClaimPayload
+): Promise<misskeyUserInfoPayload> {
+  let loginReq: misskeyCallbackTokenClaimPayload;
   try {
-    loginReq = await validateStrict(callbackTokenClaimPayload, loginReqestData);
+    loginReq = await validateStrict(
+      misskeyCallbackTokenClaimPayload,
+      loginReqestData
+    );
   } catch (err) {
     throw new Error(JSON.stringify(err));
   }
   loginReq.misskeyHost = loginReq.misskeyHost.toLowerCase();
-  
+
   // 미스키 App 인증 API에서 액세스토큰과 MiUser 정보를 받아오기
-  const misskeyApiResponse: misskeyAccessKeyApiResponse = await requestMiAccessTokenAndUserInfo(loginReq);
+  const misskeyApiResponse: misskeyAccessKeyApiResponse =
+    await requestMiAccessTokenAndUserInfo(loginReq);
   if (misskeyApiResponse === null) {
     throw new Error(`misskey token get fail!`);
   }
 
   const user: MiUser = misskeyApiResponse.user;
   const miAccessToken = misskeyApiResponse.accessToken;
-  if (typeof user !== 'object' || typeof miAccessToken !== 'string') {
+  if (typeof user !== "object" || typeof miAccessToken !== "string") {
     throw new Error(`fail to get Misskey User/Token`);
   }
 
@@ -37,9 +42,10 @@ export async function login(loginReqestData: callbackTokenClaimPayload): Promise
 
   let nameWithEmoji = await fetchNameWithEmoji({
     name: user.name ?? user.username,
-    misskeyBaseUrl: `https://${loginReq.misskeyHost}`,
+    baseUrl: loginReq.misskeyHost,
+    emojis: null,
   });
-  
+
   if (nameWithEmoji.length === 0) {
     nameWithEmoji = [`${user.username}`];
   }
@@ -51,13 +57,13 @@ export async function login(loginReqestData: callbackTokenClaimPayload): Promise
     hostName: loginReq.misskeyHost,
     handle: user_handle,
     name: nameWithEmoji,
-    avatarUrl: user.avatarUrl ?? '',
+    avatarUrl: user.avatarUrl ?? "",
     accessToken: miAccessToken,
     userId: user.id,
   };
   try {
     await pushDB(dbPayload);
-  } catch(err) {
+  } catch (err) {
     console.error(`Fail to push user to DB`, err);
     throw err;
   }
@@ -80,21 +86,21 @@ export async function login(loginReqestData: callbackTokenClaimPayload): Promise
     throw err;
   }
 
-
   //유저 정보 프론트로 반환
   return { user: user };
 }
 
-
 /**
- * 미스키에서 유저가 권한을 승인한 후, 콜백으로 받은 (App인증 방식) 토큰을 사용해서 
- * 미스키에서 accessToken과 유저 정보를 받아옴. 
+ * 미스키에서 유저가 권한을 승인한 후, 콜백으로 받은 (App인증 방식) 토큰을 사용해서
+ * 미스키에서 accessToken과 유저 정보를 받아옴.
  *  참고: https://misskey-hub.net/ko/docs/for-developers/api/token/app/
- * 인증 성공시 미스키의 /api/auth/session/userkey 응답 바디를 반환, 실패시 null 반환. 
+ * 인증 성공시 미스키의 /api/auth/session/userkey 응답 바디를 반환, 실패시 null 반환.
  * @param payload callbackTokenClaimPayload
  * @returns misskey appAuth API response body, or null when failed
  */
-async function requestMiAccessTokenAndUserInfo(payload: callbackTokenClaimPayload) {
+async function requestMiAccessTokenAndUserInfo(
+  payload: misskeyCallbackTokenClaimPayload
+) {
   const prisma = new PrismaClient();
 
   const checkInstances = await prisma.server.findFirst({
@@ -121,7 +127,11 @@ async function requestMiAccessTokenAndUserInfo(payload: callbackTokenClaimPayloa
       const resBody = await res.json();
       return resBody;
     } else {
-      console.error(`Fail to get Misskey Access token`, res.status, res.statusText);
+      console.error(
+        `Fail to get Misskey Access token`,
+        res.status,
+        res.statusText
+      );
       return null;
     }
   } else {
@@ -129,7 +139,6 @@ async function requestMiAccessTokenAndUserInfo(payload: callbackTokenClaimPayloa
   }
 }
 
-
 async function generateJwt(hostname: string, handle: string) {
   const alg = "HS256";
   const secret = new TextEncoder().encode(process.env.JWT_SECRET);
diff --git a/src/app/misskey-callback/page.tsx b/src/app/misskey-callback/page.tsx
index 5fa8e28..633293b 100644
--- a/src/app/misskey-callback/page.tsx
+++ b/src/app/misskey-callback/page.tsx
@@ -5,8 +5,8 @@ import Image from "next/image";
 import { useRouter } from "next/navigation";
 import { login } from "./actions";
 import { MiUser as MiUser } from "../api/misskey-entities/user";
-import { callbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
-import { userInfoPayload } from "../_dto/misskey-callback/user-info.dto";
+import { misskeyCallbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
+import { misskeyUserInfoPayload } from "../_dto/misskey-callback/user-info.dto";
 
 export type DBpayload = {
   account: string;
@@ -37,28 +37,27 @@ export default function CallbackPage() {
       try {
         if (server) {
           const callback_token = params.get("token");
-          if (callback_token === null) { 
-            throw new Error('callback token is null?');
+          if (callback_token === null) {
+            throw new Error("callback token is null?");
           }
-          const payload: callbackTokenClaimPayload = {
+          const payload: misskeyCallbackTokenClaimPayload = {
             misskeyHost: server,
             callback_token: callback_token,
           };
-          
-          let res: userInfoPayload;
+
+          let res: misskeyUserInfoPayload;
           try {
             res = await login(payload);
           } catch (err) {
             console.error(`login failed!`, err);
             throw err;
           }
-  
+
           const user: MiUser = res.user;
-  
-  
+
           const handle = `@${user.username}@${server}`;
-          localStorage.setItem('user_handle', handle);
-  
+          localStorage.setItem("user_handle", handle);
+
           router.replace("/main");
         }
       } catch (err) {
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 5631e73..94b0646 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -4,23 +4,39 @@ import { useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
 import { SubmitHandler, useForm } from "react-hook-form";
 import detectInstance from "./api/functions/web/detectInstance";
-import Link from "next/link";
 import { loginReqDto } from "./_dto/web/login/login.dto";
 
 interface FormValue {
   address: string;
 }
 
-interface hosts {
-  protocol: string;
-  host: string;
-}
+/**
+ * 미스키 전용 Auth Function
+ * @param loginReqDto
+ * @returns
+ */
+const misskeyAuth = async ({ host }: loginReqDto) => {
+  const body: loginReqDto = {
+    host: host,
+  };
+  const res = await fetch(`/api/web/misskey-login`, {
+    method: "POST",
+    body: JSON.stringify(body),
+  });
 
-const misskeyAuth = async ({ misskeyHost }: loginReqDto) => {
+  return await res.json();
+};
+
+/**
+ * 마스토돈 전용 Auth Function
+ * @param loginReqDto
+ * @returns
+ */
+const mastodonAuth = async ({ host }: loginReqDto) => {
   const body: loginReqDto = {
-    misskeyHost: misskeyHost,
+    host: host,
   };
-  const res = await fetch(`/api/web/login`, {
+  const res = await fetch(`/api/web/mastodon-login`, {
     method: "POST",
     body: JSON.stringify(body),
   });
@@ -48,7 +64,6 @@ function urlToHost(urlOrHost: string) {
 
 export default function Home() {
   const [isLoading, setIsLoading] = useState<boolean>(false);
-  const [hosts, setHosts] = useState<hosts>({ protocol: "", host: "" });
   const router = useRouter();
   const {
     register,
@@ -61,12 +76,11 @@ export default function Home() {
     const host = urlToHost(e.address);
     localStorage.setItem("server", host);
 
-    const payload: loginReqDto = {
-      misskeyHost: host,
-    };
-
-    detectInstance(host).then((r) => {
-      switch (r) {
+    detectInstance(host).then((type) => {
+      const payload: loginReqDto = {
+        host: host,
+      };
+      switch (type) {
         case "misskey":
           localStorage.setItem("server", host);
           misskeyAuth(payload).then((r) => {
@@ -82,8 +96,11 @@ export default function Home() {
           });
           break;
         case "mastodon":
-          document.getElementById("mastodon_modal")?.click();
-          setIsLoading(false);
+          localStorage.setItem("server", host);
+          mastodonAuth(payload).then((r) => {
+            router.replace(r);
+            console.log(r);
+          });
           break;
         default:
           console.log("아무것도 없는뎁쇼?");
@@ -92,15 +109,12 @@ export default function Home() {
   };
 
   useEffect(() => {
-    const protocol = window.location.protocol;
-    const host = window.location.host;
     const lastUsedHost = localStorage.getItem("server");
     const ele = document.getElementById("serverNameInput") as HTMLInputElement;
     if (lastUsedHost && ele) {
       ele.value = lastUsedHost;
       ele.focus();
     }
-    setHosts({ protocol: protocol, host: host });
   }, []);
 
   return (

From 9ba81c3684e7794b5701c8677fc18e08970e67f5 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Wed, 20 Nov 2024 00:44:08 +0900
Subject: [PATCH 45/89] =?UTF-8?q?=F0=9F=93=A6=20dotenv=20=EC=84=A4?=
 =?UTF-8?q?=EC=B9=98=20=EB=B0=8F=20=EC=8A=A4=ED=81=AC=EB=A6=BD=ED=8A=B8=20?=
 =?UTF-8?q?=EC=84=A4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json | 43 +++++++++++++++++++++++++++++++++++--------
 package.json      |  4 +++-
 2 files changed, 38 insertions(+), 9 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index e66029e..a2a05d9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
         "class-transformer": "^0.5.1",
         "class-validator": "^0.14.1",
         "daisyui": "^4.12.14",
+        "dotenv-cli": "^7.4.2",
         "jose": "^5.9.6",
         "next": "15.0.3",
         "pg": "^8.13.1",
@@ -1351,7 +1352,6 @@
       "version": "7.0.5",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.5.tgz",
       "integrity": "sha512-ZVJrKKYunU38/76t0RMOulHOnUcbU9GbpWKAOZ0mhjr7CX6FVrH+4FrAapSOekrgFQ3f/8gwMEuIft0aKq6Hug==",
-      "dev": true,
       "dependencies": {
         "path-key": "^3.1.0",
         "shebang-command": "^2.0.0",
@@ -1560,6 +1560,39 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/dotenv": {
+      "version": "16.4.5",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.5.tgz",
+      "integrity": "sha512-ZmdL2rui+eB2YwhsWzjInR8LldtZHGDoQ1ugH85ppHKwpUHL7j7rN0Ti9NCnGiQbhaZ11FpR+7ao1dNsmduNUg==",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://dotenvx.com"
+      }
+    },
+    "node_modules/dotenv-cli": {
+      "version": "7.4.2",
+      "resolved": "https://registry.npmjs.org/dotenv-cli/-/dotenv-cli-7.4.2.tgz",
+      "integrity": "sha512-SbUj8l61zIbzyhIbg0FwPJq6+wjbzdn9oEtozQpZ6kW2ihCcapKVZj49oCT3oPM+mgQm+itgvUQcG5szxVrZTA==",
+      "dependencies": {
+        "cross-spawn": "^7.0.3",
+        "dotenv": "^16.3.0",
+        "dotenv-expand": "^10.0.0",
+        "minimist": "^1.2.6"
+      },
+      "bin": {
+        "dotenv": "cli.js"
+      }
+    },
+    "node_modules/dotenv-expand": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/dotenv-expand/-/dotenv-expand-10.0.0.tgz",
+      "integrity": "sha512-GopVGCpVS1UKH75VKHGuQFqS1Gusej0z4FyQkPdwjil2gNIv+LNsqBlboOzpJFZKVT95GkCyWJbBSdFEFUWI2A==",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/eastasianwidth": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
@@ -3072,8 +3105,7 @@
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
-      "dev": true
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
     },
     "node_modules/iterator.prototype": {
       "version": "1.1.3",
@@ -3321,7 +3353,6 @@
       "version": "1.2.8",
       "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.8.tgz",
       "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==",
-      "dev": true,
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -3680,7 +3711,6 @@
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
       "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -4418,7 +4448,6 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
       "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
-      "dev": true,
       "dependencies": {
         "shebang-regex": "^3.0.0"
       },
@@ -4430,7 +4459,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
       "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -5110,7 +5138,6 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
       "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
-      "dev": true,
       "dependencies": {
         "isexe": "^2.0.0"
       },
diff --git a/package.json b/package.json
index e8f7de6..54813d3 100644
--- a/package.json
+++ b/package.json
@@ -9,13 +9,15 @@
     "start:local": "source config/local_env.env && next start",
     "start:docker": "prisma migrate deploy && node server.js",
     "lint": "next lint",
-    "prisma": "source config/local_dev.env && prisma migrate dev"
+    "prisma": "source config/local_dev.env && prisma migrate dev",
+    "prisma:studio": "dotenv -e config/local_dev.env -- npx prisma studio"
   },
   "dependencies": {
     "@prisma/client": "^5.19.1",
     "class-transformer": "^0.5.1",
     "class-validator": "^0.14.1",
     "daisyui": "^4.12.14",
+    "dotenv-cli": "^7.4.2",
     "jose": "^5.9.6",
     "next": "15.0.3",
     "pg": "^8.13.1",

From 1cbbbdb12286d99e3e4ac654ef291991fb6988fc Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Wed, 20 Nov 2024 00:44:31 +0900
Subject: [PATCH 46/89] =?UTF-8?q?=E2=9C=A8=20=EB=A7=88=EC=8A=A4=ED=86=A0?=
 =?UTF-8?q?=EB=8F=88=EB=8F=84=20=EB=8B=B5=EB=B3=80=20=EC=9E=91=EC=84=B1?=
 =?UTF-8?q?=ED=95=98=EB=A9=B4=20=ED=88=BF=20=EC=8F=98=EB=8A=94=20=EA=B8=B0?=
 =?UTF-8?q?=EB=8A=A5=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/index.d.ts               |   6 ++
 src/app/main/questions/action.ts | 159 ++++++++++++++++++++++++-------
 2 files changed, 133 insertions(+), 32 deletions(-)

diff --git a/src/app/index.d.ts b/src/app/index.d.ts
index 9a0014c..d2e92cb 100644
--- a/src/app/index.d.ts
+++ b/src/app/index.d.ts
@@ -45,6 +45,12 @@ export interface MkNoteAnswers {
   visibility: "public" | "home" | "followers";
 }
 
+export interface mastodonTootAnswers {
+  spoiler_text: string;
+  status: string;
+  visibility: "public" | "unlisted" | "private";
+}
+
 export interface postQuestion {
   question: string;
   questioner: string;
diff --git a/src/app/main/questions/action.ts b/src/app/main/questions/action.ts
index caefdeb..030df14 100644
--- a/src/app/main/questions/action.ts
+++ b/src/app/main/questions/action.ts
@@ -1,6 +1,7 @@
 "use server";
 
-import type { MkNoteAnswers, typedAnswer } from "@/app";
+import type { mastodonTootAnswers, MkNoteAnswers, typedAnswer } from "@/app";
+import detectInstance from "@/app/api/functions/web/detectInstance";
 import { verifyToken } from "@/app/api/functions/web/verify-jwt";
 import { PrismaClient, question } from "@prisma/client";
 import { createHash } from "crypto";
@@ -59,40 +60,89 @@ export async function postAnswer(
       },
     });
 
-    //답변 올리는 부분
-    if (userSettings && !userSettings.stopPostAnswer) {
-      const baseUrl = process.env.WEB_URL;
-      const answerUrl = `${baseUrl}/main/user/${answer.answeredPersonHandle}/${postWithAnswer.id}`;
-
-      if (answeredUser && server) {
-        const i = createHash("sha256")
-          .update(answeredUser.token + server.appSecret, "utf-8")
-          .digest("hex");
-        const host = answeredUser.hostName;
-        if (answer.nsfwedAnswer === true && answer.questioner === null) {
-          const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
-          const text = `Q: ${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-          await mkMisskeyNote(i, title, text, host, answer.visibility);
-        } else if (
-          answer.nsfwedAnswer === false &&
-          answer.questioner !== null
-        ) {
-          const title = `Q: ${question.question} #neo-quesdon`;
-          const text = `질문자:${answer.questioner}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-          await mkMisskeyNote(i, title, text, host, answer.visibility);
-        } else if (answer.nsfwedAnswer === true && answer.questioner !== null) {
-          const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
-          const text = `질문자:${answer.questioner}\nQ:${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-          await mkMisskeyNote(i, title, text, host, answer.visibility);
+    if (server) {
+      const instanceType = await detectInstance(server.instances);
+
+      console.log(instanceType);
+
+      //답변 올리는 부분
+      if (userSettings && !userSettings.stopPostAnswer) {
+        const baseUrl = process.env.WEB_URL;
+        const answerUrl = `${baseUrl}/main/user/${answer.answeredPersonHandle}/${postWithAnswer.id}`;
+
+        if (answeredUser && server) {
+          const i = createHash("sha256")
+            .update(answeredUser.token + server.appSecret, "utf-8")
+            .digest("hex");
+          const host = answeredUser.hostName;
+          if (answer.nsfwedAnswer === true && answer.questioner === null) {
+            const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
+            const text = `Q: ${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
+            if (instanceType === "misskey" || instanceType === "cherrypick") {
+              await mkMisskeyNote(i, title, text, host, answer.visibility);
+            } else {
+              await mastodonToot(
+                answeredUser.token,
+                title,
+                text,
+                host,
+                answer.visibility
+              );
+            }
+          } else if (
+            answer.nsfwedAnswer === false &&
+            answer.questioner !== null
+          ) {
+            const title = `Q: ${question.question} #neo-quesdon`;
+            const text = `질문자:${answer.questioner}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
+            if (instanceType === "misskey" || instanceType === "cherrypick") {
+              await mkMisskeyNote(i, title, text, host, answer.visibility);
+            } else {
+              await mastodonToot(
+                answeredUser.token,
+                title,
+                text,
+                host,
+                answer.visibility
+              );
+            }
+          } else if (
+            answer.nsfwedAnswer === true &&
+            answer.questioner !== null
+          ) {
+            const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
+            const text = `질문자:${answer.questioner}\nQ:${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
+            if (instanceType === "misskey" || instanceType === "cherrypick") {
+              await mkMisskeyNote(i, title, text, host, answer.visibility);
+            } else {
+              await mastodonToot(
+                answeredUser.token,
+                title,
+                text,
+                host,
+                answer.visibility
+              );
+            }
+          } else {
+            const title = `Q: ${question.question} #neo-quesdon`;
+            const text = `A: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
+            if (instanceType === "misskey" || instanceType === "cherrypick") {
+              await mkMisskeyNote(i, title, text, host, answer.visibility);
+            } else {
+              await mastodonToot(
+                answeredUser.token,
+                title,
+                text,
+                host,
+                answer.visibility
+              );
+            }
+          }
         } else {
-          const title = `Q: ${question.question} #neo-quesdon`;
-          const text = `A: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-          await mkMisskeyNote(i, title, text, host, answer.visibility);
+          console.log("user not found");
         }
-      } else {
-        console.log("user not found");
+        console.log("Created new answer:", answerUrl);
       }
-      console.log("Created new answer:", answerUrl);
     }
   }
 }
@@ -121,6 +171,51 @@ async function mkMisskeyNote(
     console.warn(`Note create fail! `, res.status, res.statusText);
   }
 }
+
+async function mastodonToot(
+  i: string,
+  title: string,
+  text: string,
+  hostname: string,
+  visibility: "public" | "home" | "followers"
+) {
+  let newVisibility: "public" | "unlisted" | "private";
+  switch (visibility) {
+    case "public":
+      newVisibility = "public";
+      break;
+    case "home":
+      newVisibility = "unlisted";
+      break;
+    case "followers":
+      newVisibility = "private";
+    default:
+      newVisibility = "public";
+      break;
+  }
+  const newAnswerToot: mastodonTootAnswers = {
+    spoiler_text: title,
+    status: text,
+    visibility: newVisibility,
+  };
+  try {
+    const res = await fetch(`https://${hostname}/api/v1/statuses`, {
+      method: "POST",
+      headers: {
+        Authorization: `Bearer ${i}`,
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify(newAnswerToot),
+    });
+
+    if (!res.ok) {
+      throw new Error(`HTTP Error! status:${res.status}`);
+    }
+  } catch (err) {
+    console.warn(`Toot Create Fail!`, err);
+  }
+}
+
 export async function deleteQuestion(id: number) {
   const cookieStore = await cookies();
   const jwtToken = cookieStore.get("jwtToken")?.value;

From a73d0cfeec14a68705c0c30ec125e3405c27a407 Mon Sep 17 00:00:00 2001
From: Yunochi <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 11:42:05 +0900
Subject: [PATCH 47/89] =?UTF-8?q?=EC=A3=BC=EC=84=9D=20=EB=B3=B4=EC=99=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 prisma/schema.prisma                                       | 6 +++---
 src/app/_dto/mastodon-callback/callback-token-claim.dto.ts | 6 +++---
 src/app/_dto/misskey-callback/callback-token-claim.dto.ts  | 4 ++--
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 6e45757..0b5f1ff 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -60,7 +60,7 @@ model question {
 model server {
     id              Int         @default(autoincrement())   @id
     instances       String      @unique
-    appSecret       String?
-    client_id       String?
-    client_secret   String?
+    appSecret       String?     /// Misskey App인증의 Secret Key
+    client_id       String?     /// Mastodon OAuth2 client ID
+    client_secret   String?     /// Mastodon OAuth2 client secret
 }
\ No newline at end of file
diff --git a/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts b/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts
index cb3ec44..7373fdc 100644
--- a/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts
+++ b/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts
@@ -1,15 +1,15 @@
 import { IsString } from "class-validator";
 
 export class mastodonCallbackTokenClaimPayload {
-  //Mastodon code를 요청할 mastodon의 host (예: planet.moe)
+  /** Mastodon code를 요청할 mastodon의 host (예: planet.moe) */
   @IsString()
   mastodonHost: string;
 
-  //callback으로 받은 토큰
+  /** callback으로 받은 토큰 */
   @IsString()
   callback_code: string;
 
-  //현재 로그인 state
+  /** 현재 로그인 state */
   @IsString()
   state: string;
 }
diff --git a/src/app/_dto/misskey-callback/callback-token-claim.dto.ts b/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
index a4cc0f7..06a9c73 100644
--- a/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
+++ b/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
@@ -1,11 +1,11 @@
 import { IsString } from "class-validator";
 
 export class misskeyCallbackTokenClaimPayload {
-  //Misskey Access key 를 요청할 misskey의 host (예: serafuku.moe)
+  /** Misskey Access key 를 요청할 misskey의 host (예: serafuku.moe) */
   @IsString()
   misskeyHost: string;
 
-  //callback으로 받은 토큰
+  /** callback으로 받은 토큰 */
   @IsString()
   callback_token: string;
 }

From 7260b9aea6a4d6017bb1cabceebc4e88c2e716df Mon Sep 17 00:00:00 2001
From: Yunochi <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 18:38:50 +0900
Subject: [PATCH 48/89] =?UTF-8?q?DB=EB=A7=88=EC=9D=B4=EA=B7=B8=EB=A0=88?=
 =?UTF-8?q?=EC=9D=B4=EC=85=98=20=EC=83=9D=EC=84=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../20241120085821_add_instance_type/migration.sql        | 5 +++++
 prisma/schema.prisma                                      | 8 +++++++-
 2 files changed, 12 insertions(+), 1 deletion(-)
 create mode 100644 prisma/migrations/20241120085821_add_instance_type/migration.sql

diff --git a/prisma/migrations/20241120085821_add_instance_type/migration.sql b/prisma/migrations/20241120085821_add_instance_type/migration.sql
new file mode 100644
index 0000000..bcb8962
--- /dev/null
+++ b/prisma/migrations/20241120085821_add_instance_type/migration.sql
@@ -0,0 +1,5 @@
+-- CreateEnum
+CREATE TYPE "InstanceType" AS ENUM ('mastodon', 'misskey', 'cherrypick');
+
+-- AlterTable
+ALTER TABLE "server" ADD COLUMN     "instanceType" "InstanceType" NOT NULL DEFAULT 'misskey';
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 0b5f1ff..3bb57de 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -8,6 +8,11 @@ datasource db {
   url = env("DATABASE_URL") // uses connection pooling
 }
 
+enum InstanceType {
+  mastodon
+  misskey
+  cherrypick
+}
 model user {
     id              Int      @default(autoincrement())    @id
     account         String
@@ -59,7 +64,8 @@ model question {
 
 model server {
     id              Int         @default(autoincrement())   @id
-    instances       String      @unique
+    instances       String      @unique         /// Server 의 Hostname
+    instanceType    InstanceType @default(misskey)
     appSecret       String?     /// Misskey App인증의 Secret Key
     client_id       String?     /// Mastodon OAuth2 client ID
     client_secret   String?     /// Mastodon OAuth2 client secret

From 8c811178ff469ceb19cb9427a199db15b581c47e Mon Sep 17 00:00:00 2001
From: Yunochi <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 18:40:03 +0900
Subject: [PATCH 49/89] =?UTF-8?q?=EB=8C=80=EB=AC=B8=20=EC=86=8C=EA=B0=9C?=
 =?UTF-8?q?=EB=AC=B8=EA=B5=AC=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/page.tsx | 37 +++++++++----------------------------
 1 file changed, 9 insertions(+), 28 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index de242de..80b4c4e 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -23,7 +23,7 @@ const misskeyAuth = async ({ host }: loginReqDto) => {
     method: "POST",
     body: JSON.stringify(body),
   });
-
+  if (!res.ok) { throw new Error(`Misskey login Error! ${res.status}, ${await res.text()}`); }
   return await res.json();
 };
 
@@ -40,7 +40,7 @@ const mastodonAuth = async ({ host }: loginReqDto) => {
     method: "POST",
     body: JSON.stringify(body),
   });
-
+  if (!res.ok) { throw new Error(`Mastodon login Error! ${res.status}, ${await res.text()}`); }
   return await res.json();
 };
 
@@ -87,6 +87,8 @@ export default function Home() {
           misskeyAuth(payload).then((r) => {
             setIsLoading(false);
             router.replace(r.url);
+          }).catch((err) => {
+            window.alert(err);
           });
           break;
         case "cherrypick":
@@ -94,13 +96,16 @@ export default function Home() {
           misskeyAuth(payload).then((r) => {
             setIsLoading(false);
             router.replace(r.url);
+          }).catch((err) => {
+            window.alert(err);
           });
           break;
         case "mastodon":
           localStorage.setItem("server", host);
           mastodonAuth(payload).then((r) => {
             router.replace(r);
-            console.log(r);
+          }).catch((err) => {
+            window.alert(err);
           });
           break;
         default:
@@ -131,7 +136,7 @@ export default function Home() {
             </h1>
           </div>
           <span className="font-thin tracking-wider text-base desktop:text-lg">
-            &quot;아직은&quot; Misskey / CherryPick에서만 사용할 수 있는 새로운
+            Misskey / CherryPick / Mastodon 에서 사용할 수 있는 새로운
             Quesdon
           </span>
         </div>
@@ -192,30 +197,6 @@ export default function Home() {
             </button>
           </div>
         </div>
-        <input type="checkbox" id="mastodon_modal" className="modal-toggle" />
-        <div className="modal" role="dialog">
-          <div className="modal-box">
-            <h3 className="text-lg font-bold">준비중!</h3>
-            <p className="py-4">
-              마스토돈 로그인은 준비중이에요.
-              <br />{" "}
-              <a
-                className="link link-primary"
-                href="https://serafuku.moe/@Yozumina"
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                @Yozumina@serafuku.moe
-              </a>
-              를 쪼아주세요!
-            </p>
-            <div className="modal-action">
-              <label htmlFor="mastodon_modal" className="btn">
-                알겠어요
-              </label>
-            </div>
-          </div>
-        </div>
       </main>
       <footer className="row-start-3 flex gap-6 flex-wrap items-center justify-center"></footer>
     </div>

From f3c3c7072037dec125f609e4ae19c09fe6755aeb Mon Sep 17 00:00:00 2001
From: Yunochi <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 18:42:23 +0900
Subject: [PATCH 50/89] =?UTF-8?q?=EB=85=B8=ED=8A=B8/=ED=88=BF=20=EC=9E=91?=
 =?UTF-8?q?=EC=84=B1=20=ED=95=A8=EC=88=98=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/question.tsx |   9 +-
 src/app/index.d.ts               |   3 -
 src/app/main/questions/action.ts | 242 +++++++++++++++++--------------
 3 files changed, 134 insertions(+), 120 deletions(-)

diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index ae7cf1b..649a26c 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -67,21 +67,18 @@ export default function Question({
       return;
     }
 
-    const question = await getQuestion(singleQuestion.id);
+    const questionId = singleQuestion.id;
     const typedAnswer: typedAnswer = {
-      question: question!.question,
-      questioner: question!.questioner,
       answer: e.answer,
-      answeredPersonHandle: question!.questioneeHandle,
       nsfwedAnswer: e.nsfw,
       visibility: e.visibility,
     };
     const filteredQuestions = multipleQuestions.filter(
-      (el) => el.id !== singleQuestion.id
+      (el) => el.id !== questionId
     );
 
     setState(filteredQuestions);
-    postAnswer(question, typedAnswer);
+    postAnswer(questionId, typedAnswer);
     document.getElementById("my_modal_1")?.click();
   };
 
diff --git a/src/app/index.d.ts b/src/app/index.d.ts
index d2e92cb..889c7bd 100644
--- a/src/app/index.d.ts
+++ b/src/app/index.d.ts
@@ -31,10 +31,7 @@ export interface questions {
 }
 
 export interface typedAnswer {
-  question: string;
-  questioner: string | null;
   answer: string;
-  answeredPersonHandle: string;
   nsfwedAnswer: boolean;
   visibility: "public" | "home" | "followers";
 }
diff --git a/src/app/main/questions/action.ts b/src/app/main/questions/action.ts
index 030df14..ce30806 100644
--- a/src/app/main/questions/action.ts
+++ b/src/app/main/questions/action.ts
@@ -1,8 +1,8 @@
 "use server";
 
 import type { mastodonTootAnswers, MkNoteAnswers, typedAnswer } from "@/app";
-import detectInstance from "@/app/api/functions/web/detectInstance";
 import { verifyToken } from "@/app/api/functions/web/verify-jwt";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { PrismaClient, question } from "@prisma/client";
 import { createHash } from "crypto";
 import { cookies } from "next/headers";
@@ -20,128 +20,139 @@ export async function getQuestion(id: number) {
 }
 
 export async function postAnswer(
-  question: question | null,
+  questionId: question["id"] | null,
   answer: typedAnswer
 ) {
   const prisma = new PrismaClient();
+  const cookieStore = await cookies();
+  const jwtToken = cookieStore.get('jwtToken')?.value;
+  let tokenPayload;
+  // JWT 토큰 검증
+  try {
+    tokenPayload = await verifyToken(jwtToken);
+  } catch (err) {
+    return sendApiError(401, "Unauthorized");
+  }
 
-  if (question !== null) {
-    const postWithAnswer = await prisma.answer.create({
-      data: {
-        question: question.question,
-        questioner: question.questioner,
-        answer: answer.answer,
-        answeredPersonHandle: question.questioneeHandle,
-        nsfwedAnswer: answer.nsfwedAnswer,
-      },
-    });
 
-    const deleteQuestion = await prisma.question.delete({
-      where: {
-        id: question.id,
-      },
-    });
+  if (questionId !== null) {
+    // 트랜잭션으로 All or Nothing 처리
+    const [question, postWithAnswer] = await prisma.$transaction(async (tx) => {
+      const q = await tx.question.findUniqueOrThrow({ where: { id: questionId } });
+      if (q.questioneeHandle !== tokenPayload.handle) {
+        throw new Error(`This question is not for you`);
+      }
+      const a = await prisma.answer.create({
+        data: {
+          question: q.question,
+          questioner: q.questioner,
+          answer: answer.answer,
+          answeredPersonHandle: tokenPayload.handle,
+          nsfwedAnswer: answer.nsfwedAnswer,
+        },
+      });
+      await prisma.question.delete({
+        where: {
+          id: q.id,
+        },
+      });
 
-    const answeredUser = await prisma.user.findUnique({
+      return [q, a];
+    });
+    const answeredUser = await prisma.user.findUniqueOrThrow({
       where: {
-        handle: question.questioneeHandle,
+        handle: tokenPayload.handle,
       },
     });
 
-    const server = await prisma.server.findUnique({
+    const server = await prisma.server.findUniqueOrThrow({
       where: {
-        instances: answeredUser?.hostName,
+        instances: answeredUser.hostName,
       },
     });
 
-    const userSettings = await prisma.profile.findUnique({
+    const instanceType = server.instanceType;
+
+    const baseUrl = process.env.WEB_URL;
+    const answerUrl = `${baseUrl}/main/user/${answeredUser.handle}/${postWithAnswer.id}`;
+    console.log("Created new answer:", answerUrl);
+    //답변 올리는 부분
+    const userSettings = await prisma.profile.findUniqueOrThrow({
       where: {
-        handle: question.questioneeHandle,
+        handle: tokenPayload.handle,
       },
     });
-
-    if (server) {
-      const instanceType = await detectInstance(server.instances);
-
-      console.log(instanceType);
-
-      //답변 올리는 부분
-      if (userSettings && !userSettings.stopPostAnswer) {
-        const baseUrl = process.env.WEB_URL;
-        const answerUrl = `${baseUrl}/main/user/${answer.answeredPersonHandle}/${postWithAnswer.id}`;
-
-        if (answeredUser && server) {
-          const i = createHash("sha256")
-            .update(answeredUser.token + server.appSecret, "utf-8")
-            .digest("hex");
-          const host = answeredUser.hostName;
-          if (answer.nsfwedAnswer === true && answer.questioner === null) {
-            const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
-            const text = `Q: ${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-            if (instanceType === "misskey" || instanceType === "cherrypick") {
-              await mkMisskeyNote(i, title, text, host, answer.visibility);
-            } else {
-              await mastodonToot(
-                answeredUser.token,
-                title,
-                text,
-                host,
-                answer.visibility
-              );
-            }
-          } else if (
-            answer.nsfwedAnswer === false &&
-            answer.questioner !== null
-          ) {
-            const title = `Q: ${question.question} #neo-quesdon`;
-            const text = `질문자:${answer.questioner}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-            if (instanceType === "misskey" || instanceType === "cherrypick") {
-              await mkMisskeyNote(i, title, text, host, answer.visibility);
-            } else {
-              await mastodonToot(
-                answeredUser.token,
-                title,
-                text,
-                host,
-                answer.visibility
-              );
-            }
-          } else if (
-            answer.nsfwedAnswer === true &&
-            answer.questioner !== null
-          ) {
-            const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo-quesdon`;
-            const text = `질문자:${answer.questioner}\nQ:${question.question}\nA: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-            if (instanceType === "misskey" || instanceType === "cherrypick") {
-              await mkMisskeyNote(i, title, text, host, answer.visibility);
-            } else {
-              await mastodonToot(
-                answeredUser.token,
-                title,
-                text,
-                host,
-                answer.visibility
-              );
-            }
+    if (!userSettings.stopPostAnswer) {
+      if (answeredUser && server) {
+        const i = createHash("sha256")
+          .update(answeredUser.token + server.appSecret, "utf-8")
+          .digest("hex");
+        const host = answeredUser.hostName;
+        if (answer.nsfwedAnswer === true && question.questioner === null) {
+          const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo_quesdon`;
+          const text = `Q: ${question.question}\nA: ${answer.answer}\n#neo_quesdon ${answerUrl}`;
+          if (instanceType === "misskey" || instanceType === "cherrypick") {
+            await mkMisskeyNote(i, title, text, host, answer.visibility);
+          } else {
+            await mastodonToot(
+              answeredUser.token,
+              title,
+              text,
+              host,
+              answer.visibility
+            );
+          }
+        } else if (
+          answer.nsfwedAnswer === false &&
+          question.questioner !== null
+        ) {
+          const title = `Q: ${question.question} #neo_quesdon`;
+          const text = `질문자:${question.questioner}\nA: ${answer.answer}\n#neo_quesdon ${answerUrl}`;
+          if (instanceType === "misskey" || instanceType === "cherrypick") {
+            await mkMisskeyNote(i, title, text, host, answer.visibility);
           } else {
-            const title = `Q: ${question.question} #neo-quesdon`;
-            const text = `A: ${answer.answer}\n#neo-quesdon ${answerUrl}`;
-            if (instanceType === "misskey" || instanceType === "cherrypick") {
-              await mkMisskeyNote(i, title, text, host, answer.visibility);
-            } else {
-              await mastodonToot(
-                answeredUser.token,
-                title,
-                text,
-                host,
-                answer.visibility
-              );
-            }
+            await mastodonToot(
+              answeredUser.token,
+              title,
+              text,
+              host,
+              answer.visibility
+            );
+          }
+        } else if (
+          answer.nsfwedAnswer === true &&
+          question.questioner !== null
+        ) {
+          const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo_quesdon`;
+          const text = `질문자:${question.questioner}\nQ:${question.question}\nA: ${answer.answer}\n#neo_quesdon ${answerUrl}`;
+          if (instanceType === "misskey" || instanceType === "cherrypick") {
+            await mkMisskeyNote(i, title, text, host, answer.visibility);
+          } else {
+            await mastodonToot(
+              answeredUser.token,
+              title,
+              text,
+              host,
+              answer.visibility
+            );
           }
         } else {
-          console.log("user not found");
+          const title = `Q: ${question.question} #neo_quesdon`;
+          const text = `A: ${answer.answer}\n#neo_quesdon ${answerUrl}`;
+          if (instanceType === "misskey" || instanceType === "cherrypick") {
+            await mkMisskeyNote(i, title, text, host, answer.visibility);
+          } else {
+            await mastodonToot(
+              answeredUser.token,
+              title,
+              text,
+              host,
+              answer.visibility
+            );
+          }
         }
-        console.log("Created new answer:", answerUrl);
+      } else {
+        console.log("user not found");
       }
     }
   }
@@ -154,6 +165,11 @@ async function mkMisskeyNote(
   hostname: string,
   visibility: "public" | "home" | "followers"
 ) {
+  // 미스키 CW길이제한 처리
+  if (title.length > 100) {
+    title = title.substring(0, 90) + '.....'
+  }
+
   const newAnswerNote: MkNoteAnswers = {
     cw: title,
     text: text,
@@ -189,6 +205,7 @@ async function mastodonToot(
       break;
     case "followers":
       newVisibility = "private";
+      break;
     default:
       newVisibility = "public";
       break;
@@ -219,17 +236,20 @@ async function mastodonToot(
 export async function deleteQuestion(id: number) {
   const cookieStore = await cookies();
   const jwtToken = cookieStore.get("jwtToken")?.value;
-
   try {
-    await verifyToken(jwtToken);
-
+    const tokenPayload = await verifyToken(jwtToken);
     const prisma = new PrismaClient();
-
-    const deleteQuestion = await prisma.question.delete({
-      where: {
-        id: id,
-      },
-    });
+    await prisma.$transaction(async (tr) => {
+      const q = await tr.question.findUniqueOrThrow({where: {id: id}});
+      if (q.questioneeHandle !== tokenPayload.handle) {
+        throw new Error(`You Can't delete this question`);
+      }
+      await prisma.question.delete({
+        where: {
+          id: id,
+        },
+      });
+    })
   } catch (err) {
     throw new Error(`JWT Token Verification Error: ${err}`);
   }

From bced03330bed63d6664952b3348c6f127bfc3d00 Mon Sep 17 00:00:00 2001
From: Yunochi <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 18:43:23 +0900
Subject: [PATCH 51/89] =?UTF-8?q?user=20profile=20API=EC=97=90=EC=84=9C=20?=
 =?UTF-8?q?=EC=9D=B8=EC=8A=A4=ED=84=B4=EC=8A=A4=20=ED=83=80=EC=9E=85=20?=
 =?UTF-8?q?=EB=82=98=EC=98=A4=EB=8F=84=EB=A1=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_dto/fetch-profile/Profile.dto.ts      |  5 ++++-
 src/app/api/db/fetch-my-profile/route.ts       | 12 ++++++++++--
 src/app/api/db/fetch-profile/[handle]/route.ts |  2 ++
 src/app/api/functions/web/detectInstance.ts    | 18 +++++++++++++++---
 4 files changed, 31 insertions(+), 6 deletions(-)

diff --git a/src/app/_dto/fetch-profile/Profile.dto.ts b/src/app/_dto/fetch-profile/Profile.dto.ts
index 1cd53f9..ef31f53 100644
--- a/src/app/_dto/fetch-profile/Profile.dto.ts
+++ b/src/app/_dto/fetch-profile/Profile.dto.ts
@@ -1,3 +1,4 @@
+import { $Enums } from "@prisma/client";
 export interface userProfileDto {
   handle: string;
   name: string[];
@@ -9,10 +10,12 @@ export interface userProfileDto {
   questionBoxName: string;
 }
 
-export interface userProfileWithCountDto extends userProfileDto {
+export interface userProfileMeDto extends userProfileDto {
   questions: number | null;
+  instanceType: $Enums.InstanceType;
 }
 
 export interface userProfileWithHostnameDto extends userProfileDto {
   hostname: string;
+  instanceType: $Enums.InstanceType;
 }
diff --git a/src/app/api/db/fetch-my-profile/route.ts b/src/app/api/db/fetch-my-profile/route.ts
index c1004e1..75c46b2 100644
--- a/src/app/api/db/fetch-my-profile/route.ts
+++ b/src/app/api/db/fetch-my-profile/route.ts
@@ -1,4 +1,4 @@
-import { userProfileWithCountDto } from "@/app/_dto/fetch-profile/Profile.dto";
+import { userProfileMeDto } from "@/app/_dto/fetch-profile/Profile.dto";
 import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
@@ -20,6 +20,11 @@ export async function GET(req: NextRequest) {
     }
 
     const userProfile = await prisma.profile.findUnique({
+      include: {
+          user: {
+            select: {hostName: true}
+          },
+      },
       where: {
         handle: handle,
       },
@@ -27,6 +32,8 @@ export async function GET(req: NextRequest) {
     if (!userProfile) {
       return NextResponse.json({ message: `User not found` }, { status: 404 });
     }
+    const host = userProfile.user.hostName;
+    const { instanceType } = await prisma.server.findUniqueOrThrow({where: {instances: host}, select: {instanceType: true}});
 
     const questionCount = await prisma.profile.findUnique({
       where: {
@@ -40,7 +47,7 @@ export async function GET(req: NextRequest) {
         },
       },
     });
-    const res: userProfileWithCountDto = {
+    const res: userProfileMeDto = {
       handle: userProfile.handle,
       name: userProfile.name,
       stopNewQuestion: userProfile.stopNewQuestion,
@@ -50,6 +57,7 @@ export async function GET(req: NextRequest) {
       stopNotiNewQuestion: userProfile.stopNotiNewQuestion,
       stopPostAnswer: userProfile.stopPostAnswer,
       questions: questionCount ? questionCount._count.questions : null,
+      instanceType: instanceType,
     };
 
     return NextResponse.json(res);
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index 7593f0b..d3fab65 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -42,6 +42,7 @@ export async function GET(
         { status: 404 }
       );
     }
+    const { instanceType } = await prisma.server.findUniqueOrThrow({where: {instances: profile.user.hostName}});
     const resBody: userProfileWithHostnameDto = {
       handle: profile.handle,
       name: profile.name,
@@ -52,6 +53,7 @@ export async function GET(
       stopNotiNewQuestion: profile.stopNotiNewQuestion,
       stopPostAnswer: profile.stopPostAnswer,
       hostname: profile.user.hostName,
+      instanceType: instanceType,
     };
 
     return NextResponse.json(resBody, {
diff --git a/src/app/api/functions/web/detectInstance.ts b/src/app/api/functions/web/detectInstance.ts
index 8cdd7d3..21db32f 100644
--- a/src/app/api/functions/web/detectInstance.ts
+++ b/src/app/api/functions/web/detectInstance.ts
@@ -16,13 +16,25 @@ export default async function detectInstance(host: string) {
   const parsedUrl = new URL(`https://${host}`);
   const nodeInfoMeta: nodeinfoMeta = await fetch(
     `${parsedUrl.origin}/.well-known/nodeinfo`
-  ).then((r) => r.json());
+  ).then((r) => {
+    if (!r.ok) {
+      console.error('인스턴스 타입 감지 실패 ', r.status);
+      throw new Error('인스턴스 타입 감지 실패');
+    }
+    return r.json();
+  }
+  );
   const nodeInfoLink = nodeInfoMeta.links.find(
     (el) => el.rel === "http://nodeinfo.diaspora.software/ns/schema/2.0"
   );
 
-  const nodeInfo: nodeinfo = await fetch(`${nodeInfoLink?.href}`).then((r) =>
-    r.json()
+  const nodeInfo: nodeinfo = await fetch(`${nodeInfoLink?.href}`).then((r) => {
+    if (!r.ok) {
+      console.error('인스턴스 타입 감지 실패 ', r.status);
+      throw new Error('인스턴스 타입 감지 실패');
+    }
+    return r.json();
+  }
   );
 
   return nodeInfo.software.name;

From d9b48bddffb454072d4b1bfb34efe959d669c34b Mon Sep 17 00:00:00 2001
From: Yunochi <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 18:48:29 +0900
Subject: [PATCH 52/89] fix: Misskey, Mastodon Auth

---
 src/app/api/web/mastodon-login/route.ts | 37 +++++++++++++++----------
 src/app/api/web/misskey-login/route.ts  |  5 +++-
 src/app/mastodon-callback/action.ts     |  2 --
 3 files changed, 27 insertions(+), 17 deletions(-)

diff --git a/src/app/api/web/mastodon-login/route.ts b/src/app/api/web/mastodon-login/route.ts
index b0d6804..06364c7 100644
--- a/src/app/api/web/mastodon-login/route.ts
+++ b/src/app/api/web/mastodon-login/route.ts
@@ -26,8 +26,8 @@ export async function POST(req: NextRequest) {
       },
     });
 
-    //인스턴스의 첫번째 로그인인 경우
-    if (!serverInfo) {
+    //인스턴스의 첫번째 로그인이거나, client_id/client_secret 가 null인 경우
+    if (!serverInfo || !serverInfo.client_id || !serverInfo.client_secret) {
       const res = await fetch(`https://${mastodonHost}/api/v1/apps`, {
         method: "POST",
         headers: {
@@ -36,47 +36,56 @@ export async function POST(req: NextRequest) {
         body: JSON.stringify({
           client_name: "Neo-Quesdon",
           redirect_uris: `${process.env.WEB_URL}/mastodon-callback`,
-          scopes: "read write",
+          scopes: "read:accounts read:blocks read:follows write:statuses",
           website: `${process.env.WEB_URL}`,
         }),
       }).then((r) => r.json());
 
       if (!res.id) {
-        return sendErrorResponse(500, `login error!`);
+        return sendErrorResponse(500, `Mastodon Response: ${JSON.stringify(res)}`);
       }
+      console.log('New Mastodon OAuth2 App Created:', res);
 
       await prisma.server.upsert({
         where: {
           instances: mastodonHost,
         },
         update: {
+          client_id: res.client_id,
           client_secret: res.client_secret,
+          instanceType: 'mastodon',
         },
         create: {
           instances: mastodonHost,
           client_id: res.client_id,
           client_secret: res.client_secret,
+          instanceType: 'mastodon',
         },
       });
-      const shit = await initiateMastodonAuthSession(
+      const session = await initiateMastodonAuthSession(
         mastodonHost,
         res.client_id
       );
-      return NextResponse.json(shit);
+      return NextResponse.json(session);
 
-      // 클라이언트 시크릿이 존재하는 경우
-    } else if (serverInfo.client_id && serverInfo.client_secret) {
-      const shit = await initiateMastodonAuthSession(
+    } else {
+      const session = await initiateMastodonAuthSession(
         mastodonHost,
         serverInfo.client_id
       );
-      return NextResponse.json(shit);
+      return NextResponse.json(session);
     }
   } catch (err) {
     return sendErrorResponse(500, `login error... ${err}`);
   }
 }
 
+/**
+ * 
+ * @param hostname Mastodon Hostname
+ * @param client_id OAuth2 Client ID
+ * @returns Mastodon Authorize URL
+ */
 async function initiateMastodonAuthSession(
   hostname: string,
   client_id: string
@@ -84,9 +93,9 @@ async function initiateMastodonAuthSession(
   const loginState = `${uuid()}_${client_id}`;
 
   const params: { [key: string]: string } = {
-    client_id: client_id,
-    scope: "read+write",
-    redirect_uri: `${process.env.WEB_URL}/mastodon-callback`,
+    client_id: encodeURIComponent(client_id),
+    scope: "read:accounts+read:blocks+read:follows+write:statuses",
+    redirect_uri: encodeURIComponent(`${process.env.WEB_URL}/mastodon-callback`),
     response_type: "code",
     state: loginState,
   };
@@ -94,6 +103,6 @@ async function initiateMastodonAuthSession(
   const url = `https://${hostname}/oauth/authorize?${Object.entries(params)
     .map((v) => v.join("="))
     .join("&")}`;
-
+  console.log('Created New Mastodon OAuth2 authorize URL:', url);
   return url;
 }
diff --git a/src/app/api/web/misskey-login/route.ts b/src/app/api/web/misskey-login/route.ts
index 17a89e0..b9bef5d 100644
--- a/src/app/api/web/misskey-login/route.ts
+++ b/src/app/api/web/misskey-login/route.ts
@@ -4,6 +4,7 @@ import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
 import { MiApiError, MiAuthSession } from "@/app";
+import detectInstance from "../../functions/web/detectInstance";
 
 export async function POST(req: NextRequest) {
   let data: loginReqDto;
@@ -50,17 +51,19 @@ export async function POST(req: NextRequest) {
       const data = await res.json();
       const appSecret = data.secret;
       console.log("New Misskey APP created!", data);
-
+      const detectedInstanceType = await detectInstance(misskeyHost) === 'cherrypick' ? 'cherrypick' : 'misskey';
       await prisma.server.upsert({
         where: {
           instances: misskeyHost,
         },
         update: {
           appSecret: appSecret,
+          instanceType: detectedInstanceType,
         },
         create: {
           appSecret: appSecret,
           instances: misskeyHost,
+          instanceType: detectedInstanceType,
         },
       });
       const authRes = await initiateMisskeyAuthSession(misskeyHost, appSecret);
diff --git a/src/app/mastodon-callback/action.ts b/src/app/mastodon-callback/action.ts
index 2456107..d5098e0 100644
--- a/src/app/mastodon-callback/action.ts
+++ b/src/app/mastodon-callback/action.ts
@@ -25,8 +25,6 @@ export async function login(
   }
   loginReq.mastodonHost = loginReq.mastodonHost.toLowerCase();
 
-  console.log(loginReq.mastodonHost);
-
   const serverInfo = await prisma.server.findFirst({
     where: {
       instances: loginReq.mastodonHost,

From c29a151863f95f6b467ea1d426d41d6eaaf7a8dd Mon Sep 17 00:00:00 2001
From: Yunochi <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 18:49:52 +0900
Subject: [PATCH 53/89] =?UTF-8?q?(=EC=9D=B8=EC=8A=A4=ED=84=B4=EC=8A=A4?=
 =?UTF-8?q?=ED=83=80=EC=9E=85)=20=EC=97=90=20=EC=A7=88=EB=AC=B8=EC=83=81?=
 =?UTF-8?q?=EC=9E=90=EB=A5=BC=20=EA=B3=B5=EC=9C=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/_header.tsx            |  4 ++--
 src/app/main/user/[handle]/page.tsx | 15 ++++++---------
 src/app/misskey-callback/page.tsx   | 17 +++++++++--------
 3 files changed, 17 insertions(+), 19 deletions(-)

diff --git a/src/app/main/_header.tsx b/src/app/main/_header.tsx
index d7fcf7b..b371d99 100644
--- a/src/app/main/_header.tsx
+++ b/src/app/main/_header.tsx
@@ -3,7 +3,7 @@
 import Link from "next/link";
 import { useCallback, useEffect, useState } from "react";
 import { FaUser } from "react-icons/fa";
-import { userProfileWithCountDto } from "../_dto/fetch-profile/Profile.dto";
+import { userProfileMeDto } from "../_dto/fetch-profile/Profile.dto";
 
 const fetchMyProfile = async () => {
   const user_handle = localStorage.getItem("user_handle");
@@ -30,7 +30,7 @@ const logout = async () => {
 };
 
 export default function MainHeader() {
-  const [user, setUser] = useState<userProfileWithCountDto>();
+  const [user, setUser] = useState<userProfileMeDto>();
 
   useEffect(() => {
     fetchMyProfile().then((r) => setUser(r));
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 45796fb..fe5e288 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -155,18 +155,15 @@ export default function UserPage() {
         });
         return;
       }
-
-      document.getElementById("my_modal_2")?.click();
-
       const req: CreateQuestionDto = {
         question: e.question,
         questioner: user_handle,
         questionee: profileHandle,
       };
+      reset();
       const res = await mkQuestionCreateApi(req);
-
       if (res.status === 200) {
-        reset();
+        (document.getElementById("my_modal_2") as HTMLInputElement).checked = true;
       }
     }
     // 작성자 비공개
@@ -186,7 +183,7 @@ export default function UserPage() {
           return;
         }
 
-        document.getElementById("my_modal_2")?.click();
+        (document.getElementById("my_modal_2") as HTMLInputElement).checked = true;
 
         const req: CreateQuestionDto = {
           question: e.question,
@@ -284,7 +281,7 @@ export default function UserPage() {
                         className={`w-24 h-24 object-cover absolute left-[calc(50%-3rem)] rounded-full`}
                       />
                     </Link>
-                    {userProfile.stopAnonQuestion && (
+                    {(userProfile.stopAnonQuestion && !userProfile.stopNewQuestion) && (
                       <div className="chat chat-start w-32 window:w-full desktop:w-full relative left-[68%] window:left-[60%] deskstop:left-[57%]">
                         <div className="chat-bubble text-sm flex items-center bg-base-100 text-slate-700">
                           작성자 공개 질문만 받아요!
@@ -377,7 +374,7 @@ export default function UserPage() {
             {localHandle === profileHandle && (
               <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
                 <a className="link" href={shareUrl()} target="_blank">
-                  Misskey에 질문상자 페이지를 공유
+                  {userProfile?.instanceType} 에 질문상자 페이지를 공유
                 </a>
               </div>
             )}
@@ -460,7 +457,7 @@ export default function UserPage() {
             <button
               className="btn"
               onClick={() => {
-                document.getElementById("my_modal_2")?.click();
+                (document.getElementById("my_modal_2") as HTMLInputElement).checked = false;
               }}
             >
               닫기
diff --git a/src/app/misskey-callback/page.tsx b/src/app/misskey-callback/page.tsx
index 633293b..c82c665 100644
--- a/src/app/misskey-callback/page.tsx
+++ b/src/app/misskey-callback/page.tsx
@@ -7,16 +7,17 @@ import { login } from "./actions";
 import { MiUser as MiUser } from "../api/misskey-entities/user";
 import { misskeyCallbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
 import { misskeyUserInfoPayload } from "../_dto/misskey-callback/user-info.dto";
+import type { profile, user } from "@prisma/client";
 
 export type DBpayload = {
-  account: string;
-  accountLower: string;
-  hostName: string;
-  handle: string;
-  name: string[];
-  avatarUrl: string;
-  accessToken: string;
-  userId: string;
+  account: user['account'];
+  accountLower: user['accountLower'];
+  hostName: user['hostName'];
+  handle: user['handle'];
+  name: profile['name'];
+  avatarUrl: profile['avatarUrl'];
+  accessToken: user['token'];
+  userId: user['userId'];
 };
 
 export default function CallbackPage() {

From 1d7aeb2a63c5894c6b90c795d345f1a51db3f338 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 20:54:03 +0900
Subject: [PATCH 54/89] =?UTF-8?q?=EC=82=AC=EC=9D=B4=20=EB=9D=84=EC=9B=8C?=
 =?UTF-8?q?=EC=93=B0=EA=B8=B0=20=EC=A0=9C=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/user/[handle]/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index fe5e288..b2309ad 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -374,7 +374,7 @@ export default function UserPage() {
             {localHandle === profileHandle && (
               <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
                 <a className="link" href={shareUrl()} target="_blank">
-                  {userProfile?.instanceType} 에 질문상자 페이지를 공유
+                  {userProfile?.instanceType}에 질문상자 페이지를 공유
                 </a>
               </div>
             )}

From e1ce22bbb0214f6ce5859bd770cd715250ed765f Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 21:11:57 +0900
Subject: [PATCH 55/89] =?UTF-8?q?fix:=20=ED=8A=B8=EB=9E=9C=EC=A0=9D?=
 =?UTF-8?q?=EC=85=98=EC=9A=A9=EC=9D=84=20=EC=8D=A8=EC=95=BC=EC=A7=80=20?=
 =?UTF-8?q?=EC=95=84=EC=98=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/questions/action.ts | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/app/main/questions/action.ts b/src/app/main/questions/action.ts
index ce30806..57a882c 100644
--- a/src/app/main/questions/action.ts
+++ b/src/app/main/questions/action.ts
@@ -42,7 +42,7 @@ export async function postAnswer(
       if (q.questioneeHandle !== tokenPayload.handle) {
         throw new Error(`This question is not for you`);
       }
-      const a = await prisma.answer.create({
+      const a = await tx.answer.create({
         data: {
           question: q.question,
           questioner: q.questioner,
@@ -51,7 +51,7 @@ export async function postAnswer(
           nsfwedAnswer: answer.nsfwedAnswer,
         },
       });
-      await prisma.question.delete({
+      await tx.question.delete({
         where: {
           id: q.id,
         },
@@ -244,7 +244,7 @@ export async function deleteQuestion(id: number) {
       if (q.questioneeHandle !== tokenPayload.handle) {
         throw new Error(`You Can't delete this question`);
       }
-      await prisma.question.delete({
+      await tr.question.delete({
         where: {
           id: id,
         },

From ccc15393f791f27c3ebd5cde2cfcf3626610be0e Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 23:00:57 +0900
Subject: [PATCH 56/89] =?UTF-8?q?=EB=8B=A8=EC=9D=BC=20=EB=8B=B5=EB=B3=80?=
 =?UTF-8?q?=EC=97=90=EC=84=9C=EB=8F=84=20=EC=82=AD=EC=A0=9C=EB=B2=84?=
 =?UTF-8?q?=ED=8A=BC=20=EB=8F=99=EC=9E=91=20=ED=95=98=EB=8F=84=EB=A1=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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

diff --git a/src/app/main/user/[handle]/[answer]/page.tsx b/src/app/main/user/[handle]/[answer]/page.tsx
index 1711801..d93d1da 100644
--- a/src/app/main/user/[handle]/[answer]/page.tsx
+++ b/src/app/main/user/[handle]/[answer]/page.tsx
@@ -4,19 +4,58 @@ import Answer from "@/app/_components/answer";
 import { useParams } from "next/navigation";
 import { useEffect, useState } from "react";
 import { fetchAnswer } from "./action";
-import { answer } from "@prisma/client";
+import { AnswerDto } from "@/app/_dto/Answers.dto";
 
 export default function SingleAnswer() {
-  const [answerBody, setAnswerBody] = useState<answer>();
+  const [answerBody, setAnswerBody] = useState<AnswerDto>();
   const { answer } = useParams() as { answer: string };
 
+  const handleDeleteAnswer = async (id: string) => {
+    const res = await fetch("/api/db/delete-answer", {
+      method: "POST",
+      body: JSON.stringify({ id: id }),
+    });
+    if (res.ok) {
+      window.history.back();
+    }
+  };
+
   useEffect(() => {
     fetchAnswer(answer).then((r) => setAnswerBody(r));
   }, [answer]);
 
   return (
     <div className="flex w-[90%] window:w-[80%] desktop:w-[70%]">
-      {answerBody && <Answer value={answerBody} id={answerBody.id} />}
+      {answerBody && (
+        <>
+          <Answer value={answerBody} id={answerBody.id} />
+          <input
+            type="checkbox"
+            id={`answer_delete_modal_${answerBody.id}`}
+            className="modal-toggle"
+          />
+          <div className="modal" role="dialog">
+            <div className="modal-box">
+              <h3 className="py-4 text-2xl">답변을 지울까요...?</h3>
+              <div className="modal-action">
+                <label
+                  htmlFor={`answer_delete_modal_${answerBody.id}`}
+                  className="btn btn-error"
+                  onClick={() => handleDeleteAnswer(answerBody.id)}
+                >
+                  확인
+                </label>
+                <label
+                  htmlFor={`answer_delete_modal_${answerBody.id}`}
+                  className="btn"
+                >
+                  취소
+                </label>
+              </div>
+            </div>
+          </div>
+        </>
+      )}
     </div>
   );
 }

From bb53f24854dcedb3ab441bbd33661db2482ebab0 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 23:24:20 +0900
Subject: [PATCH 57/89] =?UTF-8?q?=EC=84=B1=EB=8A=A5=EA=B0=9C=EC=84=A0:=20?=
 =?UTF-8?q?=EB=8B=B5=EB=B3=80=20=EB=AA=A9=EB=A1=9DAPI=20=EC=97=90=EC=84=9C?=
 =?UTF-8?q?=20=ED=94=84=EB=A1=9C=ED=95=84=EB=8F=84=20=EA=B0=99=EC=9D=B4=20?=
 =?UTF-8?q?=EB=B3=B4=EB=82=B4=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx                      | 13 ++++++++-----
 src/app/_dto/Answers.dto.ts                         |  6 ++++++
 .../_dto/fetch-all-answers/fetch-all-answers.dto.ts |  2 +-
 src/app/api/db/fetch-all-answers/route.ts           | 13 +++++++++----
 src/app/api/db/fetch-user-answers/route.ts          |  3 +++
 src/app/main/page.tsx                               |  4 ++--
 src/app/main/user/[handle]/[answer]/action.ts       |  1 +
 src/app/main/user/[handle]/page.tsx                 |  2 +-
 8 files changed, 31 insertions(+), 13 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 5eeb21d..a45e82c 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -3,7 +3,7 @@
 import Link from "next/link";
 import { useEffect, useState } from "react";
 import NameComponents from "./NameComponents";
-import { AnswerDto } from "../_dto/Answers.dto";
+import { AnswerDto, AnswerWithProfileDto } from "../_dto/Answers.dto";
 import { userProfileDto } from "../_dto/fetch-profile/Profile.dto";
 import { useParams } from "next/navigation";
 
@@ -12,8 +12,11 @@ interface askProps {
   id: string;
 }
 
-export async function fetchProfile(handle: string) {
-  const profile = await fetch(`/api/db/fetch-profile/${handle}`);
+export async function fetchProfile(value: AnswerWithProfileDto) {
+  if (value.answeredPerson) {
+    return value.answeredPerson;
+  }
+  const profile = await fetch(`/api/db/fetch-profile/${value.answeredPersonHandle}`);
   if (profile && profile.ok) {
     return profile.json() as unknown as userProfileDto;
   } else {
@@ -35,9 +38,9 @@ export default function Answer({ value, id }: askProps) {
   }, [profileHandle]);
 
   useEffect(() => {
-    fetchProfile(value.answeredPersonHandle).then((r) => setUserInfo(r));
+    fetchProfile(value).then((r) => setUserInfo(r));
     setShowNsfw(!value.nsfwedAnswer);
-  }, [value.answeredPersonHandle, value.nsfwedAnswer]);
+  }, [value]);
 
   return (
     <div className="w-full glass rounded-box px-2 desktop:px-8 py-4 mb-2 shadow">
diff --git a/src/app/_dto/Answers.dto.ts b/src/app/_dto/Answers.dto.ts
index dc3bf42..03d5475 100644
--- a/src/app/_dto/Answers.dto.ts
+++ b/src/app/_dto/Answers.dto.ts
@@ -1,3 +1,5 @@
+import { profile } from "@prisma/client";
+
 export interface AnswerDto {
   id: string;
   question: string;
@@ -7,3 +9,7 @@ export interface AnswerDto {
   answeredPersonHandle: string;
   nsfwedAnswer: boolean;
 }
+
+export interface AnswerWithProfileDto extends AnswerDto {
+  answeredPerson?: profile;
+}
\ No newline at end of file
diff --git a/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts b/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts
index 8cb9ef1..933344a 100644
--- a/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts
+++ b/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts
@@ -1,6 +1,6 @@
 import { IsEnum, IsInt, IsOptional, IsString, Max, Min } from "class-validator";
 
-export class FetchAllAnswersDto {
+export class FetchAllAnswersReqDto {
   @IsOptional()
   @IsString()
   sinceId?: string;
diff --git a/src/app/api/db/fetch-all-answers/route.ts b/src/app/api/db/fetch-all-answers/route.ts
index cfc6df5..f9541fa 100644
--- a/src/app/api/db/fetch-all-answers/route.ts
+++ b/src/app/api/db/fetch-all-answers/route.ts
@@ -1,4 +1,5 @@
-import { FetchAllAnswersDto } from "@/app/_dto/fetch-all-answers/fetch-all-answers.dto";
+import { AnswerDto } from "@/app/_dto/Answers.dto";
+import { FetchAllAnswersReqDto } from "@/app/_dto/fetch-all-answers/fetch-all-answers.dto";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { validateStrict } from "@/utils/validator/strictValidator";
 import { PrismaClient } from "@prisma/client";
@@ -8,7 +9,7 @@ export async function POST(req: NextRequest) {
   const body = await req.json();
   let data;
   try {
-    data = await validateStrict(FetchAllAnswersDto, body);
+    data = await validateStrict(FetchAllAnswersReqDto, body);
   } catch (err) {
     return sendApiError(400, `${err}`);
   }
@@ -23,18 +24,22 @@ export async function POST(req: NextRequest) {
   //내림차순이 기본값
   const orderBy = (data.sort === 'ASC') ? 'asc' : 'desc';
 
-  const questions = await prisma.answer.findMany({
+  const answersWithProfile = await prisma.answer.findMany({
     where: {
       id: {
         ...(typeof sinceId === 'string' ? { gt: sinceId } : {}),
         ...(typeof untilId === 'string' ? { lt: untilId } : {}),
       },
     },
+    include: {
+      answeredPerson: true,
+    },
     orderBy: {
       id: orderBy
     }, 
     take: query_limit
   });
+  
 
-  return NextResponse.json(questions);
+  return NextResponse.json(answersWithProfile as unknown as AnswerDto);
 }
diff --git a/src/app/api/db/fetch-user-answers/route.ts b/src/app/api/db/fetch-user-answers/route.ts
index 6cca2c7..125e145 100644
--- a/src/app/api/db/fetch-user-answers/route.ts
+++ b/src/app/api/db/fetch-user-answers/route.ts
@@ -35,6 +35,9 @@ export async function POST(req: NextRequest) {
           ...(typeof untilId === "string" ? { lt: untilId } : {}),
         },
       },
+      include: {
+        answeredPerson: true,
+      },
       orderBy: {
         id: orderBy,
       },
diff --git a/src/app/main/page.tsx b/src/app/main/page.tsx
index 9ab8295..820e34c 100644
--- a/src/app/main/page.tsx
+++ b/src/app/main/page.tsx
@@ -4,9 +4,9 @@ import { useEffect, useState } from "react";
 import Answer from "../_components/answer";
 import { FaExclamationCircle } from "react-icons/fa";
 import { answer } from "@prisma/client";
-import { FetchAllAnswersDto } from "../_dto/fetch-all-answers/fetch-all-answers.dto";
+import { FetchAllAnswersReqDto } from "../_dto/fetch-all-answers/fetch-all-answers.dto";
 
-async function fetchAllAnswers(req: FetchAllAnswersDto) {
+async function fetchAllAnswers(req: FetchAllAnswersReqDto) {
   const res = await fetch("/api/db/fetch-all-answers", {
     method: "POST",
     headers: {
diff --git a/src/app/main/user/[handle]/[answer]/action.ts b/src/app/main/user/[handle]/[answer]/action.ts
index 6658236..c91818c 100644
--- a/src/app/main/user/[handle]/[answer]/action.ts
+++ b/src/app/main/user/[handle]/[answer]/action.ts
@@ -6,6 +6,7 @@ export async function fetchAnswer(id: string) {
   const prisma = new PrismaClient();
 
   const answer = await prisma.answer.findUnique({
+    include: { answeredPerson: true },
     where: {
       id: id,
     },
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index b2309ad..9281ce1 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -253,7 +253,7 @@ export default function UserPage() {
     return () => {
       if (mounted) observer.unobserve(mounted);
     };
-  }, [mounted, untilId]);
+  }, [answers, mounted, profileHandle, untilId]);
 
   return (
     <div

From 240eb68526640c8c12ddecbd59eaa65b48f94b3a Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 23:28:11 +0900
Subject: [PATCH 58/89] =?UTF-8?q?=20=EC=A7=88=EB=AC=B8=ED=95=A8=20?=
 =?UTF-8?q?=EA=B3=B5=EC=9C=A0=20=ED=95=B4=EC=8B=9C=ED=83=9C=EA=B7=B8=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/user/[handle]/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 9281ce1..8eec879 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -131,7 +131,7 @@ export default function UserPage() {
       userProfile?.questionBoxName,
       "이에요!",
       "예요!"
-    )} #neo-quesdon ${location.origin}/main/user/${userProfile?.handle}`;
+    )} #neo_quesdon ${location.origin}/main/user/${userProfile?.handle}`;
     return `https://${server}/share?text=${encodeURIComponent(text)}`;
   };
 

From 8a95a2caba0c17f8f2d71f924242a4ebb65a51d2 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Wed, 20 Nov 2024 23:43:38 +0900
Subject: [PATCH 59/89] =?UTF-8?q?=EB=8B=B5=EB=B3=80=20=EC=9E=91=EC=84=B1?=
 =?UTF-8?q?=20=EC=8B=A4=ED=8C=A8=EC=8B=9C=20=EA=B2=BD=EA=B3=A0=EC=B0=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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

diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 8eec879..2ce09e8 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -162,8 +162,10 @@ export default function UserPage() {
       };
       reset();
       const res = await mkQuestionCreateApi(req);
-      if (res.status === 200) {
+      if (res.ok) {
         (document.getElementById("my_modal_2") as HTMLInputElement).checked = true;
+      } else {
+        window.alert(`Error!! ${await res.text()}`);
       }
     }
     // 작성자 비공개

From 03a47e7f813df0d698e5d1eb4289b1dc9b5ac7be Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Thu, 21 Nov 2024 01:38:18 +0900
Subject: [PATCH 60/89] =?UTF-8?q?=EC=A7=88=EB=AC=B8=20=EB=AA=A9=EB=A1=9D?=
 =?UTF-8?q?=20=EC=88=9C=EC=84=9C=EB=A5=BC=20=EB=82=B4=EB=A6=BC=EC=B0=A8?=
 =?UTF-8?q?=EC=88=9C=EC=9C=BC=EB=A1=9C=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/db/fetch-my-questions/route.ts | 3 +++
 src/app/main/questions/page.tsx            | 9 ++++++++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/app/api/db/fetch-my-questions/route.ts b/src/app/api/db/fetch-my-questions/route.ts
index 7a19885..d984823 100644
--- a/src/app/api/db/fetch-my-questions/route.ts
+++ b/src/app/api/db/fetch-my-questions/route.ts
@@ -15,6 +15,9 @@ export async function GET(req: NextRequest) {
           where: {
             questioneeHandle: jwt.handle,
           },
+          orderBy: {
+            id: 'desc',
+          }
         });
         return NextResponse.json(questions);
       } else {
diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index ab5aefd..d362333 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -6,7 +6,14 @@ import { useEffect, useRef, useState } from "react";
 import { deleteQuestion } from "./action";
 
 const fetchQuestions = async () => {
-  const res = await fetch("/api/db/fetch-my-questions").then((r) => r.json());
+  const res = await fetch("/api/db/fetch-my-questions")
+    .then((r) => {
+      if (!r.ok) {
+        console.error(`Fail to fetch my questions`);
+        return null;
+      }
+      return r.json();
+    });
 
   return res;
 };

From 870f9cc23467eeb4f9bd5f11eb4893556a9f88f8 Mon Sep 17 00:00:00 2001
From: Yunochi <yuno@yunochi.com>
Date: Thu, 21 Nov 2024 13:17:24 +0900
Subject: [PATCH 61/89] =?UTF-8?q?Feat:=20Ratelimiter=20=EC=A0=9C=EC=9E=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .dockerignore                             |  7 ++
 .gitignore                                |  6 +-
 compose.local-db.yml                      |  9 +++
 config/docker.env.example                 |  6 ++
 config/local_dev_example.env              |  6 ++
 docker-compose-example.yml                | 13 ++++
 package-lock.json                         | 93 ++++++++++++++++++++++-
 package.json                              |  1 +
 src/app/api/db/fetch-all-answers/route.ts |  2 -
 src/utils/ratelimiter/rateLimiter.ts      | 50 ++++++++++++
 10 files changed, 187 insertions(+), 6 deletions(-)
 create mode 100644 .dockerignore
 create mode 100644 src/utils/ratelimiter/rateLimiter.ts

diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 0000000..6d3affb
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,7 @@
+
+.git
+.gitignore
+Dockerfile
+local_db_data
+local_redis_data
+
diff --git a/.gitignore b/.gitignore
index fca331f..7e3a8d1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -44,4 +44,8 @@ next-env.d.ts
 .vscode
 
 #localDB data
-local_db_data
\ No newline at end of file
+local_db_data
+
+# local Redis data
+local_redis_data
+
diff --git a/compose.local-db.yml b/compose.local-db.yml
index 1973e13..1f01cf9 100644
--- a/compose.local-db.yml
+++ b/compose.local-db.yml
@@ -8,5 +8,14 @@ services:
       - 127.0.0.1:5432:5432
     volumes:
       - ./local_db_data:/var/lib/postgresql/data
+  redis:
+    image: redis:7-alpine
+    restart: always
+    env_file:
+      - ./config/local_dev.env
+    ports:
+      - 127.0.0.1:6379:6379
+    volumes:
+      - ./local_redis_data:/data
 
 
diff --git a/config/docker.env.example b/config/docker.env.example
index 6411112..8a7458a 100644
--- a/config/docker.env.example
+++ b/config/docker.env.example
@@ -7,6 +7,12 @@ POSTGRES_DB=quesdon
 TZ=Asia/Seoul
 # -----------------------------------------------
 
+
+# ---------- REDIS CONFIG ----------------------
+REDIS_HOST=redis
+REDIS_PORT=6379
+# ------------------------------------------------
+
 # ---------- APP CONFIG -------------------------
 # Set exposed web url
 WEB_URL="https://neo-quesdon.serafuku.moe"
diff --git a/config/local_dev_example.env b/config/local_dev_example.env
index a169720..cf7655e 100644
--- a/config/local_dev_example.env
+++ b/config/local_dev_example.env
@@ -7,6 +7,12 @@ POSTGRES_DB=quesdon
 TZ=Asia/Seoul
 # -----------------------------------------------
 
+
+# ---------- REDIS CONFIG ----------------------
+export REDIS_HOST=localhost
+export REDIS_PORT=6379
+# ------------------------------------------------
+
 # ---------- APP CONFIG -------------------------
 export WEB_URL="http://localhost:3000"
 export DATABASE_URL="postgres://${POSTGRES_USER}:${POSTGRES_PASSWORD}@localhost:5432/${POSTGRES_DB}"
diff --git a/docker-compose-example.yml b/docker-compose-example.yml
index 395dc53..5e5ec1d 100644
--- a/docker-compose-example.yml
+++ b/docker-compose-example.yml
@@ -5,6 +5,7 @@ services:
       dockerfile: Dockerfile
     depends_on:
       - db
+      - redis
     restart: unless-stopped
     ports:
       - "3000:3000"
@@ -15,6 +16,17 @@ services:
       - ./config/docker.env
     links:
       - db
+      - redis
+
+  redis:
+    image: redis:7-alpine
+    restart: always
+    env_file:
+      - ./config/docker.env
+    networks:
+      - internal_network
+    volumes:
+      - redis:/data
   db:
     image: postgres:15-alpine
     restart: always
@@ -26,6 +38,7 @@ services:
       - db:/var/lib/postgresql/data
 volumes:
   db:
+  redis:
 
 networks:
   internal_network:
diff --git a/package-lock.json b/package-lock.json
index a2a05d9..648692b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
         "class-validator": "^0.14.1",
         "daisyui": "^4.12.14",
         "dotenv-cli": "^7.4.2",
+        "ioredis": "^5.4.1",
         "jose": "^5.9.6",
         "next": "15.0.3",
         "pg": "^8.13.1",
@@ -177,6 +178,12 @@
         "@img/sharp-libvips-linux-x64": "1.0.4"
       }
     },
+    "node_modules/@ioredis/commands": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/@ioredis/commands/-/commands-1.2.0.tgz",
+      "integrity": "sha512-Sx1pU8EM64o2BrqNpEO1CNLtKQwyhuXuqyfH7oGKCk+1a33d2r5saW8zNwm3j6BTExtjrv2BxTgzzkMwts6vGg==",
+      "license": "MIT"
+    },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
       "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
@@ -550,6 +557,7 @@
       "resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.6.tgz",
       "integrity": "sha512-VEI7OdvK2wP7XHnsuXbAJnEpEkF6NjSN45QJlL4VGqZSXsnicpesdTWsg9RISeSdYd3yeRj/y3k5KGjUXYnFwQ==",
       "dev": true,
+      "license": "MIT",
       "dependencies": {
         "undici-types": "~6.19.2"
       }
@@ -1292,6 +1300,15 @@
       "resolved": "https://registry.npmjs.org/client-only/-/client-only-0.0.1.tgz",
       "integrity": "sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA=="
     },
+    "node_modules/cluster-key-slot": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/cluster-key-slot/-/cluster-key-slot-1.1.2.tgz",
+      "integrity": "sha512-RMr0FhtfXemyinomL4hrWcYJxmX6deFdCxpJzhDttxgO1+bcCnkk+9drydLVDmAMG7NE6aN/fl4F7ucU/90gAA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/color": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/color/-/color-4.2.3.tgz",
@@ -1474,7 +1491,6 @@
       "version": "4.3.7",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
       "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
-      "dev": true,
       "dependencies": {
         "ms": "^2.1.3"
       },
@@ -1527,6 +1543,15 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/denque": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/denque/-/denque-2.1.0.tgz",
+      "integrity": "sha512-HVQE3AAb/pxF8fQAoiqpvg9i3evqug3hoiwakOyZAwJm+6vZehbkYXZ0l4JxS+I3QxM97v5aaRNhj8v5oBhekw==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
     "node_modules/detect-libc": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.3.tgz",
@@ -2711,6 +2736,30 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/ioredis": {
+      "version": "5.4.1",
+      "resolved": "https://registry.npmjs.org/ioredis/-/ioredis-5.4.1.tgz",
+      "integrity": "sha512-2YZsvl7jopIa1gaePkeMtd9rAcSjOOjPtpcLlOeusyO+XH2SK5ZcT+UCrElPP+WVIInh2TzeI4XW9ENaSLVVHA==",
+      "license": "MIT",
+      "dependencies": {
+        "@ioredis/commands": "^1.1.1",
+        "cluster-key-slot": "^1.1.0",
+        "debug": "^4.3.4",
+        "denque": "^2.1.0",
+        "lodash.defaults": "^4.2.0",
+        "lodash.isarguments": "^3.1.0",
+        "redis-errors": "^1.2.0",
+        "redis-parser": "^3.0.0",
+        "standard-as-callback": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=12.22.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/ioredis"
+      }
+    },
     "node_modules/is-array-buffer": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
@@ -3292,6 +3341,18 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/lodash.defaults": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
+      "integrity": "sha512-qjxPLHd3r5DnsdGacqOMU6pb/avJzdh9tFX2ymgoZE27BmjXrNy/y4LoaiTeAb+O3gL8AfpJGtqfX/ae2leYYQ==",
+      "license": "MIT"
+    },
+    "node_modules/lodash.isarguments": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
+      "integrity": "sha512-chi4NHZlZqZD18a0imDHnZPrDeBbTtVN7GXMwuGdRH9qotxAjYs3aVLKc7zNOG9eddR5Ksd8rvFEBc9SsggPpg==",
+      "license": "MIT"
+    },
     "node_modules/lodash.merge": {
       "version": "4.6.2",
       "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
@@ -3369,8 +3430,7 @@
     "node_modules/ms": {
       "version": "2.1.3",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
-      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
-      "dev": true
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA=="
     },
     "node_modules/mz": {
       "version": "2.7.0",
@@ -4190,6 +4250,27 @@
         "node": ">=8.10.0"
       }
     },
+    "node_modules/redis-errors": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/redis-errors/-/redis-errors-1.2.0.tgz",
+      "integrity": "sha512-1qny3OExCf0UvUV/5wpYKf2YwPcOqXzkwKKSmKHiE6ZMQs5heeE/c8eXK+PNllPvmjgAbfnsbpkGZWy8cBpn9w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/redis-parser": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/redis-parser/-/redis-parser-3.0.0.tgz",
+      "integrity": "sha512-DJnGAeenTdpMEH6uAJRK/uiyEIH9WVsUmoLwzudwGJUwZPp80PDBWPHXSAGNPwNvIXAbe7MSUB1zQFugFml66A==",
+      "license": "MIT",
+      "dependencies": {
+        "redis-errors": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/reflect-metadata": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz",
@@ -4518,6 +4599,12 @@
         "node": ">= 10.x"
       }
     },
+    "node_modules/standard-as-callback": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/standard-as-callback/-/standard-as-callback-2.1.0.tgz",
+      "integrity": "sha512-qoRRSyROncaz1z0mvYqIE4lCd9p2R90i6GxW3uZv5ucSu8tU7B5HXUP1gG8pVZsYNVaXjk8ClXHPttLyxAL48A==",
+      "license": "MIT"
+    },
     "node_modules/streamsearch": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/streamsearch/-/streamsearch-1.1.0.tgz",
diff --git a/package.json b/package.json
index 54813d3..4fcb1e2 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "class-validator": "^0.14.1",
     "daisyui": "^4.12.14",
     "dotenv-cli": "^7.4.2",
+    "ioredis": "^5.4.1",
     "jose": "^5.9.6",
     "next": "15.0.3",
     "pg": "^8.13.1",
diff --git a/src/app/api/db/fetch-all-answers/route.ts b/src/app/api/db/fetch-all-answers/route.ts
index f9541fa..9c6351c 100644
--- a/src/app/api/db/fetch-all-answers/route.ts
+++ b/src/app/api/db/fetch-all-answers/route.ts
@@ -14,8 +14,6 @@ export async function POST(req: NextRequest) {
     return sendApiError(400, `${err}`);
   }
 
-
-
   const query_limit = data.limit ? Math.max(1, Math.min(data.limit, 100)) : 100;
   const prisma = new PrismaClient();
   const sinceId = data.sinceId;
diff --git a/src/utils/ratelimiter/rateLimiter.ts b/src/utils/ratelimiter/rateLimiter.ts
new file mode 100644
index 0000000..5a0d886
--- /dev/null
+++ b/src/utils/ratelimiter/rateLimiter.ts
@@ -0,0 +1,50 @@
+import { Redis } from 'ioredis';
+
+export class RateLimiterService {
+  private redis: Redis;
+  private static instance: RateLimiterService;
+  private constructor() {
+    this.redis = new Redis();
+  }
+  public static getLimiter() {
+    if (!RateLimiterService.instance) {
+      RateLimiterService.instance = new RateLimiterService();
+    }
+    return RateLimiterService.instance;
+  }
+
+  public async limit(key: string, bucket_time: number, req_limit: number) {
+    const now = Date.now() / 1000;
+    const result = await this.redis.multi()
+      .setnx(`lastreset-${key}`, now)
+      .incr(key)
+      .getex(`lastreset-${key}`, 'EX', bucket_time)
+      .expire(key, bucket_time)
+      .exec();
+
+    let req_count = result?.[1][1] as number;
+    const lastRefilled_str = result?.[2][1] as string;
+    if (typeof req_count !== 'number' || typeof lastRefilled_str !== 'string') {
+      return true;
+    }
+    const last_refilled = Number.parseInt(lastRefilled_str);
+
+    console.log(`requestConter`, req_count, '/', req_limit, `bucket-size: ${bucket_time}sec, lastReset: ${last_refilled}`);
+    if (now - last_refilled > (bucket_time / req_limit)) {
+      const refill_tokens = Math.min(Math.ceil((now - last_refilled) * (req_limit / bucket_time)), req_limit);
+      const newCounter = Math.min(req_limit, req_count) - refill_tokens;
+      console.log(`토큰 리필:`, refill_tokens);
+      await this.redis.multi()
+        .setex(`lastreset-${key}`, bucket_time, now)
+        .setex(key, bucket_time, newCounter)
+        .exec()
+      req_count = newCounter;
+    }
+
+    if (req_count > req_limit) {
+      return false;
+    }
+    return true;
+  }
+
+}
\ No newline at end of file

From 8679b9f23e68e26841469d4a8a565dc414c7bd37 Mon Sep 17 00:00:00 2001
From: Jung Sae Ron <Yozumina@serafuku.moe>
Date: Fri, 22 Nov 2024 20:53:00 +0900
Subject: [PATCH 62/89] =?UTF-8?q?=F0=9F=93=84=20=EB=9D=BC=EC=9D=B4?=
 =?UTF-8?q?=EC=84=BC=EC=8A=A4=20=EC=97=85=EB=8D=B0=EC=9D=B4=ED=8A=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 LICENSE | 661 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 661 insertions(+)
 create mode 100644 LICENSE

diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..0ad25db
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,661 @@
+                    GNU AFFERO GENERAL PUBLIC LICENSE
+                       Version 3, 19 November 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+                            Preamble
+
+  The GNU Affero General Public License is a free, copyleft license for
+software and other kinds of works, specifically designed to ensure
+cooperation with the community in the case of network server software.
+
+  The licenses for most software and other practical works are designed
+to take away your freedom to share and change the works.  By contrast,
+our General Public Licenses are intended to guarantee your freedom to
+share and change all versions of a program--to make sure it remains free
+software for all its users.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+them if you wish), that you receive source code or can get it if you
+want it, that you can change the software or use pieces of it in new
+free programs, and that you know you can do these things.
+
+  Developers that use our General Public Licenses protect your rights
+with two steps: (1) assert copyright on the software, and (2) offer
+you this License which gives you legal permission to copy, distribute
+and/or modify the software.
+
+  A secondary benefit of defending all users' freedom is that
+improvements made in alternate versions of the program, if they
+receive widespread use, become available for other developers to
+incorporate.  Many developers of free software are heartened and
+encouraged by the resulting cooperation.  However, in the case of
+software used on network servers, this result may fail to come about.
+The GNU General Public License permits making a modified version and
+letting the public access it on a server without ever releasing its
+source code to the public.
+
+  The GNU Affero General Public License is designed specifically to
+ensure that, in such cases, the modified source code becomes available
+to the community.  It requires the operator of a network server to
+provide the source code of the modified version running there to the
+users of that server.  Therefore, public use of a modified version, on
+a publicly accessible server, gives the public access to the source
+code of the modified version.
+
+  An older license, called the Affero General Public License and
+published by Affero, was designed to accomplish similar goals.  This is
+a different license, not a version of the Affero GPL, but Affero has
+released a new version of the Affero GPL which permits relicensing under
+this license.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                       TERMS AND CONDITIONS
+
+  0. Definitions.
+
+  "This License" refers to version 3 of the GNU Affero General Public License.
+
+  "Copyright" also means copyright-like laws that apply to other kinds of
+works, such as semiconductor masks.
+
+  "The Program" refers to any copyrightable work licensed under this
+License.  Each licensee is addressed as "you".  "Licensees" and
+"recipients" may be individuals or organizations.
+
+  To "modify" a work means to copy from or adapt all or part of the work
+in a fashion requiring copyright permission, other than the making of an
+exact copy.  The resulting work is called a "modified version" of the
+earlier work or a work "based on" the earlier work.
+
+  A "covered work" means either the unmodified Program or a work based
+on the Program.
+
+  To "propagate" a work means to do anything with it that, without
+permission, would make you directly or secondarily liable for
+infringement under applicable copyright law, except executing it on a
+computer or modifying a private copy.  Propagation includes copying,
+distribution (with or without modification), making available to the
+public, and in some countries other activities as well.
+
+  To "convey" a work means any kind of propagation that enables other
+parties to make or receive copies.  Mere interaction with a user through
+a computer network, with no transfer of a copy, is not conveying.
+
+  An interactive user interface displays "Appropriate Legal Notices"
+to the extent that it includes a convenient and prominently visible
+feature that (1) displays an appropriate copyright notice, and (2)
+tells the user that there is no warranty for the work (except to the
+extent that warranties are provided), that licensees may convey the
+work under this License, and how to view a copy of this License.  If
+the interface presents a list of user commands or options, such as a
+menu, a prominent item in the list meets this criterion.
+
+  1. Source Code.
+
+  The "source code" for a work means the preferred form of the work
+for making modifications to it.  "Object code" means any non-source
+form of a work.
+
+  A "Standard Interface" means an interface that either is an official
+standard defined by a recognized standards body, or, in the case of
+interfaces specified for a particular programming language, one that
+is widely used among developers working in that language.
+
+  The "System Libraries" of an executable work include anything, other
+than the work as a whole, that (a) is included in the normal form of
+packaging a Major Component, but which is not part of that Major
+Component, and (b) serves only to enable use of the work with that
+Major Component, or to implement a Standard Interface for which an
+implementation is available to the public in source code form.  A
+"Major Component", in this context, means a major essential component
+(kernel, window system, and so on) of the specific operating system
+(if any) on which the executable work runs, or a compiler used to
+produce the work, or an object code interpreter used to run it.
+
+  The "Corresponding Source" for a work in object code form means all
+the source code needed to generate, install, and (for an executable
+work) run the object code and to modify the work, including scripts to
+control those activities.  However, it does not include the work's
+System Libraries, or general-purpose tools or generally available free
+programs which are used unmodified in performing those activities but
+which are not part of the work.  For example, Corresponding Source
+includes interface definition files associated with source files for
+the work, and the source code for shared libraries and dynamically
+linked subprograms that the work is specifically designed to require,
+such as by intimate data communication or control flow between those
+subprograms and other parts of the work.
+
+  The Corresponding Source need not include anything that users
+can regenerate automatically from other parts of the Corresponding
+Source.
+
+  The Corresponding Source for a work in source code form is that
+same work.
+
+  2. Basic Permissions.
+
+  All rights granted under this License are granted for the term of
+copyright on the Program, and are irrevocable provided the stated
+conditions are met.  This License explicitly affirms your unlimited
+permission to run the unmodified Program.  The output from running a
+covered work is covered by this License only if the output, given its
+content, constitutes a covered work.  This License acknowledges your
+rights of fair use or other equivalent, as provided by copyright law.
+
+  You may make, run and propagate covered works that you do not
+convey, without conditions so long as your license otherwise remains
+in force.  You may convey covered works to others for the sole purpose
+of having them make modifications exclusively for you, or provide you
+with facilities for running those works, provided that you comply with
+the terms of this License in conveying all material for which you do
+not control copyright.  Those thus making or running the covered works
+for you must do so exclusively on your behalf, under your direction
+and control, on terms that prohibit them from making any copies of
+your copyrighted material outside their relationship with you.
+
+  Conveying under any other circumstances is permitted solely under
+the conditions stated below.  Sublicensing is not allowed; section 10
+makes it unnecessary.
+
+  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
+
+  No covered work shall be deemed part of an effective technological
+measure under any applicable law fulfilling obligations under article
+11 of the WIPO copyright treaty adopted on 20 December 1996, or
+similar laws prohibiting or restricting circumvention of such
+measures.
+
+  When you convey a covered work, you waive any legal power to forbid
+circumvention of technological measures to the extent such circumvention
+is effected by exercising rights under this License with respect to
+the covered work, and you disclaim any intention to limit operation or
+modification of the work as a means of enforcing, against the work's
+users, your or third parties' legal rights to forbid circumvention of
+technological measures.
+
+  4. Conveying Verbatim Copies.
+
+  You may convey verbatim copies of the Program's source code as you
+receive it, in any medium, provided that you conspicuously and
+appropriately publish on each copy an appropriate copyright notice;
+keep intact all notices stating that this License and any
+non-permissive terms added in accord with section 7 apply to the code;
+keep intact all notices of the absence of any warranty; and give all
+recipients a copy of this License along with the Program.
+
+  You may charge any price or no price for each copy that you convey,
+and you may offer support or warranty protection for a fee.
+
+  5. Conveying Modified Source Versions.
+
+  You may convey a work based on the Program, or the modifications to
+produce it from the Program, in the form of source code under the
+terms of section 4, provided that you also meet all of these conditions:
+
+    a) The work must carry prominent notices stating that you modified
+    it, and giving a relevant date.
+
+    b) The work must carry prominent notices stating that it is
+    released under this License and any conditions added under section
+    7.  This requirement modifies the requirement in section 4 to
+    "keep intact all notices".
+
+    c) You must license the entire work, as a whole, under this
+    License to anyone who comes into possession of a copy.  This
+    License will therefore apply, along with any applicable section 7
+    additional terms, to the whole of the work, and all its parts,
+    regardless of how they are packaged.  This License gives no
+    permission to license the work in any other way, but it does not
+    invalidate such permission if you have separately received it.
+
+    d) If the work has interactive user interfaces, each must display
+    Appropriate Legal Notices; however, if the Program has interactive
+    interfaces that do not display Appropriate Legal Notices, your
+    work need not make them do so.
+
+  A compilation of a covered work with other separate and independent
+works, which are not by their nature extensions of the covered work,
+and which are not combined with it such as to form a larger program,
+in or on a volume of a storage or distribution medium, is called an
+"aggregate" if the compilation and its resulting copyright are not
+used to limit the access or legal rights of the compilation's users
+beyond what the individual works permit.  Inclusion of a covered work
+in an aggregate does not cause this License to apply to the other
+parts of the aggregate.
+
+  6. Conveying Non-Source Forms.
+
+  You may convey a covered work in object code form under the terms
+of sections 4 and 5, provided that you also convey the
+machine-readable Corresponding Source under the terms of this License,
+in one of these ways:
+
+    a) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by the
+    Corresponding Source fixed on a durable physical medium
+    customarily used for software interchange.
+
+    b) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by a
+    written offer, valid for at least three years and valid for as
+    long as you offer spare parts or customer support for that product
+    model, to give anyone who possesses the object code either (1) a
+    copy of the Corresponding Source for all the software in the
+    product that is covered by this License, on a durable physical
+    medium customarily used for software interchange, for a price no
+    more than your reasonable cost of physically performing this
+    conveying of source, or (2) access to copy the
+    Corresponding Source from a network server at no charge.
+
+    c) Convey individual copies of the object code with a copy of the
+    written offer to provide the Corresponding Source.  This
+    alternative is allowed only occasionally and noncommercially, and
+    only if you received the object code with such an offer, in accord
+    with subsection 6b.
+
+    d) Convey the object code by offering access from a designated
+    place (gratis or for a charge), and offer equivalent access to the
+    Corresponding Source in the same way through the same place at no
+    further charge.  You need not require recipients to copy the
+    Corresponding Source along with the object code.  If the place to
+    copy the object code is a network server, the Corresponding Source
+    may be on a different server (operated by you or a third party)
+    that supports equivalent copying facilities, provided you maintain
+    clear directions next to the object code saying where to find the
+    Corresponding Source.  Regardless of what server hosts the
+    Corresponding Source, you remain obligated to ensure that it is
+    available for as long as needed to satisfy these requirements.
+
+    e) Convey the object code using peer-to-peer transmission, provided
+    you inform other peers where the object code and Corresponding
+    Source of the work are being offered to the general public at no
+    charge under subsection 6d.
+
+  A separable portion of the object code, whose source code is excluded
+from the Corresponding Source as a System Library, need not be
+included in conveying the object code work.
+
+  A "User Product" is either (1) a "consumer product", which means any
+tangible personal property which is normally used for personal, family,
+or household purposes, or (2) anything designed or sold for incorporation
+into a dwelling.  In determining whether a product is a consumer product,
+doubtful cases shall be resolved in favor of coverage.  For a particular
+product received by a particular user, "normally used" refers to a
+typical or common use of that class of product, regardless of the status
+of the particular user or of the way in which the particular user
+actually uses, or expects or is expected to use, the product.  A product
+is a consumer product regardless of whether the product has substantial
+commercial, industrial or non-consumer uses, unless such uses represent
+the only significant mode of use of the product.
+
+  "Installation Information" for a User Product means any methods,
+procedures, authorization keys, or other information required to install
+and execute modified versions of a covered work in that User Product from
+a modified version of its Corresponding Source.  The information must
+suffice to ensure that the continued functioning of the modified object
+code is in no case prevented or interfered with solely because
+modification has been made.
+
+  If you convey an object code work under this section in, or with, or
+specifically for use in, a User Product, and the conveying occurs as
+part of a transaction in which the right of possession and use of the
+User Product is transferred to the recipient in perpetuity or for a
+fixed term (regardless of how the transaction is characterized), the
+Corresponding Source conveyed under this section must be accompanied
+by the Installation Information.  But this requirement does not apply
+if neither you nor any third party retains the ability to install
+modified object code on the User Product (for example, the work has
+been installed in ROM).
+
+  The requirement to provide Installation Information does not include a
+requirement to continue to provide support service, warranty, or updates
+for a work that has been modified or installed by the recipient, or for
+the User Product in which it has been modified or installed.  Access to a
+network may be denied when the modification itself materially and
+adversely affects the operation of the network or violates the rules and
+protocols for communication across the network.
+
+  Corresponding Source conveyed, and Installation Information provided,
+in accord with this section must be in a format that is publicly
+documented (and with an implementation available to the public in
+source code form), and must require no special password or key for
+unpacking, reading or copying.
+
+  7. Additional Terms.
+
+  "Additional permissions" are terms that supplement the terms of this
+License by making exceptions from one or more of its conditions.
+Additional permissions that are applicable to the entire Program shall
+be treated as though they were included in this License, to the extent
+that they are valid under applicable law.  If additional permissions
+apply only to part of the Program, that part may be used separately
+under those permissions, but the entire Program remains governed by
+this License without regard to the additional permissions.
+
+  When you convey a copy of a covered work, you may at your option
+remove any additional permissions from that copy, or from any part of
+it.  (Additional permissions may be written to require their own
+removal in certain cases when you modify the work.)  You may place
+additional permissions on material, added by you to a covered work,
+for which you have or can give appropriate copyright permission.
+
+  Notwithstanding any other provision of this License, for material you
+add to a covered work, you may (if authorized by the copyright holders of
+that material) supplement the terms of this License with terms:
+
+    a) Disclaiming warranty or limiting liability differently from the
+    terms of sections 15 and 16 of this License; or
+
+    b) Requiring preservation of specified reasonable legal notices or
+    author attributions in that material or in the Appropriate Legal
+    Notices displayed by works containing it; or
+
+    c) Prohibiting misrepresentation of the origin of that material, or
+    requiring that modified versions of such material be marked in
+    reasonable ways as different from the original version; or
+
+    d) Limiting the use for publicity purposes of names of licensors or
+    authors of the material; or
+
+    e) Declining to grant rights under trademark law for use of some
+    trade names, trademarks, or service marks; or
+
+    f) Requiring indemnification of licensors and authors of that
+    material by anyone who conveys the material (or modified versions of
+    it) with contractual assumptions of liability to the recipient, for
+    any liability that these contractual assumptions directly impose on
+    those licensors and authors.
+
+  All other non-permissive additional terms are considered "further
+restrictions" within the meaning of section 10.  If the Program as you
+received it, or any part of it, contains a notice stating that it is
+governed by this License along with a term that is a further
+restriction, you may remove that term.  If a license document contains
+a further restriction but permits relicensing or conveying under this
+License, you may add to a covered work material governed by the terms
+of that license document, provided that the further restriction does
+not survive such relicensing or conveying.
+
+  If you add terms to a covered work in accord with this section, you
+must place, in the relevant source files, a statement of the
+additional terms that apply to those files, or a notice indicating
+where to find the applicable terms.
+
+  Additional terms, permissive or non-permissive, may be stated in the
+form of a separately written license, or stated as exceptions;
+the above requirements apply either way.
+
+  8. Termination.
+
+  You may not propagate or modify a covered work except as expressly
+provided under this License.  Any attempt otherwise to propagate or
+modify it is void, and will automatically terminate your rights under
+this License (including any patent licenses granted under the third
+paragraph of section 11).
+
+  However, if you cease all violation of this License, then your
+license from a particular copyright holder is reinstated (a)
+provisionally, unless and until the copyright holder explicitly and
+finally terminates your license, and (b) permanently, if the copyright
+holder fails to notify you of the violation by some reasonable means
+prior to 60 days after the cessation.
+
+  Moreover, your license from a particular copyright holder is
+reinstated permanently if the copyright holder notifies you of the
+violation by some reasonable means, this is the first time you have
+received notice of violation of this License (for any work) from that
+copyright holder, and you cure the violation prior to 30 days after
+your receipt of the notice.
+
+  Termination of your rights under this section does not terminate the
+licenses of parties who have received copies or rights from you under
+this License.  If your rights have been terminated and not permanently
+reinstated, you do not qualify to receive new licenses for the same
+material under section 10.
+
+  9. Acceptance Not Required for Having Copies.
+
+  You are not required to accept this License in order to receive or
+run a copy of the Program.  Ancillary propagation of a covered work
+occurring solely as a consequence of using peer-to-peer transmission
+to receive a copy likewise does not require acceptance.  However,
+nothing other than this License grants you permission to propagate or
+modify any covered work.  These actions infringe copyright if you do
+not accept this License.  Therefore, by modifying or propagating a
+covered work, you indicate your acceptance of this License to do so.
+
+  10. Automatic Licensing of Downstream Recipients.
+
+  Each time you convey a covered work, the recipient automatically
+receives a license from the original licensors, to run, modify and
+propagate that work, subject to this License.  You are not responsible
+for enforcing compliance by third parties with this License.
+
+  An "entity transaction" is a transaction transferring control of an
+organization, or substantially all assets of one, or subdividing an
+organization, or merging organizations.  If propagation of a covered
+work results from an entity transaction, each party to that
+transaction who receives a copy of the work also receives whatever
+licenses to the work the party's predecessor in interest had or could
+give under the previous paragraph, plus a right to possession of the
+Corresponding Source of the work from the predecessor in interest, if
+the predecessor has it or can get it with reasonable efforts.
+
+  You may not impose any further restrictions on the exercise of the
+rights granted or affirmed under this License.  For example, you may
+not impose a license fee, royalty, or other charge for exercise of
+rights granted under this License, and you may not initiate litigation
+(including a cross-claim or counterclaim in a lawsuit) alleging that
+any patent claim is infringed by making, using, selling, offering for
+sale, or importing the Program or any portion of it.
+
+  11. Patents.
+
+  A "contributor" is a copyright holder who authorizes use under this
+License of the Program or a work on which the Program is based.  The
+work thus licensed is called the contributor's "contributor version".
+
+  A contributor's "essential patent claims" are all patent claims
+owned or controlled by the contributor, whether already acquired or
+hereafter acquired, that would be infringed by some manner, permitted
+by this License, of making, using, or selling its contributor version,
+but do not include claims that would be infringed only as a
+consequence of further modification of the contributor version.  For
+purposes of this definition, "control" includes the right to grant
+patent sublicenses in a manner consistent with the requirements of
+this License.
+
+  Each contributor grants you a non-exclusive, worldwide, royalty-free
+patent license under the contributor's essential patent claims, to
+make, use, sell, offer for sale, import and otherwise run, modify and
+propagate the contents of its contributor version.
+
+  In the following three paragraphs, a "patent license" is any express
+agreement or commitment, however denominated, not to enforce a patent
+(such as an express permission to practice a patent or covenant not to
+sue for patent infringement).  To "grant" such a patent license to a
+party means to make such an agreement or commitment not to enforce a
+patent against the party.
+
+  If you convey a covered work, knowingly relying on a patent license,
+and the Corresponding Source of the work is not available for anyone
+to copy, free of charge and under the terms of this License, through a
+publicly available network server or other readily accessible means,
+then you must either (1) cause the Corresponding Source to be so
+available, or (2) arrange to deprive yourself of the benefit of the
+patent license for this particular work, or (3) arrange, in a manner
+consistent with the requirements of this License, to extend the patent
+license to downstream recipients.  "Knowingly relying" means you have
+actual knowledge that, but for the patent license, your conveying the
+covered work in a country, or your recipient's use of the covered work
+in a country, would infringe one or more identifiable patents in that
+country that you have reason to believe are valid.
+
+  If, pursuant to or in connection with a single transaction or
+arrangement, you convey, or propagate by procuring conveyance of, a
+covered work, and grant a patent license to some of the parties
+receiving the covered work authorizing them to use, propagate, modify
+or convey a specific copy of the covered work, then the patent license
+you grant is automatically extended to all recipients of the covered
+work and works based on it.
+
+  A patent license is "discriminatory" if it does not include within
+the scope of its coverage, prohibits the exercise of, or is
+conditioned on the non-exercise of one or more of the rights that are
+specifically granted under this License.  You may not convey a covered
+work if you are a party to an arrangement with a third party that is
+in the business of distributing software, under which you make payment
+to the third party based on the extent of your activity of conveying
+the work, and under which the third party grants, to any of the
+parties who would receive the covered work from you, a discriminatory
+patent license (a) in connection with copies of the covered work
+conveyed by you (or copies made from those copies), or (b) primarily
+for and in connection with specific products or compilations that
+contain the covered work, unless you entered into that arrangement,
+or that patent license was granted, prior to 28 March 2007.
+
+  Nothing in this License shall be construed as excluding or limiting
+any implied license or other defenses to infringement that may
+otherwise be available to you under applicable patent law.
+
+  12. No Surrender of Others' Freedom.
+
+  If conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot convey a
+covered work so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you may
+not convey it at all.  For example, if you agree to terms that obligate you
+to collect a royalty for further conveying from those to whom you convey
+the Program, the only way you could satisfy both those terms and this
+License would be to refrain entirely from conveying the Program.
+
+  13. Remote Network Interaction; Use with the GNU General Public License.
+
+  Notwithstanding any other provision of this License, if you modify the
+Program, your modified version must prominently offer all users
+interacting with it remotely through a computer network (if your version
+supports such interaction) an opportunity to receive the Corresponding
+Source of your version by providing access to the Corresponding Source
+from a network server at no charge, through some standard or customary
+means of facilitating copying of software.  This Corresponding Source
+shall include the Corresponding Source for any work covered by version 3
+of the GNU General Public License that is incorporated pursuant to the
+following paragraph.
+
+  Notwithstanding any other provision of this License, you have
+permission to link or combine any covered work with a work licensed
+under version 3 of the GNU General Public License into a single
+combined work, and to convey the resulting work.  The terms of this
+License will continue to apply to the part which is the covered work,
+but the work with which it is combined will remain governed by version
+3 of the GNU General Public License.
+
+  14. Revised Versions of this License.
+
+  The Free Software Foundation may publish revised and/or new versions of
+the GNU Affero General Public License from time to time.  Such new versions
+will be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+  Each version is given a distinguishing version number.  If the
+Program specifies that a certain numbered version of the GNU Affero General
+Public License "or any later version" applies to it, you have the
+option of following the terms and conditions either of that numbered
+version or of any later version published by the Free Software
+Foundation.  If the Program does not specify a version number of the
+GNU Affero General Public License, you may choose any version ever published
+by the Free Software Foundation.
+
+  If the Program specifies that a proxy can decide which future
+versions of the GNU Affero General Public License can be used, that proxy's
+public statement of acceptance of a version permanently authorizes you
+to choose that version for the Program.
+
+  Later license versions may give you additional or different
+permissions.  However, no additional obligations are imposed on any
+author or copyright holder as a result of your choosing to follow a
+later version.
+
+  15. Disclaimer of Warranty.
+
+  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
+APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
+HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
+OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
+THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
+IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
+ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
+
+  16. Limitation of Liability.
+
+  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
+THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
+GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
+USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
+DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
+PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
+EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
+SUCH DAMAGES.
+
+  17. Interpretation of Sections 15 and 16.
+
+  If the disclaimer of warranty and limitation of liability provided
+above cannot be given local legal effect according to their terms,
+reviewing courts shall apply local law that most closely approximates
+an absolute waiver of all civil liability in connection with the
+Program, unless a warranty or assumption of liability accompanies a
+copy of the Program in return for a fee.
+
+                     END OF TERMS AND CONDITIONS
+
+            How to Apply These Terms to Your New Programs
+
+  If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+  To do so, attach the following notices to the program.  It is safest
+to attach them to the start of each source file to most effectively
+state the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+    <one line to give the program's name and a brief idea of what it does.>
+    Copyright (C) <year>  <name of author>
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU Affero General Public License as published
+    by the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU Affero General Public License for more details.
+
+    You should have received a copy of the GNU Affero General Public License
+    along with this program.  If not, see <https://www.gnu.org/licenses/>.
+
+Also add information on how to contact you by electronic and paper mail.
+
+  If your software can interact with users remotely through a computer
+network, you should also make sure that it provides a way for users to
+get its source.  For example, if your program is a web application, its
+interface could display a "Source" link that leads users to an archive
+of the code.  There are many ways you could offer source, and different
+solutions will be better for different programs; see section 13 for the
+specific requirements.
+
+  You should also get your employer (if you work as a programmer) or school,
+if any, to sign a "copyright disclaimer" for the program, if necessary.
+For more information on this, and how to apply and follow the GNU AGPL, see
+<https://www.gnu.org/licenses/>.

From 8ff197f4d94a80acb67963f3befd7b324a019e23 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Fri, 22 Nov 2024 21:43:25 +0900
Subject: [PATCH 63/89] =?UTF-8?q?=F0=9F=92=84=20=EB=8B=A4=ED=81=AC?=
 =?UTF-8?q?=EB=AA=A8=EB=93=9C=20=EA=B0=80=EB=8F=85=EC=84=B1=20=EA=B0=9C?=
 =?UTF-8?q?=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 08950ec..8df2be8 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -62,14 +62,14 @@ export default function Answer({ value, id }: askProps) {
                 "익명의 질문자"
               )}
             </div>
-            <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble">
+            <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble text-slate-200">
               {value.question}
             </div>
           </div>
           {localHandle !== null && localHandle === profileHandle && (
             <div className="w-12 flex justify-end">
               <a
-                className="link text-red-800"
+                className="link text-red-800 dark:text-red-500"
                 onClick={() =>
                   document.getElementById(`answer_delete_modal_${id}`)?.click()
                 }
@@ -96,7 +96,7 @@ export default function Answer({ value, id }: askProps) {
               />
             </Link>
           </div>
-          <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble bg-green-600">
+          <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble chat-bubble-success text-slate-800">
             <Link href={`/main/user/${value.answeredPersonHandle}`}>
               {value.answer}
             </Link>
diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 304c1ef..c8e4c88 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -97,7 +97,7 @@ export default function Question({
             "익명의 질문자"
           )}
         </div>
-        <div className="chat-bubble flex items-center text-sm window:text-xl desktop:text-2xl">
+        <div className="chat-bubble flex items-center text-sm window:text-xl desktop:text-2xl text-slate-200">
           {singleQuestion.question}
         </div>
         <div className="chat-footer opacity-50">
@@ -113,7 +113,7 @@ export default function Question({
         </div>
       </div>
       <div className="text-2xl chat chat-end">
-        <div className="chat-bubble bg-green-600">
+        <div className="chat-bubble chat-bubble-success text-slate-800">
           <form
             onSubmit={handleSubmit(onSubmit)}
             className="flex flex-col gap-2 py-2"
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 45796fb..75d6ded 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -329,7 +329,7 @@ export default function UserPage() {
                     required: "required",
                   })}
                   placeholder="질문 내용을 입력해 주세요"
-                  className={`w-[90%] my-2 font-thin textarea ${
+                  className={`w-[90%] my-2 font-thin leading-loose textarea ${
                     errors.question ? "textarea-error" : "textarea-bordered"
                   }`}
                   onKeyDown={onCtrlEnter}

From 427ea6b4b15a104a9c91f2887115a4934ff35783 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Fri, 22 Nov 2024 20:57:03 +0900
Subject: [PATCH 64/89] =?UTF-8?q?Misskey=20=EC=97=90=EC=84=9C=20getIpHash?=
 =?UTF-8?q?=20=EC=9C=A0=ED=8B=B8=20=EB=8F=9A=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json                      | 34 ++++++++++++++++++++++++++
 package.json                           |  1 +
 src/utils/getIp/get-ip-from-Request.ts |  6 +++++
 src/utils/getIp/get-ip-hash.ts         | 19 ++++++++++++++
 4 files changed, 60 insertions(+)
 create mode 100644 src/utils/getIp/get-ip-from-Request.ts
 create mode 100644 src/utils/getIp/get-ip-hash.ts

diff --git a/package-lock.json b/package-lock.json
index 648692b..447beff 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,6 +14,7 @@
         "daisyui": "^4.12.14",
         "dotenv-cli": "^7.4.2",
         "ioredis": "^5.4.1",
+        "ip-cidr": "^4.0.2",
         "jose": "^5.9.6",
         "next": "15.0.3",
         "pg": "^8.13.1",
@@ -2760,6 +2761,29 @@
         "url": "https://opencollective.com/ioredis"
       }
     },
+    "node_modules/ip-address": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-9.0.5.tgz",
+      "integrity": "sha512-zHtQzGojZXTwZTHQqra+ETKd4Sn3vgi7uBmlPoXVWZqYvuKmtI0l/VZTjqGmJY9x88GGOaZ9+G9ES8hC4T4X8g==",
+      "dependencies": {
+        "jsbn": "1.1.0",
+        "sprintf-js": "^1.1.3"
+      },
+      "engines": {
+        "node": ">= 12"
+      }
+    },
+    "node_modules/ip-cidr": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/ip-cidr/-/ip-cidr-4.0.2.tgz",
+      "integrity": "sha512-KifhLKBjdS/hB3TD4UUOalVp1BpzPFvRpgJvXcP0Ya98tuSQTUQ71iI7EW7CKddkBJTYB3GfTWl5eJwpLOXj2A==",
+      "dependencies": {
+        "ip-address": "^9.0.5"
+      },
+      "engines": {
+        "node": ">=16.14.0"
+      }
+    },
     "node_modules/is-array-buffer": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
@@ -3221,6 +3245,11 @@
         "js-yaml": "bin/js-yaml.js"
       }
     },
+    "node_modules/jsbn": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-1.1.0.tgz",
+      "integrity": "sha512-4bYVV3aAMtDTTu4+xsDYa6sy9GyJ69/amsu9sYF2zqjiEoZA5xJi3BrfX3uY+/IekIu7MwdObdbDWpoZdBv3/A=="
+    },
     "node_modules/json-buffer": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
@@ -4599,6 +4628,11 @@
         "node": ">= 10.x"
       }
     },
+    "node_modules/sprintf-js": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.3.tgz",
+      "integrity": "sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA=="
+    },
     "node_modules/standard-as-callback": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/standard-as-callback/-/standard-as-callback-2.1.0.tgz",
diff --git a/package.json b/package.json
index 4fcb1e2..5d0fac8 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
     "daisyui": "^4.12.14",
     "dotenv-cli": "^7.4.2",
     "ioredis": "^5.4.1",
+    "ip-cidr": "^4.0.2",
     "jose": "^5.9.6",
     "next": "15.0.3",
     "pg": "^8.13.1",
diff --git a/src/utils/getIp/get-ip-from-Request.ts b/src/utils/getIp/get-ip-from-Request.ts
new file mode 100644
index 0000000..2a661e7
--- /dev/null
+++ b/src/utils/getIp/get-ip-from-Request.ts
@@ -0,0 +1,6 @@
+import { NextRequest } from "next/server";
+
+export function getIpFromRequest(req: NextRequest) {
+  const ip = req.headers.get('x-forwarded-for')?.split(/, /)[0];
+  return ip ?? '127.1.2.3';
+}
\ No newline at end of file
diff --git a/src/utils/getIp/get-ip-hash.ts b/src/utils/getIp/get-ip-hash.ts
new file mode 100644
index 0000000..e132fa8
--- /dev/null
+++ b/src/utils/getIp/get-ip-hash.ts
@@ -0,0 +1,19 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import IPCIDR from 'ip-cidr';
+
+export function getIpHash(ip: string): string {
+	try {
+		// because a single person may control many IPv6 addresses,
+		// only a /64 subnet prefix of any IP will be taken into account.
+		// (this means for IPv4 the entire address is used)
+		const prefix = IPCIDR.createAddress(ip).mask(64);
+		return 'ip-' + BigInt('0b' + prefix).toString(36);
+	} catch (e) {
+		const prefix = IPCIDR.createAddress(ip.replace(/:[0-9]+$/, '')).mask(64);
+		return 'ip-' + BigInt('0b' + prefix).toString(36);
+	}
+}

From da83b728e4ab3e477700b30c4a1b3f2fa9338045 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Fri, 22 Nov 2024 22:31:49 +0900
Subject: [PATCH 65/89] =?UTF-8?q?fix:=20RateLimiter=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/ratelimiter/rateLimiter.ts | 33 +++++++++++++++++++++-------
 1 file changed, 25 insertions(+), 8 deletions(-)

diff --git a/src/utils/ratelimiter/rateLimiter.ts b/src/utils/ratelimiter/rateLimiter.ts
index 5a0d886..6840f76 100644
--- a/src/utils/ratelimiter/rateLimiter.ts
+++ b/src/utils/ratelimiter/rateLimiter.ts
@@ -4,7 +4,16 @@ export class RateLimiterService {
   private redis: Redis;
   private static instance: RateLimiterService;
   private constructor() {
-    this.redis = new Redis();
+    const host = process.env.REDIS_HOST;
+    const port_str = process.env.REDIS_PORT;
+    if (typeof host !== 'string' || typeof port_str !== 'string') {
+      throw new Error('Redis host or port not provided!');
+    }
+    const port = Number.parseInt(port_str);
+    this.redis = new Redis({
+      host: host,
+      port: port,
+    });
   }
   public static getLimiter() {
     if (!RateLimiterService.instance) {
@@ -13,8 +22,17 @@ export class RateLimiterService {
     return RateLimiterService.instance;
   }
 
-  public async limit(key: string, bucket_time: number, req_limit: number) {
+  /**
+   * 리미터 함수.
+   * 호출시 리퀘스트 카운터를 자동으로 1증가 시키고 리밋에 도달했는지를 boolean 으로 반환.
+   * token-bucket 방식.
+   * @param key 리밋을 구분할 키
+   * @param option bucket_time: 초 단위 버킷 시간, req_limit: 리밋 숫자
+   * @returns boolean (true: 리밋에 도달함, false: 리밋에 도달하지 않음)
+   */
+  public async limit(key: string, option: {bucket_time: number, req_limit: number}) {
     const now = Date.now() / 1000;
+    const {bucket_time, req_limit} = option;
     const result = await this.redis.multi()
       .setnx(`lastreset-${key}`, now)
       .incr(key)
@@ -29,11 +47,11 @@ export class RateLimiterService {
     }
     const last_refilled = Number.parseInt(lastRefilled_str);
 
-    console.log(`requestConter`, req_count, '/', req_limit, `bucket-size: ${bucket_time}sec, lastReset: ${last_refilled}`);
+    console.debug(`requestConter`, req_count, '/', req_limit, `bucket-size: ${bucket_time}sec, lastReset: ${last_refilled}`);
     if (now - last_refilled > (bucket_time / req_limit)) {
       const refill_tokens = Math.min(Math.ceil((now - last_refilled) * (req_limit / bucket_time)), req_limit);
       const newCounter = Math.min(req_limit, req_count) - refill_tokens;
-      console.log(`토큰 리필:`, refill_tokens);
+      console.debug(`토큰 리필:`, refill_tokens);
       await this.redis.multi()
         .setex(`lastreset-${key}`, bucket_time, now)
         .setex(key, bucket_time, newCounter)
@@ -41,10 +59,9 @@ export class RateLimiterService {
       req_count = newCounter;
     }
 
-    if (req_count > req_limit) {
-      return false;
+    if (req_count >= req_limit) {
+      return true;
     }
-    return true;
+    return false;
   }
-
 }
\ No newline at end of file

From eef2a727d89c38614130341a8b2bd70163bf47bd Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Fri, 22 Nov 2024 22:34:30 +0900
Subject: [PATCH 66/89] =?UTF-8?q?Fix:=20Prisma=20=ED=81=B4=EB=9D=BC?=
 =?UTF-8?q?=EC=9D=B4=EC=96=B8=ED=8A=B8=20=ED=95=98=EB=82=98=EB=A1=9C=20?=
 =?UTF-8?q?=EA=B3=B5=EC=9C=A0=ED=95=98=EB=8F=84=EB=A1=9D=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/db/create-question/route.ts        |  5 ++---
 src/app/api/db/delete-answer/route.ts          |  4 ++--
 src/app/api/db/fetch-all-answers/route.ts      | 11 +++++++----
 src/app/api/db/fetch-my-profile/route.ts       |  4 ++--
 src/app/api/db/fetch-my-questions/route.ts     |  4 ++--
 src/app/api/db/fetch-profile/[handle]/route.ts |  4 ++--
 src/app/api/db/fetch-user-answers/route.ts     |  4 ++--
 src/app/api/web/mastodon-login/route.ts        |  5 +++--
 src/app/api/web/misskey-login/route.ts         |  4 ++--
 src/app/main/questions/action.ts               |  9 +++++----
 src/app/main/settings/action.ts                |  7 +++----
 src/app/main/user/[handle]/[answer]/action.ts  |  5 ++---
 src/app/mastodon-callback/action.ts            | 10 +++++++---
 src/app/misskey-callback/actions.ts            |  7 ++++---
 src/utils/getPrismaClient/get-prisma-client.ts | 12 ++++++++++++
 15 files changed, 57 insertions(+), 38 deletions(-)
 create mode 100644 src/utils/getPrismaClient/get-prisma-client.ts

diff --git a/src/app/api/db/create-question/route.ts b/src/app/api/db/create-question/route.ts
index c8981a4..6976989 100644
--- a/src/app/api/db/create-question/route.ts
+++ b/src/app/api/db/create-question/route.ts
@@ -1,14 +1,13 @@
 import { CreateQuestionDto } from "@/app/_dto/create_question/create-question.dto";
-import { PrismaClient } from "@prisma/client";
 import type { user } from "@prisma/client";
 import { type NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
 import { validateStrict } from "@/utils/validator/strictValidator";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
 export async function POST(req: NextRequest) {
-  const prisma = new PrismaClient();
-
+  const prisma = GetPrismaClient.getClient();
   try {
     const body = await req.json();
     let data;
diff --git a/src/app/api/db/delete-answer/route.ts b/src/app/api/db/delete-answer/route.ts
index 7af93b7..1e59138 100644
--- a/src/app/api/db/delete-answer/route.ts
+++ b/src/app/api/db/delete-answer/route.ts
@@ -1,10 +1,10 @@
 import { DeleteAnswerDto } from "@/app/_dto/delete-answer/delete-answer.dto";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { validateStrict } from "@/utils/validator/strictValidator";
-import { PrismaClient } from "@prisma/client";
 import { cookies } from "next/headers";
 import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
 export async function POST(req: NextRequest) {
   const body = await req.json();
@@ -14,7 +14,7 @@ export async function POST(req: NextRequest) {
   } catch (err) {
     return sendApiError(400, `Bad Request ${err}`);
   }
-  const prisma = new PrismaClient();
+  const prisma = GetPrismaClient.getClient();
   const cookieStore = await cookies();
   const token = cookieStore.get("jwtToken")?.value;
   let tokenPayload;
diff --git a/src/app/api/db/fetch-all-answers/route.ts b/src/app/api/db/fetch-all-answers/route.ts
index 9c6351c..6a55d81 100644
--- a/src/app/api/db/fetch-all-answers/route.ts
+++ b/src/app/api/db/fetch-all-answers/route.ts
@@ -1,21 +1,24 @@
 import { AnswerDto } from "@/app/_dto/Answers.dto";
 import { FetchAllAnswersReqDto } from "@/app/_dto/fetch-all-answers/fetch-all-answers.dto";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
+import { getIpHash } from "@/utils/getIp/get-ip-hash";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
 import { validateStrict } from "@/utils/validator/strictValidator";
-import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 
 export async function POST(req: NextRequest) {
-  const body = await req.json();
+  const prisma = GetPrismaClient.getClient();
+
   let data;
   try {
-    data = await validateStrict(FetchAllAnswersReqDto, body);
+    data = await validateStrict(FetchAllAnswersReqDto, await req.json());
   } catch (err) {
     return sendApiError(400, `${err}`);
   }
 
   const query_limit = data.limit ? Math.max(1, Math.min(data.limit, 100)) : 100;
-  const prisma = new PrismaClient();
   const sinceId = data.sinceId;
   const untilId = data.untilId;
 
diff --git a/src/app/api/db/fetch-my-profile/route.ts b/src/app/api/db/fetch-my-profile/route.ts
index 75c46b2..0ce7616 100644
--- a/src/app/api/db/fetch-my-profile/route.ts
+++ b/src/app/api/db/fetch-my-profile/route.ts
@@ -1,11 +1,11 @@
 import { userProfileMeDto } from "@/app/_dto/fetch-profile/Profile.dto";
-import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
 export async function GET(req: NextRequest) {
-  const prisma = new PrismaClient();
+  const prisma = GetPrismaClient.getClient();
   const token = req.cookies.get("jwtToken")?.value;
 
   try {
diff --git a/src/app/api/db/fetch-my-questions/route.ts b/src/app/api/db/fetch-my-questions/route.ts
index d984823..89a223a 100644
--- a/src/app/api/db/fetch-my-questions/route.ts
+++ b/src/app/api/db/fetch-my-questions/route.ts
@@ -1,11 +1,11 @@
-import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
 export async function GET(req: NextRequest) {
+  const prisma = GetPrismaClient.getClient();
   const cookie = req.cookies.get("jwtToken");
-  const prisma = new PrismaClient();
 
   try {
     if (cookie) {
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index d3fab65..d11265e 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -3,14 +3,14 @@ import {
   userProfileWithHostnameDto,
 } from "@/app/_dto/fetch-profile/Profile.dto";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
-import { PrismaClient } from "@prisma/client";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 import { NextRequest, NextResponse } from "next/server";
 
 export async function GET(
   req: NextRequest,
   { params }: { params: Promise<{ handle?: string }> }
 ) {
-  const prisma = new PrismaClient();
+  const prisma = GetPrismaClient.getClient();
   const userHandle = (await params).handle;
   try {
     if (!userHandle) {
diff --git a/src/app/api/db/fetch-user-answers/route.ts b/src/app/api/db/fetch-user-answers/route.ts
index 125e145..04a9b3c 100644
--- a/src/app/api/db/fetch-user-answers/route.ts
+++ b/src/app/api/db/fetch-user-answers/route.ts
@@ -1,10 +1,11 @@
 import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
 import { validateStrict } from "@/utils/validator/strictValidator";
-import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
 export async function POST(req: NextRequest) {
+  const prisma = GetPrismaClient.getClient();
   try {
     const body = await req.json();
     let data;
@@ -14,7 +15,6 @@ export async function POST(req: NextRequest) {
       return sendErrorResponse(400, `${err}`);
     }
 
-    const prisma = new PrismaClient();
     const query_limit = data.limit
       ? Math.max(1, Math.min(data.limit, 100))
       : 100;
diff --git a/src/app/api/web/mastodon-login/route.ts b/src/app/api/web/mastodon-login/route.ts
index 06364c7..d05806d 100644
--- a/src/app/api/web/mastodon-login/route.ts
+++ b/src/app/api/web/mastodon-login/route.ts
@@ -2,12 +2,14 @@ import { loginReqDto } from "@/app/_dto/web/login/login.dto";
 import { validateStrict } from "@/utils/validator/strictValidator";
 import { NextRequest, NextResponse } from "next/server";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
-import { PrismaClient } from "@prisma/client";
 import { v4 as uuid } from "uuid";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+
 
 export async function POST(req: NextRequest) {
   let data: loginReqDto;
   const body = await req.json();
+  const prisma = GetPrismaClient.getClient();
 
   //일단은 미스키와 같은 Validate를 거침
   try {
@@ -17,7 +19,6 @@ export async function POST(req: NextRequest) {
   }
 
   const mastodonHost = data.host.toLowerCase();
-  const prisma = new PrismaClient();
 
   try {
     const serverInfo = await prisma.server.findFirst({
diff --git a/src/app/api/web/misskey-login/route.ts b/src/app/api/web/misskey-login/route.ts
index b9bef5d..082ff97 100644
--- a/src/app/api/web/misskey-login/route.ts
+++ b/src/app/api/web/misskey-login/route.ts
@@ -1,12 +1,13 @@
 import { loginReqDto } from "@/app/_dto/web/login/login.dto";
 import { validateStrict } from "@/utils/validator/strictValidator";
-import { PrismaClient } from "@prisma/client";
 import { NextRequest, NextResponse } from "next/server";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
 import { MiApiError, MiAuthSession } from "@/app";
 import detectInstance from "../../functions/web/detectInstance";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
 export async function POST(req: NextRequest) {
+  const prisma = GetPrismaClient.getClient();
   let data: loginReqDto;
   const body = await req.json();
   try {
@@ -16,7 +17,6 @@ export async function POST(req: NextRequest) {
   }
 
   const misskeyHost = data.host.toLowerCase();
-  const prisma = new PrismaClient();
 
   try {
     const serverInfo = await prisma.server.findFirst({
diff --git a/src/app/main/questions/action.ts b/src/app/main/questions/action.ts
index 57a882c..1e50c64 100644
--- a/src/app/main/questions/action.ts
+++ b/src/app/main/questions/action.ts
@@ -3,12 +3,13 @@
 import type { mastodonTootAnswers, MkNoteAnswers, typedAnswer } from "@/app";
 import { verifyToken } from "@/app/api/functions/web/verify-jwt";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
-import { PrismaClient, question } from "@prisma/client";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { question } from "@prisma/client";
 import { createHash } from "crypto";
 import { cookies } from "next/headers";
 
 export async function getQuestion(id: number) {
-  const prisma = new PrismaClient();
+  const prisma = GetPrismaClient.getClient();
 
   const findWithId = await prisma.question.findUnique({
     where: {
@@ -23,7 +24,7 @@ export async function postAnswer(
   questionId: question["id"] | null,
   answer: typedAnswer
 ) {
-  const prisma = new PrismaClient();
+  const prisma = GetPrismaClient.getClient();
   const cookieStore = await cookies();
   const jwtToken = cookieStore.get('jwtToken')?.value;
   let tokenPayload;
@@ -234,11 +235,11 @@ async function mastodonToot(
 }
 
 export async function deleteQuestion(id: number) {
+  const prisma = GetPrismaClient.getClient();
   const cookieStore = await cookies();
   const jwtToken = cookieStore.get("jwtToken")?.value;
   try {
     const tokenPayload = await verifyToken(jwtToken);
-    const prisma = new PrismaClient();
     await prisma.$transaction(async (tr) => {
       const q = await tr.question.findUniqueOrThrow({where: {id: id}});
       if (q.questioneeHandle !== tokenPayload.handle) {
diff --git a/src/app/main/settings/action.ts b/src/app/main/settings/action.ts
index a5077d6..cf42069 100644
--- a/src/app/main/settings/action.ts
+++ b/src/app/main/settings/action.ts
@@ -1,13 +1,12 @@
 "use server";
 
-import { PrismaClient } from "@prisma/client";
 import { jwtVerify, JWTVerifyResult } from "jose";
 import { cookies } from "next/headers";
 import { FormValue } from "./page";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
 export async function fetchUser() {
-  const prisma = new PrismaClient();
-
+  const prisma = GetPrismaClient.getClient();
   const secret = new TextEncoder().encode(process.env.JWT_SECRET);
   const cookieStore = await cookies();
   const jwtToken = cookieStore.get("jwtToken");
@@ -36,7 +35,7 @@ export async function fetchUser() {
 }
 
 export async function updateSetting(handle: string, payload: FormValue) {
-  const prisma = new PrismaClient();
+  const prisma = GetPrismaClient.getClient();
 
   try {
     const updateUser = prisma.profile
diff --git a/src/app/main/user/[handle]/[answer]/action.ts b/src/app/main/user/[handle]/[answer]/action.ts
index c91818c..de01329 100644
--- a/src/app/main/user/[handle]/[answer]/action.ts
+++ b/src/app/main/user/[handle]/[answer]/action.ts
@@ -1,10 +1,9 @@
 "use server";
 
-import { PrismaClient } from "@prisma/client";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
 export async function fetchAnswer(id: string) {
-  const prisma = new PrismaClient();
-
+  const prisma = GetPrismaClient.getClient();
   const answer = await prisma.answer.findUnique({
     include: { answeredPerson: true },
     where: {
diff --git a/src/app/mastodon-callback/action.ts b/src/app/mastodon-callback/action.ts
index d5098e0..676ca51 100644
--- a/src/app/mastodon-callback/action.ts
+++ b/src/app/mastodon-callback/action.ts
@@ -2,17 +2,18 @@
 
 import { validateStrict } from "@/utils/validator/strictValidator";
 import { mastodonCallbackTokenClaimPayload } from "../_dto/mastodon-callback/callback-token-claim.dto";
-import { PrismaClient } from "@prisma/client";
 import { fetchNameWithEmoji } from "../api/functions/web/fetchUsername";
 import { DBpayload } from "../misskey-callback/page";
 import { cookies } from "next/headers";
 import { SignJWT } from "jose";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
-const prisma = new PrismaClient();
 
 export async function login(
   loginReqestData: mastodonCallbackTokenClaimPayload
 ) {
+  const prisma = GetPrismaClient.getClient();
+
   //Class Validator로 들어온 로그인 정보 검증
   let loginReq: mastodonCallbackTokenClaimPayload;
   try {
@@ -103,6 +104,8 @@ async function requestMastodonAccessCodeAndUserInfo(
   client_id: string,
   client_secret: string
 ) {
+  const prisma = GetPrismaClient.getClient();
+
   const checkInstances = await prisma.server.findFirst({
     where: {
       instances: payload.mastodonHost,
@@ -155,7 +158,8 @@ async function generateJwt(hostname: string, handle: string) {
 }
 
 async function pushDB(payload: DBpayload) {
-  const prisma = new PrismaClient();
+  const prisma = GetPrismaClient.getClient();
+
   await prisma.user.upsert({
     where: {
       handle: payload.handle,
diff --git a/src/app/misskey-callback/actions.ts b/src/app/misskey-callback/actions.ts
index 1b39f42..7c895f4 100644
--- a/src/app/misskey-callback/actions.ts
+++ b/src/app/misskey-callback/actions.ts
@@ -1,6 +1,5 @@
 "use server";
 
-import { PrismaClient } from "@prisma/client";
 import { DBpayload } from "./page";
 import { cookies } from "next/headers";
 import { SignJWT } from "jose";
@@ -10,6 +9,7 @@ import { fetchNameWithEmoji } from "../api/functions/web/fetchUsername";
 import { validateStrict } from "@/utils/validator/strictValidator";
 import { misskeyCallbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
 import { misskeyUserInfoPayload } from "../_dto/misskey-callback/user-info.dto";
+import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 
 export async function login(
   loginReqestData: misskeyCallbackTokenClaimPayload
@@ -101,7 +101,7 @@ export async function login(
 async function requestMiAccessTokenAndUserInfo(
   payload: misskeyCallbackTokenClaimPayload
 ) {
-  const prisma = new PrismaClient();
+  const prisma = GetPrismaClient.getClient();
 
   const checkInstances = await prisma.server.findFirst({
     where: {
@@ -158,7 +158,8 @@ async function generateJwt(hostname: string, handle: string) {
 }
 
 async function pushDB(payload: DBpayload) {
-  const prisma = new PrismaClient();
+  const prisma = GetPrismaClient.getClient();
+
   await prisma.user.upsert({
     where: {
       handle: payload.handle,
diff --git a/src/utils/getPrismaClient/get-prisma-client.ts b/src/utils/getPrismaClient/get-prisma-client.ts
new file mode 100644
index 0000000..46ba753
--- /dev/null
+++ b/src/utils/getPrismaClient/get-prisma-client.ts
@@ -0,0 +1,12 @@
+import { PrismaClient } from "@prisma/client";
+
+export class GetPrismaClient {
+  private static prismaClient: PrismaClient;
+  private constructor() {}
+  public static getClient() {
+    if (!GetPrismaClient.prismaClient) {
+      GetPrismaClient.prismaClient = new PrismaClient({log: ['info']});
+    }
+    return GetPrismaClient.prismaClient;
+  }
+}
\ No newline at end of file

From f67b960b63d16fc12c947cdfcd49a0efddedf2c0 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Fri, 22 Nov 2024 22:35:27 +0900
Subject: [PATCH 67/89] =?UTF-8?q?fetch-all-answers=20=EC=97=90=20=EB=A6=AC?=
 =?UTF-8?q?=EB=AF=B8=ED=84=B0=20=EC=8B=9C=ED=97=98=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/db/fetch-all-answers/route.ts | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/app/api/db/fetch-all-answers/route.ts b/src/app/api/db/fetch-all-answers/route.ts
index 6a55d81..749f419 100644
--- a/src/app/api/db/fetch-all-answers/route.ts
+++ b/src/app/api/db/fetch-all-answers/route.ts
@@ -10,6 +10,16 @@ import { NextRequest, NextResponse } from "next/server";
 
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
+  const ip = getIpFromRequest(req);
+  const limiter = RateLimiterService.getLimiter();
+  const ipHash = getIpHash(ip);
+  const limited = await limiter.limit(`fetch-all-answers-${ipHash}`, {
+    bucket_time: 600,
+    req_limit: 300,
+  });
+  if (limited) {
+    return sendApiError(429, '요청 제한에 도달했습니다!');
+  }
 
   let data;
   try {

From 30796f45a4d23edf5c754293026a8473e2bccc77 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Fri, 22 Nov 2024 23:31:41 +0900
Subject: [PATCH 68/89] =?UTF-8?q?=F0=9F=92=84=20=EB=AA=A8=EB=8B=AC=20?=
 =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=B6=94=EC=B6=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx         | 19 +++--
 src/app/_components/modalOneButton.tsx | 31 ++++++++
 src/app/_components/modalTwoButton.tsx | 40 +++++++++++
 src/app/_components/question.tsx       | 19 +++--
 src/app/main/_header.tsx               | 84 ++++++++++------------
 src/app/main/questions/page.tsx        | 97 ++++++++-----------------
 src/app/main/user/[handle]/page.tsx    | 98 ++++++++++----------------
 7 files changed, 203 insertions(+), 185 deletions(-)
 create mode 100644 src/app/_components/modalOneButton.tsx
 create mode 100644 src/app/_components/modalTwoButton.tsx

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 8df2be8..8fc723f 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -1,7 +1,13 @@
 "use client";
 
 import Link from "next/link";
-import { useEffect, useState } from "react";
+import {
+  Dispatch,
+  RefObject,
+  SetStateAction,
+  useEffect,
+  useState,
+} from "react";
 import NameComponents from "./NameComponents";
 import { AnswerDto } from "../_dto/Answers.dto";
 import { userProfileDto } from "../_dto/fetch-profile/Profile.dto";
@@ -10,6 +16,8 @@ import { useParams } from "next/navigation";
 interface askProps {
   value: AnswerDto;
   id: string;
+  ref: RefObject<HTMLDialogElement>;
+  idState: Dispatch<SetStateAction<string>>;
 }
 
 export async function fetchProfile(handle: string) {
@@ -21,7 +29,7 @@ export async function fetchProfile(handle: string) {
   }
 }
 
-export default function Answer({ value, id }: askProps) {
+export default function Answer({ value, idState, ref }: askProps) {
   const { handle } = useParams() as { handle: string };
   const [showNsfw, setShowNsfw] = useState(false);
   const [userInfo, setUserInfo] = useState<userProfileDto>();
@@ -70,9 +78,10 @@ export default function Answer({ value, id }: askProps) {
             <div className="w-12 flex justify-end">
               <a
                 className="link text-red-800 dark:text-red-500"
-                onClick={() =>
-                  document.getElementById(`answer_delete_modal_${id}`)?.click()
-                }
+                onClick={() => {
+                  ref.current?.showModal();
+                  idState(value.id);
+                }}
               >
                 삭제
               </a>
diff --git a/src/app/_components/modalOneButton.tsx b/src/app/_components/modalOneButton.tsx
new file mode 100644
index 0000000..1f736ac
--- /dev/null
+++ b/src/app/_components/modalOneButton.tsx
@@ -0,0 +1,31 @@
+import { RefObject } from "react";
+
+type modalProps = {
+  title: string;
+  body: string;
+  buttonText: string;
+  ref: RefObject<HTMLDialogElement>;
+};
+
+export default function DialogModalOneButton({
+  title,
+  body,
+  buttonText,
+  ref,
+}: modalProps) {
+  return (
+    <>
+      <dialog ref={ref} className="modal">
+        <div className="modal-box">
+          <h3 className="font-bold text-lg">{title}</h3>
+          <p className="py-4">{body}</p>
+          <div className="modal-action">
+            <form method="dialog">
+              <button className="btn">{buttonText}</button>
+            </form>
+          </div>
+        </div>
+      </dialog>
+    </>
+  );
+}
diff --git a/src/app/_components/modalTwoButton.tsx b/src/app/_components/modalTwoButton.tsx
new file mode 100644
index 0000000..82afaf9
--- /dev/null
+++ b/src/app/_components/modalTwoButton.tsx
@@ -0,0 +1,40 @@
+import { RefObject } from "react";
+
+type modalProps = {
+  title: string;
+  body: string;
+  confirmButtonText: string;
+  cancelButtonText: string;
+  ref: RefObject<HTMLDialogElement>;
+  onClick?: () => void;
+};
+
+export default function DialogModalTwoButton({
+  title,
+  body,
+  confirmButtonText,
+  cancelButtonText,
+  ref,
+  onClick,
+}: modalProps) {
+  return (
+    <>
+      <dialog ref={ref} className="modal">
+        <div className="modal-box">
+          <h3 className="font-bold text-lg">{title}</h3>
+          <p className="py-4">{body}</p>
+          <div className="modal-action">
+            <form method="dialog">
+              <div className="flex gap-2">
+                <button className="btn btn-error" onClick={onClick}>
+                  {confirmButtonText}
+                </button>
+                <button className="btn">{cancelButtonText}</button>
+              </div>
+            </form>
+          </div>
+        </div>
+      </dialog>
+    </>
+  );
+}
diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index c8e4c88..9a04164 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -2,6 +2,7 @@ import Link from "next/link";
 import { SubmitHandler, useForm } from "react-hook-form";
 import type { questions, typedAnswer } from "..";
 import { getQuestion, postAnswer } from "../main/questions/action";
+import { RefObject } from "react";
 
 interface formValue {
   answer: string;
@@ -13,14 +14,18 @@ interface askProps {
   singleQuestion: questions;
   multipleQuestions: questions[];
   setState: React.Dispatch<React.SetStateAction<questions[] | null>>;
-  id: number;
+  setId: React.Dispatch<React.SetStateAction<number>>;
+  deleteRef: RefObject<HTMLDialogElement>;
+  answerRef: RefObject<HTMLDialogElement>;
 }
 
 export default function Question({
   singleQuestion,
   multipleQuestions,
   setState,
-  id,
+  setId,
+  deleteRef,
+  answerRef,
 }: askProps) {
   const {
     register,
@@ -82,7 +87,7 @@ export default function Question({
 
     setState(filteredQuestions);
     postAnswer(question, typedAnswer);
-    document.getElementById("my_modal_1")?.click();
+    answerRef.current?.showModal();
   };
 
   return (
@@ -104,9 +109,10 @@ export default function Question({
           {singleQuestion.questionedAt.toLocaleString()}
           <span
             className="text-red-500 font-bold ml-2 cursor-pointer"
-            onClick={() =>
-              document.getElementById(`question_delete_modal_${id}`)?.click()
-            }
+            onClick={() => {
+              deleteRef.current?.showModal();
+              setId(singleQuestion.id);
+            }}
           >
             삭제
           </span>
@@ -126,6 +132,7 @@ export default function Question({
             )}
             <textarea
               {...register("answer", { required: "required" })}
+              tabIndex={0}
               className={`textarea textarea-sm text-sm h-24 desktop:h-32 window:text-xl desktop:text-2xl bg-transparent ${
                 errors.answer && "textarea-error"
               }`}
diff --git a/src/app/main/_header.tsx b/src/app/main/_header.tsx
index d7fcf7b..525b3ae 100644
--- a/src/app/main/_header.tsx
+++ b/src/app/main/_header.tsx
@@ -1,27 +1,11 @@
 "use client";
 
 import Link from "next/link";
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { FaUser } from "react-icons/fa";
 import { userProfileWithCountDto } from "../_dto/fetch-profile/Profile.dto";
-
-const fetchMyProfile = async () => {
-  const user_handle = localStorage.getItem("user_handle");
-
-  if (user_handle) {
-    const res = await fetch("/api/db/fetch-my-profile", {
-      method: "GET",
-    });
-    if (!res.ok) {
-      if (res.status === 401) {
-        document.getElementById("forceLogoutNoteModal")?.click();
-      }
-      return;
-    }
-    const data = await res.json();
-    return data;
-  }
-};
+import DialogModalTwoButton from "../_components/modalTwoButton";
+import DialogModalOneButton from "../_components/modalOneButton";
 
 const logout = async () => {
   await fetch("/api/web/logout");
@@ -31,6 +15,26 @@ const logout = async () => {
 
 export default function MainHeader() {
   const [user, setUser] = useState<userProfileWithCountDto>();
+  const logoutModalRef = useRef<HTMLDialogElement>(null);
+  const forcedLogoutModalRef = useRef<HTMLDialogElement>(null);
+
+  const fetchMyProfile = async () => {
+    const user_handle = localStorage.getItem("user_handle");
+
+    if (user_handle) {
+      const res = await fetch("/api/db/fetch-my-profile", {
+        method: "GET",
+      });
+      if (!res.ok) {
+        if (res.status === 401) {
+          forcedLogoutModalRef.current?.showModal();
+        }
+        return;
+      }
+      const data = await res.json();
+      return data;
+    }
+  };
 
   useEffect(() => {
     fetchMyProfile().then((r) => setUser(r));
@@ -87,39 +91,21 @@ export default function MainHeader() {
               <li>
                 <Link href={"/main/settings"}>설정</Link>
               </li>
-              <li
-                onClick={() => document.getElementById("logout_modal")?.click()}
-              >
+              <li onClick={() => logoutModalRef.current?.showModal()}>
                 <a>로그아웃</a>
               </li>
             </ul>
           </div>
         )}
       </div>
-      <input type="checkbox" id="logout_modal" className="modal-toggle" />
-      <div className="modal" role="dialog">
-        <div className="modal-box">
-          <h3 className="text-lg font-bold">로그아웃</h3>
-          <p className="py-4">정말로 로그아웃 하시겠어요?</p>
-          <div className="modal-action">
-            <button
-              className="btn btn-error"
-              onClick={() => {
-                document.getElementById("logout_modal")?.click();
-                logout();
-              }}
-            >
-              로그아웃
-            </button>
-            <button
-              onClick={() => document.getElementById("logout_modal")?.click()}
-              className="btn"
-            >
-              취소
-            </button>
-          </div>
-        </div>
-      </div>
+      <DialogModalTwoButton
+        title={"로그아웃"}
+        body={"정말로 로그아웃 하시겠어요?"}
+        confirmButtonText={"로그아웃"}
+        cancelButtonText={"취소"}
+        ref={logoutModalRef}
+        onClick={logout}
+      />
       <input
         type="checkbox"
         id="forceLogoutNoteModal"
@@ -141,6 +127,12 @@ export default function MainHeader() {
           </div>
         </div>
       </div>
+      <DialogModalOneButton
+        title={"자동 로그아웃"}
+        body={"로그인 유효시간이 만료되어서 로그아웃 되었어요!"}
+        buttonText={"확인"}
+        ref={forcedLogoutModalRef}
+      />
     </div>
   );
 }
diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index ab5aefd..bf6975c 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -4,6 +4,8 @@ import { questions } from "@/app";
 import Question from "@/app/_components/question";
 import { useEffect, useRef, useState } from "react";
 import { deleteQuestion } from "./action";
+import DialogModalTwoButton from "@/app/_components/modalTwoButton";
+import DialogModalOneButton from "@/app/_components/modalOneButton";
 
 const fetchQuestions = async () => {
   const res = await fetch("/api/db/fetch-my-questions").then((r) => r.json());
@@ -13,25 +15,14 @@ const fetchQuestions = async () => {
 
 export default function Questions() {
   const [questions, setQuestions] = useState<questions[] | null>(null);
-  const parentDivRef = useRef<HTMLDivElement>(null);
-
-  const onEscape = (e: React.KeyboardEvent) => {
-    const modalState = document.getElementById(
-      "my_modal_1"
-    ) as HTMLInputElement;
-    if (e.key === "Escape") {
-      modalState.checked = false;
-    }
-  };
+  const [id, setId] = useState<number>(0);
+  const deleteQuestionModalRef = useRef<HTMLDialogElement>(null);
+  const answeredQuestionModalRef = useRef<HTMLDialogElement>(null);
 
   useEffect(() => {
     fetchQuestions().then((r) => setQuestions(r));
   }, []);
 
-  useEffect(() => {
-    parentDivRef.current?.focus();
-  }, [questions]);
-
   return (
     <div className="w-[90%] window:w-[80%] desktop:w-[70%] flex flex-col justify-center">
       <h3 className="text-3xl desktop:text-4xl mb-2">미답변 질문들</h3>
@@ -50,45 +41,11 @@ export default function Questions() {
                       <Question
                         singleQuestion={el}
                         multipleQuestions={questions}
+                        setId={setId}
                         setState={setQuestions}
-                        id={el.id}
+                        answerRef={answeredQuestionModalRef}
+                        deleteRef={deleteQuestionModalRef}
                       />
-                      <input
-                        type="checkbox"
-                        id={`question_delete_modal_${el.id}`}
-                        className="modal-toggle"
-                      />
-                      <div className="modal" role="dialog">
-                        <div className="modal-box">
-                          <h3 className="py-4 text-2xl">질문을 지울까요...?</h3>
-                          <div className="modal-action">
-                            <label
-                              htmlFor={`question_delete_modal_${el.id}`}
-                              className="btn btn-error"
-                              onClick={() => {
-                                deleteQuestion(el.id);
-                                setQuestions((prevQuestions) =>
-                                  prevQuestions
-                                    ? [
-                                        ...prevQuestions.filter(
-                                          (prev) => prev.id !== el.id
-                                        ),
-                                      ]
-                                    : null
-                                );
-                              }}
-                            >
-                              확인
-                            </label>
-                            <label
-                              htmlFor={`question_delete_modal_${el.id}`}
-                              className="btn"
-                            >
-                              취소
-                            </label>
-                          </div>
-                        </div>
-                      </div>
                     </div>
                   ))}
                 </div>
@@ -107,23 +64,27 @@ export default function Questions() {
           )}
         </div>
       )}
-      <input type="checkbox" id="my_modal_1" className="modal-toggle" />
-      <div
-        className="modal"
-        role="dialog"
-        onKeyDown={onEscape}
-        tabIndex={0}
-        ref={parentDivRef}
-      >
-        <div className="modal-box">
-          <h3 className="py-4 text-2xl">답변했어요!</h3>
-          <div className="modal-action">
-            <label htmlFor="my_modal_1" className="btn">
-              닫기
-            </label>
-          </div>
-        </div>
-      </div>
+      <DialogModalOneButton
+        title={"답변완료"}
+        body={"답변했어요!"}
+        buttonText={"확인"}
+        ref={answeredQuestionModalRef}
+      />
+      <DialogModalTwoButton
+        title={"질문 지우기"}
+        body={"질문을 지울까요...?"}
+        confirmButtonText={"확인"}
+        cancelButtonText={"취소"}
+        ref={deleteQuestionModalRef}
+        onClick={() => {
+          deleteQuestion(id);
+          setQuestions((prevQuestions) =>
+            prevQuestions
+              ? [...prevQuestions.filter((prev) => prev.id !== id)]
+              : null
+          );
+        }}
+      />
     </div>
   );
 }
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 75d6ded..d55f4d7 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -2,7 +2,7 @@
 
 import NameComponents from "@/app/_components/NameComponents";
 import { useParams } from "next/navigation";
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { SubmitHandler, useForm } from "react-hook-form";
 import Answer from "@/app/_components/answer";
 import { FaUserSlash } from "react-icons/fa";
@@ -12,6 +12,8 @@ import { AnswerDto } from "@/app/_dto/Answers.dto";
 import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
 import josa from "@/app/api/functions/josa";
 import Link from "next/link";
+import DialogModalOneButton from "@/app/_components/modalOneButton";
+import DialogModalTwoButton from "@/app/_components/modalTwoButton";
 
 type FormValue = {
   question: string;
@@ -41,6 +43,9 @@ export default function UserPage() {
   const [untilId, setUntilId] = useState<string | null>(null);
   const [loading, setLoading] = useState<boolean>(true);
   const [mounted, setMounted] = useState<HTMLDivElement | null>(null);
+  const [id, setId] = useState<string>("");
+  const questionSuccessModalRef = useRef<HTMLDialogElement>(null);
+  const answerDeleteModalRef = useRef<HTMLDialogElement>(null);
 
   const profileHandle = handle.toString().replace(/(?:%40)/g, "@");
 
@@ -71,19 +76,11 @@ export default function UserPage() {
         return;
       } else {
         const value = getValues();
-        if (value) {
+        if (value && !questionSuccessModalRef.current?.open) {
           await onSubmit(value);
         }
       }
-    }
-  };
-
-  const onEscape = (e: React.KeyboardEvent) => {
-    const modalState = document.getElementById(
-      "my_modal_2"
-    ) as HTMLInputElement;
-    if (e.key === "Escape") {
-      modalState.checked = false;
+      questionSuccessModalRef.current?.showModal();
     }
   };
 
@@ -156,7 +153,11 @@ export default function UserPage() {
         return;
       }
 
-      document.getElementById("my_modal_2")?.click();
+      if (questionSuccessModalRef.current) {
+        questionSuccessModalRef.current.showModal();
+      } else {
+        alert("오류에요!!!");
+      }
 
       const req: CreateQuestionDto = {
         question: e.question,
@@ -186,7 +187,11 @@ export default function UserPage() {
           return;
         }
 
-        document.getElementById("my_modal_2")?.click();
+        if (questionSuccessModalRef.current) {
+          questionSuccessModalRef.current.showModal();
+        } else {
+          alert("오류에요!!!");
+        }
 
         const req: CreateQuestionDto = {
           question: e.question,
@@ -259,10 +264,7 @@ export default function UserPage() {
   }, [mounted, untilId]);
 
   return (
-    <div
-      className="w-[90%] window:w-[80%] desktop:w-[70%]"
-      onKeyDown={onEscape}
-    >
+    <div className="w-[90%] window:w-[80%] desktop:w-[70%]">
       {userProfile === null ? (
         <div className="w-full flex flex-col justify-center items-center glass text-4xl rounded-box shadow p-2">
           <FaUserSlash />
@@ -393,34 +395,12 @@ export default function UserPage() {
                   <div className="flex flex-col">
                     {answers.map((el) => (
                       <div key={el.id}>
-                        <Answer value={el} id={el.id} />
-                        <input
-                          type="checkbox"
-                          id={`answer_delete_modal_${el.id}`}
-                          className="modal-toggle"
+                        <Answer
+                          value={el}
+                          id={el.id}
+                          idState={setId}
+                          ref={answerDeleteModalRef}
                         />
-                        <div className="modal" role="dialog">
-                          <div className="modal-box">
-                            <h3 className="py-4 text-2xl">
-                              답변을 지울까요...?
-                            </h3>
-                            <div className="modal-action">
-                              <label
-                                htmlFor={`answer_delete_modal_${el.id}`}
-                                className="btn btn-error"
-                                onClick={() => handleDeleteAnswer(el.id)}
-                              >
-                                확인
-                              </label>
-                              <label
-                                htmlFor={`answer_delete_modal_${el.id}`}
-                                className="btn"
-                              >
-                                취소
-                              </label>
-                            </div>
-                          </div>
-                        </div>
                       </div>
                     ))}
                     <div
@@ -452,22 +432,20 @@ export default function UserPage() {
           </div>
         </div>
       )}
-      <input type="checkbox" id="my_modal_2" className="modal-toggle" />
-      <div className="modal" role="dialog">
-        <div className="modal-box">
-          <h3 className="py-4 text-2xl">질문했어요!</h3>
-          <div className="modal-action">
-            <button
-              className="btn"
-              onClick={() => {
-                document.getElementById("my_modal_2")?.click();
-              }}
-            >
-              닫기
-            </button>
-          </div>
-        </div>
-      </div>
+      <DialogModalOneButton
+        title={"성공!"}
+        body={"질문했어요!"}
+        buttonText={"닫기"}
+        ref={questionSuccessModalRef}
+      />
+      <DialogModalTwoButton
+        title={"답변 지우기"}
+        body={"답변을 지울까요...?"}
+        confirmButtonText={"확인"}
+        cancelButtonText={"취소"}
+        ref={answerDeleteModalRef}
+        onClick={() => handleDeleteAnswer(id)}
+      />
     </div>
   );
 }

From 06b41c4b9e76ad2695bd9ecc9c466cefd1cf7b96 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 00:13:04 +0900
Subject: [PATCH 69/89] =?UTF-8?q?=F0=9F=92=84=20=ED=94=84=EB=A1=9C?=
 =?UTF-8?q?=ED=95=84=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EB=B6=84?=
 =?UTF-8?q?=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/user/[handle]/_answers.tsx | 188 ++++++++++
 src/app/main/user/[handle]/_profile.tsx | 285 +++++++++++++++
 src/app/main/user/[handle]/page.tsx     | 450 +-----------------------
 3 files changed, 479 insertions(+), 444 deletions(-)
 create mode 100644 src/app/main/user/[handle]/_answers.tsx
 create mode 100644 src/app/main/user/[handle]/_profile.tsx

diff --git a/src/app/main/user/[handle]/_answers.tsx b/src/app/main/user/[handle]/_answers.tsx
new file mode 100644
index 0000000..4a53465
--- /dev/null
+++ b/src/app/main/user/[handle]/_answers.tsx
@@ -0,0 +1,188 @@
+"use client";
+
+import { useParams } from "next/navigation";
+import { useEffect, useRef, useState } from "react";
+import Answer from "@/app/_components/answer";
+import { FaUserSlash } from "react-icons/fa";
+import { userProfileWithHostnameDto } from "@/app/_dto/fetch-profile/Profile.dto";
+import { AnswerDto } from "@/app/_dto/Answers.dto";
+import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
+import DialogModalTwoButton from "@/app/_components/modalTwoButton";
+
+type ResponseType = {
+  answers: AnswerDto[];
+  count: number;
+};
+
+async function fetchProfile(handle: string) {
+  const profile = await fetch(`/api/db/fetch-profile/${handle}`);
+  if (profile && profile.ok) {
+    return profile.json() as unknown as userProfileWithHostnameDto;
+  } else {
+    return undefined;
+  }
+}
+
+export default function UserPage() {
+  const { handle } = useParams() as { handle: string };
+  const profileHandle = handle.toString().replace(/(?:%40)/g, "@");
+
+  const [userProfile, setUserProfile] = useState<userProfileWithHostnameDto>();
+  const [answers, setAnswers] = useState<AnswerDto[] | null>(null);
+  const [count, setCount] = useState<number | null>(0);
+  const [untilId, setUntilId] = useState<string | null>(null);
+  const [loading, setLoading] = useState<boolean>(true);
+  const [mounted, setMounted] = useState<HTMLDivElement | null>(null);
+  const [id, setId] = useState<string>("");
+  const answerDeleteModalRef = useRef<HTMLDialogElement>(null);
+
+  const fetchUserAnswers = async (
+    q: FetchUserAnswersDto
+  ): Promise<ResponseType> => {
+    const res = await fetch("/api/db/fetch-user-answers", {
+      method: "POST",
+      body: JSON.stringify(q),
+    });
+    if (res.ok) {
+      return res.json();
+    } else {
+      throw new Error(
+        `fetch-user-answers fail! ${res.status}, ${res.statusText}`
+      );
+    }
+  };
+
+  const handleDeleteAnswer = async (id: string) => {
+    await fetch("/api/db/delete-answer", {
+      method: "POST",
+      body: JSON.stringify({ id: id }),
+    });
+    if (answers && count) {
+      const filteredAnswer = answers.filter((el) => el.id !== id);
+      setAnswers(filteredAnswer);
+      setCount((prevCount) => (prevCount ? prevCount - 1 : null));
+    }
+  };
+
+  useEffect(() => {
+    fetchProfile(profileHandle).then((r) => {
+      setUserProfile(r);
+    });
+  }, [profileHandle]);
+
+  useEffect(() => {
+    if (userProfile) {
+      fetchUserAnswers({
+        answeredPersonHandle: userProfile.handle,
+        sort: "DESC",
+        limit: 20,
+      }).then(({ answers, count }: ResponseType) => {
+        if (answers.length === 0) {
+          setLoading(false);
+          setAnswers([]);
+          return;
+        }
+        setAnswers(answers);
+        setCount(count);
+        setUntilId(answers[answers.length - 1].id);
+      });
+    }
+  }, [profileHandle, userProfile]);
+
+  useEffect(() => {
+    const observer = new IntersectionObserver(
+      ([e]) => {
+        if (e.isIntersecting && untilId !== null && answers !== null) {
+          fetchUserAnswers({
+            sort: "DESC",
+            limit: 20,
+            untilId: untilId,
+            answeredPersonHandle: profileHandle,
+          }).then((r) => {
+            if (r.answers.length === 0) {
+              setLoading(false);
+              return;
+            }
+            setAnswers((prev_answers) =>
+              prev_answers ? [...prev_answers, ...r.answers] : null
+            );
+            setUntilId(r.answers[r.answers.length - 1].id);
+          });
+        }
+      },
+      {
+        threshold: 0.7,
+      }
+    );
+    if (mounted) observer.observe(mounted);
+    return () => {
+      if (mounted) observer.unobserve(mounted);
+    };
+  }, [mounted, untilId]);
+
+  return (
+    <div className="w-full flex flex-col desktop:flex-row">
+      {userProfile === null ? (
+        <div className="w-full flex flex-col justify-center items-center glass text-4xl rounded-box shadow p-2">
+          <FaUserSlash />
+          <span>그런 사용자는 없어요!</span>
+        </div>
+      ) : (
+        <div className="w-full flex flex-col desktop:flex-row">
+          {answers !== null ? (
+            <div className="w-full">
+              <div className="flex items-center gap-2 my-2 text-2xl">
+                <span>답변</span>
+                <span className="badge badge-ghost">{count}</span>
+              </div>
+              {answers.length > 0 ? (
+                <div className="flex flex-col">
+                  {answers.map((el) => (
+                    <div key={el.id}>
+                      <Answer
+                        value={el}
+                        id={el.id}
+                        idState={setId}
+                        ref={answerDeleteModalRef}
+                      />
+                    </div>
+                  ))}
+                  <div
+                    className="w-full h-16 flex justify-center items-center"
+                    ref={(ref) => setMounted(ref)}
+                  >
+                    {loading ? (
+                      <div>
+                        <span className="loading loading-spinner loading-lg" />
+                      </div>
+                    ) : (
+                      <div>
+                        <span className="text-3xl">🥂 끝이야 한 잔 해</span>
+                      </div>
+                    )}
+                  </div>
+                </div>
+              ) : (
+                <div className="text-2xl flex gap-2 justify-center items-center border shadow rounded-box p-2 glass">
+                  <span>🍺 질문함이 맥주있어요...</span>
+                </div>
+              )}
+            </div>
+          ) : (
+            <div className="w-full flex justify-center">
+              <span className="loading loading-spinner loading-lg" />
+            </div>
+          )}
+        </div>
+      )}
+      <DialogModalTwoButton
+        title={"답변 지우기"}
+        body={"답변을 지울까요...?"}
+        confirmButtonText={"확인"}
+        cancelButtonText={"취소"}
+        ref={answerDeleteModalRef}
+        onClick={() => handleDeleteAnswer(id)}
+      />
+    </div>
+  );
+}
diff --git a/src/app/main/user/[handle]/_profile.tsx b/src/app/main/user/[handle]/_profile.tsx
new file mode 100644
index 0000000..3dbaa58
--- /dev/null
+++ b/src/app/main/user/[handle]/_profile.tsx
@@ -0,0 +1,285 @@
+import DialogModalOneButton from "@/app/_components/modalOneButton";
+import NameComponents from "@/app/_components/NameComponents";
+import { CreateQuestionDto } from "@/app/_dto/create_question/create-question.dto";
+import { userProfileWithHostnameDto } from "@/app/_dto/fetch-profile/Profile.dto";
+import josa from "@/app/api/functions/josa";
+import Link from "next/link";
+import { useParams } from "next/navigation";
+import { useEffect, useRef, useState } from "react";
+import { SubmitHandler, useForm } from "react-hook-form";
+
+type FormValue = {
+  question: string;
+  questioner: boolean;
+};
+
+async function fetchProfile(handle: string) {
+  const profile = await fetch(`/api/db/fetch-profile/${handle}`);
+  if (profile && profile.ok) {
+    return profile.json() as unknown as userProfileWithHostnameDto;
+  } else {
+    return undefined;
+  }
+}
+
+export default function Profile() {
+  const { handle } = useParams() as { handle: string };
+  const profileHandle = handle.toString().replace(/(?:%40)/g, "@");
+
+  const [userProfile, setUserProfile] = useState<userProfileWithHostnameDto>();
+  const [localHandle, setLocalHandle] = useState<string>("");
+  const questionSuccessModalRef = useRef<HTMLDialogElement>(null);
+
+  const {
+    register,
+    handleSubmit,
+    setValue,
+    watch,
+    reset,
+    trigger,
+    getValues,
+    setError,
+    formState: { errors },
+  } = useForm<FormValue>({
+    defaultValues: {
+      question: "",
+      questioner: false,
+    },
+  });
+
+  const questioner = watch("questioner");
+
+  const onCtrlEnter = async (e: React.KeyboardEvent) => {
+    if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
+      const isValid = await trigger();
+
+      if (isValid === false) {
+        return;
+      } else {
+        const value = getValues();
+        if (value && !questionSuccessModalRef.current?.open) {
+          await onSubmit(value);
+        }
+      }
+      questionSuccessModalRef.current?.showModal();
+    }
+  };
+
+  const mkQuestionCreateApi = async (
+    q: CreateQuestionDto
+  ): Promise<Response> => {
+    const res = await fetch("/api/db/create-question", {
+      method: "POST",
+      body: JSON.stringify(q),
+    });
+    return res;
+  };
+
+  const shareUrl = () => {
+    const server = localStorage.getItem("server");
+    const text = `저의 ${josa(
+      userProfile?.questionBoxName,
+      "이에요!",
+      "예요!"
+    )} #neo-quesdon ${location.origin}/main/user/${userProfile?.handle}`;
+    return `https://${server}/share?text=${encodeURIComponent(text)}`;
+  };
+
+  const onSubmit: SubmitHandler<FormValue> = async (e) => {
+    const user_handle = localStorage.getItem("user_handle");
+    const detectWhiteSpaces = new RegExp(/^\s+$/);
+
+    // 작성자 공개
+    if (questioner === true) {
+      if (user_handle === null) {
+        setError("questioner", {
+          type: "notLoggedIn",
+          message: "작성자 공개를 하려면 로그인을 해주세요!",
+        });
+        return;
+      }
+      if (detectWhiteSpaces.test(e.question) === true) {
+        setError("question", {
+          type: "questionOnlyWhiteSpace",
+          message: "아무것도 없는 질문을 보내시려구요...?",
+        });
+        return;
+      }
+
+      if (questionSuccessModalRef.current) {
+        questionSuccessModalRef.current.showModal();
+      } else {
+        alert("오류에요!!!");
+      }
+
+      const req: CreateQuestionDto = {
+        question: e.question,
+        questioner: user_handle,
+        questionee: profileHandle,
+      };
+      const res = await mkQuestionCreateApi(req);
+
+      if (res.status === 200) {
+        reset();
+      }
+    }
+    // 작성자 비공개
+    else {
+      if (userProfile?.stopAnonQuestion === true) {
+        setError("questioner", {
+          type: "stopAnonQuestion",
+          message: "익명 질문은 받지 않고 있어요...",
+        });
+        return;
+      } else {
+        if (detectWhiteSpaces.test(e.question) === true) {
+          setError("question", {
+            type: "questionOnlyWhiteSpace",
+            message: "아무것도 없는 질문을 보내시려구요...?",
+          });
+          return;
+        }
+
+        if (questionSuccessModalRef.current) {
+          questionSuccessModalRef.current.showModal();
+        } else {
+          alert("오류에요!!!");
+        }
+
+        const req: CreateQuestionDto = {
+          question: e.question,
+          questioner: null,
+          questionee: profileHandle,
+        };
+        const res = await mkQuestionCreateApi(req);
+        if (res.status === 200) {
+          reset();
+        }
+      }
+    }
+  };
+
+  useEffect(() => {
+    fetchProfile(profileHandle).then((r) => {
+      setUserProfile(r);
+    });
+    setLocalHandle(localStorage.getItem("user_handle") ?? "");
+  }, [profileHandle]);
+
+  return (
+    <div className="w-full h-fit desktop:sticky top-2 flex flex-col">
+      <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
+        <div className="flex flex-col items-center gap-2 py-2">
+          {userProfile && userProfile.avatarUrl ? (
+            <div className="flex w-full h-24">
+              <Link
+                href={`https://${userProfile.hostname}/${userProfile.handle}`}
+              >
+                <img
+                  src={userProfile.avatarUrl}
+                  alt="User Avatar"
+                  className={`w-24 h-24 object-cover absolute left-[calc(50%-3rem)] rounded-full`}
+                />
+              </Link>
+              {userProfile.stopAnonQuestion && (
+                <div className="chat chat-start w-32 window:w-full desktop:w-full relative left-[68%] window:left-[60%] deskstop:left-[57%]">
+                  <div className="chat-bubble text-sm flex items-center bg-base-100 text-slate-700">
+                    작성자 공개 질문만 받아요!
+                  </div>
+                </div>
+              )}
+            </div>
+          ) : (
+            <div className="skeleton h-24 w-24 rounded-full" />
+          )}
+          <div className="flex items-center text-xl">
+            {userProfile?.stopNewQuestion ? (
+              <div className="flex flex-col items-center desktop:flex-row">
+                <NameComponents
+                  username={userProfile.name}
+                  width={32}
+                  height={32}
+                />
+                <span>님은 지금 질문을 받지 않고 있어요...</span>
+              </div>
+            ) : (
+              <div className="flex flex-col items-center desktop:flex-row window:flex-row window:text-2xl">
+                <NameComponents
+                  username={userProfile?.name}
+                  width={32}
+                  height={32}
+                />
+                <span>
+                  님의 {josa(userProfile?.questionBoxName, "이에요!", "예요!")}
+                </span>
+              </div>
+            )}
+          </div>
+        </div>
+        <form
+          className="w-full flex flex-col items-center"
+          onSubmit={handleSubmit(onSubmit)}
+        >
+          <textarea
+            {...register("question", {
+              required: "required",
+            })}
+            placeholder="질문 내용을 입력해 주세요"
+            className={`w-[90%] my-2 font-thin leading-loose textarea ${
+              errors.question ? "textarea-error" : "textarea-bordered"
+            }`}
+            onKeyDown={onCtrlEnter}
+            disabled={userProfile?.stopNewQuestion === true ? true : false}
+          />
+          {errors.questioner &&
+            errors.questioner.type === "stopAnonQuestion" && (
+              <div
+                className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
+                data-tip={errors.questioner.message}
+              />
+            )}
+          {errors.questioner && errors.questioner.type === "notLoggedIn" && (
+            <div
+              className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
+              data-tip={errors.questioner.message}
+            />
+          )}
+          {errors.question &&
+            errors.question.type === "questionOnlyWhiteSpace" && (
+              <div
+                className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
+                data-tip={errors.question.message}
+              />
+            )}
+          <div className="w-[90%] flex justify-between">
+            <div className="flex gap-2 items-center">
+              <input
+                type="checkbox"
+                className="toggle toggle-accent"
+                onClick={() => setValue("questioner", !questioner)}
+              />
+              <input type="hidden" {...register("questioner")} />
+              <span>작성자 공개</span>
+            </div>
+            <button type="submit" className="btn btn-primary">
+              질문하기
+            </button>
+          </div>
+        </form>
+      </div>
+      {localHandle === profileHandle && (
+        <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
+          <a className="link" href={shareUrl()} target="_blank">
+            Misskey에 질문상자 페이지를 공유
+          </a>
+        </div>
+      )}
+      <DialogModalOneButton
+        title={"성공!"}
+        body={"질문했어요!"}
+        buttonText={"닫기"}
+        ref={questionSuccessModalRef}
+      />
+    </div>
+  );
+}
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index d55f4d7..22aa9c7 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -1,451 +1,13 @@
 "use client";
 
-import NameComponents from "@/app/_components/NameComponents";
-import { useParams } from "next/navigation";
-import { useEffect, useRef, useState } from "react";
-import { SubmitHandler, useForm } from "react-hook-form";
-import Answer from "@/app/_components/answer";
-import { FaUserSlash } from "react-icons/fa";
-import { userProfileWithHostnameDto } from "@/app/_dto/fetch-profile/Profile.dto";
-import { CreateQuestionDto } from "@/app/_dto/create_question/create-question.dto";
-import { AnswerDto } from "@/app/_dto/Answers.dto";
-import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
-import josa from "@/app/api/functions/josa";
-import Link from "next/link";
-import DialogModalOneButton from "@/app/_components/modalOneButton";
-import DialogModalTwoButton from "@/app/_components/modalTwoButton";
-
-type FormValue = {
-  question: string;
-  questioner: boolean;
-};
-
-type ResponseType = {
-  answers: AnswerDto[];
-  count: number;
-};
-
-async function fetchProfile(handle: string) {
-  const profile = await fetch(`/api/db/fetch-profile/${handle}`);
-  if (profile && profile.ok) {
-    return profile.json() as unknown as userProfileWithHostnameDto;
-  } else {
-    return undefined;
-  }
-}
-
-export default function UserPage() {
-  const { handle } = useParams() as { handle: string };
-  const [userProfile, setUserProfile] = useState<userProfileWithHostnameDto>();
-  const [localHandle, setLocalHandle] = useState<string>("");
-  const [answers, setAnswers] = useState<AnswerDto[] | null>(null);
-  const [count, setCount] = useState<number | null>(0);
-  const [untilId, setUntilId] = useState<string | null>(null);
-  const [loading, setLoading] = useState<boolean>(true);
-  const [mounted, setMounted] = useState<HTMLDivElement | null>(null);
-  const [id, setId] = useState<string>("");
-  const questionSuccessModalRef = useRef<HTMLDialogElement>(null);
-  const answerDeleteModalRef = useRef<HTMLDialogElement>(null);
-
-  const profileHandle = handle.toString().replace(/(?:%40)/g, "@");
-
-  const {
-    register,
-    handleSubmit,
-    setValue,
-    watch,
-    reset,
-    trigger,
-    getValues,
-    setError,
-    formState: { errors },
-  } = useForm<FormValue>({
-    defaultValues: {
-      question: "",
-      questioner: false,
-    },
-  });
-
-  const questioner = watch("questioner");
-
-  const onCtrlEnter = async (e: React.KeyboardEvent) => {
-    if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
-      const isValid = await trigger();
-
-      if (isValid === false) {
-        return;
-      } else {
-        const value = getValues();
-        if (value && !questionSuccessModalRef.current?.open) {
-          await onSubmit(value);
-        }
-      }
-      questionSuccessModalRef.current?.showModal();
-    }
-  };
-
-  const fetchUserAnswers = async (
-    q: FetchUserAnswersDto
-  ): Promise<ResponseType> => {
-    const res = await fetch("/api/db/fetch-user-answers", {
-      method: "POST",
-      body: JSON.stringify(q),
-    });
-    if (res.ok) {
-      return res.json();
-    } else {
-      throw new Error(
-        `fetch-user-answers fail! ${res.status}, ${res.statusText}`
-      );
-    }
-  };
-
-  const handleDeleteAnswer = async (id: string) => {
-    await fetch("/api/db/delete-answer", {
-      method: "POST",
-      body: JSON.stringify({ id: id }),
-    });
-    if (answers && count) {
-      const filteredAnswer = answers.filter((el) => el.id !== id);
-      setAnswers(filteredAnswer);
-      setCount((prevCount) => (prevCount ? prevCount - 1 : null));
-    }
-  };
-
-  const mkQuestionCreateApi = async (
-    q: CreateQuestionDto
-  ): Promise<Response> => {
-    const res = await fetch("/api/db/create-question", {
-      method: "POST",
-      body: JSON.stringify(q),
-    });
-    return res;
-  };
-
-  const shareUrl = () => {
-    const server = localStorage.getItem("server");
-    const text = `저의 ${josa(
-      userProfile?.questionBoxName,
-      "이에요!",
-      "예요!"
-    )} #neo-quesdon ${location.origin}/main/user/${userProfile?.handle}`;
-    return `https://${server}/share?text=${encodeURIComponent(text)}`;
-  };
-
-  const onSubmit: SubmitHandler<FormValue> = async (e) => {
-    const user_handle = localStorage.getItem("user_handle");
-    const detectWhiteSpaces = new RegExp(/^\s+$/);
-
-    // 작성자 공개
-    if (questioner === true) {
-      if (user_handle === null) {
-        setError("questioner", {
-          type: "notLoggedIn",
-          message: "작성자 공개를 하려면 로그인을 해주세요!",
-        });
-        return;
-      }
-      if (detectWhiteSpaces.test(e.question) === true) {
-        setError("question", {
-          type: "questionOnlyWhiteSpace",
-          message: "아무것도 없는 질문을 보내시려구요...?",
-        });
-        return;
-      }
-
-      if (questionSuccessModalRef.current) {
-        questionSuccessModalRef.current.showModal();
-      } else {
-        alert("오류에요!!!");
-      }
-
-      const req: CreateQuestionDto = {
-        question: e.question,
-        questioner: user_handle,
-        questionee: profileHandle,
-      };
-      const res = await mkQuestionCreateApi(req);
-
-      if (res.status === 200) {
-        reset();
-      }
-    }
-    // 작성자 비공개
-    else {
-      if (userProfile?.stopAnonQuestion === true) {
-        setError("questioner", {
-          type: "stopAnonQuestion",
-          message: "익명 질문은 받지 않고 있어요...",
-        });
-        return;
-      } else {
-        if (detectWhiteSpaces.test(e.question) === true) {
-          setError("question", {
-            type: "questionOnlyWhiteSpace",
-            message: "아무것도 없는 질문을 보내시려구요...?",
-          });
-          return;
-        }
-
-        if (questionSuccessModalRef.current) {
-          questionSuccessModalRef.current.showModal();
-        } else {
-          alert("오류에요!!!");
-        }
-
-        const req: CreateQuestionDto = {
-          question: e.question,
-          questioner: null,
-          questionee: profileHandle,
-        };
-        const res = await mkQuestionCreateApi(req);
-        if (res.status === 200) {
-          reset();
-        }
-      }
-    }
-  };
-
-  useEffect(() => {
-    fetchProfile(profileHandle).then((r) => {
-      setUserProfile(r);
-    });
-    setLocalHandle(localStorage.getItem("user_handle") ?? "");
-  }, [profileHandle]);
-
-  useEffect(() => {
-    if (userProfile) {
-      fetchUserAnswers({
-        answeredPersonHandle: userProfile.handle,
-        sort: "DESC",
-        limit: 20,
-      }).then(({ answers, count }: ResponseType) => {
-        if (answers.length === 0) {
-          setLoading(false);
-          setAnswers([]);
-          return;
-        }
-        setAnswers(answers);
-        setCount(count);
-        setUntilId(answers[answers.length - 1].id);
-      });
-    }
-  }, [profileHandle, userProfile]);
-
-  useEffect(() => {
-    const observer = new IntersectionObserver(
-      ([e]) => {
-        if (e.isIntersecting && untilId !== null && answers !== null) {
-          fetchUserAnswers({
-            sort: "DESC",
-            limit: 20,
-            untilId: untilId,
-            answeredPersonHandle: profileHandle,
-          }).then((r) => {
-            if (r.answers.length === 0) {
-              setLoading(false);
-              return;
-            }
-            setAnswers((prev_answers) =>
-              prev_answers ? [...prev_answers, ...r.answers] : null
-            );
-            setUntilId(r.answers[r.answers.length - 1].id);
-          });
-        }
-      },
-      {
-        threshold: 0.7,
-      }
-    );
-    if (mounted) observer.observe(mounted);
-    return () => {
-      if (mounted) observer.unobserve(mounted);
-    };
-  }, [mounted, untilId]);
+import UserPage from "./_answers";
+import Profile from "./_profile";
 
+export default function ProfilePage() {
   return (
-    <div className="w-[90%] window:w-[80%] desktop:w-[70%]">
-      {userProfile === null ? (
-        <div className="w-full flex flex-col justify-center items-center glass text-4xl rounded-box shadow p-2">
-          <FaUserSlash />
-          <span>그런 사용자는 없어요!</span>
-        </div>
-      ) : (
-        <div className="w-full flex flex-col desktop:flex-row">
-          <div className="w-full h-fit desktop:sticky top-2 desktop:w-[50%] flex flex-col">
-            <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
-              <div className="flex flex-col items-center gap-2 py-2">
-                {userProfile && userProfile.avatarUrl ? (
-                  <div className="flex w-full h-24">
-                    <Link
-                      href={`https://${userProfile.hostname}/${userProfile.handle}`}
-                    >
-                      <img
-                        src={userProfile.avatarUrl}
-                        alt="User Avatar"
-                        className={`w-24 h-24 object-cover absolute left-[calc(50%-3rem)] rounded-full`}
-                      />
-                    </Link>
-                    {userProfile.stopAnonQuestion && (
-                      <div className="chat chat-start w-32 window:w-full desktop:w-full relative left-[68%] window:left-[60%] deskstop:left-[57%]">
-                        <div className="chat-bubble text-sm flex items-center bg-base-100 text-slate-700">
-                          작성자 공개 질문만 받아요!
-                        </div>
-                      </div>
-                    )}
-                  </div>
-                ) : (
-                  <div className="skeleton h-24 w-24 rounded-full" />
-                )}
-                <div className="flex items-center text-xl">
-                  {userProfile?.stopNewQuestion ? (
-                    <div className="flex flex-col items-center desktop:flex-row">
-                      <NameComponents
-                        username={userProfile.name}
-                        width={32}
-                        height={32}
-                      />
-                      <span>님은 지금 질문을 받지 않고 있어요...</span>
-                    </div>
-                  ) : (
-                    <div className="flex flex-col items-center desktop:flex-row window:flex-row window:text-2xl">
-                      <NameComponents
-                        username={userProfile?.name}
-                        width={32}
-                        height={32}
-                      />
-                      <span>
-                        님의{" "}
-                        {josa(userProfile?.questionBoxName, "이에요!", "예요!")}
-                      </span>
-                    </div>
-                  )}
-                </div>
-              </div>
-              <form
-                className="w-full flex flex-col items-center"
-                onSubmit={handleSubmit(onSubmit)}
-              >
-                <textarea
-                  {...register("question", {
-                    required: "required",
-                  })}
-                  placeholder="질문 내용을 입력해 주세요"
-                  className={`w-[90%] my-2 font-thin leading-loose textarea ${
-                    errors.question ? "textarea-error" : "textarea-bordered"
-                  }`}
-                  onKeyDown={onCtrlEnter}
-                  disabled={
-                    userProfile?.stopNewQuestion === true ? true : false
-                  }
-                />
-                {errors.questioner &&
-                  errors.questioner.type === "stopAnonQuestion" && (
-                    <div
-                      className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
-                      data-tip={errors.questioner.message}
-                    />
-                  )}
-                {errors.questioner &&
-                  errors.questioner.type === "notLoggedIn" && (
-                    <div
-                      className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
-                      data-tip={errors.questioner.message}
-                    />
-                  )}
-                {errors.question &&
-                  errors.question.type === "questionOnlyWhiteSpace" && (
-                    <div
-                      className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
-                      data-tip={errors.question.message}
-                    />
-                  )}
-                <div className="w-[90%] flex justify-between">
-                  <div className="flex gap-2 items-center">
-                    <input
-                      type="checkbox"
-                      className="toggle toggle-accent"
-                      onClick={() => setValue("questioner", !questioner)}
-                    />
-                    <input type="hidden" {...register("questioner")} />
-                    <span>작성자 공개</span>
-                  </div>
-                  <button type="submit" className="btn btn-primary">
-                    질문하기
-                  </button>
-                </div>
-              </form>
-            </div>
-            {localHandle === profileHandle && (
-              <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
-                <a className="link" href={shareUrl()} target="_blank">
-                  Misskey에 질문상자 페이지를 공유
-                </a>
-              </div>
-            )}
-          </div>
-          <div className="desktop:ml-2 desktop:w-[50%]">
-            {answers !== null ? (
-              <div>
-                <div className="flex items-center gap-2 my-2 text-2xl">
-                  <span>답변</span>
-                  <span className="badge badge-ghost">{count}</span>
-                </div>
-                {answers.length > 0 ? (
-                  <div className="flex flex-col">
-                    {answers.map((el) => (
-                      <div key={el.id}>
-                        <Answer
-                          value={el}
-                          id={el.id}
-                          idState={setId}
-                          ref={answerDeleteModalRef}
-                        />
-                      </div>
-                    ))}
-                    <div
-                      className="w-full h-16 flex justify-center items-center"
-                      ref={(ref) => setMounted(ref)}
-                    >
-                      {loading ? (
-                        <div>
-                          <span className="loading loading-spinner loading-lg" />
-                        </div>
-                      ) : (
-                        <div>
-                          <span className="text-3xl">🥂 끝이야 한 잔 해</span>
-                        </div>
-                      )}
-                    </div>
-                  </div>
-                ) : (
-                  <div className="text-2xl flex gap-2 justify-center items-center border shadow rounded-box p-2 glass">
-                    <span>🍺 질문함이 맥주있어요...</span>
-                  </div>
-                )}
-              </div>
-            ) : (
-              <div className="w-full flex justify-center">
-                <span className="loading loading-spinner loading-lg" />
-              </div>
-            )}
-          </div>
-        </div>
-      )}
-      <DialogModalOneButton
-        title={"성공!"}
-        body={"질문했어요!"}
-        buttonText={"닫기"}
-        ref={questionSuccessModalRef}
-      />
-      <DialogModalTwoButton
-        title={"답변 지우기"}
-        body={"답변을 지울까요...?"}
-        confirmButtonText={"확인"}
-        cancelButtonText={"취소"}
-        ref={answerDeleteModalRef}
-        onClick={() => handleDeleteAnswer(id)}
-      />
+    <div className="w-[90%] window:w-[80%] desktop:w-[70%] grid grid-cols-1 desktop:grid-cols-2 gap-4">
+      <Profile />
+      <UserPage />
     </div>
   );
 }

From 7fbcd7a7e2e4354cf87708bc84c815b28a467c06 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 00:13:16 +0900
Subject: [PATCH 70/89] =?UTF-8?q?Logger=20=ED=81=B4=EB=9E=98=EC=8A=A4=20?=
 =?UTF-8?q?=EC=A0=95=EC=9D=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 백앤드 코드들 Logger사용하도록 수정
---
 src/app/_dto/web/login/login.dto.ts           |  3 --
 src/app/api/db/create-question/route.ts       |  8 ++--
 src/app/api/db/delete-answer/route.ts         |  6 ++-
 src/app/api/db/fetch-all-answers/route.ts     |  2 +-
 .../api/db/fetch-profile/[handle]/route.ts    |  4 +-
 src/app/api/db/fetch-user-answers/route.ts    |  4 +-
 src/app/api/functions/web/detectInstance.ts   |  7 +++-
 src/app/api/functions/web/fetchUsername.ts    |  4 +-
 .../api/web/fetch-name-with-emoji/route.ts    |  8 ++--
 src/app/api/web/mastodon-login/route.ts       |  7 ++--
 src/app/api/web/misskey-login/route.ts        | 10 +++--
 src/app/main/questions/action.ts              | 12 ++++--
 src/app/main/settings/action.ts               | 37 ++++++++-----------
 src/app/mastodon-callback/action.ts           |  9 +++--
 src/app/misskey-callback/actions.ts           | 10 +++--
 src/app/page.tsx                              |  1 +
 src/utils/logger/Logger.ts                    | 29 +++++++++++++++
 src/utils/validator/strictValidator.ts        |  6 ++-
 18 files changed, 107 insertions(+), 60 deletions(-)
 create mode 100644 src/utils/logger/Logger.ts

diff --git a/src/app/_dto/web/login/login.dto.ts b/src/app/_dto/web/login/login.dto.ts
index b38e4cb..9d7d9a1 100644
--- a/src/app/_dto/web/login/login.dto.ts
+++ b/src/app/_dto/web/login/login.dto.ts
@@ -9,9 +9,6 @@ export class loginReqDto {
       const re = /\/\/[^/@\s]+(:[0-9]{1,5})?\/?/;
       const matched_str = v.match(re)?.[0];
       if (matched_str) {
-        console.log(
-          `URL ${param.value} replaced with ${matched_str.replaceAll("/", "")}`
-        );
         return matched_str.replaceAll("/", "");
       }
       return v;
diff --git a/src/app/api/db/create-question/route.ts b/src/app/api/db/create-question/route.ts
index 6976989..eb2a477 100644
--- a/src/app/api/db/create-question/route.ts
+++ b/src/app/api/db/create-question/route.ts
@@ -5,6 +5,8 @@ import { verifyToken } from "../../functions/web/verify-jwt";
 import { validateStrict } from "@/utils/validator/strictValidator";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
+const logger = new Logger('create-question');
 
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
@@ -48,7 +50,7 @@ export async function POST(req: NextRequest) {
           throw new Error(`Token and questioner not match`);
         }
       } catch (err) {
-        console.log(`questioner verify ERROR! ${err}`);
+        logger.log(`questioner verify ERROR! ${err}`);
         return sendErrorResponse(403, `${err}`);
       }
     }
@@ -91,7 +93,7 @@ async function sendNotify(
   url: string
 ): Promise<void> {
   const notify_host = process.env.NOTI_HOST;
-  console.log(`try to send notification to ${questionee.handle}`);
+  logger.log(`try to send notification to ${questionee.handle}`);
   try {
     const res = await fetch(`https://${notify_host}/api/notes/create`, {
       method: "POST",
@@ -109,6 +111,6 @@ async function sendNotify(
       throw new Error(`Note create error`);
     }
   } catch (error) {
-    console.error("Post-question: fail to send notify: ", error);
+    logger.error("Post-question: fail to send notify: ", error);
   }
 }
diff --git a/src/app/api/db/delete-answer/route.ts b/src/app/api/db/delete-answer/route.ts
index 1e59138..fd15e9c 100644
--- a/src/app/api/db/delete-answer/route.ts
+++ b/src/app/api/db/delete-answer/route.ts
@@ -5,7 +5,9 @@ import { cookies } from "next/headers";
 import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
 
+const logger = new Logger('delete-answer');
 export async function POST(req: NextRequest) {
   const body = await req.json();
   let data: DeleteAnswerDto;
@@ -36,7 +38,7 @@ export async function POST(req: NextRequest) {
     return sendApiError(403, "This is Not Your Answer!");
   }
   try {
-    console.log(`Delete answer... : ${data.id}`);
+    logger.log(`Delete answer... : ${data.id}`);
     await prisma.answer.delete({ where: { id: data.id } });
 
     return NextResponse.json(
@@ -44,7 +46,7 @@ export async function POST(req: NextRequest) {
       { status: 200 }
     );
   } catch (err) {
-    console.log('Error: Delete answer:', err);
+    logger.error('Error: Delete answer:', err);
     return sendApiError(500, `Error ${JSON.stringify(err)}`);
   }
 }
diff --git a/src/app/api/db/fetch-all-answers/route.ts b/src/app/api/db/fetch-all-answers/route.ts
index 749f419..e06d5f7 100644
--- a/src/app/api/db/fetch-all-answers/route.ts
+++ b/src/app/api/db/fetch-all-answers/route.ts
@@ -15,7 +15,7 @@ export async function POST(req: NextRequest) {
   const ipHash = getIpHash(ip);
   const limited = await limiter.limit(`fetch-all-answers-${ipHash}`, {
     bucket_time: 600,
-    req_limit: 300,
+    req_limit: 600,
   });
   if (limited) {
     return sendApiError(429, '요청 제한에 도달했습니다!');
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index d11265e..c27e02c 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -4,8 +4,10 @@ import {
 } from "@/app/_dto/fetch-profile/Profile.dto";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
 import { NextRequest, NextResponse } from "next/server";
 
+const logger = new Logger('fetch-profile/handle')
 export async function GET(
   req: NextRequest,
   { params }: { params: Promise<{ handle?: string }> }
@@ -63,7 +65,7 @@ export async function GET(
       },
     });
   } catch (err) {
-    console.log(err);
+    logger.error(err);
     return sendApiError(500, "Error");
   }
 }
diff --git a/src/app/api/db/fetch-user-answers/route.ts b/src/app/api/db/fetch-user-answers/route.ts
index 04a9b3c..f8badc6 100644
--- a/src/app/api/db/fetch-user-answers/route.ts
+++ b/src/app/api/db/fetch-user-answers/route.ts
@@ -3,7 +3,9 @@ import { validateStrict } from "@/utils/validator/strictValidator";
 import { NextRequest, NextResponse } from "next/server";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
 
+const logger = new Logger('fetch-user-profile');
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
   try {
@@ -62,6 +64,6 @@ export async function POST(req: NextRequest) {
       count: answerCount[0]._count.answer,
     });
   } catch (err) {
-    console.log(err);
+    logger.log(err);
   }
 }
diff --git a/src/app/api/functions/web/detectInstance.ts b/src/app/api/functions/web/detectInstance.ts
index 21db32f..b367dcf 100644
--- a/src/app/api/functions/web/detectInstance.ts
+++ b/src/app/api/functions/web/detectInstance.ts
@@ -1,3 +1,5 @@
+import { Logger } from "@/utils/logger/Logger";
+
 type nodeinfoMeta = {
   links: nodeinfoVersionList[];
 };
@@ -12,13 +14,14 @@ type nodeinfo = {
   software: { name: string; version: string };
 };
 
+const logger = new Logger('detectInstance');
 export default async function detectInstance(host: string) {
   const parsedUrl = new URL(`https://${host}`);
   const nodeInfoMeta: nodeinfoMeta = await fetch(
     `${parsedUrl.origin}/.well-known/nodeinfo`
   ).then((r) => {
     if (!r.ok) {
-      console.error('인스턴스 타입 감지 실패 ', r.status);
+      logger.error('인스턴스 타입 감지 실패 ', r.status);
       throw new Error('인스턴스 타입 감지 실패');
     }
     return r.json();
@@ -30,7 +33,7 @@ export default async function detectInstance(host: string) {
 
   const nodeInfo: nodeinfo = await fetch(`${nodeInfoLink?.href}`).then((r) => {
     if (!r.ok) {
-      console.error('인스턴스 타입 감지 실패 ', r.status);
+      logger.error('인스턴스 타입 감지 실패 ', r.status);
       throw new Error('인스턴스 타입 감지 실패');
     }
     return r.json();
diff --git a/src/app/api/functions/web/fetchUsername.ts b/src/app/api/functions/web/fetchUsername.ts
index 2b872c5..d81679c 100644
--- a/src/app/api/functions/web/fetchUsername.ts
+++ b/src/app/api/functions/web/fetchUsername.ts
@@ -1,12 +1,14 @@
 import { fetchNameWithEmojiReqDto, fetchNameWithEmojiResDto } from "@/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto";
+import { Logger } from "@/utils/logger/Logger";
 
+const logger = new Logger('fetchNameWithEmoji');
 export async function fetchNameWithEmoji(fetchUserNameReq: fetchNameWithEmojiReqDto) {
   const res = await fetch(`${process.env.WEB_URL}/api/web/fetch-name-with-emoji`, {
     method: "POST",
     body: JSON.stringify(fetchUserNameReq),
   });
   if (!res.ok) {
-    console.error(`fail to get username with emojis `, res.status, res.statusText);
+    logger.error(`fail to get username with emojis `, res.status, res.statusText);
     throw new Error('fail to get username with emojis');
   }
   const body: fetchNameWithEmojiResDto = await res.json();
diff --git a/src/app/api/web/fetch-name-with-emoji/route.ts b/src/app/api/web/fetch-name-with-emoji/route.ts
index 7d48e6d..5b5e151 100644
--- a/src/app/api/web/fetch-name-with-emoji/route.ts
+++ b/src/app/api/web/fetch-name-with-emoji/route.ts
@@ -3,7 +3,9 @@ import { validateStrict } from "@/utils/validator/strictValidator";
 import { NextRequest, NextResponse } from "next/server";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
 import detectInstance from "../../functions/web/detectInstance";
+import { Logger } from "@/utils/logger/Logger";
 
+const logger = new Logger('fetch-name-with-emoji');
 export async function POST(req: NextRequest) {
   let data;
   const body: fetchNameWithEmojiReqDto = await req.json();
@@ -77,7 +79,7 @@ export async function POST(req: NextRequest) {
 
         return NextResponse.json({ nameWithEmoji: nameArray });
       } catch (err) {
-        console.log(err);
+        logger.error(err);
         return NextResponse.json(
           { error: "Internal Server Error" },
           { status: 500 }
@@ -113,7 +115,7 @@ export async function POST(req: NextRequest) {
 
         return NextResponse.json({ nameWithEmoji: nameArray });
       } catch (err) {
-        console.log(err);
+        logger.error(err);
         return NextResponse.json(
           { error: "Internal Server Error" },
           { status: 500 }
@@ -121,7 +123,7 @@ export async function POST(req: NextRequest) {
       }
 
     default:
-      console.log("there is no matching instance type");
+      logger.warn("there is no matching instance type");
 
       break;
   }
diff --git a/src/app/api/web/mastodon-login/route.ts b/src/app/api/web/mastodon-login/route.ts
index d05806d..c029daf 100644
--- a/src/app/api/web/mastodon-login/route.ts
+++ b/src/app/api/web/mastodon-login/route.ts
@@ -4,8 +4,9 @@ import { NextRequest, NextResponse } from "next/server";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
 import { v4 as uuid } from "uuid";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
 
-
+const logger = new Logger('mastodon-login');
 export async function POST(req: NextRequest) {
   let data: loginReqDto;
   const body = await req.json();
@@ -45,7 +46,7 @@ export async function POST(req: NextRequest) {
       if (!res.id) {
         return sendErrorResponse(500, `Mastodon Response: ${JSON.stringify(res)}`);
       }
-      console.log('New Mastodon OAuth2 App Created:', res);
+      logger.log('New Mastodon OAuth2 App Created:', res);
 
       await prisma.server.upsert({
         where: {
@@ -104,6 +105,6 @@ async function initiateMastodonAuthSession(
   const url = `https://${hostname}/oauth/authorize?${Object.entries(params)
     .map((v) => v.join("="))
     .join("&")}`;
-  console.log('Created New Mastodon OAuth2 authorize URL:', url);
+  logger.log('Created New Mastodon OAuth2 authorize URL:', url);
   return url;
 }
diff --git a/src/app/api/web/misskey-login/route.ts b/src/app/api/web/misskey-login/route.ts
index 082ff97..8f203f6 100644
--- a/src/app/api/web/misskey-login/route.ts
+++ b/src/app/api/web/misskey-login/route.ts
@@ -5,7 +5,9 @@ import { sendErrorResponse } from "../../functions/web/errorResponse";
 import { MiApiError, MiAuthSession } from "@/app";
 import detectInstance from "../../functions/web/detectInstance";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
 
+const logger = new Logger('misskey-login');
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
   let data: loginReqDto;
@@ -50,7 +52,7 @@ export async function POST(req: NextRequest) {
       }
       const data = await res.json();
       const appSecret = data.secret;
-      console.log("New Misskey APP created!", data);
+      logger.log("New Misskey APP created!", data);
       const detectedInstanceType = await detectInstance(misskeyHost) === 'cherrypick' ? 'cherrypick' : 'misskey';
       await prisma.server.upsert({
         where: {
@@ -74,7 +76,7 @@ export async function POST(req: NextRequest) {
         );
       }
       const misskeyAuthSession = (await authRes.json()) as MiAuthSession;
-      console.log(`New Misskey Auth Session Created: `, misskeyAuthSession);
+      logger.log(`New Misskey Auth Session Created: `, misskeyAuthSession);
       return NextResponse.json(misskeyAuthSession);
     }
     // 앱 시크릿 존재하는 경우
@@ -87,7 +89,7 @@ export async function POST(req: NextRequest) {
         const data = (await res.json()) as MiApiError;
         if (data.error.code === "NO_SUCH_APP") {
           // 어라라...? 앱 스크릿 무효화
-          console.log(
+          logger.warn(
             `Misskey response NO_SUCH_APP, delete invalid appSecret from DB`
           );
           await prisma.server.update({
@@ -98,7 +100,7 @@ export async function POST(req: NextRequest) {
         return sendErrorResponse(500, `Fail to Create Misskey Auth Session`);
       }
       const misskeyAuthSession = (await res.json()) as MiAuthSession;
-      console.log(`New Misskey Auth Session Created: `, misskeyAuthSession);
+      logger.log(`New Misskey Auth Session Created: `, misskeyAuthSession);
       return NextResponse.json(misskeyAuthSession);
     }
   } catch (err) {
diff --git a/src/app/main/questions/action.ts b/src/app/main/questions/action.ts
index 1e50c64..899ff25 100644
--- a/src/app/main/questions/action.ts
+++ b/src/app/main/questions/action.ts
@@ -4,6 +4,7 @@ import type { mastodonTootAnswers, MkNoteAnswers, typedAnswer } from "@/app";
 import { verifyToken } from "@/app/api/functions/web/verify-jwt";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
 import { question } from "@prisma/client";
 import { createHash } from "crypto";
 import { cookies } from "next/headers";
@@ -24,6 +25,7 @@ export async function postAnswer(
   questionId: question["id"] | null,
   answer: typedAnswer
 ) {
+  const postLogger = new Logger('postAnswer');
   const prisma = GetPrismaClient.getClient();
   const cookieStore = await cookies();
   const jwtToken = cookieStore.get('jwtToken')?.value;
@@ -76,7 +78,7 @@ export async function postAnswer(
 
     const baseUrl = process.env.WEB_URL;
     const answerUrl = `${baseUrl}/main/user/${answeredUser.handle}/${postWithAnswer.id}`;
-    console.log("Created new answer:", answerUrl);
+    postLogger.log("Created new answer:", answerUrl);
     //답변 올리는 부분
     const userSettings = await prisma.profile.findUniqueOrThrow({
       where: {
@@ -153,7 +155,7 @@ export async function postAnswer(
           }
         }
       } else {
-        console.log("user not found");
+        postLogger.error("user not found");
       }
     }
   }
@@ -166,6 +168,7 @@ async function mkMisskeyNote(
   hostname: string,
   visibility: "public" | "home" | "followers"
 ) {
+  const NoteLogger = new Logger('mkMisskeyNote');
   // 미스키 CW길이제한 처리
   if (title.length > 100) {
     title = title.substring(0, 90) + '.....'
@@ -185,7 +188,7 @@ async function mkMisskeyNote(
     body: JSON.stringify(newAnswerNote),
   });
   if (!res.ok) {
-    console.warn(`Note create fail! `, res.status, res.statusText);
+    NoteLogger.warn(`Note create fail! `, res.status, res.statusText);
   }
 }
 
@@ -196,6 +199,7 @@ async function mastodonToot(
   hostname: string,
   visibility: "public" | "home" | "followers"
 ) {
+  const tootLogger = new Logger('mastodonToot');
   let newVisibility: "public" | "unlisted" | "private";
   switch (visibility) {
     case "public":
@@ -230,7 +234,7 @@ async function mastodonToot(
       throw new Error(`HTTP Error! status:${res.status}`);
     }
   } catch (err) {
-    console.warn(`Toot Create Fail!`, err);
+    tootLogger.warn(`Toot Create Fail!`, err);
   }
 }
 
diff --git a/src/app/main/settings/action.ts b/src/app/main/settings/action.ts
index cf42069..49a9468 100644
--- a/src/app/main/settings/action.ts
+++ b/src/app/main/settings/action.ts
@@ -4,38 +4,31 @@ import { jwtVerify, JWTVerifyResult } from "jose";
 import { cookies } from "next/headers";
 import { FormValue } from "./page";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
+import { verifyToken } from "@/app/api/functions/web/verify-jwt";
 
 export async function fetchUser() {
+  const logger = new Logger('fetchUser');
   const prisma = GetPrismaClient.getClient();
-  const secret = new TextEncoder().encode(process.env.JWT_SECRET);
   const cookieStore = await cookies();
-  const jwtToken = cookieStore.get("jwtToken");
-  
+  const jwtToken = cookieStore.get("jwtToken")?.value;
 
   try {
-    if (jwtToken) {
-      const { payload } = (await jwtVerify(jwtToken.value, secret, {
-        issuer: `${process.env.WEB_URL}`,
-        audience: "urn:example:audience",
-      })) as JWTVerifyResult<{ handle: string; server: string }>;
-
-      const user = await prisma.profile.findUnique({
-        where: {
-          handle: payload.handle,
-        },
-      });
-
-      return user;
-    } else {
-      throw new Error("jwtToken parsing error");
-    }
+    const payload = await verifyToken(jwtToken);
+    const user = await prisma.profile.findUnique({
+      where: {
+        handle: payload.handle,
+      },
+    });
+    return user;
   } catch (err) {
-    console.log(err);
+    logger.error(err);
   }
 }
 
 export async function updateSetting(handle: string, payload: FormValue) {
   const prisma = GetPrismaClient.getClient();
+  const logger = new Logger('updateSetting');
 
   try {
     const updateUser = prisma.profile
@@ -53,8 +46,8 @@ export async function updateSetting(handle: string, payload: FormValue) {
           }`,
         },
       })
-      .catch((err) => console.log(err));
+      .catch((err) => logger.log(err));
   } catch (err) {
-    console.log(err);
+    logger.log(err);
   }
 }
diff --git a/src/app/mastodon-callback/action.ts b/src/app/mastodon-callback/action.ts
index 676ca51..1da9c6d 100644
--- a/src/app/mastodon-callback/action.ts
+++ b/src/app/mastodon-callback/action.ts
@@ -7,8 +7,9 @@ import { DBpayload } from "../misskey-callback/page";
 import { cookies } from "next/headers";
 import { SignJWT } from "jose";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
 
-
+const logger = new Logger('Mastodon-callback');
 export async function login(
   loginReqestData: mastodonCallbackTokenClaimPayload
 ) {
@@ -67,7 +68,7 @@ export async function login(
     try {
       await pushDB(dbPayload);
     } catch (err) {
-      console.error("Fail to push user to DB", err);
+      logger.error("Fail to push user to DB", err);
       throw err;
     }
 
@@ -75,7 +76,7 @@ export async function login(
       //프론트 쿠키스토어에 쿠키 저장
       const cookieStore = await cookies();
       const jwtToken = await generateJwt(loginReq.mastodonHost, user_handle);
-      console.log(`Send JWT to Frontend... ${jwtToken}`);
+      logger.log(`Send JWT to Frontend... ${jwtToken}`);
       cookieStore.set("jwtToken", jwtToken, {
         expires: Date.now() + 1000 * 60 * 60 * 6,
         httpOnly: true,
@@ -85,7 +86,7 @@ export async function login(
         httpOnly: true,
       });
     } catch (err) {
-      console.error("Make JWT or Set cookie Failed! ", err);
+      logger.error("Make JWT or Set cookie Failed! ", err);
       throw err;
     }
 
diff --git a/src/app/misskey-callback/actions.ts b/src/app/misskey-callback/actions.ts
index 7c895f4..1cd3f63 100644
--- a/src/app/misskey-callback/actions.ts
+++ b/src/app/misskey-callback/actions.ts
@@ -10,7 +10,9 @@ import { validateStrict } from "@/utils/validator/strictValidator";
 import { misskeyCallbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
 import { misskeyUserInfoPayload } from "../_dto/misskey-callback/user-info.dto";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { Logger } from "@/utils/logger/Logger";
 
+const logger = new Logger('misskey-callback');
 export async function login(
   loginReqestData: misskeyCallbackTokenClaimPayload
 ): Promise<misskeyUserInfoPayload> {
@@ -64,7 +66,7 @@ export async function login(
   try {
     await pushDB(dbPayload);
   } catch (err) {
-    console.error(`Fail to push user to DB`, err);
+    logger.error(`Fail to push user to DB`, err);
     throw err;
   }
 
@@ -72,7 +74,7 @@ export async function login(
     // 프론트 쿠키스토어에 쿠키 저장
     const cookieStore = await cookies();
     const jwtToken = await generateJwt(loginReq.misskeyHost, user_handle);
-    console.log(`Send JWT to Frontend... ${jwtToken}`);
+    logger.log(`Send JWT to Frontend... ${jwtToken}`);
     cookieStore.set("jwtToken", jwtToken, {
       expires: Date.now() + 1000 * 60 * 60 * 6,
       httpOnly: true,
@@ -82,7 +84,7 @@ export async function login(
       httpOnly: true,
     });
   } catch (err) {
-    console.error(`Make JWT or Set cookie failed!`, err);
+    logger.error(`Make JWT or Set cookie failed!`, err);
     throw err;
   }
 
@@ -127,7 +129,7 @@ async function requestMiAccessTokenAndUserInfo(
       const resBody = await res.json();
       return resBody;
     } else {
-      console.error(
+      logger.error(
         `Fail to get Misskey Access token`,
         res.status,
         res.statusText
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 80b4c4e..c5ca992 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -109,6 +109,7 @@ export default function Home() {
           });
           break;
         default:
+          window.alert('인스턴스 타입 감지에 실패했어요!');
           console.log("아무것도 없는뎁쇼?");
       }
     });
diff --git a/src/utils/logger/Logger.ts b/src/utils/logger/Logger.ts
new file mode 100644
index 0000000..fcbba6d
--- /dev/null
+++ b/src/utils/logger/Logger.ts
@@ -0,0 +1,29 @@
+export class Logger {
+  private name: string;
+  constructor (name: string) {
+    this.name = name;
+  } 
+
+  public debug(...args: any[]) {
+    if (process.env.NODE_ENV === 'production') {
+      return;
+    }
+    const time = Math.floor(Date.now()/1000);
+    console.log(`\x1b[36m [${time}] [${this.name}] DEBUG: \x1b[0m`, ...args);
+  }
+
+  public log(...args: any[]) {
+    const time = Math.floor(Date.now()/1000);
+    console.log(`\x1b[32m [${time}] [${this.name}] INFO: \x1b[0m`, ...args);
+  }
+
+  public warn(...args: any[]) {
+    const time = Math.floor(Date.now()/1000);
+    console.log(`\x1b[33m [${time}] [${this.name}] WARN: \x1b[0m`, ...args);
+  }
+
+  public error(...args: any[]) {
+    const time = Math.floor(Date.now()/1000);
+    console.log(`\x1b[31m [${time}] [${this.name}] ERROR: \x1b[0m`, ...args);
+  }
+}
\ No newline at end of file
diff --git a/src/utils/validator/strictValidator.ts b/src/utils/validator/strictValidator.ts
index 9bec377..3b13096 100644
--- a/src/utils/validator/strictValidator.ts
+++ b/src/utils/validator/strictValidator.ts
@@ -1,15 +1,17 @@
 import { ClassConstructor, plainToInstance } from "class-transformer";
 import { validate } from "class-validator";
+import { Logger } from "../logger/Logger";
 
+const logger = new Logger('validator');
 export async function validateStrict<T extends object>(cls: ClassConstructor<T>, data: unknown): Promise<T> {
     if (typeof data !== 'object') {
-        console.error('data is not object!');
+        logger.error('data is not object!');
         throw new Error(`data is not object!`);
     }
     const instance = plainToInstance(cls, data);
     const errors = await validate(instance, { whitelist: true, forbidNonWhitelisted: true });
     if (errors.length > 0) {
-        console.error(errors);
+        logger.error(errors);
         throw errors;
     }
     return instance;

From 7fd2174157314d60daa893f9d3cd222260366d95 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 00:14:03 +0900
Subject: [PATCH 71/89] =?UTF-8?q?RateLimiter=20=EB=B2=84=EA=B7=B8=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/ratelimiter/rateLimiter.ts | 58 +++++++++++++++++++---------
 1 file changed, 40 insertions(+), 18 deletions(-)

diff --git a/src/utils/ratelimiter/rateLimiter.ts b/src/utils/ratelimiter/rateLimiter.ts
index 6840f76..861e843 100644
--- a/src/utils/ratelimiter/rateLimiter.ts
+++ b/src/utils/ratelimiter/rateLimiter.ts
@@ -1,13 +1,16 @@
-import { Redis } from 'ioredis';
+import { Redis } from "ioredis";
+import { Logger } from "../logger/Logger";
 
 export class RateLimiterService {
   private redis: Redis;
   private static instance: RateLimiterService;
+  private logger: Logger;
   private constructor() {
+    this.logger = new Logger('RateLimiterService');
     const host = process.env.REDIS_HOST;
     const port_str = process.env.REDIS_PORT;
-    if (typeof host !== 'string' || typeof port_str !== 'string') {
-      throw new Error('Redis host or port not provided!');
+    if (typeof host !== "string" || typeof port_str !== "string") {
+      throw new Error("Redis host or port not provided!");
     }
     const port = Number.parseInt(port_str);
     this.redis = new Redis({
@@ -30,38 +33,57 @@ export class RateLimiterService {
    * @param option bucket_time: 초 단위 버킷 시간, req_limit: 리밋 숫자
    * @returns boolean (true: 리밋에 도달함, false: 리밋에 도달하지 않음)
    */
-  public async limit(key: string, option: {bucket_time: number, req_limit: number}) {
+  public async limit(
+    key: string,
+    option: { bucket_time: number; req_limit: number }
+  ) {
     const now = Date.now() / 1000;
-    const {bucket_time, req_limit} = option;
-    const result = await this.redis.multi()
+    const { bucket_time, req_limit } = option;
+    const result = await this.redis
+      .multi()
       .setnx(`lastreset-${key}`, now)
       .incr(key)
-      .getex(`lastreset-${key}`, 'EX', bucket_time)
+      .getex(`lastreset-${key}`, "EX", bucket_time)
       .expire(key, bucket_time)
       .exec();
 
     let req_count = result?.[1][1] as number;
     const lastRefilled_str = result?.[2][1] as string;
-    if (typeof req_count !== 'number' || typeof lastRefilled_str !== 'string') {
+    if (typeof req_count !== "number" || typeof lastRefilled_str !== "string") {
       return true;
     }
-    const last_refilled = Number.parseInt(lastRefilled_str);
+    const lastReset = Number.parseInt(lastRefilled_str);
 
-    console.debug(`requestConter`, req_count, '/', req_limit, `bucket-size: ${bucket_time}sec, lastReset: ${last_refilled}`);
-    if (now - last_refilled > (bucket_time / req_limit)) {
-      const refill_tokens = Math.min(Math.ceil((now - last_refilled) * (req_limit / bucket_time)), req_limit);
-      const newCounter = Math.min(req_limit, req_count) - refill_tokens;
-      console.debug(`토큰 리필:`, refill_tokens);
-      await this.redis.multi()
+    if (Math.floor((now - lastReset) * (req_limit / bucket_time)) >= 1) {
+      // 리필 토큰수 계산: 마지막 리필이후 지난 초 * 초당 리밋  을 내림한 것
+      const refill_tokens = Math.floor(
+        (now - lastReset) * (req_limit / bucket_time)
+      );
+
+      // 새로운 카운터 값: '현재 카운터와 최대 리퀘스트값 중에 작은것' 에서 리필 토큰수를 뺀 후, 0보다 작으면 0으로 처리
+      // '현재 카운터와 최대 리퀘스트값 중에 작은것' 의 이유: 카운터는 리밋에 걸린 이후에도 계속 요청마다 증가하지만, 거부된 요청은 리밋으로 카운트하지 않고 싶음.
+      // 0보다 작은경우 0으로 처리하는 이유: 0이 토큰 버킷에서 토큰이 꽉 차있는 상태를 의미하기 때문에, 0보다 작아지면 안됨.
+      const newCounter = Math.max(Math.min(req_count, req_limit) - refill_tokens, 0);
+      this.logger.debug(`토큰 리필:`, req_count - newCounter);
+      req_count = newCounter;
+
+      await this.redis
+        .multi()
         .setex(`lastreset-${key}`, bucket_time, now)
         .setex(key, bucket_time, newCounter)
-        .exec()
-      req_count = newCounter;
+        .exec();
     }
 
+    this.logger.debug(
+      `requestConter`,
+      req_count,
+      "/",
+      req_limit,
+      `bucket-size: ${bucket_time}sec, lastReset: ${lastReset}`
+    );
     if (req_count >= req_limit) {
       return true;
     }
     return false;
   }
-}
\ No newline at end of file
+}

From a46be83df692caa23aaf951f3dbdb33c46bae63d Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 00:14:12 +0900
Subject: [PATCH 72/89] =?UTF-8?q?=F0=9F=90=9B=20=EB=8B=B5=EB=B3=80?=
 =?UTF-8?q?=EC=97=90=20=EC=9E=90=EB=A5=B4=EA=B8=B0=20=EC=95=A0=EB=A7=A4?=
 =?UTF-8?q?=ED=95=9C=20=EB=A7=81=ED=81=AC=EA=B0=99=EC=9D=80=EA=B1=B0=20?=
 =?UTF-8?q?=EC=A4=84=EB=B0=94=EA=BF=88=20=ED=95=B4=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 8fc723f..0fd9257 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -105,7 +105,7 @@ export default function Answer({ value, idState, ref }: askProps) {
               />
             </Link>
           </div>
-          <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble chat-bubble-success text-slate-800">
+          <div className="flex items-center text-sm break-all window:text-xl desktop:text-2xl chat-bubble chat-bubble-success text-slate-800">
             <Link href={`/main/user/${value.answeredPersonHandle}`}>
               {value.answer}
             </Link>

From e56eee5de121bb1cb00b484072e4fe30e7405c2b Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 00:22:40 +0900
Subject: [PATCH 73/89] =?UTF-8?q?=F0=9F=92=84=20=EB=8B=A4=ED=81=AC?=
 =?UTF-8?q?=EB=AA=A8=EB=93=9C=20=EA=B0=80=EB=8F=85=EC=84=B1=20=EA=B0=9C?=
 =?UTF-8?q?=EC=84=A0(=EB=98=90)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx   | 4 ++--
 src/app/_components/question.tsx | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 0fd9257..e8b648f 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -105,12 +105,12 @@ export default function Answer({ value, idState, ref }: askProps) {
               />
             </Link>
           </div>
-          <div className="flex items-center text-sm break-all window:text-xl desktop:text-2xl chat-bubble chat-bubble-success text-slate-800">
+          <div className="flex items-center text-sm break-all window:text-xl desktop:text-2xl chat-bubble bg-green-600 text-slate-300 dark:text-slate-200">
             <Link href={`/main/user/${value.answeredPersonHandle}`}>
               {value.answer}
             </Link>
           </div>
-          <div className="chat-footer font-thin text-xs mt-2 underline text-blue-900">
+          <div className="chat-footer font-thin text-xs mt-2 underline text-blue-900 dark:text-blue-400">
             <Link href={`/main/user/${value.answeredPersonHandle}/${value.id}`}>
               {value.answeredAt.toLocaleString()}
             </Link>
diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 9a04164..129da91 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -119,7 +119,7 @@ export default function Question({
         </div>
       </div>
       <div className="text-2xl chat chat-end">
-        <div className="chat-bubble chat-bubble-success text-slate-800">
+        <div className="chat-bubble bg-green-600 text-slate-300 dark:text-slate-200">
           <form
             onSubmit={handleSubmit(onSubmit)}
             className="flex flex-col gap-2 py-2"
@@ -164,7 +164,7 @@ export default function Question({
               <div className="w-full desktop:w-fit flex justify-center">
                 <button
                   type={"submit"}
-                  className="btn btn-outline btn-sm h-10 w-16 desktop:btn-md"
+                  className="btn btn-outline dark:border-white dark:text-slate-200 btn-sm h-10 w-16 desktop:btn-md"
                 >
                   답변
                 </button>

From 8bc9246bc97722672448da809da439f3edc1be7c Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 00:58:11 +0900
Subject: [PATCH 74/89] =?UTF-8?q?=F0=9F=92=84=20=EA=B7=B8=EB=9F=B0=20?=
 =?UTF-8?q?=EC=82=AC=EC=9A=A9=EC=9E=90=EB=8A=94=20=EC=97=86=EC=96=B4?=
 =?UTF-8?q?=EC=9A=94!=20=EB=A1=9C=EC=A7=81=20=EC=9D=B4=EB=8F=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/user/[handle]/_answers.tsx |  8 +----
 src/app/main/user/[handle]/page.tsx     | 44 +++++++++++++++++++++++--
 2 files changed, 43 insertions(+), 9 deletions(-)

diff --git a/src/app/main/user/[handle]/_answers.tsx b/src/app/main/user/[handle]/_answers.tsx
index 4a53465..7937866 100644
--- a/src/app/main/user/[handle]/_answers.tsx
+++ b/src/app/main/user/[handle]/_answers.tsx
@@ -3,7 +3,6 @@
 import { useParams } from "next/navigation";
 import { useEffect, useRef, useState } from "react";
 import Answer from "@/app/_components/answer";
-import { FaUserSlash } from "react-icons/fa";
 import { userProfileWithHostnameDto } from "@/app/_dto/fetch-profile/Profile.dto";
 import { AnswerDto } from "@/app/_dto/Answers.dto";
 import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
@@ -122,12 +121,7 @@ export default function UserPage() {
 
   return (
     <div className="w-full flex flex-col desktop:flex-row">
-      {userProfile === null ? (
-        <div className="w-full flex flex-col justify-center items-center glass text-4xl rounded-box shadow p-2">
-          <FaUserSlash />
-          <span>그런 사용자는 없어요!</span>
-        </div>
-      ) : (
+      {userProfile !== null && (
         <div className="w-full flex flex-col desktop:flex-row">
           {answers !== null ? (
             <div className="w-full">
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 22aa9c7..178dc5a 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -1,13 +1,53 @@
 "use client";
 
+import { useEffect, useState } from "react";
 import UserPage from "./_answers";
 import Profile from "./_profile";
+import { useParams } from "next/navigation";
+import { userProfileWithHostnameDto } from "@/app/_dto/fetch-profile/Profile.dto";
+
+async function fetchProfile(handle: string) {
+  const profile = await fetch(`/api/db/fetch-profile/${handle}`);
+  if (profile && profile.ok) {
+    return profile.json() as unknown as userProfileWithHostnameDto;
+  } else {
+    return null;
+  }
+}
 
 export default function ProfilePage() {
+  const { handle } = useParams() as { handle: string };
+  const profileHandle = handle.toString().replace(/(?:%40)/g, "@");
+
+  const [userProfile, setUserProfile] =
+    useState<userProfileWithHostnameDto | null>();
+
+  useEffect(() => {
+    fetchProfile(profileHandle).then((r) => {
+      setUserProfile(r);
+    });
+  }, [profileHandle]);
   return (
     <div className="w-[90%] window:w-[80%] desktop:w-[70%] grid grid-cols-1 desktop:grid-cols-2 gap-4">
-      <Profile />
-      <UserPage />
+      {userProfile === null ? (
+        <div className="w-full col-span-2 flex flex-col justify-center items-center glass text-4xl rounded-box shadow p-2">
+          😶‍🌫️
+          <span>그런 사용자는 없어요!</span>
+        </div>
+      ) : (
+        <>
+          {userProfile === undefined ? (
+            <div className="w-full col-span-2 flex justify-center">
+              <span className="loading loading-spinner loading-lg" />
+            </div>
+          ) : (
+            <>
+              <Profile />
+              <UserPage />
+            </>
+          )}
+        </>
+      )}
     </div>
   );
 }

From 81a70d8fc3176c3958734a37be28f6bc7be5d68a Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 00:30:45 +0900
Subject: [PATCH 75/89] =?UTF-8?q?=EB=A6=B0=ED=84=B0,=20=ED=8F=AC=EB=A7=A4?=
 =?UTF-8?q?=ED=84=B0=20=EC=84=A4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .eslintrc.json                      |   7 -
 .prettierrc                         |   8 +
 eslint.config.mjs                   |  17 +++
 next.config.ts                      |   9 +-
 package-lock.json                   | 229 +++++++++++++++++++++-------
 package.json                        |  17 ++-
 src/app/main/user/[handle]/page.tsx |   2 +-
 src/utils/logger/Logger.ts          |  22 +--
 tsconfig.json                       |  22 +--
 9 files changed, 233 insertions(+), 100 deletions(-)
 delete mode 100644 .eslintrc.json
 create mode 100644 .prettierrc
 create mode 100644 eslint.config.mjs

diff --git a/.eslintrc.json b/.eslintrc.json
deleted file mode 100644
index 50efe77..0000000
--- a/.eslintrc.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
-  "extends": ["next/core-web-vitals", "next/typescript"],
-  "rules": {
-    "@typescript-eslint/no-unused-vars": "off",
-    "@next/next/no-img-element": "off"
-  }
-}
diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 0000000..128d686
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,8 @@
+
+{
+  "singleQuote": true,
+  "semi": true,
+  "useTabs": false,
+  "tabWidth": 2,
+  "printWidth": 120
+}
diff --git a/eslint.config.mjs b/eslint.config.mjs
new file mode 100644
index 0000000..f7d43cb
--- /dev/null
+++ b/eslint.config.mjs
@@ -0,0 +1,17 @@
+import globals from 'globals';
+import tseslint from 'typescript-eslint';
+import pluginReact from 'eslint-plugin-react';
+
+export default [
+  { files: ['./src/**/*.{js,mjs,cjs,ts,jsx,tsx}'] },
+  { languageOptions: { globals: { ...globals.browser, ...globals.node } } },
+  ...tseslint.configs.recommended,
+  pluginReact.configs.flat.recommended,
+  {
+    rules: {
+      'react/react-in-jsx-scope': 'off',
+      'no-unused-vars': 'off',
+      '@typescript-eslint/no-unused-vars': 'warn'
+    },
+  },
+];
diff --git a/next.config.ts b/next.config.ts
index fe0761f..78da825 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -1,8 +1,11 @@
-import type { NextConfig } from "next";
-import "reflect-metadata";
+import type { NextConfig } from 'next';
+import 'reflect-metadata';
 
 const nextConfig: NextConfig = {
-  output: "standalone",
+  output: 'standalone',
+  eslint: {
+    ignoreDuringBuilds: true,
+  },
   experimental: {
     forceSwcTransforms: true,
   },
diff --git a/package-lock.json b/package-lock.json
index 447beff..d68377b 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,14 +27,22 @@
         "uuid": "^11.0.2"
       },
       "devDependencies": {
+        "@eslint/js": "^9.15.0",
         "@types/node": "^20.17.6",
         "@types/react": "^18",
         "@types/react-dom": "^18",
-        "eslint": "^8",
+        "@typescript-eslint/eslint-plugin": "^8.15.0",
+        "@typescript-eslint/parser": "^8.15.0",
+        "eslint": "^8.57.1",
         "eslint-config-next": "15.0.1",
+        "eslint-config-prettier": "^9.1.0",
+        "eslint-plugin-react": "^7.37.2",
+        "globals": "^15.12.0",
         "postcss": "^8",
+        "prettier": "^3.3.3",
         "tailwindcss": "^3.4.1",
-        "typescript": "^5"
+        "typescript": "^5",
+        "typescript-eslint": "^8.15.0"
       }
     },
     "node_modules/@alloc/quick-lru": {
@@ -99,13 +107,28 @@
         "url": "https://opencollective.com/eslint"
       }
     },
+    "node_modules/@eslint/eslintrc/node_modules/globals": {
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
+      "dev": true,
+      "dependencies": {
+        "type-fest": "^0.20.2"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/@eslint/js": {
-      "version": "8.57.1",
-      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.1.tgz",
-      "integrity": "sha512-d9zaMRSTIKDLhctzH12MtXvJKSSUhaHcjV+2Z+GK+EEY7XKpP5yR4x+N3TAcHTcu963nIr+TMcCb4DBCYX1z6Q==",
+      "version": "9.15.0",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.15.0.tgz",
+      "integrity": "sha512-tMTqrY+EzbXmKJR5ToI8lxu7jaN5EdmrBFJpQk5JmSlyLsx6o4t27r883K5xsLuCYCpfKBCGswMSWXsM+jB7lg==",
       "dev": true,
       "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       }
     },
     "node_modules/@humanwhocodes/config-array": {
@@ -594,16 +617,16 @@
       "integrity": "sha512-6SlHBzUW8Jhf3liqrGGXyTJSIFe4nqlJ5A5KaMZ2l/vbM3Wh3KSybots/wfWVzNLK4D1NZluDlSQIbIEPx6oyA=="
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
-      "version": "8.14.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.14.0.tgz",
-      "integrity": "sha512-tqp8H7UWFaZj0yNO6bycd5YjMwxa6wIHOLZvWPkidwbgLCsBMetQoGj7DPuAlWa2yGO3H48xmPwjhsSPPCGU5w==",
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.15.0.tgz",
+      "integrity": "sha512-+zkm9AR1Ds9uLWN3fkoeXgFppaQ+uEVtfOV62dDmsy9QCNqlRHWNEck4yarvRNrvRcHQLGfqBNui3cimoz8XAg==",
       "dev": true,
       "dependencies": {
         "@eslint-community/regexpp": "^4.10.0",
-        "@typescript-eslint/scope-manager": "8.14.0",
-        "@typescript-eslint/type-utils": "8.14.0",
-        "@typescript-eslint/utils": "8.14.0",
-        "@typescript-eslint/visitor-keys": "8.14.0",
+        "@typescript-eslint/scope-manager": "8.15.0",
+        "@typescript-eslint/type-utils": "8.15.0",
+        "@typescript-eslint/utils": "8.15.0",
+        "@typescript-eslint/visitor-keys": "8.15.0",
         "graphemer": "^1.4.0",
         "ignore": "^5.3.1",
         "natural-compare": "^1.4.0",
@@ -627,15 +650,15 @@
       }
     },
     "node_modules/@typescript-eslint/parser": {
-      "version": "8.14.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.14.0.tgz",
-      "integrity": "sha512-2p82Yn9juUJq0XynBXtFCyrBDb6/dJombnz6vbo6mgQEtWHfvHbQuEa9kAOVIt1c9YFwi7H6WxtPj1kg+80+RA==",
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.15.0.tgz",
+      "integrity": "sha512-7n59qFpghG4uazrF9qtGKBZXn7Oz4sOMm8dwNWDQY96Xlm2oX67eipqcblDj+oY1lLCbf1oltMZFpUso66Kl1A==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/scope-manager": "8.14.0",
-        "@typescript-eslint/types": "8.14.0",
-        "@typescript-eslint/typescript-estree": "8.14.0",
-        "@typescript-eslint/visitor-keys": "8.14.0",
+        "@typescript-eslint/scope-manager": "8.15.0",
+        "@typescript-eslint/types": "8.15.0",
+        "@typescript-eslint/typescript-estree": "8.15.0",
+        "@typescript-eslint/visitor-keys": "8.15.0",
         "debug": "^4.3.4"
       },
       "engines": {
@@ -655,13 +678,13 @@
       }
     },
     "node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.14.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.14.0.tgz",
-      "integrity": "sha512-aBbBrnW9ARIDn92Zbo7rguLnqQ/pOrUguVpbUwzOhkFg2npFDwTgPGqFqE0H5feXcOoJOfX3SxlJaKEVtq54dw==",
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.15.0.tgz",
+      "integrity": "sha512-QRGy8ADi4J7ii95xz4UoiymmmMd/zuy9azCaamnZ3FM8T5fZcex8UfJcjkiEZjJSztKfEBe3dZ5T/5RHAmw2mA==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/types": "8.14.0",
-        "@typescript-eslint/visitor-keys": "8.14.0"
+        "@typescript-eslint/types": "8.15.0",
+        "@typescript-eslint/visitor-keys": "8.15.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -672,13 +695,13 @@
       }
     },
     "node_modules/@typescript-eslint/type-utils": {
-      "version": "8.14.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.14.0.tgz",
-      "integrity": "sha512-Xcz9qOtZuGusVOH5Uk07NGs39wrKkf3AxlkK79RBK6aJC1l03CobXjJbwBPSidetAOV+5rEVuiT1VSBUOAsanQ==",
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.15.0.tgz",
+      "integrity": "sha512-UU6uwXDoI3JGSXmcdnP5d8Fffa2KayOhUUqr/AiBnG1Gl7+7ut/oyagVeSkh7bxQ0zSXV9ptRh/4N15nkCqnpw==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/typescript-estree": "8.14.0",
-        "@typescript-eslint/utils": "8.14.0",
+        "@typescript-eslint/typescript-estree": "8.15.0",
+        "@typescript-eslint/utils": "8.15.0",
         "debug": "^4.3.4",
         "ts-api-utils": "^1.3.0"
       },
@@ -689,6 +712,9 @@
         "type": "opencollective",
         "url": "https://opencollective.com/typescript-eslint"
       },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0"
+      },
       "peerDependenciesMeta": {
         "typescript": {
           "optional": true
@@ -696,9 +722,9 @@
       }
     },
     "node_modules/@typescript-eslint/types": {
-      "version": "8.14.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.14.0.tgz",
-      "integrity": "sha512-yjeB9fnO/opvLJFAsPNYlKPnEM8+z4og09Pk504dkqonT02AyL5Z9SSqlE0XqezS93v6CXn49VHvB2G7XSsl0g==",
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.15.0.tgz",
+      "integrity": "sha512-n3Gt8Y/KyJNe0S3yDCD2RVKrHBC4gTUcLTebVBXacPy091E6tNspFLKRXlk3hwT4G55nfr1n2AdFqi/XMxzmPQ==",
       "dev": true,
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -709,13 +735,13 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.14.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.14.0.tgz",
-      "integrity": "sha512-OPXPLYKGZi9XS/49rdaCbR5j/S14HazviBlUQFvSKz3npr3NikF+mrgK7CFVur6XEt95DZp/cmke9d5i3vtVnQ==",
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.15.0.tgz",
+      "integrity": "sha512-1eMp2JgNec/niZsR7ioFBlsh/Fk0oJbhaqO0jRyQBMgkz7RrFfkqF9lYYmBoGBaSiLnu8TAPQTwoTUiSTUW9dg==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/types": "8.14.0",
-        "@typescript-eslint/visitor-keys": "8.14.0",
+        "@typescript-eslint/types": "8.15.0",
+        "@typescript-eslint/visitor-keys": "8.15.0",
         "debug": "^4.3.4",
         "fast-glob": "^3.3.2",
         "is-glob": "^4.0.3",
@@ -789,15 +815,15 @@
       }
     },
     "node_modules/@typescript-eslint/utils": {
-      "version": "8.14.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.14.0.tgz",
-      "integrity": "sha512-OGqj6uB8THhrHj0Fk27DcHPojW7zKwKkPmHXHvQ58pLYp4hy8CSUdTKykKeh+5vFqTTVmjz0zCOOPKRovdsgHA==",
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.15.0.tgz",
+      "integrity": "sha512-k82RI9yGhr0QM3Dnq+egEpz9qB6Un+WLYhmoNcvl8ltMEededhh7otBVVIDDsEEttauwdY/hQoSsOv13lxrFzQ==",
       "dev": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.4.0",
-        "@typescript-eslint/scope-manager": "8.14.0",
-        "@typescript-eslint/types": "8.14.0",
-        "@typescript-eslint/typescript-estree": "8.14.0"
+        "@typescript-eslint/scope-manager": "8.15.0",
+        "@typescript-eslint/types": "8.15.0",
+        "@typescript-eslint/typescript-estree": "8.15.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -808,16 +834,21 @@
       },
       "peerDependencies": {
         "eslint": "^8.57.0 || ^9.0.0"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
       }
     },
     "node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.14.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.14.0.tgz",
-      "integrity": "sha512-vG0XZo8AdTH9OE6VFRwAZldNc7qtJ/6NLGWak+BtENuEUXGZgFpihILPiBvKXvJ2nFu27XNGC6rKiwuaoMbYzQ==",
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.15.0.tgz",
+      "integrity": "sha512-h8vYOulWec9LhpwfAdZf2bjr8xIp0KNKnpgqSz0qqYYKAW/QZKw3ktRndbiAtUz4acH4QLQavwZBYCc0wulA/Q==",
       "dev": true,
       "dependencies": {
-        "@typescript-eslint/types": "8.14.0",
-        "eslint-visitor-keys": "^3.4.3"
+        "@typescript-eslint/types": "8.15.0",
+        "eslint-visitor-keys": "^4.2.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -827,6 +858,18 @@
         "url": "https://opencollective.com/typescript-eslint"
       }
     },
+    "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.0.tgz",
+      "integrity": "sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==",
+      "dev": true,
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
     "node_modules/@ungap/structured-clone": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.2.0.tgz",
@@ -1898,6 +1941,18 @@
         }
       }
     },
+    "node_modules/eslint-config-prettier": {
+      "version": "9.1.0",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz",
+      "integrity": "sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==",
+      "dev": true,
+      "bin": {
+        "eslint-config-prettier": "bin/cli.js"
+      },
+      "peerDependencies": {
+        "eslint": ">=7.0.0"
+      }
+    },
     "node_modules/eslint-import-resolver-node": {
       "version": "0.3.9",
       "resolved": "https://registry.npmjs.org/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz",
@@ -2209,6 +2264,30 @@
         "url": "https://opencollective.com/eslint"
       }
     },
+    "node_modules/eslint/node_modules/@eslint/js": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.1.tgz",
+      "integrity": "sha512-d9zaMRSTIKDLhctzH12MtXvJKSSUhaHcjV+2Z+GK+EEY7XKpP5yR4x+N3TAcHTcu963nIr+TMcCb4DBCYX1z6Q==",
+      "dev": true,
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      }
+    },
+    "node_modules/eslint/node_modules/globals": {
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
+      "dev": true,
+      "dependencies": {
+        "type-fest": "^0.20.2"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/espree": {
       "version": "9.6.1",
       "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
@@ -2537,15 +2616,12 @@
       }
     },
     "node_modules/globals": {
-      "version": "13.24.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
-      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
+      "version": "15.12.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-15.12.0.tgz",
+      "integrity": "sha512-1+gLErljJFhbOVyaetcwJiJ4+eLe45S2E7P5UiZ9xGfeq3ATQf5DOv9G7MH3gGbKQLkzmNh2DxfZwLdw+j6oTQ==",
       "dev": true,
-      "dependencies": {
-        "type-fest": "^0.20.2"
-      },
       "engines": {
-        "node": ">=8"
+        "node": ">=18"
       },
       "funding": {
         "url": "https://github.com/sponsors/sindresorhus"
@@ -4148,6 +4224,21 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/prettier": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
+      "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
+      "dev": true,
+      "bin": {
+        "prettier": "bin/prettier.cjs"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
+      }
+    },
     "node_modules/prisma": {
       "version": "5.22.0",
       "resolved": "https://registry.npmjs.org/prisma/-/prisma-5.22.0.tgz",
@@ -5199,6 +5290,32 @@
         "node": ">=14.17"
       }
     },
+    "node_modules/typescript-eslint": {
+      "version": "8.15.0",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.15.0.tgz",
+      "integrity": "sha512-wY4FRGl0ZI+ZU4Jo/yjdBu0lVTSML58pu6PgGtJmCufvzfV565pUF6iACQt092uFOd49iLOTX/sEVmHtbSrS+w==",
+      "dev": true,
+      "dependencies": {
+        "@typescript-eslint/eslint-plugin": "8.15.0",
+        "@typescript-eslint/parser": "8.15.0",
+        "@typescript-eslint/utils": "8.15.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/unbox-primitive": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz",
diff --git a/package.json b/package.json
index 5d0fac8..b5e0a6a 100644
--- a/package.json
+++ b/package.json
@@ -4,11 +4,12 @@
   "private": true,
   "scripts": {
     "dev": "source config/local_dev.env && next dev",
-    "build": "next build",
+    "build": "npm run lint && next build",
     "start": "next start",
     "start:local": "source config/local_env.env && next start",
     "start:docker": "prisma migrate deploy && node server.js",
-    "lint": "next lint",
+    "lint": "eslint ./src",
+    "format": "prettier --write ./src",
     "prisma": "source config/local_dev.env && prisma migrate dev",
     "prisma:studio": "dotenv -e config/local_dev.env -- npx prisma studio"
   },
@@ -32,13 +33,21 @@
     "uuid": "^11.0.2"
   },
   "devDependencies": {
+    "@eslint/js": "^9.15.0",
     "@types/node": "^20.17.6",
     "@types/react": "^18",
     "@types/react-dom": "^18",
-    "eslint": "^8",
+    "@typescript-eslint/eslint-plugin": "^8.15.0",
+    "@typescript-eslint/parser": "^8.15.0",
+    "eslint": "^8.57.1",
     "eslint-config-next": "15.0.1",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-react": "^7.37.2",
+    "globals": "^15.12.0",
     "postcss": "^8",
+    "prettier": "^3.3.3",
     "tailwindcss": "^3.4.1",
-    "typescript": "^5"
+    "typescript": "^5",
+    "typescript-eslint": "^8.15.0"
   }
 }
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 2ce09e8..ec4cc8e 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -375,7 +375,7 @@ export default function UserPage() {
             </div>
             {localHandle === profileHandle && (
               <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
-                <a className="link" href={shareUrl()} target="_blank">
+                <a className="link" href={shareUrl()} target="_blank" rel="noreferrer">
                   {userProfile?.instanceType}에 질문상자 페이지를 공유
                 </a>
               </div>
diff --git a/src/utils/logger/Logger.ts b/src/utils/logger/Logger.ts
index fcbba6d..e7ca7f1 100644
--- a/src/utils/logger/Logger.ts
+++ b/src/utils/logger/Logger.ts
@@ -1,29 +1,29 @@
 export class Logger {
   private name: string;
-  constructor (name: string) {
+  constructor(name: string) {
     this.name = name;
-  } 
+  }
 
-  public debug(...args: any[]) {
+  public debug(...args: unknown[]) {
     if (process.env.NODE_ENV === 'production') {
       return;
     }
-    const time = Math.floor(Date.now()/1000);
+    const time = Math.floor(Date.now() / 1000);
     console.log(`\x1b[36m [${time}] [${this.name}] DEBUG: \x1b[0m`, ...args);
   }
 
-  public log(...args: any[]) {
-    const time = Math.floor(Date.now()/1000);
+  public log(...args: unknown[]) {
+    const time = Math.floor(Date.now() / 1000);
     console.log(`\x1b[32m [${time}] [${this.name}] INFO: \x1b[0m`, ...args);
   }
 
-  public warn(...args: any[]) {
-    const time = Math.floor(Date.now()/1000);
+  public warn(...args: unknown[]) {
+    const time = Math.floor(Date.now() / 1000);
     console.log(`\x1b[33m [${time}] [${this.name}] WARN: \x1b[0m`, ...args);
   }
 
-  public error(...args: any[]) {
-    const time = Math.floor(Date.now()/1000);
+  public error(...args: unknown[]) {
+    const time = Math.floor(Date.now() / 1000);
     console.log(`\x1b[31m [${time}] [${this.name}] ERROR: \x1b[0m`, ...args);
   }
-}
\ No newline at end of file
+}
diff --git a/tsconfig.json b/tsconfig.json
index 331fe12..4287e93 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,11 +1,7 @@
 {
   "compilerOptions": {
     "target": "ES2017",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -26,19 +22,9 @@
       }
     ],
     "paths": {
-      "@/*": [
-        "./src/*"
-      ]
+      "@/*": ["./src/*"]
     }
   },
-  "include": [
-    "**/*.ts",
-    "**/*.tsx",
-    ".next/types/**/*.ts",
-    "next-env.d.ts",
-    "build/types/**/*.ts"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
+  "include": ["**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "next-env.d.ts", "build/types/**/*.ts", "eslint.config.mjs"],
+  "exclude": ["node_modules"]
 }

From ddbb50b6552c35ebd4d2709f868517207c9182a3 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 02:14:57 +0900
Subject: [PATCH 76/89] =?UTF-8?q?enhance:=20API=EB=93=A4=EC=97=90=20?=
 =?UTF-8?q?=EB=A6=AC=EB=AF=B8=ED=84=B0=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/db/create-question/route.ts       | 38 +++++++++++++++----
 src/app/api/db/delete-answer/route.ts         | 16 ++++++--
 src/app/api/db/fetch-all-answers/route.ts     |  4 +-
 src/app/api/db/fetch-my-profile/route.ts      |  9 +++++
 src/app/api/db/fetch-my-questions/route.ts    | 10 +++++
 .../api/db/fetch-profile/[handle]/route.ts    | 12 ++++++
 src/app/api/db/fetch-user-answers/route.ts    | 19 ++++++++--
 .../api/web/fetch-name-with-emoji/route.ts    |  7 ++--
 src/app/api/web/mastodon-login/route.ts       | 17 ++++++++-
 src/app/api/web/misskey-login/route.ts        | 17 ++++++++-
 10 files changed, 126 insertions(+), 23 deletions(-)

diff --git a/src/app/api/db/create-question/route.ts b/src/app/api/db/create-question/route.ts
index eb2a477..940fcd9 100644
--- a/src/app/api/db/create-question/route.ts
+++ b/src/app/api/db/create-question/route.ts
@@ -6,15 +6,41 @@ import { validateStrict } from "@/utils/validator/strictValidator";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 import { Logger } from "@/utils/logger/Logger";
+import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
+import { getIpHash } from "@/utils/getIp/get-ip-hash";
 const logger = new Logger('create-question');
 
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
+  const token = req.cookies.get("jwtToken")?.value;
+  const tokenPayload = await verifyToken(token).then((payload) => payload).catch(()=> {});
+  if (tokenPayload) {
+    const limiter = RateLimiterService.getLimiter();
+    const limited = await limiter.limit(`create-question-${tokenPayload.handle}`, {
+      bucket_time: 100,
+      req_limit: 10,
+    });
+    if (limited) {
+      return sendApiError(429, '요청 제한에 도달했습니다!');
+    }
+  } else {
+    const limiter = RateLimiterService.getLimiter();
+    const ipHash = getIpHash(getIpFromRequest(req));
+    const limited = await limiter.limit(`create-question-${ipHash}`, {
+      bucket_time: 100,
+      req_limit: 10,
+    });
+    if (limited) {
+      return sendApiError(429, '요청 제한에 도달했습니다!');
+    }
+  }
+
   try {
-    const body = await req.json();
     let data;
     try {
-      data = await validateStrict(CreateQuestionDto, body);
+      data = await validateStrict(CreateQuestionDto, await req.json());
     } catch (errors) {
       return sendErrorResponse(400, `${errors}`);
     }
@@ -38,19 +64,17 @@ export async function POST(req: NextRequest) {
 
     // 제시된 questioner 핸들이 JWT토큰의 핸들과 일치하는지 검사
     if (data.questioner) {
-      const token = req.cookies.get("jwtToken")?.value;
       try {
-        if (typeof token !== "string") {
-          throw new Error(`Token is not string!`);
+        if (!tokenPayload) {
+          throw new Error(`No Auth Token`);
         }
-        const tokenPayload = await verifyToken(token);
         if (
           tokenPayload.handle.toLowerCase() !== data.questioner.toLowerCase()
         ) {
           throw new Error(`Token and questioner not match`);
         }
       } catch (err) {
-        logger.log(`questioner verify ERROR! ${err}`);
+        logger.warn(`questioner verify ERROR! ${err}`);
         return sendErrorResponse(403, `${err}`);
       }
     }
diff --git a/src/app/api/db/delete-answer/route.ts b/src/app/api/db/delete-answer/route.ts
index fd15e9c..3c39497 100644
--- a/src/app/api/db/delete-answer/route.ts
+++ b/src/app/api/db/delete-answer/route.ts
@@ -6,13 +6,13 @@ import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 import { Logger } from "@/utils/logger/Logger";
+import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
 
 const logger = new Logger('delete-answer');
 export async function POST(req: NextRequest) {
-  const body = await req.json();
   let data: DeleteAnswerDto;
   try {
-    data = await validateStrict(DeleteAnswerDto, body);
+    data = await validateStrict(DeleteAnswerDto, await req.json());
   } catch (err) {
     return sendApiError(400, `Bad Request ${err}`);
   }
@@ -23,9 +23,19 @@ export async function POST(req: NextRequest) {
   // JWT 토큰 검증
   try {
     tokenPayload = await verifyToken(token);
-  } catch (err) {
+  } catch {
     return sendApiError(401, "Unauthorized");
   }
+
+  const limiter = RateLimiterService.getLimiter();
+  const limited = await limiter.limit(`delete-answer-${tokenPayload.handle}`, {
+    bucket_time: 600,
+    req_limit: 300,
+  });
+  if (limited) {
+    return sendApiError(429, '요청 제한에 도달했습니다!');
+  }
+
   const willBeDeletedAnswer = await prisma.answer.findUnique({
     where: { id: data.id },
   });
diff --git a/src/app/api/db/fetch-all-answers/route.ts b/src/app/api/db/fetch-all-answers/route.ts
index e06d5f7..a58fb43 100644
--- a/src/app/api/db/fetch-all-answers/route.ts
+++ b/src/app/api/db/fetch-all-answers/route.ts
@@ -10,9 +10,9 @@ import { NextRequest, NextResponse } from "next/server";
 
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
-  const ip = getIpFromRequest(req);
+
   const limiter = RateLimiterService.getLimiter();
-  const ipHash = getIpHash(ip);
+  const ipHash = getIpHash(getIpFromRequest(req));
   const limited = await limiter.limit(`fetch-all-answers-${ipHash}`, {
     bucket_time: 600,
     req_limit: 600,
diff --git a/src/app/api/db/fetch-my-profile/route.ts b/src/app/api/db/fetch-my-profile/route.ts
index 0ce7616..3887a56 100644
--- a/src/app/api/db/fetch-my-profile/route.ts
+++ b/src/app/api/db/fetch-my-profile/route.ts
@@ -3,6 +3,7 @@ import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
 
 export async function GET(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
@@ -18,6 +19,14 @@ export async function GET(req: NextRequest) {
     } catch {
       return sendApiError(401, "Token Verify Error");
     }
+    const limiter = RateLimiterService.getLimiter();
+    const limited = await limiter.limit(`fetch-my-profile-${handle}`, {
+      bucket_time: 600,
+      req_limit: 300,
+    });
+    if (limited) {
+      return sendApiError(429, '요청 제한에 도달했습니다!');
+    }
 
     const userProfile = await prisma.profile.findUnique({
       include: {
diff --git a/src/app/api/db/fetch-my-questions/route.ts b/src/app/api/db/fetch-my-questions/route.ts
index 89a223a..9198d46 100644
--- a/src/app/api/db/fetch-my-questions/route.ts
+++ b/src/app/api/db/fetch-my-questions/route.ts
@@ -2,6 +2,7 @@ import { NextRequest, NextResponse } from "next/server";
 import { verifyToken } from "../../functions/web/verify-jwt";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
 
 export async function GET(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
@@ -10,6 +11,15 @@ export async function GET(req: NextRequest) {
   try {
     if (cookie) {
       const jwt = await verifyToken(cookie.value);
+      const limiter = RateLimiterService.getLimiter();
+      const limited = await limiter.limit(`fetch-my-questions-${jwt.handle}`, {
+        bucket_time: 600,
+        req_limit: 300,
+      });
+      if (limited) {
+        return sendApiError(429, '요청 제한에 도달했습니다!');
+      }
+
       if (jwt.handle) {
         const questions = await prisma.question.findMany({
           where: {
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index c27e02c..77cd538 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -3,8 +3,11 @@ import {
   userProfileWithHostnameDto,
 } from "@/app/_dto/fetch-profile/Profile.dto";
 import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
+import { getIpHash } from "@/utils/getIp/get-ip-hash";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 import { Logger } from "@/utils/logger/Logger";
+import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
 import { NextRequest, NextResponse } from "next/server";
 
 const logger = new Logger('fetch-profile/handle')
@@ -18,6 +21,15 @@ export async function GET(
     if (!userHandle) {
       return sendApiError(400, "userHandle empty");
     }
+    const limiter = RateLimiterService.getLimiter();
+    const ipHash = getIpHash(getIpFromRequest(req));
+    const limited = await limiter.limit(`fetch-profile-${ipHash}`, {
+      bucket_time: 600,
+      req_limit: 300,
+    });
+    if (limited) {
+      return sendApiError(429, '요청 제한에 도달했습니다!');
+    }
     const profile = await prisma.profile.findUnique({
       where: {
         handle: userHandle,
diff --git a/src/app/api/db/fetch-user-answers/route.ts b/src/app/api/db/fetch-user-answers/route.ts
index f8badc6..32fe915 100644
--- a/src/app/api/db/fetch-user-answers/route.ts
+++ b/src/app/api/db/fetch-user-answers/route.ts
@@ -4,19 +4,32 @@ import { NextRequest, NextResponse } from "next/server";
 import { sendErrorResponse } from "../../functions/web/errorResponse";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 import { Logger } from "@/utils/logger/Logger";
+import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
+import { getIpHash } from "@/utils/getIp/get-ip-hash";
+import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 
-const logger = new Logger('fetch-user-profile');
+const logger = new Logger('fetch-user-answer');
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
   try {
-    const body = await req.json();
     let data;
     try {
-      data = await validateStrict(FetchUserAnswersDto, body);
+      data = await validateStrict(FetchUserAnswersDto, await req.json());
     } catch (err) {
       return sendErrorResponse(400, `${err}`);
     }
 
+    const limiter = RateLimiterService.getLimiter();
+    const ipHash = getIpHash(getIpFromRequest(req));
+    const limited = await limiter.limit(`fetch-user-answers-${ipHash}`, {
+      bucket_time: 600,
+      req_limit: 300,
+    });
+    if (limited) {
+      return sendApiError(429, '요청 제한에 도달했습니다!');
+    }
+  
     const query_limit = data.limit
       ? Math.max(1, Math.min(data.limit, 100))
       : 100;
diff --git a/src/app/api/web/fetch-name-with-emoji/route.ts b/src/app/api/web/fetch-name-with-emoji/route.ts
index 5b5e151..b5960fa 100644
--- a/src/app/api/web/fetch-name-with-emoji/route.ts
+++ b/src/app/api/web/fetch-name-with-emoji/route.ts
@@ -8,9 +8,8 @@ import { Logger } from "@/utils/logger/Logger";
 const logger = new Logger('fetch-name-with-emoji');
 export async function POST(req: NextRequest) {
   let data;
-  const body: fetchNameWithEmojiReqDto = await req.json();
   try {
-    data = await validateStrict(fetchNameWithEmojiReqDto, body);
+    data = await validateStrict(fetchNameWithEmojiReqDto, await req.json());
   } catch (err) {
     return sendErrorResponse(400, `${err}`);
   }
@@ -31,9 +30,9 @@ export async function POST(req: NextRequest) {
   switch (instanceType) {
     case "mastodon":
       try {
-        if (emojiInUsername && body.emojis) {
+        if (emojiInUsername && data.emojis) {
           for (let i = 0; i < emojiInUsername.length; i++) {
-            usernameEmojiAddress.push(body.emojis[i].url);
+            usernameEmojiAddress.push(data.emojis[i].url);
           }
 
           for (const el in nameArray) {
diff --git a/src/app/api/web/mastodon-login/route.ts b/src/app/api/web/mastodon-login/route.ts
index c029daf..30d1be0 100644
--- a/src/app/api/web/mastodon-login/route.ts
+++ b/src/app/api/web/mastodon-login/route.ts
@@ -5,20 +5,33 @@ import { sendErrorResponse } from "../../functions/web/errorResponse";
 import { v4 as uuid } from "uuid";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 import { Logger } from "@/utils/logger/Logger";
+import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
+import { getIpHash } from "@/utils/getIp/get-ip-hash";
+import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 
 const logger = new Logger('mastodon-login');
 export async function POST(req: NextRequest) {
   let data: loginReqDto;
-  const body = await req.json();
   const prisma = GetPrismaClient.getClient();
 
   //일단은 미스키와 같은 Validate를 거침
   try {
-    data = await validateStrict(loginReqDto, body);
+    data = await validateStrict(loginReqDto, await req.json());
   } catch (err) {
     return sendErrorResponse(400, `${err}`);
   }
 
+  const limiter = RateLimiterService.getLimiter();
+  const ipHash = getIpHash(getIpFromRequest(req));
+  const limited = await limiter.limit(`mastodon-login-${ipHash}`, {
+    bucket_time: 600,
+    req_limit: 300,
+  });
+  if (limited) {
+    return sendApiError(429, '요청 제한에 도달했습니다!');
+  }
+  
   const mastodonHost = data.host.toLowerCase();
 
   try {
diff --git a/src/app/api/web/misskey-login/route.ts b/src/app/api/web/misskey-login/route.ts
index 8f203f6..d5eb6ef 100644
--- a/src/app/api/web/misskey-login/route.ts
+++ b/src/app/api/web/misskey-login/route.ts
@@ -6,18 +6,31 @@ import { MiApiError, MiAuthSession } from "@/app";
 import detectInstance from "../../functions/web/detectInstance";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
 import { Logger } from "@/utils/logger/Logger";
+import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
+import { getIpHash } from "@/utils/getIp/get-ip-hash";
+import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
+import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
 
 const logger = new Logger('misskey-login');
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
   let data: loginReqDto;
-  const body = await req.json();
   try {
-    data = await validateStrict(loginReqDto, body);
+    data = await validateStrict(loginReqDto, await req.json());
   } catch (err) {
     return sendErrorResponse(400, `${err}`);
   }
 
+  const limiter = RateLimiterService.getLimiter();
+  const ipHash = getIpHash(getIpFromRequest(req));
+  const limited = await limiter.limit(`misskey-login-${ipHash}`, {
+    bucket_time: 600,
+    req_limit: 60,
+  });
+  if (limited) {
+    return sendApiError(429, '요청 제한에 도달했습니다!');
+  }
+
   const misskeyHost = data.host.toLowerCase();
 
   try {

From d54a945729c85e5f11f2627bad7694c0db8e0c34 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 02:32:09 +0900
Subject: [PATCH 77/89] =?UTF-8?q?fix:=20ip=EA=B0=80=EC=A0=B8=EC=98=A4?=
 =?UTF-8?q?=EB=8A=94=20=EC=9C=A0=ED=8B=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/getIp/get-ip-from-Request.ts | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/utils/getIp/get-ip-from-Request.ts b/src/utils/getIp/get-ip-from-Request.ts
index 2a661e7..a230904 100644
--- a/src/utils/getIp/get-ip-from-Request.ts
+++ b/src/utils/getIp/get-ip-from-Request.ts
@@ -1,6 +1,11 @@
 import { NextRequest } from "next/server";
+import { Logger } from "../logger/Logger";
 
+const logger = new Logger('get-ip-from-request');
 export function getIpFromRequest(req: NextRequest) {
-  const ip = req.headers.get('x-forwarded-for')?.split(/, /)[0];
+  const ip = req.headers.get('x-forwarded-for')?.split(',')[0].replace(' ', '');
+  if (!ip){
+    logger.warn('IP detect fail!');
+  }
   return ip ?? '127.1.2.3';
 }
\ No newline at end of file

From d11670d01daf89d7377f89d18ec06f289d5357a7 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 12:46:01 +0900
Subject: [PATCH 78/89] =?UTF-8?q?fix:=20=EC=A7=88=EB=AC=B8,=EB=8B=B5?=
 =?UTF-8?q?=EB=B3=80=20=EB=8B=A4=ED=81=AC=EB=AA=A8=EB=93=9C=20=EC=83=89=20?=
 =?UTF-8?q?=EB=AF=B8=EC=84=B8=EC=A1=B0=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx   | 2 +-
 src/app/_components/question.tsx | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 87691f8..1eafeed 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -108,7 +108,7 @@ export default function Answer({ value, idState, ref }: askProps) {
               />
             </Link>
           </div>
-          <div className="flex items-center text-sm break-all window:text-xl desktop:text-2xl chat-bubble bg-green-600 text-slate-300 dark:text-slate-200">
+          <div className="flex items-center text-sm break-all window:text-xl desktop:text-2xl chat-bubble bg-green-600 text-slate-200">
             <Link href={`/main/user/${value.answeredPersonHandle}`}>
               {value.answer}
             </Link>
diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 895380c..bae9099 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -90,7 +90,7 @@ export default function Question({
   return (
     <div className="rounded-box p-2 desktop:p-4 mb-2 glass shadow">
       <div className="text-2xl chat chat-start">
-        <div className="chat-header">
+        <div className="chat-header dark:text-slate-100">
           {singleQuestion.questioner ? (
             <Link href={`/main/user/${singleQuestion.questioner}`}>
               {singleQuestion.questioner}
@@ -102,7 +102,7 @@ export default function Question({
         <div className="chat-bubble flex items-center text-sm window:text-xl desktop:text-2xl text-slate-200">
           {singleQuestion.question}
         </div>
-        <div className="chat-footer opacity-50">
+        <div className="chat-footer opacity-50 dark:text-slate-100 dark:opacity-80">
           {new Date(singleQuestion.questionedAt).toLocaleString('ko-KR', {hour12: false})}
           <span
             className="text-red-500 font-bold ml-2 cursor-pointer"

From 53bc2cb6a03f709566ce5215d508b592724ea247 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 12:47:03 +0900
Subject: [PATCH 79/89] fix lint

---
 src/app/main/user/[handle]/_profile.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/main/user/[handle]/_profile.tsx b/src/app/main/user/[handle]/_profile.tsx
index 3dbaa58..8e674ed 100644
--- a/src/app/main/user/[handle]/_profile.tsx
+++ b/src/app/main/user/[handle]/_profile.tsx
@@ -269,7 +269,7 @@ export default function Profile() {
       </div>
       {localHandle === profileHandle && (
         <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
-          <a className="link" href={shareUrl()} target="_blank">
+          <a className="link" href={shareUrl()} target="_blank" rel="noreferrer">
             Misskey에 질문상자 페이지를 공유
           </a>
         </div>

From aaec1e4afdc4cf6c14801d5da6af129b802498be Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 12:57:20 +0900
Subject: [PATCH 80/89] fix build error

---
 src/app/_components/answer.tsx | 10 ++++++----
 src/app/main/page.tsx          |  2 +-
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 1eafeed..2e12846 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -16,8 +16,8 @@ import { useParams } from "next/navigation";
 interface askProps {
   value: AnswerDto;
   id: string;
-  ref: RefObject<HTMLDialogElement>;
-  idState: Dispatch<SetStateAction<string>>;
+  ref?: RefObject<HTMLDialogElement>;
+  idState?: Dispatch<SetStateAction<string>>;
 }
 
 export async function fetchProfile(value: AnswerWithProfileDto) {
@@ -82,8 +82,10 @@ export default function Answer({ value, idState, ref }: askProps) {
               <a
                 className="link text-red-800 dark:text-red-500"
                 onClick={() => {
-                  ref.current?.showModal();
-                  idState(value.id);
+                  ref?.current?.showModal();
+                  if (idState) {
+                    idState(value.id);
+                  }
                 }}
               >
                 삭제
diff --git a/src/app/main/page.tsx b/src/app/main/page.tsx
index 820e34c..9ecaed2 100644
--- a/src/app/main/page.tsx
+++ b/src/app/main/page.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect, useState } from "react";
+import { SetStateAction, useEffect, useState } from "react";
 import Answer from "../_components/answer";
 import { FaExclamationCircle } from "react-icons/fa";
 import { answer } from "@prisma/client";

From 37ce35dd89391468d7d0398f8522f233cc4c8fec Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 13:19:07 +0900
Subject: [PATCH 81/89] =?UTF-8?q?=F0=9F=92=84=20=EB=8B=A4=ED=81=AC?=
 =?UTF-8?q?=EB=AA=A8=EB=93=9C=20=EB=A7=81=ED=81=AC=20=EC=83=89=20=EB=AF=B8?=
 =?UTF-8?q?=EC=84=B8=EC=A1=B0=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx | 47 ++++++++++++----------------------
 1 file changed, 16 insertions(+), 31 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index 2e12846..d7e82bf 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -1,17 +1,11 @@
-"use client";
+'use client';
 
-import Link from "next/link";
-import {
-  Dispatch,
-  RefObject,
-  SetStateAction,
-  useEffect,
-  useState,
-} from "react";
-import NameComponents from "./NameComponents";
-import { AnswerDto, AnswerWithProfileDto } from "../_dto/Answers.dto";
-import { userProfileDto } from "../_dto/fetch-profile/Profile.dto";
-import { useParams } from "next/navigation";
+import Link from 'next/link';
+import { Dispatch, RefObject, SetStateAction, useEffect, useState } from 'react';
+import NameComponents from './NameComponents';
+import { AnswerDto, AnswerWithProfileDto } from '../_dto/Answers.dto';
+import { userProfileDto } from '../_dto/fetch-profile/Profile.dto';
+import { useParams } from 'next/navigation';
 
 interface askProps {
   value: AnswerDto;
@@ -38,11 +32,10 @@ export default function Answer({ value, idState, ref }: askProps) {
   const [userInfo, setUserInfo] = useState<userProfileDto>();
   const [localHandle, setLocalHandle] = useState<string | null>();
 
-  const profileHandle =
-    handle !== undefined ? handle.toString().replace(/(?:%40)/g, "@") : "";
+  const profileHandle = handle !== undefined ? handle.toString().replace(/(?:%40)/g, '@') : '';
 
   useEffect(() => {
-    setLocalHandle(localStorage.getItem("user_handle"));
+    setLocalHandle(localStorage.getItem('user_handle'));
   }, [profileHandle]);
 
   useEffect(() => {
@@ -61,16 +54,14 @@ export default function Answer({ value, idState, ref }: askProps) {
         </div>
       )}
 
-      <div className={`${!showNsfw && "blur"} w-full h-full`}>
+      <div className={`${!showNsfw && '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">
               {value.questioner ? (
-                <Link href={`/main/user/${value.questioner}`}>
-                  {value.questioner}
-                </Link>
+                <Link href={`/main/user/${value.questioner}`}>{value.questioner}</Link>
               ) : (
-                "익명의 질문자"
+                '익명의 질문자'
               )}
             </div>
             <div className="flex items-center text-sm window:text-xl desktop:text-2xl chat-bubble text-slate-200">
@@ -103,21 +94,15 @@ export default function Answer({ value, idState, ref }: askProps) {
           </div>
           <div className="chat-header">
             <Link href={`/main/user/${value.answeredPersonHandle}`}>
-              <NameComponents
-                username={userInfo?.name}
-                width={16}
-                height={16}
-              />
+              <NameComponents username={userInfo?.name} width={16} height={16} />
             </Link>
           </div>
           <div className="flex items-center text-sm break-all window:text-xl desktop:text-2xl chat-bubble bg-green-600 text-slate-200">
-            <Link href={`/main/user/${value.answeredPersonHandle}`}>
-              {value.answer}
-            </Link>
+            <Link href={`/main/user/${value.answeredPersonHandle}`}>{value.answer}</Link>
           </div>
-          <div className="chat-footer font-thin text-xs mt-2 underline text-blue-900 dark:text-blue-400">
+          <div className="chat-footer font-thin text-xs mt-2 underline text-blue-900 dark:text-slate-200">
             <Link href={`/main/user/${value.answeredPersonHandle}/${value.id}`}>
-              {new Date(value.answeredAt).toLocaleString('ko-kr', {hour12: false})}
+              {new Date(value.answeredAt).toLocaleString('ko-kr', { hour12: false })}
             </Link>
           </div>
         </div>

From 691c275bb5fcb44a5a14ed2b4712653b04e698dc Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 13:58:03 +0900
Subject: [PATCH 82/89] =?UTF-8?q?=F0=9F=90=9B=20=ED=97=88=EC=A0=91=20RegEx?=
 =?UTF-8?q?p=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx          |   2 +-
 src/app/main/user/[handle]/_answers.tsx |  66 +++++------
 src/app/main/user/[handle]/_profile.tsx | 146 ++++++++++--------------
 src/app/main/user/[handle]/page.tsx     |  17 ++-
 4 files changed, 96 insertions(+), 135 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index d7e82bf..e7a47e5 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -32,7 +32,7 @@ export default function Answer({ value, idState, ref }: askProps) {
   const [userInfo, setUserInfo] = useState<userProfileDto>();
   const [localHandle, setLocalHandle] = useState<string | null>();
 
-  const profileHandle = handle !== undefined ? handle.toString().replace(/(?:%40)/g, '@') : '';
+  const profileHandle = handle !== undefined ? decodeURIComponent(handle) : '';
 
   useEffect(() => {
     setLocalHandle(localStorage.getItem('user_handle'));
diff --git a/src/app/main/user/[handle]/_answers.tsx b/src/app/main/user/[handle]/_answers.tsx
index 7937866..d10f546 100644
--- a/src/app/main/user/[handle]/_answers.tsx
+++ b/src/app/main/user/[handle]/_answers.tsx
@@ -1,12 +1,12 @@
-"use client";
+'use client';
 
-import { useParams } from "next/navigation";
-import { useEffect, useRef, useState } from "react";
-import Answer from "@/app/_components/answer";
-import { userProfileWithHostnameDto } from "@/app/_dto/fetch-profile/Profile.dto";
-import { AnswerDto } from "@/app/_dto/Answers.dto";
-import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
-import DialogModalTwoButton from "@/app/_components/modalTwoButton";
+import { useParams } from 'next/navigation';
+import { useEffect, useRef, useState } from 'react';
+import Answer from '@/app/_components/answer';
+import { userProfileWithHostnameDto } from '@/app/_dto/fetch-profile/Profile.dto';
+import { AnswerDto } from '@/app/_dto/Answers.dto';
+import { FetchUserAnswersDto } from '@/app/_dto/fetch-user-answers/fetch-user-answers.dto';
+import DialogModalTwoButton from '@/app/_components/modalTwoButton';
 
 type ResponseType = {
   answers: AnswerDto[];
@@ -24,7 +24,7 @@ async function fetchProfile(handle: string) {
 
 export default function UserPage() {
   const { handle } = useParams() as { handle: string };
-  const profileHandle = handle.toString().replace(/(?:%40)/g, "@");
+  const profileHandle = decodeURIComponent(handle);
 
   const [userProfile, setUserProfile] = useState<userProfileWithHostnameDto>();
   const [answers, setAnswers] = useState<AnswerDto[] | null>(null);
@@ -32,28 +32,24 @@ export default function UserPage() {
   const [untilId, setUntilId] = useState<string | null>(null);
   const [loading, setLoading] = useState<boolean>(true);
   const [mounted, setMounted] = useState<HTMLDivElement | null>(null);
-  const [id, setId] = useState<string>("");
+  const [id, setId] = useState<string>('');
   const answerDeleteModalRef = useRef<HTMLDialogElement>(null);
 
-  const fetchUserAnswers = async (
-    q: FetchUserAnswersDto
-  ): Promise<ResponseType> => {
-    const res = await fetch("/api/db/fetch-user-answers", {
-      method: "POST",
+  const fetchUserAnswers = async (q: FetchUserAnswersDto): Promise<ResponseType> => {
+    const res = await fetch('/api/db/fetch-user-answers', {
+      method: 'POST',
       body: JSON.stringify(q),
     });
     if (res.ok) {
       return res.json();
     } else {
-      throw new Error(
-        `fetch-user-answers fail! ${res.status}, ${res.statusText}`
-      );
+      throw new Error(`fetch-user-answers fail! ${res.status}, ${res.statusText}`);
     }
   };
 
   const handleDeleteAnswer = async (id: string) => {
-    await fetch("/api/db/delete-answer", {
-      method: "POST",
+    await fetch('/api/db/delete-answer', {
+      method: 'POST',
       body: JSON.stringify({ id: id }),
     });
     if (answers && count) {
@@ -73,7 +69,7 @@ export default function UserPage() {
     if (userProfile) {
       fetchUserAnswers({
         answeredPersonHandle: userProfile.handle,
-        sort: "DESC",
+        sort: 'DESC',
         limit: 20,
       }).then(({ answers, count }: ResponseType) => {
         if (answers.length === 0) {
@@ -93,7 +89,7 @@ export default function UserPage() {
       ([e]) => {
         if (e.isIntersecting && untilId !== null && answers !== null) {
           fetchUserAnswers({
-            sort: "DESC",
+            sort: 'DESC',
             limit: 20,
             untilId: untilId,
             answeredPersonHandle: profileHandle,
@@ -102,16 +98,14 @@ export default function UserPage() {
               setLoading(false);
               return;
             }
-            setAnswers((prev_answers) =>
-              prev_answers ? [...prev_answers, ...r.answers] : null
-            );
+            setAnswers((prev_answers) => (prev_answers ? [...prev_answers, ...r.answers] : null));
             setUntilId(r.answers[r.answers.length - 1].id);
           });
         }
       },
       {
         threshold: 0.7,
-      }
+      },
     );
     if (mounted) observer.observe(mounted);
     return () => {
@@ -133,18 +127,10 @@ export default function UserPage() {
                 <div className="flex flex-col">
                   {answers.map((el) => (
                     <div key={el.id}>
-                      <Answer
-                        value={el}
-                        id={el.id}
-                        idState={setId}
-                        ref={answerDeleteModalRef}
-                      />
+                      <Answer value={el} id={el.id} idState={setId} ref={answerDeleteModalRef} />
                     </div>
                   ))}
-                  <div
-                    className="w-full h-16 flex justify-center items-center"
-                    ref={(ref) => setMounted(ref)}
-                  >
+                  <div className="w-full h-16 flex justify-center items-center" ref={(ref) => setMounted(ref)}>
                     {loading ? (
                       <div>
                         <span className="loading loading-spinner loading-lg" />
@@ -170,10 +156,10 @@ export default function UserPage() {
         </div>
       )}
       <DialogModalTwoButton
-        title={"답변 지우기"}
-        body={"답변을 지울까요...?"}
-        confirmButtonText={"확인"}
-        cancelButtonText={"취소"}
+        title={'답변 지우기'}
+        body={'답변을 지울까요...?'}
+        confirmButtonText={'확인'}
+        cancelButtonText={'취소'}
         ref={answerDeleteModalRef}
         onClick={() => handleDeleteAnswer(id)}
       />
diff --git a/src/app/main/user/[handle]/_profile.tsx b/src/app/main/user/[handle]/_profile.tsx
index 8e674ed..56d7b35 100644
--- a/src/app/main/user/[handle]/_profile.tsx
+++ b/src/app/main/user/[handle]/_profile.tsx
@@ -1,12 +1,12 @@
-import DialogModalOneButton from "@/app/_components/modalOneButton";
-import NameComponents from "@/app/_components/NameComponents";
-import { CreateQuestionDto } from "@/app/_dto/create_question/create-question.dto";
-import { userProfileWithHostnameDto } from "@/app/_dto/fetch-profile/Profile.dto";
-import josa from "@/app/api/functions/josa";
-import Link from "next/link";
-import { useParams } from "next/navigation";
-import { useEffect, useRef, useState } from "react";
-import { SubmitHandler, useForm } from "react-hook-form";
+import DialogModalOneButton from '@/app/_components/modalOneButton';
+import NameComponents from '@/app/_components/NameComponents';
+import { CreateQuestionDto } from '@/app/_dto/create_question/create-question.dto';
+import { userProfileWithHostnameDto } from '@/app/_dto/fetch-profile/Profile.dto';
+import josa from '@/app/api/functions/josa';
+import Link from 'next/link';
+import { useParams } from 'next/navigation';
+import { useEffect, useRef, useState } from 'react';
+import { SubmitHandler, useForm } from 'react-hook-form';
 
 type FormValue = {
   question: string;
@@ -24,10 +24,10 @@ async function fetchProfile(handle: string) {
 
 export default function Profile() {
   const { handle } = useParams() as { handle: string };
-  const profileHandle = handle.toString().replace(/(?:%40)/g, "@");
+  const profileHandle = decodeURIComponent(handle);
 
   const [userProfile, setUserProfile] = useState<userProfileWithHostnameDto>();
-  const [localHandle, setLocalHandle] = useState<string>("");
+  const [localHandle, setLocalHandle] = useState<string>('');
   const questionSuccessModalRef = useRef<HTMLDialogElement>(null);
 
   const {
@@ -42,15 +42,15 @@ export default function Profile() {
     formState: { errors },
   } = useForm<FormValue>({
     defaultValues: {
-      question: "",
+      question: '',
       questioner: false,
     },
   });
 
-  const questioner = watch("questioner");
+  const questioner = watch('questioner');
 
   const onCtrlEnter = async (e: React.KeyboardEvent) => {
-    if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
+    if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
       const isValid = await trigger();
 
       if (isValid === false) {
@@ -65,43 +65,41 @@ export default function Profile() {
     }
   };
 
-  const mkQuestionCreateApi = async (
-    q: CreateQuestionDto
-  ): Promise<Response> => {
-    const res = await fetch("/api/db/create-question", {
-      method: "POST",
+  const mkQuestionCreateApi = async (q: CreateQuestionDto): Promise<Response> => {
+    const res = await fetch('/api/db/create-question', {
+      method: 'POST',
       body: JSON.stringify(q),
     });
     return res;
   };
 
   const shareUrl = () => {
-    const server = localStorage.getItem("server");
+    const server = localStorage.getItem('server');
     const text = `저의 ${josa(
       userProfile?.questionBoxName,
-      "이에요!",
-      "예요!"
+      '이에요!',
+      '예요!',
     )} #neo-quesdon ${location.origin}/main/user/${userProfile?.handle}`;
     return `https://${server}/share?text=${encodeURIComponent(text)}`;
   };
 
   const onSubmit: SubmitHandler<FormValue> = async (e) => {
-    const user_handle = localStorage.getItem("user_handle");
+    const user_handle = localStorage.getItem('user_handle');
     const detectWhiteSpaces = new RegExp(/^\s+$/);
 
     // 작성자 공개
     if (questioner === true) {
       if (user_handle === null) {
-        setError("questioner", {
-          type: "notLoggedIn",
-          message: "작성자 공개를 하려면 로그인을 해주세요!",
+        setError('questioner', {
+          type: 'notLoggedIn',
+          message: '작성자 공개를 하려면 로그인을 해주세요!',
         });
         return;
       }
       if (detectWhiteSpaces.test(e.question) === true) {
-        setError("question", {
-          type: "questionOnlyWhiteSpace",
-          message: "아무것도 없는 질문을 보내시려구요...?",
+        setError('question', {
+          type: 'questionOnlyWhiteSpace',
+          message: '아무것도 없는 질문을 보내시려구요...?',
         });
         return;
       }
@@ -109,7 +107,7 @@ export default function Profile() {
       if (questionSuccessModalRef.current) {
         questionSuccessModalRef.current.showModal();
       } else {
-        alert("오류에요!!!");
+        alert('오류에요!!!');
       }
 
       const req: CreateQuestionDto = {
@@ -126,16 +124,16 @@ export default function Profile() {
     // 작성자 비공개
     else {
       if (userProfile?.stopAnonQuestion === true) {
-        setError("questioner", {
-          type: "stopAnonQuestion",
-          message: "익명 질문은 받지 않고 있어요...",
+        setError('questioner', {
+          type: 'stopAnonQuestion',
+          message: '익명 질문은 받지 않고 있어요...',
         });
         return;
       } else {
         if (detectWhiteSpaces.test(e.question) === true) {
-          setError("question", {
-            type: "questionOnlyWhiteSpace",
-            message: "아무것도 없는 질문을 보내시려구요...?",
+          setError('question', {
+            type: 'questionOnlyWhiteSpace',
+            message: '아무것도 없는 질문을 보내시려구요...?',
           });
           return;
         }
@@ -143,7 +141,7 @@ export default function Profile() {
         if (questionSuccessModalRef.current) {
           questionSuccessModalRef.current.showModal();
         } else {
-          alert("오류에요!!!");
+          alert('오류에요!!!');
         }
 
         const req: CreateQuestionDto = {
@@ -163,7 +161,7 @@ export default function Profile() {
     fetchProfile(profileHandle).then((r) => {
       setUserProfile(r);
     });
-    setLocalHandle(localStorage.getItem("user_handle") ?? "");
+    setLocalHandle(localStorage.getItem('user_handle') ?? '');
   }, [profileHandle]);
 
   return (
@@ -172,9 +170,7 @@ export default function Profile() {
         <div className="flex flex-col items-center gap-2 py-2">
           {userProfile && userProfile.avatarUrl ? (
             <div className="flex w-full h-24">
-              <Link
-                href={`https://${userProfile.hostname}/${userProfile.handle}`}
-              >
+              <Link href={`https://${userProfile.hostname}/${userProfile.handle}`}>
                 <img
                   src={userProfile.avatarUrl}
                   alt="User Avatar"
@@ -195,70 +191,55 @@ export default function Profile() {
           <div className="flex items-center text-xl">
             {userProfile?.stopNewQuestion ? (
               <div className="flex flex-col items-center desktop:flex-row">
-                <NameComponents
-                  username={userProfile.name}
-                  width={32}
-                  height={32}
-                />
+                <NameComponents username={userProfile.name} width={32} height={32} />
                 <span>님은 지금 질문을 받지 않고 있어요...</span>
               </div>
             ) : (
               <div className="flex flex-col items-center desktop:flex-row window:flex-row window:text-2xl">
-                <NameComponents
-                  username={userProfile?.name}
-                  width={32}
-                  height={32}
-                />
-                <span>
-                  님의 {josa(userProfile?.questionBoxName, "이에요!", "예요!")}
-                </span>
+                <NameComponents username={userProfile?.name} width={32} height={32} />
+                <span>님의 {josa(userProfile?.questionBoxName, '이에요!', '예요!')}</span>
               </div>
             )}
           </div>
         </div>
-        <form
-          className="w-full flex flex-col items-center"
-          onSubmit={handleSubmit(onSubmit)}
-        >
+        <form className="w-full flex flex-col items-center" onSubmit={handleSubmit(onSubmit)}>
           <textarea
-            {...register("question", {
-              required: "required",
+            {...register('question', {
+              required: 'required',
             })}
             placeholder="질문 내용을 입력해 주세요"
             className={`w-[90%] my-2 font-thin leading-loose textarea ${
-              errors.question ? "textarea-error" : "textarea-bordered"
+              errors.question ? 'textarea-error' : 'textarea-bordered'
             }`}
             onKeyDown={onCtrlEnter}
             disabled={userProfile?.stopNewQuestion === true ? true : false}
           />
-          {errors.questioner &&
-            errors.questioner.type === "stopAnonQuestion" && (
-              <div
-                className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
-                data-tip={errors.questioner.message}
-              />
-            )}
-          {errors.questioner && errors.questioner.type === "notLoggedIn" && (
+          {errors.questioner && errors.questioner.type === 'stopAnonQuestion' && (
             <div
               className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
               data-tip={errors.questioner.message}
             />
           )}
-          {errors.question &&
-            errors.question.type === "questionOnlyWhiteSpace" && (
-              <div
-                className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
-                data-tip={errors.question.message}
-              />
-            )}
+          {errors.questioner && errors.questioner.type === 'notLoggedIn' && (
+            <div
+              className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
+              data-tip={errors.questioner.message}
+            />
+          )}
+          {errors.question && errors.question.type === 'questionOnlyWhiteSpace' && (
+            <div
+              className="tooltip tooltip-open tooltip-bottom tooltip-error transition-opacity"
+              data-tip={errors.question.message}
+            />
+          )}
           <div className="w-[90%] flex justify-between">
             <div className="flex gap-2 items-center">
               <input
                 type="checkbox"
                 className="toggle toggle-accent"
-                onClick={() => setValue("questioner", !questioner)}
+                onClick={() => setValue('questioner', !questioner)}
               />
-              <input type="hidden" {...register("questioner")} />
+              <input type="hidden" {...register('questioner')} />
               <span>작성자 공개</span>
             </div>
             <button type="submit" className="btn btn-primary">
@@ -270,16 +251,11 @@ export default function Profile() {
       {localHandle === profileHandle && (
         <div className="h-fit py-4 glass rounded-box flex flex-col items-center shadow mb-2">
           <a className="link" href={shareUrl()} target="_blank" rel="noreferrer">
-            Misskey에 질문상자 페이지를 공유
+            {userProfile?.instanceType}에 질문상자 페이지를 공유
           </a>
         </div>
       )}
-      <DialogModalOneButton
-        title={"성공!"}
-        body={"질문했어요!"}
-        buttonText={"닫기"}
-        ref={questionSuccessModalRef}
-      />
+      <DialogModalOneButton title={'성공!'} body={'질문했어요!'} buttonText={'닫기'} ref={questionSuccessModalRef} />
     </div>
   );
 }
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 178dc5a..8e5dffb 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -1,10 +1,10 @@
-"use client";
+'use client';
 
-import { useEffect, useState } from "react";
-import UserPage from "./_answers";
-import Profile from "./_profile";
-import { useParams } from "next/navigation";
-import { userProfileWithHostnameDto } from "@/app/_dto/fetch-profile/Profile.dto";
+import { useEffect, useState } from 'react';
+import UserPage from './_answers';
+import Profile from './_profile';
+import { useParams } from 'next/navigation';
+import { userProfileWithHostnameDto } from '@/app/_dto/fetch-profile/Profile.dto';
 
 async function fetchProfile(handle: string) {
   const profile = await fetch(`/api/db/fetch-profile/${handle}`);
@@ -17,10 +17,9 @@ async function fetchProfile(handle: string) {
 
 export default function ProfilePage() {
   const { handle } = useParams() as { handle: string };
-  const profileHandle = handle.toString().replace(/(?:%40)/g, "@");
+  const profileHandle = decodeURIComponent(handle);
 
-  const [userProfile, setUserProfile] =
-    useState<userProfileWithHostnameDto | null>();
+  const [userProfile, setUserProfile] = useState<userProfileWithHostnameDto | null>();
 
   useEffect(() => {
     fetchProfile(profileHandle).then((r) => {

From e56cc8db78fb73c52997e242bcc5ad3134b4a28e Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 14:57:12 +0900
Subject: [PATCH 83/89] =?UTF-8?q?=F0=9F=92=84=20=EC=A0=80=EC=9E=A5?=
 =?UTF-8?q?=EC=86=8C=20=EB=A7=81=ED=81=AC=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/github.tsx | 25 +++++++++++++++++++++++++
 src/app/layout.tsx             |  2 +-
 src/app/page.tsx               | 11 +++++++----
 3 files changed, 33 insertions(+), 5 deletions(-)
 create mode 100644 src/app/_components/github.tsx

diff --git a/src/app/_components/github.tsx b/src/app/_components/github.tsx
new file mode 100644
index 0000000..5e35b6e
--- /dev/null
+++ b/src/app/_components/github.tsx
@@ -0,0 +1,25 @@
+import Link from "next/link";
+
+export default function GithubRepoLink() {
+  return (
+    <div className="flex flex-col gap-2">
+      <Link href='https://github.com/serafuku/neo-quesdon' className="flex items-center gap-2 opacity-70">
+        <div>
+          <svg width="15" height="15" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" className="fill-black dark:fill-white">
+            <path
+              fillRule="evenodd"
+              clipRule="evenodd"
+              d="M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z"
+              transform="scale(64)"
+            />
+          </svg>
+        </div>
+        <div className="text-xs underline">Github</div>
+      </Link>
+      <div className="flex flex-col text-xs font-thin opacity-70">
+      <span>AGPL-3.0 License</span>
+      <span>Serafuku.moe</span>
+      </div>
+    </div>
+  );
+}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index f8a5614..8562a3b 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -43,7 +43,7 @@ export default function RootLayout({
   return (
     <html lang="en">
       <body
-        className={`${theJamsil.variable} antialiased font-[family-name:var(--font-the-jamsil)] bg-transparent w-[100vw] h-[100vh] `}
+        className={`${theJamsil.variable} antialiased font-[family-name:var(--font-the-jamsil)] bg-transparent w-[100vw] h-[100vh]`}
       >
         {children}
         <div className="fixed top-0 left-0 bg-transparent w-[100vw] h-[100vh] -z-10">
diff --git a/src/app/page.tsx b/src/app/page.tsx
index c5ca992..82e2361 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -5,6 +5,7 @@ import { useEffect, useState } from "react";
 import { SubmitHandler, useForm } from "react-hook-form";
 import detectInstance from "./api/functions/web/detectInstance";
 import { loginReqDto } from "./_dto/web/login/login.dto";
+import GithubRepoLink from "./_components/github";
 
 interface FormValue {
   address: string;
@@ -125,8 +126,8 @@ export default function Home() {
   }, [ setFormValue ]);
 
   return (
-    <div className="w-screen h-screen absolute flex items-center justify-center p-8">
-      <main className="w-full flex flex-col justify-center items-center">
+    <div className="w-screen h-screen absolute flex flex-col items-center justify-center">
+      <main className="w-full h-full flex flex-col justify-center items-center p-6">
         <div className="mb-4 flex flex-col items-center">
           <div className="relative text-7xl font-bold z-10">
             <h1 className="absolute -inset-0 -z-10 bg-gradient-to-r text-transparent from-red-500 via-fuchsia-500 to-green-500 bg-clip-text blur-lg">
@@ -166,7 +167,7 @@ export default function Home() {
                 required: "required",
               })}
               placeholder="serafuku.moe"
-              className="input input-bordered text-lg desktop:text-3xl mb-4 desktop:mb-0"
+              className="w-full input input-bordered text-lg desktop:text-3xl mb-4 desktop:mb-0"
             />
           </form>
           <div className="flex flex-row items-center">
@@ -199,7 +200,9 @@ export default function Home() {
           </div>
         </div>
       </main>
-      <footer className="row-start-3 flex gap-6 flex-wrap items-center justify-center"></footer>
+      <footer className="w-full row-start-3 flex gap-6 flex-wrap items-center justify-end">
+        <GithubRepoLink />
+      </footer>
     </div>
   );
 }

From f63be07feed5eec7a8a269c24998f12ce0f098d7 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 16:13:36 +0900
Subject: [PATCH 84/89] =?UTF-8?q?=F0=9F=9A=A7=20=EB=B2=84=EA=B7=B8=20?=
 =?UTF-8?q?=ED=94=BD=EC=8A=A4,=20=EB=AF=B8=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?=
 =?UTF-8?q?=EC=B2=98=EB=A6=AC,=20=EA=B8=B0=ED=83=80=20chore=20=EC=B2=98?=
 =?UTF-8?q?=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/question.tsx        |  15 +-
 src/app/main/questions/page.tsx         |  17 ++-
 src/app/main/settings/action.ts         |   2 +-
 src/app/main/settings/page.tsx          | 178 ++++++++++++------------
 src/app/main/user/[handle]/_profile.tsx |  19 +--
 5 files changed, 113 insertions(+), 118 deletions(-)

diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index bae9099..51e20dc 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -1,7 +1,7 @@
 import Link from "next/link";
 import { SubmitHandler, useForm } from "react-hook-form";
 import type { questions, typedAnswer } from "..";
-import { getQuestion, postAnswer } from "../main/questions/action";
+import { postAnswer } from "../main/questions/action";
 import { RefObject } from "react";
 
 interface formValue {
@@ -13,7 +13,7 @@ interface formValue {
 interface askProps {
   singleQuestion: questions;
   multipleQuestions: questions[];
-  setState: React.Dispatch<React.SetStateAction<questions[] | null>>;
+  setQuestions: React.Dispatch<React.SetStateAction<questions[] | undefined | null>>;
   setId: React.Dispatch<React.SetStateAction<number>>;
   deleteRef: RefObject<HTMLDialogElement>;
   answerRef: RefObject<HTMLDialogElement>;
@@ -22,11 +22,12 @@ interface askProps {
 export default function Question({
   singleQuestion,
   multipleQuestions,
-  setState,
+  setQuestions,
   setId,
   deleteRef,
   answerRef,
 }: askProps) {
+
   const {
     register,
     handleSubmit,
@@ -44,6 +45,8 @@ export default function Question({
     },
   });
 
+
+
   const onCtrlEnter = async (e: React.KeyboardEvent) => {
     if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
       const isValid = await trigger();
@@ -52,7 +55,7 @@ export default function Question({
         return;
       } else {
         const value = getValues();
-        if (value) {
+        if (value && !answerRef.current?.open) {          
           await onSubmit(value);
         }
       }
@@ -82,8 +85,8 @@ export default function Question({
       (el) => el.id !== questionId
     );
 
-    setState(filteredQuestions);
-    postAnswer(questionId, typedAnswer);
+    setQuestions(filteredQuestions);
+    await postAnswer(questionId, typedAnswer);    
     answerRef.current?.showModal();
   };
 
diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index b645231..f1fb5a8 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -11,7 +11,6 @@ const fetchQuestions = async () => {
   const res = await fetch("/api/db/fetch-my-questions")
     .then((r) => {
       if (!r.ok) {
-        console.error(`Fail to fetch my questions`);
         return null;
       }
       return r.json();
@@ -21,7 +20,7 @@ const fetchQuestions = async () => {
 };
 
 export default function Questions() {
-  const [questions, setQuestions] = useState<questions[] | null>(null);
+  const [questions, setQuestions] = useState<questions[] | null>();
   const [id, setId] = useState<number>(0);
   const deleteQuestionModalRef = useRef<HTMLDialogElement>(null);
   const answeredQuestionModalRef = useRef<HTMLDialogElement>(null);
@@ -33,13 +32,13 @@ export default function Questions() {
   return (
     <div className="w-[90%] window:w-[80%] desktop:w-[70%] flex flex-col justify-center">
       <h3 className="text-3xl desktop:text-4xl mb-2">미답변 질문들</h3>
-      {questions === undefined || null ? (
-        <div>
-          <span className="loading loading-infinity loading-lg" />
-        </div>
+      {questions === undefined ? (
+            <div className="w-full flex justify-center">
+            <span className="loading loading-spinner loading-lg" />
+          </div>
       ) : (
         <div className="w-full">
-          {questions ? (
+          {questions !== null ? (
             <div>
               {questions.length > 0 ? (
                 <div>
@@ -49,7 +48,7 @@ export default function Questions() {
                         singleQuestion={el}
                         multipleQuestions={questions}
                         setId={setId}
-                        setState={setQuestions}
+                        setQuestions={setQuestions}
                         answerRef={answeredQuestionModalRef}
                         deleteRef={deleteQuestionModalRef}
                       />
@@ -66,7 +65,7 @@ export default function Questions() {
             </div>
           ) : (
             <div className="w-full flex justify-center">
-              <span className="loading loading-spinner loading-lg" />
+              <span className="text-2xl">로그인이 안 되어있어요!</span>
             </div>
           )}
         </div>
diff --git a/src/app/main/settings/action.ts b/src/app/main/settings/action.ts
index 49a9468..8356f8d 100644
--- a/src/app/main/settings/action.ts
+++ b/src/app/main/settings/action.ts
@@ -1,6 +1,5 @@
 "use server";
 
-import { jwtVerify, JWTVerifyResult } from "jose";
 import { cookies } from "next/headers";
 import { FormValue } from "./page";
 import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
@@ -23,6 +22,7 @@ export async function fetchUser() {
     return user;
   } catch (err) {
     logger.error(err);
+    return null;
   }
 }
 
diff --git a/src/app/main/settings/page.tsx b/src/app/main/settings/page.tsx
index 9e9a6b9..5804779 100644
--- a/src/app/main/settings/page.tsx
+++ b/src/app/main/settings/page.tsx
@@ -1,11 +1,11 @@
-"use client";
+'use client';
 
-import NameComponents from "@/app/_components/NameComponents";
+import NameComponents from '@/app/_components/NameComponents';
 
-import { useEffect, useState } from "react";
-import { fetchUser, updateSetting } from "./action";
-import { userProfileDto } from "@/app/_dto/fetch-profile/Profile.dto";
-import { SubmitHandler, useForm } from "react-hook-form";
+import { useEffect, useState } from 'react';
+import { fetchUser, updateSetting } from './action';
+import { userProfileDto } from '@/app/_dto/fetch-profile/Profile.dto';
+import { SubmitHandler, useForm } from 'react-hook-form';
 
 export type FormValue = {
   stopAnonQuestion: boolean;
@@ -41,91 +41,95 @@ export default function Settings() {
 
   return (
     <div className="w-[90%] window:w-[80%] desktop:w-[70%] glass flex flex-col desktop:grid desktop:grid-cols-2 gap-4 rounded-box shadow p-2">
-      <div className="flex flex-col mt-2 desktop:flex-row desktop:ml-4 gap-2 items-center">
-        <div className="avatar">
-          <div className="ring-primary ring-offset-base-100 w-24 h-24 rounded-full ring ring-offset-2">
-            {userInfo?.avatarUrl !== undefined && (
-              <img
-                src={userInfo?.avatarUrl}
-                alt="User Avatar"
-                className="rounded-full"
-              />
-            )}
-          </div>
+      {userInfo === undefined ? (
+        <div className="w-full flex col-span-2 justify-center">
+          <span className="loading loading-spinner loading-lg" />
         </div>
-        <div className="desktop:ml-2 flex flex-col items-center desktop:items-start">
-          <span className="text-xl font-thin">안녕하세요,</span>
-          <div className="flex text-2xl items-center">
-            <NameComponents username={userInfo?.name} width={32} height={32} />
-            님!
-          </div>
-        </div>
-      </div>
-      <div className="flex flex-col items-center">
-        <div className="text-3xl flex justify-center m-4 pb-4 border-b w-full window:w-[90%] desktop:w-full">
-          <span>우리만의 비밀설정창</span>
-        </div>
-        <div className="w-full window:w-[70%] desktop:w-full">
-          {userInfo ? (
-            <form onSubmit={handleSubmit(onSubmit)}>
-              <div className="grid grid-cols-2 gap-2">
-                <span className="font-thin">익명 질문을 받지 않기</span>
-                <input
-                  {...register("stopAnonQuestion")}
-                  type="checkbox"
-                  className="toggle toggle-success"
-                  defaultChecked={userInfo.stopAnonQuestion}
-                />
-                <span className="font-thin">더 이상 질문을 받지 않기</span>
-                <input
-                  {...register("stopNewQuestion")}
-                  type="checkbox"
-                  className="toggle toggle-success"
-                  defaultChecked={userInfo.stopNewQuestion}
-                />
-                <span className="font-thin">새 질문 DM으로 받지 않기</span>
-                <input
-                  {...register("stopNotiNewQuestion")}
-                  type="checkbox"
-                  className="toggle toggle-success"
-                  defaultChecked={userInfo.stopNotiNewQuestion}
-                />
-                <span className="font-thin">내 답변을 올리지 않기</span>
-                <input
-                  {...register("stopPostAnswer")}
-                  type="checkbox"
-                  className="toggle toggle-success"
-                  defaultChecked={userInfo.stopPostAnswer}
-                />
-                <span className="font-thin">질문함 이름 (10글자 이내)</span>
-                <input
-                  {...register("questionBoxName", {
-                    maxLength: 10,
-                  })}
-                  type="text"
-                  placeholder={userInfo?.questionBoxName}
-                  className={`input input-bordered input-sm max-w-full min-w-40 ${
-                    errors.questionBoxName?.type === "maxLength" &&
-                    "input-error"
-                  }`}
-                />
+      ) : (
+        <>
+          {userInfo === null ? (
+            <div className="w-full flex col-span-2 justify-center">
+              <span className="text-2xl">로그인이 안 되어있어요!</span>
+            </div>
+          ) : (
+            <>
+              <div className="flex flex-col mt-2 desktop:flex-row desktop:ml-4 gap-2 items-center">
+                <div className="avatar">
+                  <div className="ring-primary ring-offset-base-100 w-24 h-24 rounded-full ring ring-offset-2">
+                    {userInfo?.avatarUrl !== undefined && (
+                      <img src={userInfo?.avatarUrl} alt="User Avatar" className="rounded-full" />
+                    )}
+                  </div>
+                </div>
+                <div className="desktop:ml-2 flex flex-col items-center desktop:items-start">
+                  <span className="text-xl font-thin">안녕하세요,</span>
+                  <div className="flex text-2xl items-center">
+                    <NameComponents username={userInfo?.name} width={32} height={32} />
+                    님!
+                  </div>
+                </div>
               </div>
-              <div className="flex justify-end mt-2">
-                <button
-                  type="submit"
-                  className={`btn ${
-                    buttonClicked ? "btn-disabled" : "btn-primary"
-                  }`}
-                >
-                  {buttonClicked ? "저장했어요!" : "저장"}
-                </button>
+              <div className="flex flex-col items-center">
+                <div className="text-3xl flex justify-center m-4 pb-4 border-b w-full window:w-[90%] desktop:w-full">
+                  <span>우리만의 비밀설정창</span>
+                </div>
+                <div className="w-full window:w-[70%] desktop:w-full">
+                  {userInfo && (
+                    <form onSubmit={handleSubmit(onSubmit)}>
+                      <div className="grid grid-cols-2 gap-2">
+                        <span className="font-thin">익명 질문을 받지 않기</span>
+                        <input
+                          {...register('stopAnonQuestion')}
+                          type="checkbox"
+                          className="toggle toggle-success"
+                          defaultChecked={userInfo.stopAnonQuestion}
+                        />
+                        <span className="font-thin">더 이상 질문을 받지 않기</span>
+                        <input
+                          {...register('stopNewQuestion')}
+                          type="checkbox"
+                          className="toggle toggle-success"
+                          defaultChecked={userInfo.stopNewQuestion}
+                        />
+                        <span className="font-thin">새 질문 DM으로 받지 않기</span>
+                        <input
+                          {...register('stopNotiNewQuestion')}
+                          type="checkbox"
+                          className="toggle toggle-success"
+                          defaultChecked={userInfo.stopNotiNewQuestion}
+                        />
+                        <span className="font-thin">내 답변을 올리지 않기</span>
+                        <input
+                          {...register('stopPostAnswer')}
+                          type="checkbox"
+                          className="toggle toggle-success"
+                          defaultChecked={userInfo.stopPostAnswer}
+                        />
+                        <span className="font-thin">질문함 이름 (10글자 이내)</span>
+                        <input
+                          {...register('questionBoxName', {
+                            maxLength: 10,
+                          })}
+                          type="text"
+                          placeholder={userInfo?.questionBoxName}
+                          className={`input input-bordered input-sm max-w-full min-w-40 ${
+                            errors.questionBoxName?.type === 'maxLength' && 'input-error'
+                          }`}
+                        />
+                      </div>
+                      <div className="flex justify-end mt-2">
+                        <button type="submit" className={`btn ${buttonClicked ? 'btn-disabled' : 'btn-primary'}`}>
+                          {buttonClicked ? '저장했어요!' : '저장'}
+                        </button>
+                      </div>
+                    </form>
+                  )}
+                </div>
               </div>
-            </form>
-          ) : (
-            <span className="loading loading-spinner loading-lg" />
+            </>
           )}
-        </div>
-      </div>
+        </>
+      )}
     </div>
   );
 }
diff --git a/src/app/main/user/[handle]/_profile.tsx b/src/app/main/user/[handle]/_profile.tsx
index 56d7b35..03e302a 100644
--- a/src/app/main/user/[handle]/_profile.tsx
+++ b/src/app/main/user/[handle]/_profile.tsx
@@ -61,7 +61,6 @@ export default function Profile() {
           await onSubmit(value);
         }
       }
-      questionSuccessModalRef.current?.showModal();
     }
   };
 
@@ -104,21 +103,16 @@ export default function Profile() {
         return;
       }
 
-      if (questionSuccessModalRef.current) {
-        questionSuccessModalRef.current.showModal();
-      } else {
-        alert('오류에요!!!');
-      }
-
       const req: CreateQuestionDto = {
         question: e.question,
         questioner: user_handle,
         questionee: profileHandle,
       };
+      reset()
       const res = await mkQuestionCreateApi(req);
 
       if (res.status === 200) {
-        reset();
+        questionSuccessModalRef.current?.showModal();
       }
     }
     // 작성자 비공개
@@ -138,20 +132,15 @@ export default function Profile() {
           return;
         }
 
-        if (questionSuccessModalRef.current) {
-          questionSuccessModalRef.current.showModal();
-        } else {
-          alert('오류에요!!!');
-        }
-
         const req: CreateQuestionDto = {
           question: e.question,
           questioner: null,
           questionee: profileHandle,
         };
+        reset();
         const res = await mkQuestionCreateApi(req);
         if (res.status === 200) {
-          reset();
+          questionSuccessModalRef.current?.showModal()
         }
       }
     }

From b75e19dd31378186828d3adf8b55020bc57216b7 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 17:34:07 +0900
Subject: [PATCH 85/89] =?UTF-8?q?=F0=9F=A5=85=20=EC=98=A4=EB=A5=98=20?=
 =?UTF-8?q?=ED=95=B8=EB=93=A4=EB=A7=81=20=EA=B0=9C=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/answer.tsx                |  2 +-
 src/app/_components/modalOneButton.tsx        |  4 +-
 .../api/db/fetch-profile/[handle]/route.ts    |  5 +-
 src/app/main/_header.tsx                      | 26 ++--------
 src/app/main/page.tsx                         | 15 ++++--
 src/app/main/questions/page.tsx               | 16 ++++---
 src/app/main/user/[handle]/[answer]/page.tsx  | 47 +++++++++++--------
 src/app/main/user/[handle]/_answers.tsx       | 31 ++++++++----
 src/app/main/user/[handle]/_profile.tsx       | 28 ++++++++---
 src/app/main/user/[handle]/page.tsx           | 14 ++++--
 src/app/page.tsx                              | 18 +++++--
 11 files changed, 124 insertions(+), 82 deletions(-)

diff --git a/src/app/_components/answer.tsx b/src/app/_components/answer.tsx
index e7a47e5..15bc907 100644
--- a/src/app/_components/answer.tsx
+++ b/src/app/_components/answer.tsx
@@ -98,7 +98,7 @@ export default function Answer({ value, idState, ref }: askProps) {
             </Link>
           </div>
           <div className="flex items-center text-sm break-all window:text-xl desktop:text-2xl chat-bubble bg-green-600 text-slate-200">
-            <Link href={`/main/user/${value.answeredPersonHandle}`}>{value.answer}</Link>
+            <Link href={`/main/user/${value.answeredPersonHandle}/${value.id}`}>{value.answer}</Link>
           </div>
           <div className="chat-footer font-thin text-xs mt-2 underline text-blue-900 dark:text-slate-200">
             <Link href={`/main/user/${value.answeredPersonHandle}/${value.id}`}>
diff --git a/src/app/_components/modalOneButton.tsx b/src/app/_components/modalOneButton.tsx
index 1f736ac..3e841a2 100644
--- a/src/app/_components/modalOneButton.tsx
+++ b/src/app/_components/modalOneButton.tsx
@@ -5,6 +5,7 @@ type modalProps = {
   body: string;
   buttonText: string;
   ref: RefObject<HTMLDialogElement>;
+  onClick?: () => void;
 };
 
 export default function DialogModalOneButton({
@@ -12,6 +13,7 @@ export default function DialogModalOneButton({
   body,
   buttonText,
   ref,
+  onClick,
 }: modalProps) {
   return (
     <>
@@ -21,7 +23,7 @@ export default function DialogModalOneButton({
           <p className="py-4">{body}</p>
           <div className="modal-action">
             <form method="dialog">
-              <button className="btn">{buttonText}</button>
+              <button className="btn" onClick={onClick}>{buttonText}</button>
             </form>
           </div>
         </div>
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index 77cd538..c3102c2 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -51,10 +51,7 @@ export async function GET(
       },
     });
     if (!profile) {
-      return NextResponse.json(
-        { message: `profile ${profile} not found` },
-        { status: 404 }
-      );
+      return sendApiError(404, '그런 유저는 없습니다!')
     }
     const { instanceType } = await prisma.server.findUniqueOrThrow({where: {instances: profile.user.hostName}});
     const resBody: userProfileWithHostnameDto = {
diff --git a/src/app/main/_header.tsx b/src/app/main/_header.tsx
index b7c3d84..e9479d5 100644
--- a/src/app/main/_header.tsx
+++ b/src/app/main/_header.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import Link from "next/link";
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { FaUser } from "react-icons/fa";
 import { userProfileMeDto } from "../_dto/fetch-profile/Profile.dto";
 import DialogModalTwoButton from "../_components/modalTwoButton";
@@ -10,7 +10,7 @@ import DialogModalOneButton from "../_components/modalOneButton";
 const logout = async () => {
   await fetch("/api/web/logout");
   localStorage.removeItem("user_handle");
-  window.location.replace("/");
+  window.location.reload();
 };
 
 export default function MainHeader() {
@@ -106,32 +106,12 @@ export default function MainHeader() {
         ref={logoutModalRef}
         onClick={logout}
       />
-      <input
-        type="checkbox"
-        id="forceLogoutNoteModal"
-        className="modal-toggle"
-      />
-      <div className="modal" role="dialog">
-        <div className="modal-box">
-          <h3 className="py-4 text-2xl">
-            로그인 유효시간이 만료되어서 로그아웃 되었어요!
-          </h3>
-          <div className="modal-action">
-            <label
-              htmlFor="forceLogoutNoteModal"
-              className="btn btn-primary"
-              onClick={logout}
-            >
-              홈으로 돌아가기
-            </label>
-          </div>
-        </div>
-      </div>
       <DialogModalOneButton
         title={"자동 로그아웃"}
         body={"로그인 유효시간이 만료되어서 로그아웃 되었어요!"}
         buttonText={"확인"}
         ref={forcedLogoutModalRef}
+        onClick={logout}
       />
     </div>
   );
diff --git a/src/app/main/page.tsx b/src/app/main/page.tsx
index 9ecaed2..ffbc971 100644
--- a/src/app/main/page.tsx
+++ b/src/app/main/page.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { SetStateAction, useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import Answer from "../_components/answer";
 import { FaExclamationCircle } from "react-icons/fa";
 import { answer } from "@prisma/client";
@@ -14,12 +14,17 @@ async function fetchAllAnswers(req: FetchAllAnswersReqDto) {
     },
     body: JSON.stringify(req),
   });
-  if (res.ok) {
-    return (await res.json()) as answer[];
-  } else {
-    console.log("error:", res.status, res.statusText);
+  try {
+    if (res.ok) {
+      return (await res.json()) as answer[];
+    } else {
+      throw new Error(`답변을 불러오는데 실패했어요!: ${await res.text()}`);
+    }
+  } catch (err) {
+    alert(err)
     return [];
   }
+
 }
 export default function MainBody() {
   const [answers, setAnswers] = useState<answer[] | null>(null);
diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index f1fb5a8..bfd14fc 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -9,12 +9,16 @@ import DialogModalOneButton from "@/app/_components/modalOneButton";
 
 const fetchQuestions = async () => {
   const res = await fetch("/api/db/fetch-my-questions")
-    .then((r) => {
-      if (!r.ok) {
-        return null;
-      }
-      return r.json();
-    });
+  
+  try {
+    if (!res.ok) {
+      throw new Error(`내 질문을 불러오는데 실패했어요!: ${await res.text()}`)
+    } else {
+      return await res.json();
+    }
+  } catch (err) {
+    alert(err)
+  }
 
   return res;
 };
diff --git a/src/app/main/user/[handle]/[answer]/page.tsx b/src/app/main/user/[handle]/[answer]/page.tsx
index d93d1da..8446070 100644
--- a/src/app/main/user/[handle]/[answer]/page.tsx
+++ b/src/app/main/user/[handle]/[answer]/page.tsx
@@ -1,22 +1,30 @@
-"use client";
+'use client';
 
-import Answer from "@/app/_components/answer";
-import { useParams } from "next/navigation";
-import { useEffect, useState } from "react";
-import { fetchAnswer } from "./action";
-import { AnswerDto } from "@/app/_dto/Answers.dto";
+import Answer from '@/app/_components/answer';
+import { useParams } from 'next/navigation';
+import { useEffect, useRef, useState } from 'react';
+import { fetchAnswer } from './action';
+import { AnswerDto } from '@/app/_dto/Answers.dto';
+import DialogModalTwoButton from '@/app/_components/modalTwoButton';
 
 export default function SingleAnswer() {
   const [answerBody, setAnswerBody] = useState<AnswerDto>();
+  const singleQuestionDeleteModalRef = useRef<HTMLDialogElement>(null);
   const { answer } = useParams() as { answer: string };
 
   const handleDeleteAnswer = async (id: string) => {
-    const res = await fetch("/api/db/delete-answer", {
-      method: "POST",
+    const res = await fetch('/api/db/delete-answer', {
+      method: 'POST',
       body: JSON.stringify({ id: id }),
     });
-    if (res.ok) {
-      window.history.back();
+    try {
+      if (res.ok) {
+        window.history.back();
+      } else {
+        throw new Error(`답변을 지우는데 실패했어요! ${await res.text()}`);
+      }
+    } catch (err) {
+      alert(err);
     }
   };
 
@@ -28,12 +36,16 @@ export default function SingleAnswer() {
     <div className="flex w-[90%] window:w-[80%] desktop:w-[70%]">
       {answerBody && (
         <>
-          <Answer value={answerBody} id={answerBody.id} />
-          <input
-            type="checkbox"
-            id={`answer_delete_modal_${answerBody.id}`}
-            className="modal-toggle"
+          <Answer value={answerBody} id={answerBody.id} ref={singleQuestionDeleteModalRef} />
+          <DialogModalTwoButton
+            title={'답변 지우기'}
+            body={'답변을 지울까요...?'}
+            confirmButtonText={'확인'}
+            cancelButtonText={'취소'}
+            ref={singleQuestionDeleteModalRef}
+            onClick={() => handleDeleteAnswer(answerBody.id)}
           />
+          <input type="checkbox" id={`answer_delete_modal_${answerBody.id}`} className="modal-toggle" />
           <div className="modal" role="dialog">
             <div className="modal-box">
               <h3 className="py-4 text-2xl">답변을 지울까요...?</h3>
@@ -45,10 +57,7 @@ export default function SingleAnswer() {
                 >
                   확인
                 </label>
-                <label
-                  htmlFor={`answer_delete_modal_${answerBody.id}`}
-                  className="btn"
-                >
+                <label htmlFor={`answer_delete_modal_${answerBody.id}`} className="btn">
                   취소
                 </label>
               </div>
diff --git a/src/app/main/user/[handle]/_answers.tsx b/src/app/main/user/[handle]/_answers.tsx
index d10f546..ad6a18c 100644
--- a/src/app/main/user/[handle]/_answers.tsx
+++ b/src/app/main/user/[handle]/_answers.tsx
@@ -15,11 +15,17 @@ type ResponseType = {
 
 async function fetchProfile(handle: string) {
   const profile = await fetch(`/api/db/fetch-profile/${handle}`);
-  if (profile && profile.ok) {
-    return profile.json() as unknown as userProfileWithHostnameDto;
-  } else {
+  try {
+    if (profile.ok) {
+      return profile.json() as unknown as userProfileWithHostnameDto;
+    } else {
+      throw new Error(`프로필이 없습니다! ${await profile.text()}`);
+    }
+  } catch (err) {
+    alert(err);
     return undefined;
   }
+
 }
 
 export default function UserPage() {
@@ -40,18 +46,27 @@ export default function UserPage() {
       method: 'POST',
       body: JSON.stringify(q),
     });
-    if (res.ok) {
-      return res.json();
-    } else {
-      throw new Error(`fetch-user-answers fail! ${res.status}, ${res.statusText}`);
+    try {
+      if (res.ok) {
+        return res.json();
+      } else {
+        throw new Error(`fetch-user-answers fail! ${res.status}, ${res.statusText}`);
+      }
+    } catch (err) {
+      alert(err);
+      return {answers: [], count: 0};
     }
   };
 
   const handleDeleteAnswer = async (id: string) => {
-    await fetch('/api/db/delete-answer', {
+    const res = await fetch('/api/db/delete-answer', {
       method: 'POST',
       body: JSON.stringify({ id: id }),
     });
+    if (!res.ok) {
+      alert(`답변을 삭제하는데 실패하였습니다! ${await res.text()}`);
+      return;
+    }
     if (answers && count) {
       const filteredAnswer = answers.filter((el) => el.id !== id);
       setAnswers(filteredAnswer);
diff --git a/src/app/main/user/[handle]/_profile.tsx b/src/app/main/user/[handle]/_profile.tsx
index 03e302a..c4e7813 100644
--- a/src/app/main/user/[handle]/_profile.tsx
+++ b/src/app/main/user/[handle]/_profile.tsx
@@ -14,12 +14,18 @@ type FormValue = {
 };
 
 async function fetchProfile(handle: string) {
-  const profile = await fetch(`/api/db/fetch-profile/${handle}`);
-  if (profile && profile.ok) {
-    return profile.json() as unknown as userProfileWithHostnameDto;
-  } else {
+  const res = await fetch(`/api/db/fetch-profile/${handle}`);
+  try {
+    if (res && res.ok) {
+      return res.json() as unknown as userProfileWithHostnameDto;
+    } else {
+      throw new Error(`프로필을 불러오는데 실패했습니다! ${await res.text()}`);
+    }
+  } catch (err) {
+    alert(err)
     return undefined;
   }
+
 }
 
 export default function Profile() {
@@ -68,8 +74,17 @@ export default function Profile() {
     const res = await fetch('/api/db/create-question', {
       method: 'POST',
       body: JSON.stringify(q),
-    });
-    return res;
+    })
+    try {
+      if (res.ok) {
+        return res;
+      } else {
+        throw new Error(`질문을 보내는데 실패했어요! ${await res.text()}`);
+      }
+    } catch (err) {
+      alert(err);
+      return res;
+    }
   };
 
   const shareUrl = () => {
@@ -110,7 +125,6 @@ export default function Profile() {
       };
       reset()
       const res = await mkQuestionCreateApi(req);
-
       if (res.status === 200) {
         questionSuccessModalRef.current?.showModal();
       }
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 8e5dffb..1668389 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -7,12 +7,18 @@ import { useParams } from 'next/navigation';
 import { userProfileWithHostnameDto } from '@/app/_dto/fetch-profile/Profile.dto';
 
 async function fetchProfile(handle: string) {
-  const profile = await fetch(`/api/db/fetch-profile/${handle}`);
-  if (profile && profile.ok) {
-    return profile.json() as unknown as userProfileWithHostnameDto;
-  } else {
+  const res = await fetch(`/api/db/fetch-profile/${handle}`);
+  try {
+    if (res && res.ok) {
+      return res.json() as unknown as userProfileWithHostnameDto;
+    } else {
+      throw new Error(`사용자를 불러오는데 실패했어요! ${await res.text()}`);
+    }
+  } catch (err) {
+    alert(err)
     return null;
   }
+
 }
 
 export default function ProfilePage() {
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 82e2361..9ef7d96 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,11 +1,12 @@
 "use client";
 
 import { useRouter } from "next/navigation";
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { SubmitHandler, useForm } from "react-hook-form";
 import detectInstance from "./api/functions/web/detectInstance";
 import { loginReqDto } from "./_dto/web/login/login.dto";
 import GithubRepoLink from "./_components/github";
+import DialogModalOneButton from "./_components/modalOneButton";
 
 interface FormValue {
   address: string;
@@ -65,6 +66,8 @@ function urlToHost(urlOrHost: string) {
 
 export default function Home() {
   const [isLoading, setIsLoading] = useState<boolean>(false);
+  const [errMessage ,setErrorMessage] = useState<string>()
+  const errModalRef = useRef<HTMLDialogElement>(null);
   const router = useRouter();
   const {
     register,
@@ -89,7 +92,9 @@ export default function Home() {
             setIsLoading(false);
             router.replace(r.url);
           }).catch((err) => {
-            window.alert(err);
+            setIsLoading(false);
+            setErrorMessage(err);
+            errModalRef.current?.showModal()
           });
           break;
         case "cherrypick":
@@ -98,7 +103,9 @@ export default function Home() {
             setIsLoading(false);
             router.replace(r.url);
           }).catch((err) => {
-            window.alert(err);
+            setIsLoading(false);
+            setErrorMessage(err);
+            errModalRef.current?.showModal()
           });
           break;
         case "mastodon":
@@ -106,7 +113,9 @@ export default function Home() {
           mastodonAuth(payload).then((r) => {
             router.replace(r);
           }).catch((err) => {
-            window.alert(err);
+            setIsLoading(false);
+            setErrorMessage(err);
+            errModalRef.current?.showModal()
           });
           break;
         default:
@@ -203,6 +212,7 @@ export default function Home() {
       <footer className="w-full row-start-3 flex gap-6 flex-wrap items-center justify-end">
         <GithubRepoLink />
       </footer>
+      <DialogModalOneButton title={"오류"} body={`로그인 오류가 발생했어요! ${errMessage}`} buttonText={"확인"} ref={errModalRef} />
     </div>
   );
 }

From 44caaf5181552bd4e75032d44e8e7f9f96d82da9 Mon Sep 17 00:00:00 2001
From: Squarecat-meow <yozumina@serafuku.moe>
Date: Sat, 23 Nov 2024 17:57:28 +0900
Subject: [PATCH 86/89] =?UTF-8?q?=EC=9C=A0=EC=A0=80=20=EC=9B=90=EB=B3=B8?=
 =?UTF-8?q?=20=ED=94=84=EB=A1=9C=ED=95=84=20=EB=B3=B4=EA=B8=B0=20=EB=A7=81?=
 =?UTF-8?q?=ED=81=AC=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/user/[handle]/_profile.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/main/user/[handle]/_profile.tsx b/src/app/main/user/[handle]/_profile.tsx
index c4e7813..f7096b6 100644
--- a/src/app/main/user/[handle]/_profile.tsx
+++ b/src/app/main/user/[handle]/_profile.tsx
@@ -173,7 +173,7 @@ export default function Profile() {
         <div className="flex flex-col items-center gap-2 py-2">
           {userProfile && userProfile.avatarUrl ? (
             <div className="flex w-full h-24">
-              <Link href={`https://${userProfile.hostname}/${userProfile.handle}`}>
+              <Link href={`https://${userProfile.hostname}/${userProfile.handle.match(/^@([^@ ]){1,100}/g)?.[0]}`}>
                 <img
                   src={userProfile.avatarUrl}
                   alt="User Avatar"

From 88a3e7edba6ba02188d1689a7ec98b5d3334d186 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 18:02:02 +0900
Subject: [PATCH 87/89] =?UTF-8?q?=EC=BD=94=EB=93=9C=20=ED=8F=AC=EB=A7=B7?=
 =?UTF-8?q?=ED=8C=85=20=ED=86=B5=EC=9D=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/_components/NameComponents.tsx        |   2 +-
 src/app/_components/github.tsx                |  16 +-
 src/app/_components/modalOneButton.tsx        |  14 +-
 src/app/_components/modalTwoButton.tsx        |   2 +-
 src/app/_components/question.tsx              |  73 ++++----
 src/app/_dto/Answers.dto.ts                   |   4 +-
 .../create_question/create-question.dto.ts    |   4 +-
 .../_dto/delete-answer/delete-answer.dto.ts   |   2 +-
 .../fetch-all-answers.dto.ts                  |   6 +-
 .../fetch-name-with-emoji.dto.ts              |   8 +-
 src/app/_dto/fetch-profile/Profile.dto.ts     |   2 +-
 .../fetch-user-answers.dto.ts                 |  38 ++---
 .../callback-token-claim.dto.ts               |   2 +-
 .../callback-token-claim.dto.ts               |   2 +-
 .../_dto/misskey-callback/user-info.dto.ts    |   2 +-
 src/app/_dto/web/login/login.dto.ts           |   8 +-
 src/app/api/db/create-question/route.ts       |  52 +++---
 src/app/api/db/delete-answer/route.ts         |  31 ++--
 src/app/api/db/fetch-all-answers/route.ts     |  27 ++-
 src/app/api/db/fetch-my-profile/route.ts      |  34 ++--
 src/app/api/db/fetch-my-questions/route.ts    |  14 +-
 .../api/db/fetch-profile/[handle]/route.ts    |  36 ++--
 src/app/api/db/fetch-user-answers/route.ts    |  32 ++--
 src/app/api/functions/josa.ts                 |  11 +-
 src/app/api/functions/web/detectInstance.ts   |  16 +-
 src/app/api/functions/web/errorResponse.ts    |   6 +-
 src/app/api/functions/web/fetchUsername.ts    |   9 +-
 src/app/api/functions/web/verify-jwt.ts       |  19 +--
 .../api/web/fetch-name-with-emoji/route.ts    |  46 +++--
 src/app/api/web/logout/route.ts               |  12 +-
 src/app/api/web/mastodon-login/route.ts       |  58 +++----
 src/app/api/web/misskey-login/route.ts        |  68 +++-----
 src/app/index.d.ts                            |  12 +-
 src/app/layout.tsx                            |  30 ++--
 src/app/main/_header.tsx                      |  48 +++---
 src/app/main/layout.tsx                       |   8 +-
 src/app/main/page.tsx                         |  48 +++---
 src/app/main/questions/action.ts              | 122 +++++---------
 src/app/main/questions/layout.tsx             |   6 +-
 src/app/main/questions/page.tsx               |  52 +++---
 src/app/main/settings/action.ts               |  18 +-
 src/app/main/settings/layout.tsx              |   6 +-
 src/app/main/user/[handle]/[answer]/action.ts |   4 +-
 src/app/main/user/[handle]/_answers.tsx       |   3 +-
 src/app/main/user/[handle]/_profile.tsx       |   9 +-
 src/app/main/user/[handle]/layout.tsx         |   6 +-
 src/app/main/user/[handle]/page.tsx           |   3 +-
 src/app/mastodon-callback/action.ts           |  70 ++++----
 src/app/mastodon-callback/page.tsx            |  34 ++--
 src/app/misskey-callback/actions.ts           |  85 ++++------
 src/app/misskey-callback/page.tsx             |  36 ++--
 src/app/page.tsx                              | 157 +++++++++---------
 src/utils/apiErrorResponse/sendApiError.ts    |   2 +-
 src/utils/getIp/get-ip-from-Request.ts        |   8 +-
 src/utils/getIp/get-ip-hash.ts                |  20 +--
 .../getPrismaClient/get-prisma-client.ts      |   6 +-
 src/utils/ratelimiter/rateLimiter.ts          |  31 ++--
 src/utils/validator/strictValidator.ts        |  30 ++--
 58 files changed, 655 insertions(+), 855 deletions(-)

diff --git a/src/app/_components/NameComponents.tsx b/src/app/_components/NameComponents.tsx
index e084abb..081b995 100644
--- a/src/app/_components/NameComponents.tsx
+++ b/src/app/_components/NameComponents.tsx
@@ -11,7 +11,7 @@ export default function NameComponents({ username, width, height }: username) {
         <div className="flex items-center">
           {username?.map((el, key) => (
             <div key={key}>
-              {el.toString().substring(0, 8) === "https://" ? (
+              {el.toString().substring(0, 8) === 'https://' ? (
                 <img
                   className={`mx-1`}
                   style={{ width: width, height: height }}
diff --git a/src/app/_components/github.tsx b/src/app/_components/github.tsx
index 5e35b6e..f0ad56f 100644
--- a/src/app/_components/github.tsx
+++ b/src/app/_components/github.tsx
@@ -1,11 +1,17 @@
-import Link from "next/link";
+import Link from 'next/link';
 
 export default function GithubRepoLink() {
   return (
     <div className="flex flex-col gap-2">
-      <Link href='https://github.com/serafuku/neo-quesdon' className="flex items-center gap-2 opacity-70">
+      <Link href="https://github.com/serafuku/neo-quesdon" className="flex items-center gap-2 opacity-70">
         <div>
-          <svg width="15" height="15" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" className="fill-black dark:fill-white">
+          <svg
+            width="15"
+            height="15"
+            viewBox="0 0 1024 1024"
+            xmlns="http://www.w3.org/2000/svg"
+            className="fill-black dark:fill-white"
+          >
             <path
               fillRule="evenodd"
               clipRule="evenodd"
@@ -17,8 +23,8 @@ export default function GithubRepoLink() {
         <div className="text-xs underline">Github</div>
       </Link>
       <div className="flex flex-col text-xs font-thin opacity-70">
-      <span>AGPL-3.0 License</span>
-      <span>Serafuku.moe</span>
+        <span>AGPL-3.0 License</span>
+        <span>Serafuku.moe</span>
       </div>
     </div>
   );
diff --git a/src/app/_components/modalOneButton.tsx b/src/app/_components/modalOneButton.tsx
index 3e841a2..8a5a489 100644
--- a/src/app/_components/modalOneButton.tsx
+++ b/src/app/_components/modalOneButton.tsx
@@ -1,4 +1,4 @@
-import { RefObject } from "react";
+import { RefObject } from 'react';
 
 type modalProps = {
   title: string;
@@ -8,13 +8,7 @@ type modalProps = {
   onClick?: () => void;
 };
 
-export default function DialogModalOneButton({
-  title,
-  body,
-  buttonText,
-  ref,
-  onClick,
-}: modalProps) {
+export default function DialogModalOneButton({ title, body, buttonText, ref, onClick }: modalProps) {
   return (
     <>
       <dialog ref={ref} className="modal">
@@ -23,7 +17,9 @@ export default function DialogModalOneButton({
           <p className="py-4">{body}</p>
           <div className="modal-action">
             <form method="dialog">
-              <button className="btn" onClick={onClick}>{buttonText}</button>
+              <button className="btn" onClick={onClick}>
+                {buttonText}
+              </button>
             </form>
           </div>
         </div>
diff --git a/src/app/_components/modalTwoButton.tsx b/src/app/_components/modalTwoButton.tsx
index 82afaf9..254fa1a 100644
--- a/src/app/_components/modalTwoButton.tsx
+++ b/src/app/_components/modalTwoButton.tsx
@@ -1,4 +1,4 @@
-import { RefObject } from "react";
+import { RefObject } from 'react';
 
 type modalProps = {
   title: string;
diff --git a/src/app/_components/question.tsx b/src/app/_components/question.tsx
index 51e20dc..3a597d4 100644
--- a/src/app/_components/question.tsx
+++ b/src/app/_components/question.tsx
@@ -1,13 +1,13 @@
-import Link from "next/link";
-import { SubmitHandler, useForm } from "react-hook-form";
-import type { questions, typedAnswer } from "..";
-import { postAnswer } from "../main/questions/action";
-import { RefObject } from "react";
+import Link from 'next/link';
+import { SubmitHandler, useForm } from 'react-hook-form';
+import type { questions, typedAnswer } from '..';
+import { postAnswer } from '../main/questions/action';
+import { RefObject } from 'react';
 
 interface formValue {
   answer: string;
   nsfw: boolean;
-  visibility: "public" | "home" | "followers";
+  visibility: 'public' | 'home' | 'followers';
 }
 
 interface askProps {
@@ -27,7 +27,6 @@ export default function Question({
   deleteRef,
   answerRef,
 }: askProps) {
-
   const {
     register,
     handleSubmit,
@@ -39,38 +38,36 @@ export default function Question({
     formState: { errors },
   } = useForm<formValue>({
     defaultValues: {
-      answer: "",
+      answer: '',
       nsfw: false,
-      visibility: "public",
+      visibility: 'public',
     },
   });
 
-
-
   const onCtrlEnter = async (e: React.KeyboardEvent) => {
-    if (e.key === "Enter" && (e.ctrlKey || e.metaKey)) {
+    if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
       const isValid = await trigger();
 
       if (isValid === false) {
         return;
       } else {
         const value = getValues();
-        if (value && !answerRef.current?.open) {          
+        if (value && !answerRef.current?.open) {
           await onSubmit(value);
         }
       }
     }
   };
 
-  const nsfwedAnswer = watch("nsfw");
+  const nsfwedAnswer = watch('nsfw');
 
   const onSubmit: SubmitHandler<formValue> = async (e) => {
     const detectWhiteSpaces = new RegExp(/^\s+$/);
 
     if (detectWhiteSpaces.test(e.answer) === true) {
-      setError("answer", {
-        type: "answerOnlyWhiteSpace",
-        message: "답변에 아무말 안 하시게요...?",
+      setError('answer', {
+        type: 'answerOnlyWhiteSpace',
+        message: '답변에 아무말 안 하시게요...?',
       });
       return;
     }
@@ -81,12 +78,10 @@ export default function Question({
       nsfwedAnswer: e.nsfw,
       visibility: e.visibility,
     };
-    const filteredQuestions = multipleQuestions.filter(
-      (el) => el.id !== questionId
-    );
+    const filteredQuestions = multipleQuestions.filter((el) => el.id !== questionId);
 
     setQuestions(filteredQuestions);
-    await postAnswer(questionId, typedAnswer);    
+    await postAnswer(questionId, typedAnswer);
     answerRef.current?.showModal();
   };
 
@@ -95,18 +90,16 @@ export default function Question({
       <div className="text-2xl chat chat-start">
         <div className="chat-header dark:text-slate-100">
           {singleQuestion.questioner ? (
-            <Link href={`/main/user/${singleQuestion.questioner}`}>
-              {singleQuestion.questioner}
-            </Link>
+            <Link href={`/main/user/${singleQuestion.questioner}`}>{singleQuestion.questioner}</Link>
           ) : (
-            "익명의 질문자"
+            '익명의 질문자'
           )}
         </div>
         <div className="chat-bubble flex items-center text-sm window:text-xl desktop:text-2xl text-slate-200">
           {singleQuestion.question}
         </div>
         <div className="chat-footer opacity-50 dark:text-slate-100 dark:opacity-80">
-          {new Date(singleQuestion.questionedAt).toLocaleString('ko-KR', {hour12: false})}
+          {new Date(singleQuestion.questionedAt).toLocaleString('ko-KR', { hour12: false })}
           <span
             className="text-red-500 font-bold ml-2 cursor-pointer"
             onClick={() => {
@@ -120,21 +113,15 @@ export default function Question({
       </div>
       <div className="text-2xl chat chat-end">
         <div className="chat-bubble bg-green-600 text-slate-300 dark:text-slate-200">
-          <form
-            onSubmit={handleSubmit(onSubmit)}
-            className="flex flex-col gap-2 py-2"
-          >
-            {errors.answer && errors.answer.type === "answerOnlyWhiteSpace" && (
-              <div
-                className="tooltip tooltip-open tooltip-error transition-opacity"
-                data-tip={errors.answer.message}
-              />
+          <form onSubmit={handleSubmit(onSubmit)} className="flex flex-col gap-2 py-2">
+            {errors.answer && errors.answer.type === 'answerOnlyWhiteSpace' && (
+              <div className="tooltip tooltip-open tooltip-error transition-opacity" data-tip={errors.answer.message} />
             )}
             <textarea
-              {...register("answer", { required: "required" })}
+              {...register('answer', { required: 'required' })}
               tabIndex={0}
               className={`textarea textarea-sm text-sm h-24 desktop:h-32 window:text-xl desktop:text-2xl bg-transparent ${
-                errors.answer && "textarea-error"
+                errors.answer && 'textarea-error'
               }`}
               placeholder="답변을 입력하세요..."
               onKeyDown={onCtrlEnter}
@@ -146,16 +133,12 @@ export default function Question({
                   <input
                     type="checkbox"
                     className="toggle toggle-accent"
-                    onClick={() => setValue("nsfw", !nsfwedAnswer)}
+                    onClick={() => setValue('nsfw', !nsfwedAnswer)}
                   />
-                  <input type="hidden" {...register("nsfw")} />
+                  <input type="hidden" {...register('nsfw')} />
                   <span className="text-sm desktop:text-xl">NSFW로 체크</span>
                 </div>
-                <select
-                  {...register("visibility")}
-                  className="select select-ghost select-sm"
-                  defaultValue={"public"}
-                >
+                <select {...register('visibility')} className="select select-ghost select-sm" defaultValue={'public'}>
                   <option value="public">공개</option>
                   <option value="home">홈</option>
                   <option value="followers">팔로워</option>
@@ -163,7 +146,7 @@ export default function Question({
               </div>
               <div className="w-full desktop:w-fit flex justify-center">
                 <button
-                  type={"submit"}
+                  type={'submit'}
                   className="btn btn-outline dark:border-white dark:text-slate-200 btn-sm h-10 w-16 desktop:btn-md"
                 >
                   답변
diff --git a/src/app/_dto/Answers.dto.ts b/src/app/_dto/Answers.dto.ts
index 03d5475..cd644f8 100644
--- a/src/app/_dto/Answers.dto.ts
+++ b/src/app/_dto/Answers.dto.ts
@@ -1,4 +1,4 @@
-import { profile } from "@prisma/client";
+import { profile } from '@prisma/client';
 
 export interface AnswerDto {
   id: string;
@@ -12,4 +12,4 @@ export interface AnswerDto {
 
 export interface AnswerWithProfileDto extends AnswerDto {
   answeredPerson?: profile;
-}
\ No newline at end of file
+}
diff --git a/src/app/_dto/create_question/create-question.dto.ts b/src/app/_dto/create_question/create-question.dto.ts
index 67de6fd..1a1bcce 100644
--- a/src/app/_dto/create_question/create-question.dto.ts
+++ b/src/app/_dto/create_question/create-question.dto.ts
@@ -1,10 +1,10 @@
-import { IsString, ValidateIf } from "class-validator";
+import { IsString, ValidateIf } from 'class-validator';
 
 export class CreateQuestionDto {
   @IsString()
   question: string;
 
-  @ValidateIf((o,v) => v)
+  @ValidateIf((o, v) => v)
   @IsString()
   questioner: string | null;
 
diff --git a/src/app/_dto/delete-answer/delete-answer.dto.ts b/src/app/_dto/delete-answer/delete-answer.dto.ts
index 36f63ba..9b30911 100644
--- a/src/app/_dto/delete-answer/delete-answer.dto.ts
+++ b/src/app/_dto/delete-answer/delete-answer.dto.ts
@@ -1,4 +1,4 @@
-import { IsString } from "class-validator";
+import { IsString } from 'class-validator';
 
 export class DeleteAnswerDto {
   @IsString()
diff --git a/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts b/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts
index 933344a..10c7b46 100644
--- a/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts
+++ b/src/app/_dto/fetch-all-answers/fetch-all-answers.dto.ts
@@ -1,4 +1,4 @@
-import { IsEnum, IsInt, IsOptional, IsString, Max, Min } from "class-validator";
+import { IsEnum, IsInt, IsOptional, IsString, Max, Min } from 'class-validator';
 
 export class FetchAllAnswersReqDto {
   @IsOptional()
@@ -10,8 +10,8 @@ export class FetchAllAnswersReqDto {
   untilId?: string;
 
   @IsOptional()
-  @IsEnum(["ASC", "DESC"])
-  sort?: "ASC" | "DESC";
+  @IsEnum(['ASC', 'DESC'])
+  sort?: 'ASC' | 'DESC';
 
   @IsOptional()
   @IsInt()
diff --git a/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts b/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts
index 6879b9f..6d88987 100644
--- a/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts
+++ b/src/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto.ts
@@ -1,10 +1,4 @@
-import {
-  IsArray,
-  IsBoolean,
-  IsOptional,
-  IsString,
-  ValidateIf,
-} from "class-validator";
+import { IsArray, IsBoolean, IsOptional, IsString, ValidateIf } from 'class-validator';
 
 class mastodonEmojiModel {
   @IsString()
diff --git a/src/app/_dto/fetch-profile/Profile.dto.ts b/src/app/_dto/fetch-profile/Profile.dto.ts
index ef31f53..48f6c77 100644
--- a/src/app/_dto/fetch-profile/Profile.dto.ts
+++ b/src/app/_dto/fetch-profile/Profile.dto.ts
@@ -1,4 +1,4 @@
-import { $Enums } from "@prisma/client";
+import { $Enums } from '@prisma/client';
 export interface userProfileDto {
   handle: string;
   name: string[];
diff --git a/src/app/_dto/fetch-user-answers/fetch-user-answers.dto.ts b/src/app/_dto/fetch-user-answers/fetch-user-answers.dto.ts
index 8b9f84c..acd3b92 100644
--- a/src/app/_dto/fetch-user-answers/fetch-user-answers.dto.ts
+++ b/src/app/_dto/fetch-user-answers/fetch-user-answers.dto.ts
@@ -1,25 +1,25 @@
-import { IsEnum, IsIn, IsInt, IsNotEmpty, IsOptional, IsString, Max, Min } from "class-validator";
+import { IsEnum, IsIn, IsInt, IsNotEmpty, IsOptional, IsString, Max, Min } from 'class-validator';
 
 export class FetchUserAnswersDto {
-    @IsOptional()
-    @IsString()
-    sinceId?: string;
+  @IsOptional()
+  @IsString()
+  sinceId?: string;
 
-    @IsOptional()
-    @IsString()
-    untilId?: string;
+  @IsOptional()
+  @IsString()
+  untilId?: string;
 
-    @IsOptional()
-    @IsEnum(['ASC', 'DESC'])
-    sort?: 'ASC' | 'DESC'
+  @IsOptional()
+  @IsEnum(['ASC', 'DESC'])
+  sort?: 'ASC' | 'DESC';
 
-    @IsOptional()
-    @IsInt()
-    @Min(1)
-    @Max(100)
-    limit?: number;
+  @IsOptional()
+  @IsInt()
+  @Min(1)
+  @Max(100)
+  limit?: number;
 
-    @IsString()
-    @IsNotEmpty()
-    answeredPersonHandle: string;
-}
\ No newline at end of file
+  @IsString()
+  @IsNotEmpty()
+  answeredPersonHandle: string;
+}
diff --git a/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts b/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts
index 7373fdc..e9d8fc9 100644
--- a/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts
+++ b/src/app/_dto/mastodon-callback/callback-token-claim.dto.ts
@@ -1,4 +1,4 @@
-import { IsString } from "class-validator";
+import { IsString } from 'class-validator';
 
 export class mastodonCallbackTokenClaimPayload {
   /** Mastodon code를 요청할 mastodon의 host (예: planet.moe) */
diff --git a/src/app/_dto/misskey-callback/callback-token-claim.dto.ts b/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
index 06a9c73..222e8cf 100644
--- a/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
+++ b/src/app/_dto/misskey-callback/callback-token-claim.dto.ts
@@ -1,4 +1,4 @@
-import { IsString } from "class-validator";
+import { IsString } from 'class-validator';
 
 export class misskeyCallbackTokenClaimPayload {
   /** Misskey Access key 를 요청할 misskey의 host (예: serafuku.moe) */
diff --git a/src/app/_dto/misskey-callback/user-info.dto.ts b/src/app/_dto/misskey-callback/user-info.dto.ts
index 5fb80e1..96ff146 100644
--- a/src/app/_dto/misskey-callback/user-info.dto.ts
+++ b/src/app/_dto/misskey-callback/user-info.dto.ts
@@ -1,4 +1,4 @@
-import type { MiUser } from "@/app/api/misskey-entities/user";
+import type { MiUser } from '@/app/api/misskey-entities/user';
 
 export class misskeyUserInfoPayload {
   user: MiUser;
diff --git a/src/app/_dto/web/login/login.dto.ts b/src/app/_dto/web/login/login.dto.ts
index 9d7d9a1..33137dd 100644
--- a/src/app/_dto/web/login/login.dto.ts
+++ b/src/app/_dto/web/login/login.dto.ts
@@ -1,15 +1,15 @@
-import { Transform } from "class-transformer";
-import { IsNotEmpty, IsString } from "class-validator";
+import { Transform } from 'class-transformer';
+import { IsNotEmpty, IsString } from 'class-validator';
 
 export class loginReqDto {
   @Transform((param) => {
     // https://example.com/ 같은 형식으로 온 경우 Host 형식으로 변환
-    if (typeof param.value === "string") {
+    if (typeof param.value === 'string') {
       const v = param.value;
       const re = /\/\/[^/@\s]+(:[0-9]{1,5})?\/?/;
       const matched_str = v.match(re)?.[0];
       if (matched_str) {
-        return matched_str.replaceAll("/", "");
+        return matched_str.replaceAll('/', '');
       }
       return v;
     }
diff --git a/src/app/api/db/create-question/route.ts b/src/app/api/db/create-question/route.ts
index 940fcd9..87f86d1 100644
--- a/src/app/api/db/create-question/route.ts
+++ b/src/app/api/db/create-question/route.ts
@@ -1,21 +1,23 @@
-import { CreateQuestionDto } from "@/app/_dto/create_question/create-question.dto";
-import type { user } from "@prisma/client";
-import { type NextRequest, NextResponse } from "next/server";
-import { verifyToken } from "../../functions/web/verify-jwt";
-import { validateStrict } from "@/utils/validator/strictValidator";
-import { sendErrorResponse } from "../../functions/web/errorResponse";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
-import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
-import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
-import { getIpHash } from "@/utils/getIp/get-ip-hash";
+import { CreateQuestionDto } from '@/app/_dto/create_question/create-question.dto';
+import type { user } from '@prisma/client';
+import { type NextRequest, NextResponse } from 'next/server';
+import { verifyToken } from '../../functions/web/verify-jwt';
+import { validateStrict } from '@/utils/validator/strictValidator';
+import { sendErrorResponse } from '../../functions/web/errorResponse';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
+import { RateLimiterService } from '@/utils/ratelimiter/rateLimiter';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
+import { getIpFromRequest } from '@/utils/getIp/get-ip-from-Request';
+import { getIpHash } from '@/utils/getIp/get-ip-hash';
 const logger = new Logger('create-question');
 
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
-  const token = req.cookies.get("jwtToken")?.value;
-  const tokenPayload = await verifyToken(token).then((payload) => payload).catch(()=> {});
+  const token = req.cookies.get('jwtToken')?.value;
+  const tokenPayload = await verifyToken(token)
+    .then((payload) => payload)
+    .catch(() => {});
   if (tokenPayload) {
     const limiter = RateLimiterService.getLimiter();
     const limited = await limiter.limit(`create-question-${tokenPayload.handle}`, {
@@ -57,9 +59,9 @@ export async function POST(req: NextRequest) {
     });
 
     if (questionee_profile.stopAnonQuestion && !data.questioner) {
-      throw new Error("The user has prohibits anonymous questions.");
+      throw new Error('The user has prohibits anonymous questions.');
     } else if (questionee_profile.stopNewQuestion) {
-      throw new Error("User stops NewQuestion");
+      throw new Error('User stops NewQuestion');
     }
 
     // 제시된 questioner 핸들이 JWT토큰의 핸들과 일치하는지 검사
@@ -68,9 +70,7 @@ export async function POST(req: NextRequest) {
         if (!tokenPayload) {
           throw new Error(`No Auth Token`);
         }
-        if (
-          tokenPayload.handle.toLowerCase() !== data.questioner.toLowerCase()
-        ) {
+        if (tokenPayload.handle.toLowerCase() !== data.questioner.toLowerCase()) {
           throw new Error(`Token and questioner not match`);
         }
       } catch (err) {
@@ -111,23 +111,19 @@ export async function POST(req: NextRequest) {
   }
 }
 
-async function sendNotify(
-  questionee: user,
-  question: string,
-  url: string
-): Promise<void> {
+async function sendNotify(questionee: user, question: string, url: string): Promise<void> {
   const notify_host = process.env.NOTI_HOST;
   logger.log(`try to send notification to ${questionee.handle}`);
   try {
     const res = await fetch(`https://${notify_host}/api/notes/create`, {
-      method: "POST",
+      method: 'POST',
       headers: {
         authorization: `Bearer ${process.env.NOTI_TOKEN}`,
-        "Content-Type": "application/json",
+        'Content-Type': 'application/json',
       },
       body: JSON.stringify({
         visibleUserIds: [questionee.userId],
-        visibility: "specified",
+        visibility: 'specified',
         text: `${questionee.handle} <네오-퀘스돈> 새로운 질문이에요!\nQ. ${question}\n ${url}`,
       }),
     });
@@ -135,6 +131,6 @@ async function sendNotify(
       throw new Error(`Note create error`);
     }
   } catch (error) {
-    logger.error("Post-question: fail to send notify: ", error);
+    logger.error('Post-question: fail to send notify: ', error);
   }
 }
diff --git a/src/app/api/db/delete-answer/route.ts b/src/app/api/db/delete-answer/route.ts
index 3c39497..f329a01 100644
--- a/src/app/api/db/delete-answer/route.ts
+++ b/src/app/api/db/delete-answer/route.ts
@@ -1,12 +1,12 @@
-import { DeleteAnswerDto } from "@/app/_dto/delete-answer/delete-answer.dto";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
-import { validateStrict } from "@/utils/validator/strictValidator";
-import { cookies } from "next/headers";
-import { NextRequest, NextResponse } from "next/server";
-import { verifyToken } from "../../functions/web/verify-jwt";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
-import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
+import { DeleteAnswerDto } from '@/app/_dto/delete-answer/delete-answer.dto';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
+import { validateStrict } from '@/utils/validator/strictValidator';
+import { cookies } from 'next/headers';
+import { NextRequest, NextResponse } from 'next/server';
+import { verifyToken } from '../../functions/web/verify-jwt';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
+import { RateLimiterService } from '@/utils/ratelimiter/rateLimiter';
 
 const logger = new Logger('delete-answer');
 export async function POST(req: NextRequest) {
@@ -18,13 +18,13 @@ export async function POST(req: NextRequest) {
   }
   const prisma = GetPrismaClient.getClient();
   const cookieStore = await cookies();
-  const token = cookieStore.get("jwtToken")?.value;
+  const token = cookieStore.get('jwtToken')?.value;
   let tokenPayload;
   // JWT 토큰 검증
   try {
     tokenPayload = await verifyToken(token);
   } catch {
-    return sendApiError(401, "Unauthorized");
+    return sendApiError(401, 'Unauthorized');
   }
 
   const limiter = RateLimiterService.getLimiter();
@@ -41,20 +41,17 @@ export async function POST(req: NextRequest) {
   });
   if (!willBeDeletedAnswer) {
     // 그런 답변이 없음
-    return sendApiError(404, "Not Found");
+    return sendApiError(404, 'Not Found');
   }
   if (willBeDeletedAnswer.answeredPersonHandle !== tokenPayload.handle) {
     // 너의 답변이 아님
-    return sendApiError(403, "This is Not Your Answer!");
+    return sendApiError(403, 'This is Not Your Answer!');
   }
   try {
     logger.log(`Delete answer... : ${data.id}`);
     await prisma.answer.delete({ where: { id: data.id } });
 
-    return NextResponse.json(
-      { message: "Delete Answer Successful" },
-      { status: 200 }
-    );
+    return NextResponse.json({ message: 'Delete Answer Successful' }, { status: 200 });
   } catch (err) {
     logger.error('Error: Delete answer:', err);
     return sendApiError(500, `Error ${JSON.stringify(err)}`);
diff --git a/src/app/api/db/fetch-all-answers/route.ts b/src/app/api/db/fetch-all-answers/route.ts
index a58fb43..ecf50de 100644
--- a/src/app/api/db/fetch-all-answers/route.ts
+++ b/src/app/api/db/fetch-all-answers/route.ts
@@ -1,12 +1,12 @@
-import { AnswerDto } from "@/app/_dto/Answers.dto";
-import { FetchAllAnswersReqDto } from "@/app/_dto/fetch-all-answers/fetch-all-answers.dto";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
-import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
-import { getIpHash } from "@/utils/getIp/get-ip-hash";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
-import { validateStrict } from "@/utils/validator/strictValidator";
-import { NextRequest, NextResponse } from "next/server";
+import { AnswerDto } from '@/app/_dto/Answers.dto';
+import { FetchAllAnswersReqDto } from '@/app/_dto/fetch-all-answers/fetch-all-answers.dto';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
+import { getIpFromRequest } from '@/utils/getIp/get-ip-from-Request';
+import { getIpHash } from '@/utils/getIp/get-ip-hash';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { RateLimiterService } from '@/utils/ratelimiter/rateLimiter';
+import { validateStrict } from '@/utils/validator/strictValidator';
+import { NextRequest, NextResponse } from 'next/server';
 
 export async function POST(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
@@ -33,7 +33,7 @@ export async function POST(req: NextRequest) {
   const untilId = data.untilId;
 
   //내림차순이 기본값
-  const orderBy = (data.sort === 'ASC') ? 'asc' : 'desc';
+  const orderBy = data.sort === 'ASC' ? 'asc' : 'desc';
 
   const answersWithProfile = await prisma.answer.findMany({
     where: {
@@ -46,11 +46,10 @@ export async function POST(req: NextRequest) {
       answeredPerson: true,
     },
     orderBy: {
-      id: orderBy
-    }, 
-    take: query_limit
+      id: orderBy,
+    },
+    take: query_limit,
   });
-  
 
   return NextResponse.json(answersWithProfile as unknown as AnswerDto);
 }
diff --git a/src/app/api/db/fetch-my-profile/route.ts b/src/app/api/db/fetch-my-profile/route.ts
index 3887a56..4bb8420 100644
--- a/src/app/api/db/fetch-my-profile/route.ts
+++ b/src/app/api/db/fetch-my-profile/route.ts
@@ -1,23 +1,23 @@
-import { userProfileMeDto } from "@/app/_dto/fetch-profile/Profile.dto";
-import { NextRequest, NextResponse } from "next/server";
-import { verifyToken } from "../../functions/web/verify-jwt";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
+import { userProfileMeDto } from '@/app/_dto/fetch-profile/Profile.dto';
+import { NextRequest, NextResponse } from 'next/server';
+import { verifyToken } from '../../functions/web/verify-jwt';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { RateLimiterService } from '@/utils/ratelimiter/rateLimiter';
 
 export async function GET(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
-  const token = req.cookies.get("jwtToken")?.value;
+  const token = req.cookies.get('jwtToken')?.value;
 
   try {
     if (!token) {
-      return sendApiError(401, "No Auth Token");
+      return sendApiError(401, 'No Auth Token');
     }
     let handle: string;
     try {
       handle = (await verifyToken(token)).handle;
     } catch {
-      return sendApiError(401, "Token Verify Error");
+      return sendApiError(401, 'Token Verify Error');
     }
     const limiter = RateLimiterService.getLimiter();
     const limited = await limiter.limit(`fetch-my-profile-${handle}`, {
@@ -30,9 +30,9 @@ export async function GET(req: NextRequest) {
 
     const userProfile = await prisma.profile.findUnique({
       include: {
-          user: {
-            select: {hostName: true}
-          },
+        user: {
+          select: { hostName: true },
+        },
       },
       where: {
         handle: handle,
@@ -42,7 +42,10 @@ export async function GET(req: NextRequest) {
       return NextResponse.json({ message: `User not found` }, { status: 404 });
     }
     const host = userProfile.user.hostName;
-    const { instanceType } = await prisma.server.findUniqueOrThrow({where: {instances: host}, select: {instanceType: true}});
+    const { instanceType } = await prisma.server.findUniqueOrThrow({
+      where: { instances: host },
+      select: { instanceType: true },
+    });
 
     const questionCount = await prisma.profile.findUnique({
       where: {
@@ -71,9 +74,6 @@ export async function GET(req: NextRequest) {
 
     return NextResponse.json(res);
   } catch (err) {
-    return NextResponse.json(
-      { message: `Bad Request: ${err}` },
-      { status: 400 }
-    );
+    return NextResponse.json({ message: `Bad Request: ${err}` }, { status: 400 });
   }
 }
diff --git a/src/app/api/db/fetch-my-questions/route.ts b/src/app/api/db/fetch-my-questions/route.ts
index 9198d46..1e6ee15 100644
--- a/src/app/api/db/fetch-my-questions/route.ts
+++ b/src/app/api/db/fetch-my-questions/route.ts
@@ -1,12 +1,12 @@
-import { NextRequest, NextResponse } from "next/server";
-import { verifyToken } from "../../functions/web/verify-jwt";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
+import { NextRequest, NextResponse } from 'next/server';
+import { verifyToken } from '../../functions/web/verify-jwt';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { RateLimiterService } from '@/utils/ratelimiter/rateLimiter';
 
 export async function GET(req: NextRequest) {
   const prisma = GetPrismaClient.getClient();
-  const cookie = req.cookies.get("jwtToken");
+  const cookie = req.cookies.get('jwtToken');
 
   try {
     if (cookie) {
@@ -27,7 +27,7 @@ export async function GET(req: NextRequest) {
           },
           orderBy: {
             id: 'desc',
-          }
+          },
         });
         return NextResponse.json(questions);
       } else {
diff --git a/src/app/api/db/fetch-profile/[handle]/route.ts b/src/app/api/db/fetch-profile/[handle]/route.ts
index c3102c2..d59f18c 100644
--- a/src/app/api/db/fetch-profile/[handle]/route.ts
+++ b/src/app/api/db/fetch-profile/[handle]/route.ts
@@ -1,25 +1,19 @@
-import {
-  userProfileDto,
-  userProfileWithHostnameDto,
-} from "@/app/_dto/fetch-profile/Profile.dto";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
-import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
-import { getIpHash } from "@/utils/getIp/get-ip-hash";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
-import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
-import { NextRequest, NextResponse } from "next/server";
+import { userProfileDto, userProfileWithHostnameDto } from '@/app/_dto/fetch-profile/Profile.dto';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
+import { getIpFromRequest } from '@/utils/getIp/get-ip-from-Request';
+import { getIpHash } from '@/utils/getIp/get-ip-hash';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
+import { RateLimiterService } from '@/utils/ratelimiter/rateLimiter';
+import { NextRequest, NextResponse } from 'next/server';
 
-const logger = new Logger('fetch-profile/handle')
-export async function GET(
-  req: NextRequest,
-  { params }: { params: Promise<{ handle?: string }> }
-) {
+const logger = new Logger('fetch-profile/handle');
+export async function GET(req: NextRequest, { params }: { params: Promise<{ handle?: string }> }) {
   const prisma = GetPrismaClient.getClient();
   const userHandle = (await params).handle;
   try {
     if (!userHandle) {
-      return sendApiError(400, "userHandle empty");
+      return sendApiError(400, 'userHandle empty');
     }
     const limiter = RateLimiterService.getLimiter();
     const ipHash = getIpHash(getIpFromRequest(req));
@@ -51,9 +45,9 @@ export async function GET(
       },
     });
     if (!profile) {
-      return sendApiError(404, '그런 유저는 없습니다!')
+      return sendApiError(404, '그런 유저는 없습니다!');
     }
-    const { instanceType } = await prisma.server.findUniqueOrThrow({where: {instances: profile.user.hostName}});
+    const { instanceType } = await prisma.server.findUniqueOrThrow({ where: { instances: profile.user.hostName } });
     const resBody: userProfileWithHostnameDto = {
       handle: profile.handle,
       name: profile.name,
@@ -70,11 +64,11 @@ export async function GET(
     return NextResponse.json(resBody, {
       status: 200,
       headers: {
-        "Cache-Control": "public, max-age=10",
+        'Cache-Control': 'public, max-age=10',
       },
     });
   } catch (err) {
     logger.error(err);
-    return sendApiError(500, "Error");
+    return sendApiError(500, 'Error');
   }
 }
diff --git a/src/app/api/db/fetch-user-answers/route.ts b/src/app/api/db/fetch-user-answers/route.ts
index 32fe915..70d314b 100644
--- a/src/app/api/db/fetch-user-answers/route.ts
+++ b/src/app/api/db/fetch-user-answers/route.ts
@@ -1,13 +1,13 @@
-import { FetchUserAnswersDto } from "@/app/_dto/fetch-user-answers/fetch-user-answers.dto";
-import { validateStrict } from "@/utils/validator/strictValidator";
-import { NextRequest, NextResponse } from "next/server";
-import { sendErrorResponse } from "../../functions/web/errorResponse";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
-import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
-import { getIpHash } from "@/utils/getIp/get-ip-hash";
-import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { FetchUserAnswersDto } from '@/app/_dto/fetch-user-answers/fetch-user-answers.dto';
+import { validateStrict } from '@/utils/validator/strictValidator';
+import { NextRequest, NextResponse } from 'next/server';
+import { sendErrorResponse } from '../../functions/web/errorResponse';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
+import { RateLimiterService } from '@/utils/ratelimiter/rateLimiter';
+import { getIpHash } from '@/utils/getIp/get-ip-hash';
+import { getIpFromRequest } from '@/utils/getIp/get-ip-from-Request';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
 
 const logger = new Logger('fetch-user-answer');
 export async function POST(req: NextRequest) {
@@ -29,15 +29,13 @@ export async function POST(req: NextRequest) {
     if (limited) {
       return sendApiError(429, '요청 제한에 도달했습니다!');
     }
-  
-    const query_limit = data.limit
-      ? Math.max(1, Math.min(data.limit, 100))
-      : 100;
+
+    const query_limit = data.limit ? Math.max(1, Math.min(data.limit, 100)) : 100;
     const sinceId = data.sinceId;
     const untilId = data.untilId;
 
     //내림차순이 기본값
-    const orderBy = data.sort === "ASC" ? "asc" : "desc";
+    const orderBy = data.sort === 'ASC' ? 'asc' : 'desc';
 
     if (!data.answeredPersonHandle) {
       throw new Error(`answeredPersonHandle is null`);
@@ -46,8 +44,8 @@ export async function POST(req: NextRequest) {
       where: {
         answeredPersonHandle: data.answeredPersonHandle,
         id: {
-          ...(typeof sinceId === "string" ? { gt: sinceId } : {}),
-          ...(typeof untilId === "string" ? { lt: untilId } : {}),
+          ...(typeof sinceId === 'string' ? { gt: sinceId } : {}),
+          ...(typeof untilId === 'string' ? { lt: untilId } : {}),
         },
       },
       include: {
diff --git a/src/app/api/functions/josa.ts b/src/app/api/functions/josa.ts
index f831944..36d1798 100644
--- a/src/app/api/functions/josa.ts
+++ b/src/app/api/functions/josa.ts
@@ -1,10 +1,3 @@
-export default function josa(
-  str: string | undefined,
-  whenTrue: string,
-  whenFalse: string
-) {
-  if (str)
-    return (str.charCodeAt(str.length - 1) - "가".charCodeAt(0)) % 28 > 0
-      ? str + whenTrue
-      : str + whenFalse;
+export default function josa(str: string | undefined, whenTrue: string, whenFalse: string) {
+  if (str) return (str.charCodeAt(str.length - 1) - '가'.charCodeAt(0)) % 28 > 0 ? str + whenTrue : str + whenFalse;
 }
diff --git a/src/app/api/functions/web/detectInstance.ts b/src/app/api/functions/web/detectInstance.ts
index b367dcf..1743c4a 100644
--- a/src/app/api/functions/web/detectInstance.ts
+++ b/src/app/api/functions/web/detectInstance.ts
@@ -1,4 +1,4 @@
-import { Logger } from "@/utils/logger/Logger";
+import { Logger } from '@/utils/logger/Logger';
 
 type nodeinfoMeta = {
   links: nodeinfoVersionList[];
@@ -17,19 +17,14 @@ type nodeinfo = {
 const logger = new Logger('detectInstance');
 export default async function detectInstance(host: string) {
   const parsedUrl = new URL(`https://${host}`);
-  const nodeInfoMeta: nodeinfoMeta = await fetch(
-    `${parsedUrl.origin}/.well-known/nodeinfo`
-  ).then((r) => {
+  const nodeInfoMeta: nodeinfoMeta = await fetch(`${parsedUrl.origin}/.well-known/nodeinfo`).then((r) => {
     if (!r.ok) {
       logger.error('인스턴스 타입 감지 실패 ', r.status);
       throw new Error('인스턴스 타입 감지 실패');
     }
     return r.json();
-  }
-  );
-  const nodeInfoLink = nodeInfoMeta.links.find(
-    (el) => el.rel === "http://nodeinfo.diaspora.software/ns/schema/2.0"
-  );
+  });
+  const nodeInfoLink = nodeInfoMeta.links.find((el) => el.rel === 'http://nodeinfo.diaspora.software/ns/schema/2.0');
 
   const nodeInfo: nodeinfo = await fetch(`${nodeInfoLink?.href}`).then((r) => {
     if (!r.ok) {
@@ -37,8 +32,7 @@ export default async function detectInstance(host: string) {
       throw new Error('인스턴스 타입 감지 실패');
     }
     return r.json();
-  }
-  );
+  });
 
   return nodeInfo.software.name;
 }
diff --git a/src/app/api/functions/web/errorResponse.ts b/src/app/api/functions/web/errorResponse.ts
index 8957b6c..be32b1c 100644
--- a/src/app/api/functions/web/errorResponse.ts
+++ b/src/app/api/functions/web/errorResponse.ts
@@ -1,5 +1,5 @@
-import { NextResponse } from "next/server";
+import { NextResponse } from 'next/server';
 
 export function sendErrorResponse(code: number, message: string) {
-  return NextResponse.json({status: code, message: message}, {status: code});
-}
\ No newline at end of file
+  return NextResponse.json({ status: code, message: message }, { status: code });
+}
diff --git a/src/app/api/functions/web/fetchUsername.ts b/src/app/api/functions/web/fetchUsername.ts
index d81679c..75c0984 100644
--- a/src/app/api/functions/web/fetchUsername.ts
+++ b/src/app/api/functions/web/fetchUsername.ts
@@ -1,10 +1,13 @@
-import { fetchNameWithEmojiReqDto, fetchNameWithEmojiResDto } from "@/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto";
-import { Logger } from "@/utils/logger/Logger";
+import {
+  fetchNameWithEmojiReqDto,
+  fetchNameWithEmojiResDto,
+} from '@/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto';
+import { Logger } from '@/utils/logger/Logger';
 
 const logger = new Logger('fetchNameWithEmoji');
 export async function fetchNameWithEmoji(fetchUserNameReq: fetchNameWithEmojiReqDto) {
   const res = await fetch(`${process.env.WEB_URL}/api/web/fetch-name-with-emoji`, {
-    method: "POST",
+    method: 'POST',
     body: JSON.stringify(fetchUserNameReq),
   });
   if (!res.ok) {
diff --git a/src/app/api/functions/web/verify-jwt.ts b/src/app/api/functions/web/verify-jwt.ts
index 26dafd2..ba484b9 100644
--- a/src/app/api/functions/web/verify-jwt.ts
+++ b/src/app/api/functions/web/verify-jwt.ts
@@ -1,6 +1,6 @@
-"use server";
+'use server';
 
-import { jwtVerify } from "jose";
+import { jwtVerify } from 'jose';
 
 type jwtPayload = {
   handle: string;
@@ -17,22 +17,19 @@ export async function verifyToken(token: string | null | undefined) {
   const secret = new TextEncoder().encode(process.env.JWT_SECRET);
 
   try {
-    if (typeof token !== "string") {
-      throw new Error("token is not string");
+    if (typeof token !== 'string') {
+      throw new Error('token is not string');
     }
     const { payload } = await jwtVerify(token, secret);
     const data: jwtPayload = {
-      handle: "",
-      server: "",
+      handle: '',
+      server: '',
     };
-    if (
-      typeof payload.handle === "string" &&
-      typeof payload.server === "string"
-    ) {
+    if (typeof payload.handle === 'string' && typeof payload.server === 'string') {
       data.handle = payload.handle;
       data.server = payload.server;
     } else {
-      throw new Error("JWT payload error");
+      throw new Error('JWT payload error');
     }
     return data;
   } catch (err) {
diff --git a/src/app/api/web/fetch-name-with-emoji/route.ts b/src/app/api/web/fetch-name-with-emoji/route.ts
index b5960fa..e13d20d 100644
--- a/src/app/api/web/fetch-name-with-emoji/route.ts
+++ b/src/app/api/web/fetch-name-with-emoji/route.ts
@@ -1,9 +1,9 @@
-import { fetchNameWithEmojiReqDto } from "@/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto";
-import { validateStrict } from "@/utils/validator/strictValidator";
-import { NextRequest, NextResponse } from "next/server";
-import { sendErrorResponse } from "../../functions/web/errorResponse";
-import detectInstance from "../../functions/web/detectInstance";
-import { Logger } from "@/utils/logger/Logger";
+import { fetchNameWithEmojiReqDto } from '@/app/_dto/fetch-name-with-emoji/fetch-name-with-emoji.dto';
+import { validateStrict } from '@/utils/validator/strictValidator';
+import { NextRequest, NextResponse } from 'next/server';
+import { sendErrorResponse } from '../../functions/web/errorResponse';
+import detectInstance from '../../functions/web/detectInstance';
+import { Logger } from '@/utils/logger/Logger';
 
 const logger = new Logger('fetch-name-with-emoji');
 export async function POST(req: NextRequest) {
@@ -20,15 +20,13 @@ export async function POST(req: NextRequest) {
   if (!name) {
     return NextResponse.json({ nameWithEmoji: [] });
   }
-  const emojiInUsername = name
-    .match(/:[\w]+:/g)
-    ?.map((el) => el.replaceAll(":", ""));
-  const nameArray = name.split(":").filter((el) => el !== "");
+  const emojiInUsername = name.match(/:[\w]+:/g)?.map((el) => el.replaceAll(':', ''));
+  const nameArray = name.split(':').filter((el) => el !== '');
 
   const instanceType = await detectInstance(baseUrl);
 
   switch (instanceType) {
-    case "mastodon":
+    case 'mastodon':
       try {
         if (emojiInUsername && data.emojis) {
           for (let i = 0; i < emojiInUsername.length; i++) {
@@ -46,17 +44,17 @@ export async function POST(req: NextRequest) {
         }
         return NextResponse.json({ nameWithEmoji: nameArray });
       } catch (err) {
-        return NextResponse.json({ asdf: "asdf" }, { status: 500 });
+        return NextResponse.json({ asdf: 'asdf' }, { status: 500 });
       }
 
-    case "misskey":
+    case 'misskey':
       try {
         if (emojiInUsername) {
           for (let i = 0; i < emojiInUsername.length; i++) {
             const emojiAddress = await fetch(`https://${baseUrl}/api/emoji`, {
-              method: "POST",
+              method: 'POST',
               headers: {
-                "Content-Type": "application/json",
+                'Content-Type': 'application/json',
               },
               body: JSON.stringify({
                 name: emojiInUsername[i],
@@ -79,20 +77,17 @@ export async function POST(req: NextRequest) {
         return NextResponse.json({ nameWithEmoji: nameArray });
       } catch (err) {
         logger.error(err);
-        return NextResponse.json(
-          { error: "Internal Server Error" },
-          { status: 500 }
-        );
+        return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 });
       }
 
-    case "cherrypick":
+    case 'cherrypick':
       try {
         if (emojiInUsername) {
           for (let i = 0; i < emojiInUsername.length; i++) {
             const emojiAddress = await fetch(`https://${baseUrl}/api/emoji`, {
-              method: "POST",
+              method: 'POST',
               headers: {
-                "Content-Type": "application/json",
+                'Content-Type': 'application/json',
               },
               body: JSON.stringify({
                 name: emojiInUsername[i],
@@ -115,14 +110,11 @@ export async function POST(req: NextRequest) {
         return NextResponse.json({ nameWithEmoji: nameArray });
       } catch (err) {
         logger.error(err);
-        return NextResponse.json(
-          { error: "Internal Server Error" },
-          { status: 500 }
-        );
+        return NextResponse.json({ error: 'Internal Server Error' }, { status: 500 });
       }
 
     default:
-      logger.warn("there is no matching instance type");
+      logger.warn('there is no matching instance type');
 
       break;
   }
diff --git a/src/app/api/web/logout/route.ts b/src/app/api/web/logout/route.ts
index cb5d82f..c0a3ae4 100644
--- a/src/app/api/web/logout/route.ts
+++ b/src/app/api/web/logout/route.ts
@@ -1,16 +1,16 @@
-import { cookies } from "next/headers";
-import { NextResponse } from "next/server";
+import { cookies } from 'next/headers';
+import { NextResponse } from 'next/server';
 
 export async function GET() {
   try {
     const cookieStore = await cookies();
 
-    cookieStore.delete("jwtToken");
-    cookieStore.delete("server");
-    cookieStore.delete("handle");
+    cookieStore.delete('jwtToken');
+    cookieStore.delete('server');
+    cookieStore.delete('handle');
 
     return NextResponse.json({ status: 200 });
   } catch (err) {
-    return NextResponse.json({ status: 500, error: err }, {status: 500});
+    return NextResponse.json({ status: 500, error: err }, { status: 500 });
   }
 }
diff --git a/src/app/api/web/mastodon-login/route.ts b/src/app/api/web/mastodon-login/route.ts
index 30d1be0..30e6a40 100644
--- a/src/app/api/web/mastodon-login/route.ts
+++ b/src/app/api/web/mastodon-login/route.ts
@@ -1,14 +1,14 @@
-import { loginReqDto } from "@/app/_dto/web/login/login.dto";
-import { validateStrict } from "@/utils/validator/strictValidator";
-import { NextRequest, NextResponse } from "next/server";
-import { sendErrorResponse } from "../../functions/web/errorResponse";
-import { v4 as uuid } from "uuid";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
-import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
-import { getIpHash } from "@/utils/getIp/get-ip-hash";
-import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { loginReqDto } from '@/app/_dto/web/login/login.dto';
+import { validateStrict } from '@/utils/validator/strictValidator';
+import { NextRequest, NextResponse } from 'next/server';
+import { sendErrorResponse } from '../../functions/web/errorResponse';
+import { v4 as uuid } from 'uuid';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
+import { RateLimiterService } from '@/utils/ratelimiter/rateLimiter';
+import { getIpHash } from '@/utils/getIp/get-ip-hash';
+import { getIpFromRequest } from '@/utils/getIp/get-ip-from-Request';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
 
 const logger = new Logger('mastodon-login');
 export async function POST(req: NextRequest) {
@@ -31,7 +31,7 @@ export async function POST(req: NextRequest) {
   if (limited) {
     return sendApiError(429, '요청 제한에 도달했습니다!');
   }
-  
+
   const mastodonHost = data.host.toLowerCase();
 
   try {
@@ -44,14 +44,14 @@ export async function POST(req: NextRequest) {
     //인스턴스의 첫번째 로그인이거나, client_id/client_secret 가 null인 경우
     if (!serverInfo || !serverInfo.client_id || !serverInfo.client_secret) {
       const res = await fetch(`https://${mastodonHost}/api/v1/apps`, {
-        method: "POST",
+        method: 'POST',
         headers: {
-          "Content-Type": "application/json",
+          'Content-Type': 'application/json',
         },
         body: JSON.stringify({
-          client_name: "Neo-Quesdon",
+          client_name: 'Neo-Quesdon',
           redirect_uris: `${process.env.WEB_URL}/mastodon-callback`,
-          scopes: "read:accounts read:blocks read:follows write:statuses",
+          scopes: 'read:accounts read:blocks read:follows write:statuses',
           website: `${process.env.WEB_URL}`,
         }),
       }).then((r) => r.json());
@@ -77,17 +77,10 @@ export async function POST(req: NextRequest) {
           instanceType: 'mastodon',
         },
       });
-      const session = await initiateMastodonAuthSession(
-        mastodonHost,
-        res.client_id
-      );
+      const session = await initiateMastodonAuthSession(mastodonHost, res.client_id);
       return NextResponse.json(session);
-
     } else {
-      const session = await initiateMastodonAuthSession(
-        mastodonHost,
-        serverInfo.client_id
-      );
+      const session = await initiateMastodonAuthSession(mastodonHost, serverInfo.client_id);
       return NextResponse.json(session);
     }
   } catch (err) {
@@ -96,28 +89,25 @@ export async function POST(req: NextRequest) {
 }
 
 /**
- * 
+ *
  * @param hostname Mastodon Hostname
  * @param client_id OAuth2 Client ID
  * @returns Mastodon Authorize URL
  */
-async function initiateMastodonAuthSession(
-  hostname: string,
-  client_id: string
-) {
+async function initiateMastodonAuthSession(hostname: string, client_id: string) {
   const loginState = `${uuid()}_${client_id}`;
 
   const params: { [key: string]: string } = {
     client_id: encodeURIComponent(client_id),
-    scope: "read:accounts+read:blocks+read:follows+write:statuses",
+    scope: 'read:accounts+read:blocks+read:follows+write:statuses',
     redirect_uri: encodeURIComponent(`${process.env.WEB_URL}/mastodon-callback`),
-    response_type: "code",
+    response_type: 'code',
     state: loginState,
   };
 
   const url = `https://${hostname}/oauth/authorize?${Object.entries(params)
-    .map((v) => v.join("="))
-    .join("&")}`;
+    .map((v) => v.join('='))
+    .join('&')}`;
   logger.log('Created New Mastodon OAuth2 authorize URL:', url);
   return url;
 }
diff --git a/src/app/api/web/misskey-login/route.ts b/src/app/api/web/misskey-login/route.ts
index d5eb6ef..f56d69d 100644
--- a/src/app/api/web/misskey-login/route.ts
+++ b/src/app/api/web/misskey-login/route.ts
@@ -1,15 +1,15 @@
-import { loginReqDto } from "@/app/_dto/web/login/login.dto";
-import { validateStrict } from "@/utils/validator/strictValidator";
-import { NextRequest, NextResponse } from "next/server";
-import { sendErrorResponse } from "../../functions/web/errorResponse";
-import { MiApiError, MiAuthSession } from "@/app";
-import detectInstance from "../../functions/web/detectInstance";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
-import { RateLimiterService } from "@/utils/ratelimiter/rateLimiter";
-import { getIpHash } from "@/utils/getIp/get-ip-hash";
-import { getIpFromRequest } from "@/utils/getIp/get-ip-from-Request";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
+import { loginReqDto } from '@/app/_dto/web/login/login.dto';
+import { validateStrict } from '@/utils/validator/strictValidator';
+import { NextRequest, NextResponse } from 'next/server';
+import { sendErrorResponse } from '../../functions/web/errorResponse';
+import { MiApiError, MiAuthSession } from '@/app';
+import detectInstance from '../../functions/web/detectInstance';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
+import { RateLimiterService } from '@/utils/ratelimiter/rateLimiter';
+import { getIpHash } from '@/utils/getIp/get-ip-hash';
+import { getIpFromRequest } from '@/utils/getIp/get-ip-from-Request';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
 
 const logger = new Logger('misskey-login');
 export async function POST(req: NextRequest) {
@@ -43,30 +43,27 @@ export async function POST(req: NextRequest) {
     // 인스턴스의 첫 번째 로그인이거나, 앱시크릿이 유효하지 않은 경우
     if (serverInfo === null || serverInfo.appSecret === null) {
       const payload = {
-        name: "Neo-Quesdon",
-        description: "새로운 퀘스돈, 네오-퀘스돈입니다.",
-        permission: ["write:notes"],
+        name: 'Neo-Quesdon',
+        description: '새로운 퀘스돈, 네오-퀘스돈입니다.',
+        permission: ['write:notes'],
         callbackUrl: `${process.env.WEB_URL}/misskey-callback`,
       };
 
       // Create New App in instance
       const res = await fetch(`https://${misskeyHost}/api/app/create`, {
-        method: "POST",
+        method: 'POST',
         headers: {
-          "Content-Type": "application/json",
+          'Content-Type': 'application/json',
         },
         body: JSON.stringify(payload),
       });
       if (!res.ok) {
-        return sendErrorResponse(
-          500,
-          `Login Error! From Remote: ${await res.text()}`
-        );
+        return sendErrorResponse(500, `Login Error! From Remote: ${await res.text()}`);
       }
       const data = await res.json();
       const appSecret = data.secret;
-      logger.log("New Misskey APP created!", data);
-      const detectedInstanceType = await detectInstance(misskeyHost) === 'cherrypick' ? 'cherrypick' : 'misskey';
+      logger.log('New Misskey APP created!', data);
+      const detectedInstanceType = (await detectInstance(misskeyHost)) === 'cherrypick' ? 'cherrypick' : 'misskey';
       await prisma.server.upsert({
         where: {
           instances: misskeyHost,
@@ -83,10 +80,7 @@ export async function POST(req: NextRequest) {
       });
       const authRes = await initiateMisskeyAuthSession(misskeyHost, appSecret);
       if (!authRes.ok) {
-        return sendErrorResponse(
-          500,
-          `Fail to Create Auth Session: ${await authRes.text()}`
-        );
+        return sendErrorResponse(500, `Fail to Create Auth Session: ${await authRes.text()}`);
       }
       const misskeyAuthSession = (await authRes.json()) as MiAuthSession;
       logger.log(`New Misskey Auth Session Created: `, misskeyAuthSession);
@@ -94,17 +88,12 @@ export async function POST(req: NextRequest) {
     }
     // 앱 시크릿 존재하는 경우
     else {
-      const res = await initiateMisskeyAuthSession(
-        misskeyHost,
-        serverInfo.appSecret
-      );
+      const res = await initiateMisskeyAuthSession(misskeyHost, serverInfo.appSecret);
       if (!res.ok) {
         const data = (await res.json()) as MiApiError;
-        if (data.error.code === "NO_SUCH_APP") {
+        if (data.error.code === 'NO_SUCH_APP') {
           // 어라라...? 앱 스크릿 무효화
-          logger.warn(
-            `Misskey response NO_SUCH_APP, delete invalid appSecret from DB`
-          );
+          logger.warn(`Misskey response NO_SUCH_APP, delete invalid appSecret from DB`);
           await prisma.server.update({
             where: { instances: misskeyHost },
             data: { appSecret: null },
@@ -127,14 +116,11 @@ export async function POST(req: NextRequest) {
  * @param appSecret Misskey AppSecret
  * @returns Misskey API Response
  */
-async function initiateMisskeyAuthSession(
-  host: string,
-  appSecret: string
-): Promise<Response> {
+async function initiateMisskeyAuthSession(host: string, appSecret: string): Promise<Response> {
   return await fetch(`https://${host}/api/auth/session/generate`, {
-    method: "POST",
+    method: 'POST',
     headers: {
-      "Content-Type": "application/json",
+      'Content-Type': 'application/json',
     },
     body: JSON.stringify({
       appSecret: appSecret,
diff --git a/src/app/index.d.ts b/src/app/index.d.ts
index 889c7bd..f0a5802 100644
--- a/src/app/index.d.ts
+++ b/src/app/index.d.ts
@@ -1,5 +1,5 @@
-import type { profile, user } from "@prisma/client";
-import { MiUser } from "./api/misskey-entities/user";
+import type { profile, user } from '@prisma/client';
+import { MiUser } from './api/misskey-entities/user';
 
 interface MiAuthSession {
   token: string;
@@ -11,7 +11,7 @@ interface MiApiError {
     message: string;
     code: string;
     id: string;
-    kind: "client" | "server";
+    kind: 'client' | 'server';
   };
 }
 
@@ -33,19 +33,19 @@ export interface questions {
 export interface typedAnswer {
   answer: string;
   nsfwedAnswer: boolean;
-  visibility: "public" | "home" | "followers";
+  visibility: 'public' | 'home' | 'followers';
 }
 
 export interface MkNoteAnswers {
   cw: string;
   text: string;
-  visibility: "public" | "home" | "followers";
+  visibility: 'public' | 'home' | 'followers';
 }
 
 export interface mastodonTootAnswers {
   spoiler_text: string;
   status: string;
-  visibility: "public" | "unlisted" | "private";
+  visibility: 'public' | 'unlisted' | 'private';
 }
 
 export interface postQuestion {
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 8562a3b..35c4014 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,33 +1,33 @@
-import type { Metadata, Viewport } from "next";
-import localFont from "next/font/local";
-import "./globals.css";
-import Image from "next/image";
+import type { Metadata, Viewport } from 'next';
+import localFont from 'next/font/local';
+import './globals.css';
+import Image from 'next/image';
 
 const theJamsil = localFont({
   src: [
     {
-      path: "./fonts/The-Jamsil-1-Thin.ttf",
-      weight: "100",
+      path: './fonts/The-Jamsil-1-Thin.ttf',
+      weight: '100',
     },
     {
-      path: "./fonts/The-Jamsil-3-Regular.ttf",
-      weight: "400",
+      path: './fonts/The-Jamsil-3-Regular.ttf',
+      weight: '400',
     },
     {
-      path: "./fonts/The-Jamsil-6-ExtraBold.ttf",
-      weight: "800",
+      path: './fonts/The-Jamsil-6-ExtraBold.ttf',
+      weight: '800',
     },
   ],
-  variable: "--font-the-jamsil",
+  variable: '--font-the-jamsil',
 });
 
 export const metadata: Metadata = {
-  title: "Neo-Quesdon",
-  description: "세라복.모에의 새로운 Quesdon",
+  title: 'Neo-Quesdon',
+  description: '세라복.모에의 새로운 Quesdon',
 };
 
 export const viewport: Viewport = {
-  width: "device-width",
+  width: 'device-width',
   initialScale: 1,
   maximumScale: 1,
   userScalable: false,
@@ -54,7 +54,7 @@ export default function RootLayout({
             unoptimized
             objectFit="cover"
             style={{
-              opacity: "0.6",
+              opacity: '0.6',
             }}
           />
         </div>
diff --git a/src/app/main/_header.tsx b/src/app/main/_header.tsx
index e9479d5..0378ba8 100644
--- a/src/app/main/_header.tsx
+++ b/src/app/main/_header.tsx
@@ -1,15 +1,15 @@
-"use client";
+'use client';
 
-import Link from "next/link";
-import { useEffect, useRef, useState } from "react";
-import { FaUser } from "react-icons/fa";
-import { userProfileMeDto } from "../_dto/fetch-profile/Profile.dto";
-import DialogModalTwoButton from "../_components/modalTwoButton";
-import DialogModalOneButton from "../_components/modalOneButton";
+import Link from 'next/link';
+import { useEffect, useRef, useState } from 'react';
+import { FaUser } from 'react-icons/fa';
+import { userProfileMeDto } from '../_dto/fetch-profile/Profile.dto';
+import DialogModalTwoButton from '../_components/modalTwoButton';
+import DialogModalOneButton from '../_components/modalOneButton';
 
 const logout = async () => {
-  await fetch("/api/web/logout");
-  localStorage.removeItem("user_handle");
+  await fetch('/api/web/logout');
+  localStorage.removeItem('user_handle');
   window.location.reload();
 };
 
@@ -19,11 +19,11 @@ export default function MainHeader() {
   const forcedLogoutModalRef = useRef<HTMLDialogElement>(null);
 
   const fetchMyProfile = async () => {
-    const user_handle = localStorage.getItem("user_handle");
+    const user_handle = localStorage.getItem('user_handle');
 
     if (user_handle) {
-      const res = await fetch("/api/db/fetch-my-profile", {
-        method: "GET",
+      const res = await fetch('/api/db/fetch-my-profile', {
+        method: 'GET',
       });
       if (!res.ok) {
         if (res.status === 401) {
@@ -51,9 +51,7 @@ export default function MainHeader() {
         <div
           tabIndex={0}
           role="button"
-          className={`btn btn-ghost btn-circle avatar ${
-            user?.questions && user?.questions > 0 && "online"
-          }`}
+          className={`btn btn-ghost btn-circle avatar ${user?.questions && user?.questions > 0 && 'online'}`}
         >
           <div className="w-10 rounded-full">
             {user?.avatarUrl ? (
@@ -72,7 +70,7 @@ export default function MainHeader() {
               className="menu menu-sm dropdown-content bg-base-100 rounded-box z-10 mt-3 w-52 p-2 shadow"
             >
               <li>
-                <Link href={"/"}>로그인</Link>
+                <Link href={'/'}>로그인</Link>
               </li>
             </ul>
           </div>
@@ -86,10 +84,10 @@ export default function MainHeader() {
                 <Link href={`/main/user/${user?.handle}`}>마이페이지</Link>
               </li>
               <li>
-                <Link href={"/main/questions"}>미답변 질문</Link>
+                <Link href={'/main/questions'}>미답변 질문</Link>
               </li>
               <li>
-                <Link href={"/main/settings"}>설정</Link>
+                <Link href={'/main/settings'}>설정</Link>
               </li>
               <li onClick={() => logoutModalRef.current?.showModal()}>
                 <a>로그아웃</a>
@@ -99,17 +97,17 @@ export default function MainHeader() {
         )}
       </div>
       <DialogModalTwoButton
-        title={"로그아웃"}
-        body={"정말로 로그아웃 하시겠어요?"}
-        confirmButtonText={"로그아웃"}
-        cancelButtonText={"취소"}
+        title={'로그아웃'}
+        body={'정말로 로그아웃 하시겠어요?'}
+        confirmButtonText={'로그아웃'}
+        cancelButtonText={'취소'}
         ref={logoutModalRef}
         onClick={logout}
       />
       <DialogModalOneButton
-        title={"자동 로그아웃"}
-        body={"로그인 유효시간이 만료되어서 로그아웃 되었어요!"}
-        buttonText={"확인"}
+        title={'자동 로그아웃'}
+        body={'로그인 유효시간이 만료되어서 로그아웃 되었어요!'}
+        buttonText={'확인'}
         ref={forcedLogoutModalRef}
         onClick={logout}
       />
diff --git a/src/app/main/layout.tsx b/src/app/main/layout.tsx
index 7043436..0d94d07 100644
--- a/src/app/main/layout.tsx
+++ b/src/app/main/layout.tsx
@@ -1,10 +1,6 @@
-import MainHeader from "./_header";
+import MainHeader from './_header';
 
-export default function MainLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
+export default function MainLayout({ children }: { children: React.ReactNode }) {
   return (
     <div>
       <header className="w-full h-full flex justify-center">
diff --git a/src/app/main/page.tsx b/src/app/main/page.tsx
index ffbc971..25aef1a 100644
--- a/src/app/main/page.tsx
+++ b/src/app/main/page.tsx
@@ -1,16 +1,16 @@
-"use client";
+'use client';
 
-import { useEffect, useState } from "react";
-import Answer from "../_components/answer";
-import { FaExclamationCircle } from "react-icons/fa";
-import { answer } from "@prisma/client";
-import { FetchAllAnswersReqDto } from "../_dto/fetch-all-answers/fetch-all-answers.dto";
+import { useEffect, useState } from 'react';
+import Answer from '../_components/answer';
+import { FaExclamationCircle } from 'react-icons/fa';
+import { answer } from '@prisma/client';
+import { FetchAllAnswersReqDto } from '../_dto/fetch-all-answers/fetch-all-answers.dto';
 
 async function fetchAllAnswers(req: FetchAllAnswersReqDto) {
-  const res = await fetch("/api/db/fetch-all-answers", {
-    method: "POST",
+  const res = await fetch('/api/db/fetch-all-answers', {
+    method: 'POST',
     headers: {
-      "Content-Type": "application/json",
+      'Content-Type': 'application/json',
     },
     body: JSON.stringify(req),
   });
@@ -21,10 +21,9 @@ async function fetchAllAnswers(req: FetchAllAnswersReqDto) {
       throw new Error(`답변을 불러오는데 실패했어요!: ${await res.text()}`);
     }
   } catch (err) {
-    alert(err)
+    alert(err);
     return [];
   }
-
 }
 export default function MainBody() {
   const [answers, setAnswers] = useState<answer[] | null>(null);
@@ -33,7 +32,7 @@ export default function MainBody() {
   const [loading, setLoading] = useState<boolean>(true);
 
   useEffect(() => {
-    fetchAllAnswers({ sort: "DESC", limit: 25 }).then((r) => {
+    fetchAllAnswers({ sort: 'DESC', limit: 25 }).then((r) => {
       if (r.length === 0) {
         setLoading(false);
         setAnswers([]);
@@ -48,23 +47,19 @@ export default function MainBody() {
     const observer = new IntersectionObserver(
       ([e]) => {
         if (e.isIntersecting && untilId !== null) {
-          fetchAllAnswers({ sort: "DESC", limit: 25, untilId: untilId }).then(
-            (r) => {
-              if (r.length === 0) {
-                setLoading(false);
-                return;
-              }
-              setAnswers((prev_answers) =>
-                prev_answers ? [...prev_answers, ...r] : null
-              );
-              setUntilId(r[r.length - 1].id);
+          fetchAllAnswers({ sort: 'DESC', limit: 25, untilId: untilId }).then((r) => {
+            if (r.length === 0) {
+              setLoading(false);
+              return;
             }
-          );
+            setAnswers((prev_answers) => (prev_answers ? [...prev_answers, ...r] : null));
+            setUntilId(r[r.length - 1].id);
+          });
         }
       },
       {
         threshold: 0.7,
-      }
+      },
     );
     if (mounted) observer.observe(mounted);
     return () => {
@@ -88,10 +83,7 @@ export default function MainBody() {
                   <Answer id={r.id} value={r} />
                 </div>
               ))}
-              <div
-                className="w-full h-16 flex justify-center items-center"
-                ref={(ref) => setMounted(ref)}
-              >
+              <div className="w-full h-16 flex justify-center items-center" ref={(ref) => setMounted(ref)}>
                 {loading ? (
                   <div>
                     <span className="loading loading-spinner loading-lg" />
diff --git a/src/app/main/questions/action.ts b/src/app/main/questions/action.ts
index 899ff25..6b30493 100644
--- a/src/app/main/questions/action.ts
+++ b/src/app/main/questions/action.ts
@@ -1,13 +1,13 @@
-"use server";
+'use server';
 
-import type { mastodonTootAnswers, MkNoteAnswers, typedAnswer } from "@/app";
-import { verifyToken } from "@/app/api/functions/web/verify-jwt";
-import { sendApiError } from "@/utils/apiErrorResponse/sendApiError";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
-import { question } from "@prisma/client";
-import { createHash } from "crypto";
-import { cookies } from "next/headers";
+import type { mastodonTootAnswers, MkNoteAnswers, typedAnswer } from '@/app';
+import { verifyToken } from '@/app/api/functions/web/verify-jwt';
+import { sendApiError } from '@/utils/apiErrorResponse/sendApiError';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
+import { question } from '@prisma/client';
+import { createHash } from 'crypto';
+import { cookies } from 'next/headers';
 
 export async function getQuestion(id: number) {
   const prisma = GetPrismaClient.getClient();
@@ -21,10 +21,7 @@ export async function getQuestion(id: number) {
   return findWithId;
 }
 
-export async function postAnswer(
-  questionId: question["id"] | null,
-  answer: typedAnswer
-) {
+export async function postAnswer(questionId: question['id'] | null, answer: typedAnswer) {
   const postLogger = new Logger('postAnswer');
   const prisma = GetPrismaClient.getClient();
   const cookieStore = await cookies();
@@ -34,10 +31,9 @@ export async function postAnswer(
   try {
     tokenPayload = await verifyToken(jwtToken);
   } catch (err) {
-    return sendApiError(401, "Unauthorized");
+    return sendApiError(401, 'Unauthorized');
   }
 
-
   if (questionId !== null) {
     // 트랜잭션으로 All or Nothing 처리
     const [question, postWithAnswer] = await prisma.$transaction(async (tx) => {
@@ -78,7 +74,7 @@ export async function postAnswer(
 
     const baseUrl = process.env.WEB_URL;
     const answerUrl = `${baseUrl}/main/user/${answeredUser.handle}/${postWithAnswer.id}`;
-    postLogger.log("Created new answer:", answerUrl);
+    postLogger.log('Created new answer:', answerUrl);
     //답변 올리는 부분
     const userSettings = await prisma.profile.findUniqueOrThrow({
       where: {
@@ -87,75 +83,45 @@ export async function postAnswer(
     });
     if (!userSettings.stopPostAnswer) {
       if (answeredUser && server) {
-        const i = createHash("sha256")
-          .update(answeredUser.token + server.appSecret, "utf-8")
-          .digest("hex");
+        const i = createHash('sha256')
+          .update(answeredUser.token + server.appSecret, 'utf-8')
+          .digest('hex');
         const host = answeredUser.hostName;
         if (answer.nsfwedAnswer === true && question.questioner === null) {
           const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo_quesdon`;
           const text = `Q: ${question.question}\nA: ${answer.answer}\n#neo_quesdon ${answerUrl}`;
-          if (instanceType === "misskey" || instanceType === "cherrypick") {
+          if (instanceType === 'misskey' || instanceType === 'cherrypick') {
             await mkMisskeyNote(i, title, text, host, answer.visibility);
           } else {
-            await mastodonToot(
-              answeredUser.token,
-              title,
-              text,
-              host,
-              answer.visibility
-            );
+            await mastodonToot(answeredUser.token, title, text, host, answer.visibility);
           }
-        } else if (
-          answer.nsfwedAnswer === false &&
-          question.questioner !== null
-        ) {
+        } else if (answer.nsfwedAnswer === false && question.questioner !== null) {
           const title = `Q: ${question.question} #neo_quesdon`;
           const text = `질문자:${question.questioner}\nA: ${answer.answer}\n#neo_quesdon ${answerUrl}`;
-          if (instanceType === "misskey" || instanceType === "cherrypick") {
+          if (instanceType === 'misskey' || instanceType === 'cherrypick') {
             await mkMisskeyNote(i, title, text, host, answer.visibility);
           } else {
-            await mastodonToot(
-              answeredUser.token,
-              title,
-              text,
-              host,
-              answer.visibility
-            );
+            await mastodonToot(answeredUser.token, title, text, host, answer.visibility);
           }
-        } else if (
-          answer.nsfwedAnswer === true &&
-          question.questioner !== null
-        ) {
+        } else if (answer.nsfwedAnswer === true && question.questioner !== null) {
           const title = `⚠️ 이 질문은 NSFW한 질문이에요! #neo_quesdon`;
           const text = `질문자:${question.questioner}\nQ:${question.question}\nA: ${answer.answer}\n#neo_quesdon ${answerUrl}`;
-          if (instanceType === "misskey" || instanceType === "cherrypick") {
+          if (instanceType === 'misskey' || instanceType === 'cherrypick') {
             await mkMisskeyNote(i, title, text, host, answer.visibility);
           } else {
-            await mastodonToot(
-              answeredUser.token,
-              title,
-              text,
-              host,
-              answer.visibility
-            );
+            await mastodonToot(answeredUser.token, title, text, host, answer.visibility);
           }
         } else {
           const title = `Q: ${question.question} #neo_quesdon`;
           const text = `A: ${answer.answer}\n#neo_quesdon ${answerUrl}`;
-          if (instanceType === "misskey" || instanceType === "cherrypick") {
+          if (instanceType === 'misskey' || instanceType === 'cherrypick') {
             await mkMisskeyNote(i, title, text, host, answer.visibility);
           } else {
-            await mastodonToot(
-              answeredUser.token,
-              title,
-              text,
-              host,
-              answer.visibility
-            );
+            await mastodonToot(answeredUser.token, title, text, host, answer.visibility);
           }
         }
       } else {
-        postLogger.error("user not found");
+        postLogger.error('user not found');
       }
     }
   }
@@ -166,12 +132,12 @@ async function mkMisskeyNote(
   title: string,
   text: string,
   hostname: string,
-  visibility: "public" | "home" | "followers"
+  visibility: 'public' | 'home' | 'followers',
 ) {
   const NoteLogger = new Logger('mkMisskeyNote');
   // 미스키 CW길이제한 처리
   if (title.length > 100) {
-    title = title.substring(0, 90) + '.....'
+    title = title.substring(0, 90) + '.....';
   }
 
   const newAnswerNote: MkNoteAnswers = {
@@ -180,10 +146,10 @@ async function mkMisskeyNote(
     visibility: visibility,
   };
   const res = await fetch(`https://${hostname}/api/notes/create`, {
-    method: "POST",
+    method: 'POST',
     headers: {
       Authorization: `Bearer ${i}`,
-      "Content-Type": "application/json",
+      'Content-Type': 'application/json',
     },
     body: JSON.stringify(newAnswerNote),
   });
@@ -197,22 +163,22 @@ async function mastodonToot(
   title: string,
   text: string,
   hostname: string,
-  visibility: "public" | "home" | "followers"
+  visibility: 'public' | 'home' | 'followers',
 ) {
   const tootLogger = new Logger('mastodonToot');
-  let newVisibility: "public" | "unlisted" | "private";
+  let newVisibility: 'public' | 'unlisted' | 'private';
   switch (visibility) {
-    case "public":
-      newVisibility = "public";
+    case 'public':
+      newVisibility = 'public';
       break;
-    case "home":
-      newVisibility = "unlisted";
+    case 'home':
+      newVisibility = 'unlisted';
       break;
-    case "followers":
-      newVisibility = "private";
+    case 'followers':
+      newVisibility = 'private';
       break;
     default:
-      newVisibility = "public";
+      newVisibility = 'public';
       break;
   }
   const newAnswerToot: mastodonTootAnswers = {
@@ -222,10 +188,10 @@ async function mastodonToot(
   };
   try {
     const res = await fetch(`https://${hostname}/api/v1/statuses`, {
-      method: "POST",
+      method: 'POST',
       headers: {
         Authorization: `Bearer ${i}`,
-        "Content-Type": "application/json",
+        'Content-Type': 'application/json',
       },
       body: JSON.stringify(newAnswerToot),
     });
@@ -241,11 +207,11 @@ async function mastodonToot(
 export async function deleteQuestion(id: number) {
   const prisma = GetPrismaClient.getClient();
   const cookieStore = await cookies();
-  const jwtToken = cookieStore.get("jwtToken")?.value;
+  const jwtToken = cookieStore.get('jwtToken')?.value;
   try {
     const tokenPayload = await verifyToken(jwtToken);
     await prisma.$transaction(async (tr) => {
-      const q = await tr.question.findUniqueOrThrow({where: {id: id}});
+      const q = await tr.question.findUniqueOrThrow({ where: { id: id } });
       if (q.questioneeHandle !== tokenPayload.handle) {
         throw new Error(`You Can't delete this question`);
       }
@@ -254,7 +220,7 @@ export async function deleteQuestion(id: number) {
           id: id,
         },
       });
-    })
+    });
   } catch (err) {
     throw new Error(`JWT Token Verification Error: ${err}`);
   }
diff --git a/src/app/main/questions/layout.tsx b/src/app/main/questions/layout.tsx
index f4a8a62..9251c16 100644
--- a/src/app/main/questions/layout.tsx
+++ b/src/app/main/questions/layout.tsx
@@ -1,8 +1,4 @@
-export default function QuestionLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
+export default function QuestionLayout({ children }: { children: React.ReactNode }) {
   return (
     <div className="w-full flex">
       <main className="w-full flex justify-center">{children}</main>
diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index bfd14fc..ce5d3c9 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -1,23 +1,23 @@
-"use client";
+'use client';
 
-import { questions } from "@/app";
-import Question from "@/app/_components/question";
-import { useEffect, useRef, useState } from "react";
-import { deleteQuestion } from "./action";
-import DialogModalTwoButton from "@/app/_components/modalTwoButton";
-import DialogModalOneButton from "@/app/_components/modalOneButton";
+import { questions } from '@/app';
+import Question from '@/app/_components/question';
+import { useEffect, useRef, useState } from 'react';
+import { deleteQuestion } from './action';
+import DialogModalTwoButton from '@/app/_components/modalTwoButton';
+import DialogModalOneButton from '@/app/_components/modalOneButton';
 
 const fetchQuestions = async () => {
-  const res = await fetch("/api/db/fetch-my-questions")
-  
+  const res = await fetch('/api/db/fetch-my-questions');
+
   try {
     if (!res.ok) {
-      throw new Error(`내 질문을 불러오는데 실패했어요!: ${await res.text()}`)
+      throw new Error(`내 질문을 불러오는데 실패했어요!: ${await res.text()}`);
     } else {
       return await res.json();
     }
   } catch (err) {
-    alert(err)
+    alert(err);
   }
 
   return res;
@@ -37,9 +37,9 @@ export default function Questions() {
     <div className="w-[90%] window:w-[80%] desktop:w-[70%] flex flex-col justify-center">
       <h3 className="text-3xl desktop:text-4xl mb-2">미답변 질문들</h3>
       {questions === undefined ? (
-            <div className="w-full flex justify-center">
-            <span className="loading loading-spinner loading-lg" />
-          </div>
+        <div className="w-full flex justify-center">
+          <span className="loading loading-spinner loading-lg" />
+        </div>
       ) : (
         <div className="w-full">
           {questions !== null ? (
@@ -61,9 +61,7 @@ export default function Questions() {
                 </div>
               ) : (
                 <div className="h-fit p-4 glass rounded-box flex flex-col items-center shadow mb-2">
-                  <h1 className="text-xl desktop:text-3xl">
-                    👍 답변하지 않은 질문이 없어요!
-                  </h1>
+                  <h1 className="text-xl desktop:text-3xl">👍 답변하지 않은 질문이 없어요!</h1>
                 </div>
               )}
             </div>
@@ -75,24 +73,20 @@ export default function Questions() {
         </div>
       )}
       <DialogModalOneButton
-        title={"답변완료"}
-        body={"답변했어요!"}
-        buttonText={"확인"}
+        title={'답변완료'}
+        body={'답변했어요!'}
+        buttonText={'확인'}
         ref={answeredQuestionModalRef}
       />
       <DialogModalTwoButton
-        title={"질문 지우기"}
-        body={"질문을 지울까요...?"}
-        confirmButtonText={"확인"}
-        cancelButtonText={"취소"}
+        title={'질문 지우기'}
+        body={'질문을 지울까요...?'}
+        confirmButtonText={'확인'}
+        cancelButtonText={'취소'}
         ref={deleteQuestionModalRef}
         onClick={() => {
           deleteQuestion(id);
-          setQuestions((prevQuestions) =>
-            prevQuestions
-              ? [...prevQuestions.filter((prev) => prev.id !== id)]
-              : null
-          );
+          setQuestions((prevQuestions) => (prevQuestions ? [...prevQuestions.filter((prev) => prev.id !== id)] : null));
         }}
       />
     </div>
diff --git a/src/app/main/settings/action.ts b/src/app/main/settings/action.ts
index 8356f8d..f10c866 100644
--- a/src/app/main/settings/action.ts
+++ b/src/app/main/settings/action.ts
@@ -1,16 +1,16 @@
-"use server";
+'use server';
 
-import { cookies } from "next/headers";
-import { FormValue } from "./page";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
-import { verifyToken } from "@/app/api/functions/web/verify-jwt";
+import { cookies } from 'next/headers';
+import { FormValue } from './page';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
+import { verifyToken } from '@/app/api/functions/web/verify-jwt';
 
 export async function fetchUser() {
   const logger = new Logger('fetchUser');
   const prisma = GetPrismaClient.getClient();
   const cookieStore = await cookies();
-  const jwtToken = cookieStore.get("jwtToken")?.value;
+  const jwtToken = cookieStore.get('jwtToken')?.value;
 
   try {
     const payload = await verifyToken(jwtToken);
@@ -41,9 +41,7 @@ export async function updateSetting(handle: string, payload: FormValue) {
           stopNewQuestion: payload.stopNewQuestion,
           stopNotiNewQuestion: payload.stopNotiNewQuestion,
           stopPostAnswer: payload.stopPostAnswer,
-          questionBoxName: `${
-            payload.questionBoxName === "" ? "질문함" : payload.questionBoxName
-          }`,
+          questionBoxName: `${payload.questionBoxName === '' ? '질문함' : payload.questionBoxName}`,
         },
       })
       .catch((err) => logger.log(err));
diff --git a/src/app/main/settings/layout.tsx b/src/app/main/settings/layout.tsx
index 3da9363..e4d10f2 100644
--- a/src/app/main/settings/layout.tsx
+++ b/src/app/main/settings/layout.tsx
@@ -1,8 +1,4 @@
-export default function SettingsLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
+export default function SettingsLayout({ children }: { children: React.ReactNode }) {
   return (
     <div className="w-full flex">
       <main className="w-full flex justify-center">{children}</main>
diff --git a/src/app/main/user/[handle]/[answer]/action.ts b/src/app/main/user/[handle]/[answer]/action.ts
index de01329..0ad2e40 100644
--- a/src/app/main/user/[handle]/[answer]/action.ts
+++ b/src/app/main/user/[handle]/[answer]/action.ts
@@ -1,6 +1,6 @@
-"use server";
+'use server';
 
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
 
 export async function fetchAnswer(id: string) {
   const prisma = GetPrismaClient.getClient();
diff --git a/src/app/main/user/[handle]/_answers.tsx b/src/app/main/user/[handle]/_answers.tsx
index ad6a18c..7f9a67b 100644
--- a/src/app/main/user/[handle]/_answers.tsx
+++ b/src/app/main/user/[handle]/_answers.tsx
@@ -25,7 +25,6 @@ async function fetchProfile(handle: string) {
     alert(err);
     return undefined;
   }
-
 }
 
 export default function UserPage() {
@@ -54,7 +53,7 @@ export default function UserPage() {
       }
     } catch (err) {
       alert(err);
-      return {answers: [], count: 0};
+      return { answers: [], count: 0 };
     }
   };
 
diff --git a/src/app/main/user/[handle]/_profile.tsx b/src/app/main/user/[handle]/_profile.tsx
index f7096b6..b0f8ed2 100644
--- a/src/app/main/user/[handle]/_profile.tsx
+++ b/src/app/main/user/[handle]/_profile.tsx
@@ -22,10 +22,9 @@ async function fetchProfile(handle: string) {
       throw new Error(`프로필을 불러오는데 실패했습니다! ${await res.text()}`);
     }
   } catch (err) {
-    alert(err)
+    alert(err);
     return undefined;
   }
-
 }
 
 export default function Profile() {
@@ -74,7 +73,7 @@ export default function Profile() {
     const res = await fetch('/api/db/create-question', {
       method: 'POST',
       body: JSON.stringify(q),
-    })
+    });
     try {
       if (res.ok) {
         return res;
@@ -123,7 +122,7 @@ export default function Profile() {
         questioner: user_handle,
         questionee: profileHandle,
       };
-      reset()
+      reset();
       const res = await mkQuestionCreateApi(req);
       if (res.status === 200) {
         questionSuccessModalRef.current?.showModal();
@@ -154,7 +153,7 @@ export default function Profile() {
         reset();
         const res = await mkQuestionCreateApi(req);
         if (res.status === 200) {
-          questionSuccessModalRef.current?.showModal()
+          questionSuccessModalRef.current?.showModal();
         }
       }
     }
diff --git a/src/app/main/user/[handle]/layout.tsx b/src/app/main/user/[handle]/layout.tsx
index 71019d8..af385b7 100644
--- a/src/app/main/user/[handle]/layout.tsx
+++ b/src/app/main/user/[handle]/layout.tsx
@@ -1,7 +1,3 @@
-export default function UserLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
+export default function UserLayout({ children }: { children: React.ReactNode }) {
   return <main className="w-full flex justify-center">{children}</main>;
 }
diff --git a/src/app/main/user/[handle]/page.tsx b/src/app/main/user/[handle]/page.tsx
index 1668389..59da901 100644
--- a/src/app/main/user/[handle]/page.tsx
+++ b/src/app/main/user/[handle]/page.tsx
@@ -15,10 +15,9 @@ async function fetchProfile(handle: string) {
       throw new Error(`사용자를 불러오는데 실패했어요! ${await res.text()}`);
     }
   } catch (err) {
-    alert(err)
+    alert(err);
     return null;
   }
-
 }
 
 export default function ProfilePage() {
diff --git a/src/app/mastodon-callback/action.ts b/src/app/mastodon-callback/action.ts
index 1da9c6d..5b76381 100644
--- a/src/app/mastodon-callback/action.ts
+++ b/src/app/mastodon-callback/action.ts
@@ -1,27 +1,22 @@
-"use server";
+'use server';
 
-import { validateStrict } from "@/utils/validator/strictValidator";
-import { mastodonCallbackTokenClaimPayload } from "../_dto/mastodon-callback/callback-token-claim.dto";
-import { fetchNameWithEmoji } from "../api/functions/web/fetchUsername";
-import { DBpayload } from "../misskey-callback/page";
-import { cookies } from "next/headers";
-import { SignJWT } from "jose";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
+import { validateStrict } from '@/utils/validator/strictValidator';
+import { mastodonCallbackTokenClaimPayload } from '../_dto/mastodon-callback/callback-token-claim.dto';
+import { fetchNameWithEmoji } from '../api/functions/web/fetchUsername';
+import { DBpayload } from '../misskey-callback/page';
+import { cookies } from 'next/headers';
+import { SignJWT } from 'jose';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
 
 const logger = new Logger('Mastodon-callback');
-export async function login(
-  loginReqestData: mastodonCallbackTokenClaimPayload
-) {
+export async function login(loginReqestData: mastodonCallbackTokenClaimPayload) {
   const prisma = GetPrismaClient.getClient();
 
   //Class Validator로 들어온 로그인 정보 검증
   let loginReq: mastodonCallbackTokenClaimPayload;
   try {
-    loginReq = await validateStrict(
-      mastodonCallbackTokenClaimPayload,
-      loginReqestData
-    );
+    loginReq = await validateStrict(mastodonCallbackTokenClaimPayload, loginReqestData);
   } catch (err) {
     throw new Error(JSON.stringify(err));
   }
@@ -37,15 +32,13 @@ export async function login(
     const mastodonApiResponse = await requestMastodonAccessCodeAndUserInfo(
       loginReq,
       serverInfo.client_id,
-      serverInfo.client_secret
+      serverInfo.client_secret,
     );
 
     const user_handle = `@${mastodonApiResponse.profile.username}@${loginReq.mastodonHost}`;
 
     let nameWithEmoji = await fetchNameWithEmoji({
-      name:
-        mastodonApiResponse.profile.display_name ??
-        mastodonApiResponse.profile.username,
+      name: mastodonApiResponse.profile.display_name ?? mastodonApiResponse.profile.username,
       baseUrl: loginReq.mastodonHost,
       emojis: mastodonApiResponse.profile.emojis,
     });
@@ -60,7 +53,7 @@ export async function login(
       hostName: loginReq.mastodonHost,
       handle: user_handle,
       name: nameWithEmoji,
-      avatarUrl: mastodonApiResponse.profile.avatar ?? "",
+      avatarUrl: mastodonApiResponse.profile.avatar ?? '',
       accessToken: mastodonApiResponse.token,
       userId: mastodonApiResponse.profile.id,
     };
@@ -68,7 +61,7 @@ export async function login(
     try {
       await pushDB(dbPayload);
     } catch (err) {
-      logger.error("Fail to push user to DB", err);
+      logger.error('Fail to push user to DB', err);
       throw err;
     }
 
@@ -77,22 +70,22 @@ export async function login(
       const cookieStore = await cookies();
       const jwtToken = await generateJwt(loginReq.mastodonHost, user_handle);
       logger.log(`Send JWT to Frontend... ${jwtToken}`);
-      cookieStore.set("jwtToken", jwtToken, {
+      cookieStore.set('jwtToken', jwtToken, {
         expires: Date.now() + 1000 * 60 * 60 * 6,
         httpOnly: true,
       });
-      cookieStore.set("server", loginReq.mastodonHost, {
+      cookieStore.set('server', loginReq.mastodonHost, {
         expires: Date.now() + 1000 * 60 * 60 * 6,
         httpOnly: true,
       });
     } catch (err) {
-      logger.error("Make JWT or Set cookie Failed! ", err);
+      logger.error('Make JWT or Set cookie Failed! ', err);
       throw err;
     }
 
     return { user: mastodonApiResponse };
   } else {
-    throw new Error("there is no server");
+    throw new Error('there is no server');
   }
 }
 
@@ -103,7 +96,7 @@ export async function login(
 async function requestMastodonAccessCodeAndUserInfo(
   payload: mastodonCallbackTokenClaimPayload,
   client_id: string,
-  client_secret: string
+  client_secret: string,
 ) {
   const prisma = GetPrismaClient.getClient();
 
@@ -115,10 +108,10 @@ async function requestMastodonAccessCodeAndUserInfo(
 
   if (checkInstances) {
     const res = await fetch(`https://${payload.mastodonHost}/oauth/token`, {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({
-        grant_type: "authorization_code",
+        grant_type: 'authorization_code',
         redirect_uri: `${process.env.WEB_URL}/mastodon-callback`,
         client_id: client_id,
         client_secret: client_secret,
@@ -127,21 +120,18 @@ async function requestMastodonAccessCodeAndUserInfo(
       }),
     }).then((r) => r.json());
 
-    const myProfile = await fetch(
-      `https://${payload.mastodonHost}/api/v1/accounts/verify_credentials`,
-      {
-        headers: { Authorization: `Bearer ${res.access_token}` },
-      }
-    ).then((r) => r.json());
+    const myProfile = await fetch(`https://${payload.mastodonHost}/api/v1/accounts/verify_credentials`, {
+      headers: { Authorization: `Bearer ${res.access_token}` },
+    }).then((r) => r.json());
 
     return { profile: myProfile, token: res.access_token };
   } else {
-    throw new Error("there is no instances");
+    throw new Error('there is no instances');
   }
 }
 
 async function generateJwt(hostname: string, handle: string) {
-  const alg = "HS256";
+  const alg = 'HS256';
   const secret = new TextEncoder().encode(process.env.JWT_SECRET);
 
   const webUrl = process.env.WEB_URL;
@@ -152,8 +142,8 @@ async function generateJwt(hostname: string, handle: string) {
     .setProtectedHeader({ alg })
     .setIssuedAt()
     .setIssuer(`${webUrl}`)
-    .setAudience("urn:example:audience")
-    .setExpirationTime("6h")
+    .setAudience('urn:example:audience')
+    .setExpirationTime('6h')
     .sign(secret);
   return jwtToken;
 }
diff --git a/src/app/mastodon-callback/page.tsx b/src/app/mastodon-callback/page.tsx
index 3d3a595..754d2c5 100644
--- a/src/app/mastodon-callback/page.tsx
+++ b/src/app/mastodon-callback/page.tsx
@@ -1,10 +1,10 @@
-"use client";
+'use client';
 
-import Image from "next/image";
-import { useEffect, useState } from "react";
-import { mastodonCallbackTokenClaimPayload } from "../_dto/mastodon-callback/callback-token-claim.dto";
-import { login } from "./action";
-import { useRouter } from "next/navigation";
+import Image from 'next/image';
+import { useEffect, useState } from 'react';
+import { mastodonCallbackTokenClaimPayload } from '../_dto/mastodon-callback/callback-token-claim.dto';
+import { login } from './action';
+import { useRouter } from 'next/navigation';
 
 export default function CallbackPage() {
   const [id, setId] = useState<number>(0);
@@ -15,7 +15,7 @@ export default function CallbackPage() {
     const url = new URL(window.location.href);
     const params = new URLSearchParams(url.search);
 
-    const server = localStorage.getItem("server");
+    const server = localStorage.getItem('server');
 
     const randomNumber = Math.ceil(Math.random() * 3);
     setId(randomNumber);
@@ -23,13 +23,13 @@ export default function CallbackPage() {
     const fn = async () => {
       try {
         if (server) {
-          const code = params.get("code");
-          const state = params.get("state");
+          const code = params.get('code');
+          const state = params.get('state');
           if (code === null) {
-            throw new Error("User code is null?");
+            throw new Error('User code is null?');
           }
           if (state === null) {
-            throw new Error("login state is null?");
+            throw new Error('login state is null?');
           }
           const payload: mastodonCallbackTokenClaimPayload = {
             mastodonHost: server,
@@ -48,9 +48,9 @@ export default function CallbackPage() {
           const user = res.user;
 
           const handle = `@${user.profile.username}@${server}`;
-          localStorage.setItem("user_handle", handle);
+          localStorage.setItem('user_handle', handle);
 
-          router.replace("/main");
+          router.replace('/main');
         }
       } catch (err) {
         console.error(err);
@@ -66,13 +66,7 @@ export default function CallbackPage() {
 
   return (
     <div className="w-full h-[100vh] flex flex-col gap-2 justify-center items-center text-3xl">
-      <Image
-        src={`/loading/${id}.gif`}
-        width={64}
-        height={64}
-        alt="Login Loading"
-        unoptimized
-      />
+      <Image src={`/loading/${id}.gif`} width={64} height={64} alt="Login Loading" unoptimized />
       <span>로그인하고 있어요...</span>
     </div>
   );
diff --git a/src/app/misskey-callback/actions.ts b/src/app/misskey-callback/actions.ts
index 1cd3f63..cb27b2c 100644
--- a/src/app/misskey-callback/actions.ts
+++ b/src/app/misskey-callback/actions.ts
@@ -1,42 +1,36 @@
-"use server";
-
-import { DBpayload } from "./page";
-import { cookies } from "next/headers";
-import { SignJWT } from "jose";
-import { misskeyAccessKeyApiResponse } from "..";
-import { MiUser } from "../api/misskey-entities/user";
-import { fetchNameWithEmoji } from "../api/functions/web/fetchUsername";
-import { validateStrict } from "@/utils/validator/strictValidator";
-import { misskeyCallbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
-import { misskeyUserInfoPayload } from "../_dto/misskey-callback/user-info.dto";
-import { GetPrismaClient } from "@/utils/getPrismaClient/get-prisma-client";
-import { Logger } from "@/utils/logger/Logger";
+'use server';
+
+import { DBpayload } from './page';
+import { cookies } from 'next/headers';
+import { SignJWT } from 'jose';
+import { misskeyAccessKeyApiResponse } from '..';
+import { MiUser } from '../api/misskey-entities/user';
+import { fetchNameWithEmoji } from '../api/functions/web/fetchUsername';
+import { validateStrict } from '@/utils/validator/strictValidator';
+import { misskeyCallbackTokenClaimPayload } from '../_dto/misskey-callback/callback-token-claim.dto';
+import { misskeyUserInfoPayload } from '../_dto/misskey-callback/user-info.dto';
+import { GetPrismaClient } from '@/utils/getPrismaClient/get-prisma-client';
+import { Logger } from '@/utils/logger/Logger';
 
 const logger = new Logger('misskey-callback');
-export async function login(
-  loginReqestData: misskeyCallbackTokenClaimPayload
-): Promise<misskeyUserInfoPayload> {
+export async function login(loginReqestData: misskeyCallbackTokenClaimPayload): Promise<misskeyUserInfoPayload> {
   let loginReq: misskeyCallbackTokenClaimPayload;
   try {
-    loginReq = await validateStrict(
-      misskeyCallbackTokenClaimPayload,
-      loginReqestData
-    );
+    loginReq = await validateStrict(misskeyCallbackTokenClaimPayload, loginReqestData);
   } catch (err) {
     throw new Error(JSON.stringify(err));
   }
   loginReq.misskeyHost = loginReq.misskeyHost.toLowerCase();
 
   // 미스키 App 인증 API에서 액세스토큰과 MiUser 정보를 받아오기
-  const misskeyApiResponse: misskeyAccessKeyApiResponse =
-    await requestMiAccessTokenAndUserInfo(loginReq);
+  const misskeyApiResponse: misskeyAccessKeyApiResponse = await requestMiAccessTokenAndUserInfo(loginReq);
   if (misskeyApiResponse === null) {
     throw new Error(`misskey token get fail!`);
   }
 
   const user: MiUser = misskeyApiResponse.user;
   const miAccessToken = misskeyApiResponse.accessToken;
-  if (typeof user !== "object" || typeof miAccessToken !== "string") {
+  if (typeof user !== 'object' || typeof miAccessToken !== 'string') {
     throw new Error(`fail to get Misskey User/Token`);
   }
 
@@ -59,7 +53,7 @@ export async function login(
     hostName: loginReq.misskeyHost,
     handle: user_handle,
     name: nameWithEmoji,
-    avatarUrl: user.avatarUrl ?? "",
+    avatarUrl: user.avatarUrl ?? '',
     accessToken: miAccessToken,
     userId: user.id,
   };
@@ -75,11 +69,11 @@ export async function login(
     const cookieStore = await cookies();
     const jwtToken = await generateJwt(loginReq.misskeyHost, user_handle);
     logger.log(`Send JWT to Frontend... ${jwtToken}`);
-    cookieStore.set("jwtToken", jwtToken, {
+    cookieStore.set('jwtToken', jwtToken, {
       expires: Date.now() + 1000 * 60 * 60 * 6,
       httpOnly: true,
     });
-    cookieStore.set("server", loginReq.misskeyHost, {
+    cookieStore.set('server', loginReq.misskeyHost, {
       expires: Date.now() + 1000 * 60 * 60 * 6,
       httpOnly: true,
     });
@@ -100,9 +94,7 @@ export async function login(
  * @param payload callbackTokenClaimPayload
  * @returns misskey appAuth API response body, or null when failed
  */
-async function requestMiAccessTokenAndUserInfo(
-  payload: misskeyCallbackTokenClaimPayload
-) {
+async function requestMiAccessTokenAndUserInfo(payload: misskeyCallbackTokenClaimPayload) {
   const prisma = GetPrismaClient.getClient();
 
   const checkInstances = await prisma.server.findFirst({
@@ -112,28 +104,21 @@ async function requestMiAccessTokenAndUserInfo(
   });
 
   if (checkInstances) {
-    const res = await fetch(
-      `https://${payload.misskeyHost}/api/auth/session/userkey`,
-      {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json",
-        },
-        body: JSON.stringify({
-          appSecret: checkInstances.appSecret,
-          token: payload.callback_token,
-        }),
-      }
-    );
+    const res = await fetch(`https://${payload.misskeyHost}/api/auth/session/userkey`, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        appSecret: checkInstances.appSecret,
+        token: payload.callback_token,
+      }),
+    });
     if (res.ok) {
       const resBody = await res.json();
       return resBody;
     } else {
-      logger.error(
-        `Fail to get Misskey Access token`,
-        res.status,
-        res.statusText
-      );
+      logger.error(`Fail to get Misskey Access token`, res.status, res.statusText);
       return null;
     }
   } else {
@@ -142,7 +127,7 @@ async function requestMiAccessTokenAndUserInfo(
 }
 
 async function generateJwt(hostname: string, handle: string) {
-  const alg = "HS256";
+  const alg = 'HS256';
   const secret = new TextEncoder().encode(process.env.JWT_SECRET);
 
   const webUrl = process.env.WEB_URL;
@@ -153,8 +138,8 @@ async function generateJwt(hostname: string, handle: string) {
     .setProtectedHeader({ alg })
     .setIssuedAt()
     .setIssuer(`${webUrl}`)
-    .setAudience("urn:example:audience")
-    .setExpirationTime("6h")
+    .setAudience('urn:example:audience')
+    .setExpirationTime('6h')
     .sign(secret);
   return jwtToken;
 }
diff --git a/src/app/misskey-callback/page.tsx b/src/app/misskey-callback/page.tsx
index c82c665..9eec7bb 100644
--- a/src/app/misskey-callback/page.tsx
+++ b/src/app/misskey-callback/page.tsx
@@ -1,13 +1,13 @@
-"use client";
+'use client';
 
-import { useEffect, useState } from "react";
-import Image from "next/image";
-import { useRouter } from "next/navigation";
-import { login } from "./actions";
-import { MiUser as MiUser } from "../api/misskey-entities/user";
-import { misskeyCallbackTokenClaimPayload } from "../_dto/misskey-callback/callback-token-claim.dto";
-import { misskeyUserInfoPayload } from "../_dto/misskey-callback/user-info.dto";
-import type { profile, user } from "@prisma/client";
+import { useEffect, useState } from 'react';
+import Image from 'next/image';
+import { useRouter } from 'next/navigation';
+import { login } from './actions';
+import { MiUser as MiUser } from '../api/misskey-entities/user';
+import { misskeyCallbackTokenClaimPayload } from '../_dto/misskey-callback/callback-token-claim.dto';
+import { misskeyUserInfoPayload } from '../_dto/misskey-callback/user-info.dto';
+import type { profile, user } from '@prisma/client';
 
 export type DBpayload = {
   account: user['account'];
@@ -26,7 +26,7 @@ export default function CallbackPage() {
   const router = useRouter();
 
   useEffect(() => {
-    const server = localStorage.getItem("server");
+    const server = localStorage.getItem('server');
 
     const url = new URL(window.location.href);
     const params = new URLSearchParams(url.search);
@@ -37,9 +37,9 @@ export default function CallbackPage() {
     const fn = async () => {
       try {
         if (server) {
-          const callback_token = params.get("token");
+          const callback_token = params.get('token');
           if (callback_token === null) {
-            throw new Error("callback token is null?");
+            throw new Error('callback token is null?');
           }
           const payload: misskeyCallbackTokenClaimPayload = {
             misskeyHost: server,
@@ -57,9 +57,9 @@ export default function CallbackPage() {
           const user: MiUser = res.user;
 
           const handle = `@${user.username}@${server}`;
-          localStorage.setItem("user_handle", handle);
+          localStorage.setItem('user_handle', handle);
 
-          router.replace("/main");
+          router.replace('/main');
         }
       } catch (err) {
         console.error(err);
@@ -76,13 +76,7 @@ export default function CallbackPage() {
 
   return (
     <div className="w-full h-[100vh] flex flex-col gap-2 justify-center items-center text-3xl">
-      <Image
-        src={`/loading/${id}.gif`}
-        width={64}
-        height={64}
-        alt="Login Loading"
-        unoptimized
-      />
+      <Image src={`/loading/${id}.gif`} width={64} height={64} alt="Login Loading" unoptimized />
       <span>로그인하고 있어요...</span>
     </div>
   );
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 9ef7d96..9a712d5 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,12 +1,12 @@
-"use client";
+'use client';
 
-import { useRouter } from "next/navigation";
-import { useEffect, useRef, useState } from "react";
-import { SubmitHandler, useForm } from "react-hook-form";
-import detectInstance from "./api/functions/web/detectInstance";
-import { loginReqDto } from "./_dto/web/login/login.dto";
-import GithubRepoLink from "./_components/github";
-import DialogModalOneButton from "./_components/modalOneButton";
+import { useRouter } from 'next/navigation';
+import { useEffect, useRef, useState } from 'react';
+import { SubmitHandler, useForm } from 'react-hook-form';
+import detectInstance from './api/functions/web/detectInstance';
+import { loginReqDto } from './_dto/web/login/login.dto';
+import GithubRepoLink from './_components/github';
+import DialogModalOneButton from './_components/modalOneButton';
 
 interface FormValue {
   address: string;
@@ -22,10 +22,12 @@ const misskeyAuth = async ({ host }: loginReqDto) => {
     host: host,
   };
   const res = await fetch(`/api/web/misskey-login`, {
-    method: "POST",
+    method: 'POST',
     body: JSON.stringify(body),
   });
-  if (!res.ok) { throw new Error(`Misskey login Error! ${res.status}, ${await res.text()}`); }
+  if (!res.ok) {
+    throw new Error(`Misskey login Error! ${res.status}, ${await res.text()}`);
+  }
   return await res.json();
 };
 
@@ -39,10 +41,12 @@ const mastodonAuth = async ({ host }: loginReqDto) => {
     host: host,
   };
   const res = await fetch(`/api/web/mastodon-login`, {
-    method: "POST",
+    method: 'POST',
     body: JSON.stringify(body),
   });
-  if (!res.ok) { throw new Error(`Mastodon login Error! ${res.status}, ${await res.text()}`); }
+  if (!res.ok) {
+    throw new Error(`Mastodon login Error! ${res.status}, ${await res.text()}`);
+  }
   return await res.json();
 };
 
@@ -56,83 +60,87 @@ function urlToHost(urlOrHost: string) {
   const re = /\/\/[^/@\s]+(:[0-9]{1,5})?\/?/;
   const matched_str = urlOrHost.match(re)?.[0];
   if (matched_str) {
-    console.log(
-      `URL ${urlOrHost} replaced with ${matched_str.replaceAll("/", "")}`
-    );
-    return matched_str.replaceAll("/", "");
+    console.log(`URL ${urlOrHost} replaced with ${matched_str.replaceAll('/', '')}`);
+    return matched_str.replaceAll('/', '');
   }
   return urlOrHost;
 }
 
 export default function Home() {
   const [isLoading, setIsLoading] = useState<boolean>(false);
-  const [errMessage ,setErrorMessage] = useState<string>()
+  const [errMessage, setErrorMessage] = useState<string>();
   const errModalRef = useRef<HTMLDialogElement>(null);
   const router = useRouter();
   const {
     register,
     formState: { errors },
     handleSubmit,
-    setValue: setFormValue
-  } = useForm<FormValue>({ defaultValues: { address: "" } });
+    setValue: setFormValue,
+  } = useForm<FormValue>({ defaultValues: { address: '' } });
 
   const onSubmit: SubmitHandler<FormValue> = async (e) => {
     setIsLoading(true);
     const host = urlToHost(e.address);
-    localStorage.setItem("server", host);
+    localStorage.setItem('server', host);
 
     detectInstance(host).then((type) => {
       const payload: loginReqDto = {
         host: host,
       };
       switch (type) {
-        case "misskey":
-          localStorage.setItem("server", host);
-          misskeyAuth(payload).then((r) => {
-            setIsLoading(false);
-            router.replace(r.url);
-          }).catch((err) => {
-            setIsLoading(false);
-            setErrorMessage(err);
-            errModalRef.current?.showModal()
-          });
+        case 'misskey':
+          localStorage.setItem('server', host);
+          misskeyAuth(payload)
+            .then((r) => {
+              setIsLoading(false);
+              router.replace(r.url);
+            })
+            .catch((err) => {
+              setIsLoading(false);
+              setErrorMessage(err);
+              errModalRef.current?.showModal();
+            });
           break;
-        case "cherrypick":
-          localStorage.setItem("server", host);
-          misskeyAuth(payload).then((r) => {
-            setIsLoading(false);
-            router.replace(r.url);
-          }).catch((err) => {
-            setIsLoading(false);
-            setErrorMessage(err);
-            errModalRef.current?.showModal()
-          });
+        case 'cherrypick':
+          localStorage.setItem('server', host);
+          misskeyAuth(payload)
+            .then((r) => {
+              setIsLoading(false);
+              router.replace(r.url);
+            })
+            .catch((err) => {
+              setIsLoading(false);
+              setErrorMessage(err);
+              errModalRef.current?.showModal();
+            });
           break;
-        case "mastodon":
-          localStorage.setItem("server", host);
-          mastodonAuth(payload).then((r) => {
-            router.replace(r);
-          }).catch((err) => {
-            setIsLoading(false);
-            setErrorMessage(err);
-            errModalRef.current?.showModal()
-          });
+        case 'mastodon':
+          localStorage.setItem('server', host);
+          mastodonAuth(payload)
+            .then((r) => {
+              router.replace(r);
+            })
+            .catch((err) => {
+              setIsLoading(false);
+              setErrorMessage(err);
+              errModalRef.current?.showModal();
+            });
           break;
         default:
           window.alert('인스턴스 타입 감지에 실패했어요!');
-          console.log("아무것도 없는뎁쇼?");
+          console.log('아무것도 없는뎁쇼?');
       }
     });
   };
 
   useEffect(() => {
-    const lastUsedHost = localStorage.getItem("server");
-    const ele = document.getElementById("serverNameInput") as HTMLInputElement;
+    const lastUsedHost = localStorage.getItem('server');
+    const ele = document.getElementById('serverNameInput') as HTMLInputElement;
     if (lastUsedHost && ele) {
       setFormValue('address', lastUsedHost);
       ele.focus();
     }
-  }, [ setFormValue ]);
+  }, [setFormValue]);
 
   return (
     <div className="w-screen h-screen absolute flex flex-col items-center justify-center">
@@ -142,38 +150,28 @@ export default function Home() {
             <h1 className="absolute -inset-0 -z-10 bg-gradient-to-r text-transparent from-red-500 via-fuchsia-500 to-green-500 bg-clip-text blur-lg">
               Neo-Quesdon
             </h1>
-            <h1 className="text-7xl font-bold z-10 mb-2 desktop:mb-0">
-              Neo-Quesdon
-            </h1>
+            <h1 className="text-7xl font-bold z-10 mb-2 desktop:mb-0">Neo-Quesdon</h1>
           </div>
           <span className="font-thin tracking-wider text-base desktop:text-lg">
-            Misskey / CherryPick / Mastodon 에서 사용할 수 있는 새로운
-            Quesdon
+            Misskey / CherryPick / Mastodon 에서 사용할 수 있는 새로운 Quesdon
           </span>
         </div>
         <div className="flex flex-col desktop:flex-row items-center">
-          <form
-            className="flex flex-col desktop:flex-row"
-            onSubmit={handleSubmit(onSubmit)}
-            id="urlInputForm"
-          >
-            {errors.address && errors.address.type === "pattern" && (
+          <form className="flex flex-col desktop:flex-row" onSubmit={handleSubmit(onSubmit)} id="urlInputForm">
+            {errors.address && errors.address.type === 'pattern' && (
               <div
                 className="tooltip tooltip-open tooltip-error transition-opacity"
                 data-tip="올바른 URL을 입력해주세요"
               />
             )}
-            {errors.address && errors.address.message === "required" && (
-              <div
-                className="tooltip tooltip-open tooltip-error transition-opacity"
-                data-tip="URL을 입력해주세요"
-              />
+            {errors.address && errors.address.message === 'required' && (
+              <div className="tooltip tooltip-open tooltip-error transition-opacity" data-tip="URL을 입력해주세요" />
             )}
             <input
               id="serverNameInput"
-              {...register("address", {
+              {...register('address', {
                 pattern: /\./,
-                required: "required",
+                required: 'required',
               })}
               placeholder="serafuku.moe"
               className="w-full input input-bordered text-lg desktop:text-3xl mb-4 desktop:mb-0"
@@ -182,9 +180,7 @@ export default function Home() {
           <div className="flex flex-row items-center">
             <button
               type="submit"
-              className={`btn ml-4 ${
-                isLoading ? "btn-disabled" : "btn-primary"
-              }`}
+              className={`btn ml-4 ${isLoading ? 'btn-disabled' : 'btn-primary'}`}
               form="urlInputForm"
             >
               {isLoading ? (
@@ -199,10 +195,8 @@ export default function Home() {
             </button>
             <button
               type="button"
-              className={`btn ml-4 ${
-                isLoading ? "btn-disabled" : "btn-outline"
-              }`}
-              onClick={() => (window.location.href = "/main")}
+              className={`btn ml-4 ${isLoading ? 'btn-disabled' : 'btn-outline'}`}
+              onClick={() => (window.location.href = '/main')}
             >
               로그인 없이 즐기기
             </button>
@@ -212,7 +206,12 @@ export default function Home() {
       <footer className="w-full row-start-3 flex gap-6 flex-wrap items-center justify-end">
         <GithubRepoLink />
       </footer>
-      <DialogModalOneButton title={"오류"} body={`로그인 오류가 발생했어요! ${errMessage}`} buttonText={"확인"} ref={errModalRef} />
+      <DialogModalOneButton
+        title={'오류'}
+        body={`로그인 오류가 발생했어요! ${errMessage}`}
+        buttonText={'확인'}
+        ref={errModalRef}
+      />
     </div>
   );
 }
diff --git a/src/utils/apiErrorResponse/sendApiError.ts b/src/utils/apiErrorResponse/sendApiError.ts
index d6251ff..a648945 100644
--- a/src/utils/apiErrorResponse/sendApiError.ts
+++ b/src/utils/apiErrorResponse/sendApiError.ts
@@ -1,4 +1,4 @@
-import { NextResponse } from "next/server";
+import { NextResponse } from 'next/server';
 
 export function sendApiError(code: number, message: string | string[]) {
   return NextResponse.json({ code: code, message: message }, { status: code });
diff --git a/src/utils/getIp/get-ip-from-Request.ts b/src/utils/getIp/get-ip-from-Request.ts
index a230904..8e3748a 100644
--- a/src/utils/getIp/get-ip-from-Request.ts
+++ b/src/utils/getIp/get-ip-from-Request.ts
@@ -1,11 +1,11 @@
-import { NextRequest } from "next/server";
-import { Logger } from "../logger/Logger";
+import { NextRequest } from 'next/server';
+import { Logger } from '../logger/Logger';
 
 const logger = new Logger('get-ip-from-request');
 export function getIpFromRequest(req: NextRequest) {
   const ip = req.headers.get('x-forwarded-for')?.split(',')[0].replace(' ', '');
-  if (!ip){
+  if (!ip) {
     logger.warn('IP detect fail!');
   }
   return ip ?? '127.1.2.3';
-}
\ No newline at end of file
+}
diff --git a/src/utils/getIp/get-ip-hash.ts b/src/utils/getIp/get-ip-hash.ts
index e132fa8..d4a2e74 100644
--- a/src/utils/getIp/get-ip-hash.ts
+++ b/src/utils/getIp/get-ip-hash.ts
@@ -6,14 +6,14 @@
 import IPCIDR from 'ip-cidr';
 
 export function getIpHash(ip: string): string {
-	try {
-		// because a single person may control many IPv6 addresses,
-		// only a /64 subnet prefix of any IP will be taken into account.
-		// (this means for IPv4 the entire address is used)
-		const prefix = IPCIDR.createAddress(ip).mask(64);
-		return 'ip-' + BigInt('0b' + prefix).toString(36);
-	} catch (e) {
-		const prefix = IPCIDR.createAddress(ip.replace(/:[0-9]+$/, '')).mask(64);
-		return 'ip-' + BigInt('0b' + prefix).toString(36);
-	}
+  try {
+    // because a single person may control many IPv6 addresses,
+    // only a /64 subnet prefix of any IP will be taken into account.
+    // (this means for IPv4 the entire address is used)
+    const prefix = IPCIDR.createAddress(ip).mask(64);
+    return 'ip-' + BigInt('0b' + prefix).toString(36);
+  } catch (e) {
+    const prefix = IPCIDR.createAddress(ip.replace(/:[0-9]+$/, '')).mask(64);
+    return 'ip-' + BigInt('0b' + prefix).toString(36);
+  }
 }
diff --git a/src/utils/getPrismaClient/get-prisma-client.ts b/src/utils/getPrismaClient/get-prisma-client.ts
index 46ba753..c7ec163 100644
--- a/src/utils/getPrismaClient/get-prisma-client.ts
+++ b/src/utils/getPrismaClient/get-prisma-client.ts
@@ -1,12 +1,12 @@
-import { PrismaClient } from "@prisma/client";
+import { PrismaClient } from '@prisma/client';
 
 export class GetPrismaClient {
   private static prismaClient: PrismaClient;
   private constructor() {}
   public static getClient() {
     if (!GetPrismaClient.prismaClient) {
-      GetPrismaClient.prismaClient = new PrismaClient({log: ['info']});
+      GetPrismaClient.prismaClient = new PrismaClient({ log: ['info'] });
     }
     return GetPrismaClient.prismaClient;
   }
-}
\ No newline at end of file
+}
diff --git a/src/utils/ratelimiter/rateLimiter.ts b/src/utils/ratelimiter/rateLimiter.ts
index 861e843..213c59d 100644
--- a/src/utils/ratelimiter/rateLimiter.ts
+++ b/src/utils/ratelimiter/rateLimiter.ts
@@ -1,5 +1,5 @@
-import { Redis } from "ioredis";
-import { Logger } from "../logger/Logger";
+import { Redis } from 'ioredis';
+import { Logger } from '../logger/Logger';
 
 export class RateLimiterService {
   private redis: Redis;
@@ -9,8 +9,8 @@ export class RateLimiterService {
     this.logger = new Logger('RateLimiterService');
     const host = process.env.REDIS_HOST;
     const port_str = process.env.REDIS_PORT;
-    if (typeof host !== "string" || typeof port_str !== "string") {
-      throw new Error("Redis host or port not provided!");
+    if (typeof host !== 'string' || typeof port_str !== 'string') {
+      throw new Error('Redis host or port not provided!');
     }
     const port = Number.parseInt(port_str);
     this.redis = new Redis({
@@ -33,32 +33,27 @@ export class RateLimiterService {
    * @param option bucket_time: 초 단위 버킷 시간, req_limit: 리밋 숫자
    * @returns boolean (true: 리밋에 도달함, false: 리밋에 도달하지 않음)
    */
-  public async limit(
-    key: string,
-    option: { bucket_time: number; req_limit: number }
-  ) {
+  public async limit(key: string, option: { bucket_time: number; req_limit: number }) {
     const now = Date.now() / 1000;
     const { bucket_time, req_limit } = option;
     const result = await this.redis
       .multi()
       .setnx(`lastreset-${key}`, now)
       .incr(key)
-      .getex(`lastreset-${key}`, "EX", bucket_time)
+      .getex(`lastreset-${key}`, 'EX', bucket_time)
       .expire(key, bucket_time)
       .exec();
 
     let req_count = result?.[1][1] as number;
     const lastRefilled_str = result?.[2][1] as string;
-    if (typeof req_count !== "number" || typeof lastRefilled_str !== "string") {
+    if (typeof req_count !== 'number' || typeof lastRefilled_str !== 'string') {
       return true;
     }
     const lastReset = Number.parseInt(lastRefilled_str);
 
     if (Math.floor((now - lastReset) * (req_limit / bucket_time)) >= 1) {
       // 리필 토큰수 계산: 마지막 리필이후 지난 초 * 초당 리밋  을 내림한 것
-      const refill_tokens = Math.floor(
-        (now - lastReset) * (req_limit / bucket_time)
-      );
+      const refill_tokens = Math.floor((now - lastReset) * (req_limit / bucket_time));
 
       // 새로운 카운터 값: '현재 카운터와 최대 리퀘스트값 중에 작은것' 에서 리필 토큰수를 뺀 후, 0보다 작으면 0으로 처리
       // '현재 카운터와 최대 리퀘스트값 중에 작은것' 의 이유: 카운터는 리밋에 걸린 이후에도 계속 요청마다 증가하지만, 거부된 요청은 리밋으로 카운트하지 않고 싶음.
@@ -67,19 +62,15 @@ export class RateLimiterService {
       this.logger.debug(`토큰 리필:`, req_count - newCounter);
       req_count = newCounter;
 
-      await this.redis
-        .multi()
-        .setex(`lastreset-${key}`, bucket_time, now)
-        .setex(key, bucket_time, newCounter)
-        .exec();
+      await this.redis.multi().setex(`lastreset-${key}`, bucket_time, now).setex(key, bucket_time, newCounter).exec();
     }
 
     this.logger.debug(
       `requestConter`,
       req_count,
-      "/",
+      '/',
       req_limit,
-      `bucket-size: ${bucket_time}sec, lastReset: ${lastReset}`
+      `bucket-size: ${bucket_time}sec, lastReset: ${lastReset}`,
     );
     if (req_count >= req_limit) {
       return true;
diff --git a/src/utils/validator/strictValidator.ts b/src/utils/validator/strictValidator.ts
index 3b13096..c3c5552 100644
--- a/src/utils/validator/strictValidator.ts
+++ b/src/utils/validator/strictValidator.ts
@@ -1,18 +1,18 @@
-import { ClassConstructor, plainToInstance } from "class-transformer";
-import { validate } from "class-validator";
-import { Logger } from "../logger/Logger";
+import { ClassConstructor, plainToInstance } from 'class-transformer';
+import { validate } from 'class-validator';
+import { Logger } from '../logger/Logger';
 
 const logger = new Logger('validator');
 export async function validateStrict<T extends object>(cls: ClassConstructor<T>, data: unknown): Promise<T> {
-    if (typeof data !== 'object') {
-        logger.error('data is not object!');
-        throw new Error(`data is not object!`);
-    }
-    const instance = plainToInstance(cls, data);
-    const errors = await validate(instance, { whitelist: true, forbidNonWhitelisted: true });
-    if (errors.length > 0) {
-        logger.error(errors);
-        throw errors;
-    }
-    return instance;
-}
\ No newline at end of file
+  if (typeof data !== 'object') {
+    logger.error('data is not object!');
+    throw new Error(`data is not object!`);
+  }
+  const instance = plainToInstance(cls, data);
+  const errors = await validate(instance, { whitelist: true, forbidNonWhitelisted: true });
+  if (errors.length > 0) {
+    logger.error(errors);
+    throw errors;
+  }
+  return instance;
+}

From ddb5ea205f927feb87023c647ee84a7aed1af2f9 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 18:23:48 +0900
Subject: [PATCH 88/89] =?UTF-8?q?Fix:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8?=
 =?UTF-8?q?=EB=90=98=EC=A7=80=20=EC=95=8A=EC=9D=80=20=EC=83=81=ED=83=9C?=
 =?UTF-8?q?=EC=97=90=EC=84=9C=20=EB=82=B4=EC=A7=88=EB=AC=B8=20=ED=8E=98?=
 =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EC=98=A4=EB=A5=98=EC=B2=98=EB=A6=AC=20?=
 =?UTF-8?q?=EA=B0=9C=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/main/questions/page.tsx | 4 +++-
 src/app/main/settings/action.ts | 2 +-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/app/main/questions/page.tsx b/src/app/main/questions/page.tsx
index ce5d3c9..3e0b195 100644
--- a/src/app/main/questions/page.tsx
+++ b/src/app/main/questions/page.tsx
@@ -11,7 +11,9 @@ const fetchQuestions = async () => {
   const res = await fetch('/api/db/fetch-my-questions');
 
   try {
-    if (!res.ok) {
+    if (res.status === 401) {
+      return null;
+    } else if (!res.ok) {
       throw new Error(`내 질문을 불러오는데 실패했어요!: ${await res.text()}`);
     } else {
       return await res.json();
diff --git a/src/app/main/settings/action.ts b/src/app/main/settings/action.ts
index f10c866..824dbde 100644
--- a/src/app/main/settings/action.ts
+++ b/src/app/main/settings/action.ts
@@ -21,7 +21,7 @@ export async function fetchUser() {
     });
     return user;
   } catch (err) {
-    logger.error(err);
+    logger.debug(err);
     return null;
   }
 }

From 697c56818101e1df2da214a975ddd1fcf53dd449 Mon Sep 17 00:00:00 2001
From: Yuno <yuno@yunochi.com>
Date: Sat, 23 Nov 2024 19:00:15 +0900
Subject: [PATCH 89/89] =?UTF-8?q?chore:=20=EB=B0=B1=EC=95=A4=EB=93=9C=20?=
 =?UTF-8?q?=EB=A1=9C=EA=B7=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/api/db/create-question/route.ts | 13 ++++++-----
 src/app/main/questions/action.ts        | 30 ++++++++++++++++---------
 2 files changed, 27 insertions(+), 16 deletions(-)

diff --git a/src/app/api/db/create-question/route.ts b/src/app/api/db/create-question/route.ts
index 87f86d1..07a0dc6 100644
--- a/src/app/api/db/create-question/route.ts
+++ b/src/app/api/db/create-question/route.ts
@@ -44,6 +44,7 @@ export async function POST(req: NextRequest) {
     try {
       data = await validateStrict(CreateQuestionDto, await req.json());
     } catch (errors) {
+      logger.warn(errors);
       return sendErrorResponse(400, `${errors}`);
     }
 
@@ -59,8 +60,10 @@ export async function POST(req: NextRequest) {
     });
 
     if (questionee_profile.stopAnonQuestion && !data.questioner) {
+      logger.debug('The user has prohibits anonymous questions.');
       throw new Error('The user has prohibits anonymous questions.');
     } else if (questionee_profile.stopNewQuestion) {
+      logger.debug('User stops NewQuestion');
       throw new Error('User stops NewQuestion');
     }
 
@@ -99,9 +102,7 @@ export async function POST(req: NextRequest) {
     } else {
       // 알림 전송
       const url = `${process.env.WEB_URL}/main/questions`;
-      setImmediate(() => {
-        sendNotify(questionee_user, newQuestion.question, url);
-      });
+      sendNotify(questionee_user, newQuestion.question, url);
     }
 
     // notify send 기다라지 않고 200반환
@@ -127,8 +128,10 @@ async function sendNotify(questionee: user, question: string, url: string): Prom
         text: `${questionee.handle} <네오-퀘스돈> 새로운 질문이에요!\nQ. ${question}\n ${url}`,
       }),
     });
-    if (res.ok === false) {
-      throw new Error(`Note create error`);
+    if (!res.ok) {
+      throw new Error(`Note create error ${await res.text()}`);
+    } else {
+      logger.log(`Notification Sent to ${questionee.handle}`);
     }
   } catch (error) {
     logger.error('Post-question: fail to send notify: ', error);
diff --git a/src/app/main/questions/action.ts b/src/app/main/questions/action.ts
index 6b30493..94dab4d 100644
--- a/src/app/main/questions/action.ts
+++ b/src/app/main/questions/action.ts
@@ -145,16 +145,22 @@ async function mkMisskeyNote(
     text: text,
     visibility: visibility,
   };
-  const res = await fetch(`https://${hostname}/api/notes/create`, {
-    method: 'POST',
-    headers: {
-      Authorization: `Bearer ${i}`,
-      'Content-Type': 'application/json',
-    },
-    body: JSON.stringify(newAnswerNote),
-  });
-  if (!res.ok) {
-    NoteLogger.warn(`Note create fail! `, res.status, res.statusText);
+  try {
+    const res = await fetch(`https://${hostname}/api/notes/create`, {
+      method: 'POST',
+      headers: {
+        Authorization: `Bearer ${i}`,
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify(newAnswerNote),
+    });
+    if (!res.ok) {
+      throw new Error(`Note Create Fail! ${await res.text()}`);
+    } else {
+      NoteLogger.log(`Note Created! ${res.statusText}`);
+    }
+  } catch (err) {
+    NoteLogger.warn(err);
   }
 }
 
@@ -197,7 +203,9 @@ async function mastodonToot(
     });
 
     if (!res.ok) {
-      throw new Error(`HTTP Error! status:${res.status}`);
+      throw new Error(`HTTP Error! status:${await res.text()}`);
+    } else {
+      tootLogger.log(`Toot Created! ${res.statusText}`);
     }
   } catch (err) {
     tootLogger.warn(`Toot Create Fail!`, err);