hotfix: 채팅방 엣지 케이스 처리

BCSDLab · Feb 13, 2025 · ed0ba7b · ed0ba7b
1 parent e80b6aa
commit ed0ba7b
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 4 deletions.
diff --git a/src/pages/Articles/LostItemChatPage/hooks/useChatroomQuery.ts b/src/pages/Articles/LostItemChatPage/hooks/useChatroomQuery.ts
@@ -1,5 +1,14 @@
-import { skipToken, useQuery, useSuspenseQuery } from '@tanstack/react-query';
-import { getLostItemChatroomDetail, getLostItemChatroomDetailMessages, getLostItemChatroomList } from 'api/articles';
+import {
+  keepPreviousData,
+  skipToken,
+  useQuery,
+  useSuspenseQuery,
+} from '@tanstack/react-query';
+import {
+  getLostItemChatroomDetail,
+  getLostItemChatroomDetailMessages,
+  getLostItemChatroomList,
+} from 'api/articles';
 
 const useChatroomQuery = (
   token: string,
@@ -11,20 +20,22 @@ const useChatroomQuery = (
     queryFn: () => getLostItemChatroomList(token),
   });
 
-  const defaultChatroomId = chatroomId || chatroomList[0].chat_room_id;
-  const defaultArticleId = articleId || chatroomList[0].article_id;
+  const defaultChatroomId = chatroomId || chatroomList[0]?.chat_room_id;
+  const defaultArticleId = articleId || chatroomList[0]?.article_id;
 
   const { data: chatroomDetail } = useQuery({
     queryKey: ['chatroom', 'lost-item', articleId, chatroomId],
     queryFn: (articleId && chatroomId)
       ? () => getLostItemChatroomDetail(token, Number(articleId), Number(defaultChatroomId))
       : skipToken,
+    placeholderData: keepPreviousData,
   });
   const { data: messages } = useQuery({
     queryKey: ['chatroom', 'lost-item', articleId, chatroomId, 'messages'],
     queryFn: (articleId && chatroomId)
       ? () => getLostItemChatroomDetailMessages(token, Number(articleId), Number(defaultChatroomId))
       : skipToken,
+    placeholderData: keepPreviousData,
   });
 
   return {

diff --git a/src/pages/Articles/LostItemChatPage/index.tsx b/src/pages/Articles/LostItemChatPage/index.tsx
@@ -58,6 +58,15 @@ function LostItemChatPage() {
   const isCouncil = user && user.student_number === COUNCIL_STUDENT_NUMBER;
 
   const connectChatroom = () => {
+    if (!chatroomList || chatroomList.length === 0) {
+      return;
+    }
+
+    if (!articleId || !chatroomId) {
+      showToast('error', '채팅방 정보를 불러오는데 실패했습니다.');
+      return;
+    }
+
     if (client) {
       client.deactivate();
     }