Merge pull request #233 from catchroom/feature/#228

✨ feat : 채팅방 생성 API 연결

api/chat/api.ts

@@ -1,20 +1,30 @@
 import axios from 'axios';
+import { apiClient } from '../user/apiClient';
 
-export const fetchChatRoom = async (token: string) => {
-  const data = await axios.get('https://catchroom.store/v1/chat/room/list', {
-    headers: {
-      Authorization: `Bearer ${token}`,
-    },
-  });
+// 1. 상품 상세조회 화면 API
+export const roomItemInfo = async (id: string | string[] | undefined) => {
+  const res = await apiClient.get(`/v1/product?id=${id}`);
 
-  const result = await data.data;
-  return result;
+  const data = res.data.data;
+  const userIdentity = res.data.data.userIdentity;
+  const accommodationUrl = res.data.data.accommodationUrl;
+  return { data, userIdentity, accommodationUrl };
 };
 
-export const fetchPreviousChat = async (roomId: string, token: string) => {
-  console.log('roomId는', roomId);
-  const data = await axios.get(
-    `https://catchroom.store/v1/chat/room/find?id=${roomId}&page=0`,
+// 2. 채팅방 생성
+export const createChatRoom = async (
+  buyerId: number,
+  sellerId: number,
+  productId: number,
+  token: string,
+) => {
+  const data = await axios.post(
+    'https://catchroom.xyz/v1/chat/room/create',
+    {
+      buyerId,
+      sellerId,
+      productId,
+    },
     {
       headers: {
         'Content-Type': 'application/json',
@@ -23,8 +33,10 @@ export const fetchPreviousChat = async (roomId: string, token: string) => {
     },
   );
 
-  const result = await data.data;
-  return result.data;
+  const result = await data.data.data.chatRoomNumber;
+  console.log(result);
+  console.log(buyerId, sellerId, productId);
+  return result;
 };
 
 export const infinitePreviousChat = async ({

components/roomInfo/footer/index.tsx

@@ -7,17 +7,39 @@ import { Button } from '@material-tailwind/react';
 // import { useRoomItem } from '@/api/room-info/query';
 import { useRecoilState } from 'recoil';
 import { viewerTestButton } from '@/atoms/roomInfo/headerTitle';
+import { UseParamsType } from '@/types/room-info/types';
+import { useParams, useRouter } from 'next/navigation';
+import { createChatRoom } from '@/api/chat/api';
+import { useRoomItem } from '@/api/room-info/query';
+import { useCookies } from 'react-cookie';
 
 // 판매자 유무에 따른 버튼노출 처리 필요
 // 현재 헤더의 화면전환 버튼을 이용한 전역상태로 바뀌는 중
 
 const FooterComponent = () => {
   const [viewerState] = useRecoilState(viewerTestButton);
+  const [cookies] = useCookies();
+  const accessToken = cookies.accessToken;
+
+  const { id } = useParams() as UseParamsType;
+  console.log(id);
+  const router = useRouter();
+  const { data } = useRoomItem(id);
+
+  const sellerId: number = data?.data.seller_id;
+  const buyerId: number = cookies.id;
+
+  //채팅방 생성
+  const createChat = async () => {
+    const chatRoomId: number = await createChatRoom(
+      sellerId,
+      buyerId,
+      Number(id),
+      accessToken,
+    );
+    router.push(`/chat/${chatRoomId}`);
+  };
 
-  // 지민님 작업 끝나시면 이어서 할 예정.
-  // const { id } = useParams() as UseParamsType;
-  // const { data } = useRoomItem(id);
-  // const userState = data?.data.userIdentity;
 
   const buttonClass =
     'font-pretend h-full rounded-[4px] text-t1 font-semibold shadow-none';
@@ -28,7 +50,7 @@ const FooterComponent = () => {
         <Button
           placeholder="Button"
           type="button"
-          onClick={() => console.log('대화중인 채팅방')}
+          onClick={() => router.push('/chat')}
           className={`${buttonClass} w-full bg-main text-white`}
         >
           대화중인 채팅방
@@ -38,7 +60,7 @@ const FooterComponent = () => {
           <Button
             placeholder="Button"
             type="button"
-            onClick={() => console.log('채팅하기 버튼 클릭')}
+            onClick={createChat}
             className={`${buttonClass} w-1/2 bg-white border border-main text-main`}
           >
             채팅으로 문의하기