From 09a236365ad5f04555e85329ea60fb10abfeb962 Mon Sep 17 00:00:00 2001
From: "SeungJu, Lee" <84257439+SeungJL@users.noreply.github.com>
Date: Tue, 13 Aug 2024 15:41:46 +0900
Subject: [PATCH 1/2] perf: notice (#209)

---
 pageTemplates/notice/NoticeItem.tsx           | 19 ++++++++++++++++++-
 .../square/SecretSquare/SquareItem.tsx        |  2 +-
 storage/notice.ts                             | 10 ++++++++++
 3 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/pageTemplates/notice/NoticeItem.tsx b/pageTemplates/notice/NoticeItem.tsx
index ddc77eb18..e6e33c8ad 100644
--- a/pageTemplates/notice/NoticeItem.tsx
+++ b/pageTemplates/notice/NoticeItem.tsx
@@ -8,6 +8,7 @@ import {
   Flex,
   Text,
 } from "@chakra-ui/react";
+import Link from "next/link";
 import { useEffect } from "react";
 
 import { NoticeIcon } from "../../components/atoms/Icons/NoticeIcons";
@@ -47,7 +48,23 @@ function NoticeItem() {
               color="var(--gray-700)"
               lineHeight="22px"
             >
-              {item.content}
+              <p>{item.content}</p>
+              {item?.link && (
+                <Link href={item.link}>
+                  <Box
+                    my="12px"
+                    bgColor="var(--gray-200)"
+                    color="var(--gray-700)"
+                    fontSize="13px"
+                    w="max-content"
+                    p="4px 8px"
+                    rounded="lg"
+                    textDecoration="underline"
+                  >
+                    @{item.title}
+                  </Box>
+                </Link>
+              )}
             </AccordionPanel>
           </AccordionItem>
         ))}
diff --git a/pageTemplates/square/SecretSquare/SquareItem.tsx b/pageTemplates/square/SecretSquare/SquareItem.tsx
index c3179b4f5..b8d6aa765 100644
--- a/pageTemplates/square/SecretSquare/SquareItem.tsx
+++ b/pageTemplates/square/SecretSquare/SquareItem.tsx
@@ -1,7 +1,7 @@
 import { Box, Flex, Image, Text } from "@chakra-ui/react";
 import dayjs from "dayjs";
-import { useSession } from "next-auth/react";
 import Link from "next/link";
+import { useSession } from "next-auth/react";
 import styled from "styled-components";
 
 import { useTypeToast } from "../../../hooks/custom/CustomToast";
diff --git a/storage/notice.ts b/storage/notice.ts
index e609d73ad..0bcf36685 100644
--- a/storage/notice.ts
+++ b/storage/notice.ts
@@ -4,6 +4,7 @@ interface INoticeArr {
   category: NoticeCategory;
   content: string;
   date: string;
+  link?: string;
 }
 
 export type NoticeCategory = "main" | "sub" | "event" | "update";
@@ -866,4 +867,13 @@ export const NOTICE_ARR: INoticeArr[] = [
       "라운지에 이어 익명 커뮤니티가 출시되었습니다! 익명이 보장되니까 할 얘기가 있다면 부담없이 소통하세요!",
     date: "2023-08-13",
   },
+  {
+    id: "110",
+    title: "8월 3주차 주간 공지",
+    category: "main",
+    content:
+      "이벤트 당첨자 발표, 커뮤니티 출시, 번개/소모임 개설 가이드. 상세 내용은 하단 링크 참조.",
+    date: "2023-08-13",
+    link: "https://mewing-sombrero-e36.notion.site/8-0eec96824f8e4ff09d6a66a27de9572f?pvs=25",
+  },
 ];

