Merge pull request kookmin-sw#92 from capstone-maru/feat/chat-api

feat: Chat-API
kookmin-sw · May 21, 2024 · 85b873b · 85b873b
2 parents b4f7186 + 5e2191e
commit 85b873b
Show file tree

Hide file tree

Showing 5 changed files with 31 additions and 44 deletions.
diff --git a/src/app/pages/mobile/mobile-shared-post-page.tsx b/src/app/pages/mobile/mobile-shared-post-page.tsx
@@ -6,7 +6,7 @@ import styled from 'styled-components';
 
 import { Bookmark, CircularProfileImage } from '@/components';
 import { ImageGrid } from '@/components/shared-post-page';
-import { useAuthValue, useUserData } from '@/features/auth';
+import { useAuthValue } from '@/features/auth';
 import { useCreateChatRoom } from '@/features/chat';
 import { fromAddrToCoord } from '@/features/geocoding';
 import { useFollowUser, useUnfollowUser } from '@/features/profile';
@@ -445,15 +445,6 @@ export function MobileSharedPostPage({
       enabled: type === 'dormitory' && auth?.accessToken != null,
     });
 
-  const { data: userData } = useUserData(auth?.accessToken != null);
-  const [userId, setUserId] = useState<string>('');
-
-  useEffect(() => {
-    if (userData != null) {
-      setUserId(userData.memberId);
-    }
-  }, [userData]);
-
   useEffect(() => {
     if (sharedPost?.data.address.roadAddress != null) {
       fromAddrToCoord({ query: sharedPost?.data.address.roadAddress }).then(
@@ -474,16 +465,7 @@ export function MobileSharedPostPage({
     }
   }, [sharedPost]);
 
-  const [roomName, setRoomName] = useState<string>('');
-
-  useEffect(() => {
-    if (sharedPost !== undefined) {
-      setRoomName(sharedPost.data.publisherAccount.nickname);
-    }
-  }, [sharedPost]);
-
-  const members = [userId];
-  const { mutate: chattingMutate } = useCreateChatRoom(roomName, members);
+  const { mutate: chattingMutate } = useCreateChatRoom();
 
   const isLoading = useMemo(
     () =>
@@ -574,7 +556,12 @@ export function MobileSharedPostPage({
                   </div>
                   <styles.chattingButton
                     onClick={() => {
-                      chattingMutate();
+                      if (selected == null) return;
+
+                      chattingMutate({
+                        roomName: selected.nickname,
+                        members: [selected.memberId],
+                      });
                     }}
                   >
                     채팅

diff --git a/src/app/pages/shared-post-page.tsx b/src/app/pages/shared-post-page.tsx
@@ -517,18 +517,9 @@ export function SharedPostPage({
     }
   }, [sharedPost]);
 
-  const [roomName, setRoomName] = useState<string>('');
-  const [userId, setUserId] = useState<string>('');
   const [, setIsChatOpen] = useRecoilState(chatOpenState);
 
-  useEffect(() => {
-    if (sharedPost !== undefined) {
-      setRoomName(sharedPost.data.publisherAccount.nickname);
-      setUserId(sharedPost.data.publisherAccount.memberId);
-    }
-  }, [sharedPost]);
-
-  const { mutate: chattingMutate } = useCreateChatRoom(roomName, [userId]);
+  const { mutate: chattingMutate } = useCreateChatRoom();
 
   const isLoading = useMemo(
     () =>
@@ -749,7 +740,13 @@ export function SharedPostPage({
             <styles.buttons>
               <styles.chattingButton
                 onClick={() => {
-                  chattingMutate();
+                  if (selected == null) return;
+
+                  chattingMutate({
+                    roomName: selected.nickname,
+                    members: [selected.memberId],
+                  });
+
                   setTimeout(() => {
                     setIsChatOpen(true);
                   }, 200);

diff --git a/src/components/FloatingChatting.tsx b/src/components/FloatingChatting.tsx
@@ -332,7 +332,6 @@ export function FloatingChatting() {
 
   const auth = useAuthValue();
   if (auth == null) return <></>;
-
   return (
     <>
       <styles.chattingButton onClick={toggleChat}>

diff --git a/src/features/chat/chat.api.ts b/src/features/chat/chat.api.ts
@@ -14,19 +14,25 @@ export const getChatRoomList = async (token: string | undefined) =>
     })
     .then(res => res.data);
 
-export const postChatRoom = async (roomName: string, members: string[]) => {
+export const postChatRoom = async ({
+  roomName,
+  members,
+}: {
+  roomName: string;
+  members: string[];
+}) => {
   await axios
     .post<PostChatRoomDTO>(`/maru-api/chatRoom`, {
-      roomName: roomName,
-      members: members,
+      roomName,
+      members,
     })
     .then(res => res.data);
 };
 
 export const postInviteUser = async (roomId: number, members: string[]) => {
   await axios
     .post(`/maru-api/chatRoom/${roomId}/invite`, {
-      members: members,
+      members,
     })
     .then(res => res.data);
 };
@@ -40,9 +46,9 @@ export const getEnterChatRoom = async (
     `/maru-api/chatRoom/${roomId}/chat`,
     {
       params: {
-        roomId: roomId,
-        page: page,
-        size: size,
+        roomId,
+        page,
+        size,
       },
     },
   );

diff --git a/src/features/chat/chat.hook.ts b/src/features/chat/chat.hook.ts
@@ -16,11 +16,9 @@ export const useChatRoomList = (token: string | undefined) =>
     enabled: token !== undefined,
   });
 
-export const useCreateChatRoom = (roomName: string, members: string[]) =>
+export const useCreateChatRoom = () =>
   useMutation({
-    mutationFn: async () => {
-      await postChatRoom(roomName, members);
-    },
+    mutationFn: postChatRoom,
   });
 
 export const useInviteUsers = (roomId: number, members: string[]) =>