From 872ec36c3b812e002780111e61a8825001a73b63 Mon Sep 17 00:00:00 2001
From: "SeungJu, Lee" <84257439+SeungJL@users.noreply.github.com>
Date: Tue, 13 Aug 2024 16:40:30 +0900
Subject: [PATCH 2/2] perf: comment (#210)

---
 components/molecules/UserCommentBlock.tsx        |  1 +
 .../square/SecretSquare/SecretSquareComments.tsx | 16 ++++++++++++----
 pages/square/secret/[id].tsx                     | 11 ++++++-----
 3 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/components/molecules/UserCommentBlock.tsx b/components/molecules/UserCommentBlock.tsx
index bb3edadd8..1adf26282 100644
--- a/components/molecules/UserCommentBlock.tsx
+++ b/components/molecules/UserCommentBlock.tsx
@@ -42,6 +42,7 @@ function UserCommentBlock({
           : obj;
       }),
     );
+    setIsReCommentInput(false);
   };
 
   return (
diff --git a/pageTemplates/square/SecretSquare/SecretSquareComments.tsx b/pageTemplates/square/SecretSquare/SecretSquareComments.tsx
index cad90c93c..da215a409 100644
--- a/pageTemplates/square/SecretSquare/SecretSquareComments.tsx
+++ b/pageTemplates/square/SecretSquare/SecretSquareComments.tsx
@@ -15,9 +15,10 @@ import { dayjsToStr } from "../../../utils/dateTimeUtils";
 
 interface SecretSquareCommentsProps {
   comments: UserCommentProps[];
+  refetch: () => void;
 }
 
-function SecretSquareComments({ comments }: SecretSquareCommentsProps) {
+function SecretSquareComments({ comments, refetch }: SecretSquareCommentsProps) {
   const router = useRouter();
   const { data: userInfo } = useUserInfoQuery();
 
@@ -29,10 +30,14 @@ function SecretSquareComments({ comments }: SecretSquareCommentsProps) {
   }, [comments]);
 
   const { mutate: writeComment } = useCommentMutation("post", "square", squareId, {
-    onSuccess() {},
+    onSuccess() {
+      refetch();
+    },
   });
   const { mutate: writeSubComment } = useSubCommentMutation("post", "square", squareId, {
-    onSuccess() {},
+    onSuccess() {
+      refetch();
+    },
   });
 
   const addNewComment = (user: IUserSummary, comment: string): UserCommentProps => {
@@ -51,7 +56,10 @@ function SecretSquareComments({ comments }: SecretSquareCommentsProps) {
   const uniqueUsers = {};
   let uniqueIdCounter = 1;
   commentArr
-    .map((item) => item.user)
+    .flatMap((item) => [
+      item.user,
+      ...(Array.isArray(item.subComments) ? item.subComments.map((sub) => sub.user) : []),
+    ])
     .forEach((user) => {
       if (!uniqueUsers[user as unknown as string]) {
         uniqueUsers[user as unknown as string] = uniqueIdCounter;
diff --git a/pages/square/secret/[id].tsx b/pages/square/secret/[id].tsx
index 14d4cd76f..6dd307bbf 100644
--- a/pages/square/secret/[id].tsx
+++ b/pages/square/secret/[id].tsx
@@ -55,10 +55,11 @@ function SecretSquareDetailPage() {
   );
   const { mutate: mutatePoll, isLoading: isPollLoading } = usePatchPollMutation({ squareId });
   const { mutate: deleteSquareMutate } = useDeleteSecretSquareMutation({ squareId });
-  const { data: squareDetail, isFetching: isSquareDetailFetching } = useGetSquareDetailQuery(
-    { squareId },
-    { staleTime: Infinity, enabled: !!squareId },
-  );
+  const {
+    data: squareDetail,
+    isFetching: isSquareDetailFetching,
+    refetch,
+  } = useGetSquareDetailQuery({ squareId }, { staleTime: Infinity, enabled: !!squareId });
   const { data: pollStatus } = useCurrentPollStatusQuery(
     { squareId },
     {
@@ -391,7 +392,7 @@ function SecretSquareDetailPage() {
         </Slide>
         {squareDetail && (
           <Box as="section" bg="white">
-            <SecretSquareComments comments={squareDetail?.comments} />
+            <SecretSquareComments comments={squareDetail?.comments} refetch={refetch} />
           </Box>
         )}
       </>