Merge pull request #197 from DevKor-github/fix/#193/pick-api

PICK api 대응

Author: jw0202058

src/features/pickList/apis/useGetAppointment.ts

@@ -12,7 +12,7 @@ export interface GetAppointmentReuest {
   cursorDate?: string | null;
 }
 
-export interface GetAppointmentResponst {
+export interface GetAppointmentResponse {
   message: string;
   data: {
     appointmentInfoList: AppointmentInterface[];
@@ -32,7 +32,7 @@ interface PageParam {
 }
 
 const getAppointment = async (params: GetAppointmentReuest) => {
-  const res = await client.get<GetAppointmentResponst>('/api/v1/appointment', {
+  const res = await client.get<GetAppointmentResponse>('/api/v1/appointment', {
     params,
   });
 

src/features/pickList/components/Btn/index.tsx

@@ -7,16 +7,16 @@ interface BtnProps {
   nickname?: string;
   chatRoomId?: number;
   appointmentId: number;
-  isComplete?: boolean;
+  isReviewed?: boolean;
 }
 
-const Btn = ({ type, isComplete, chatRoomId, appointmentId, nickname }: BtnProps) => {
-  const title = type === 'chat' ? '채팅창' : isComplete ? '작성완료' : '리뷰작성';
-  const iconColor = type === 'chat' ? '54' : isComplete ? 'systemGray2' : '100';
-  const icon = type === 'chat' ? 'mgc_chat_1_fill' : isComplete ? 'mgc_choice_fill' : 'mgc_message_4_fill';
+const Btn = ({ type, isReviewed, chatRoomId, appointmentId, nickname }: BtnProps) => {
+  const title = type === 'chat' ? '채팅창' : isReviewed ? '작성완료' : '리뷰작성';
+  const iconColor = type === 'chat' ? '54' : isReviewed ? 'systemGray2' : '100';
+  const icon = type === 'chat' ? 'mgc_chat_1_fill' : isReviewed ? 'mgc_choice_fill' : 'mgc_message_4_fill';
 
-  const bg = type === 'chat' ? 'systemGray2' : isComplete ? 'systemGray5' : 'main';
-  const color = type === 'review' && isComplete ? '54' : '100';
+  const bg = type === 'chat' ? 'systemGray2' : isReviewed ? 'systemGray5' : 'main';
+  const color = type === 'review' && isReviewed ? '54' : '100';
 
   const navigate = useNavigate();
 
@@ -25,14 +25,13 @@ const Btn = ({ type, isComplete, chatRoomId, appointmentId, nickname }: BtnProps
     e.preventDefault();
 
     if (type === 'chat') {
-      alert('채팅창으로 연결');
       navigate(`/chatroom/${chatRoomId}`);
 
       return;
     }
     if (type === 'review') {
       // 리뷰 작성 전일 때,
-      if (!isComplete) {
+      if (!isReviewed) {
         alert('리뷰 작성 페이지로 연결');
         navigate(`/review/${appointmentId}`, {
           state: {

src/features/pickList/components/PickItemList/index.tsx

@@ -37,11 +37,11 @@ const PickItemList = ({ data }: PickItemListProps) => {
                     showCount={3}
                     itemInfo={{
                       productTypes: data.productTypes,
-                      // transactionTypes: data.type,
-                      // quality: 'BEST',
-                      // size: 'L',
-                      // color: 'BLACK',
-                      // tradeMethods: ['DIRECT'],
+                      transactionTypes: [data.type],
+                      quality: data.quality,
+                      size: data.size,
+                      color: data.color,
+                      tradeMethods: ['DIRECT'],
                     }}
                   />
                 </div>
@@ -53,16 +53,16 @@ const PickItemList = ({ data }: PickItemListProps) => {
             <Btn
               type="chat"
               appointmentId={data.appointmentId}
-              // nickname={data.nickname}
-              // chatRoomId={data.chatRoomId}
+              nickname={data.opponentNickname}
+              chatRoomId={data.chatRoomId}
             />
             {isSuccess && (
               <Btn
                 type="review"
                 appointmentId={data.appointmentId}
-                // nickname={data.nickname}
-                // isComplete={data.isComplete}
-                // chatRoomId={data.chatRoomId}
+                nickname={data.opponentNickname}
+                isReviewed={data.isReviewed}
+                chatRoomId={data.chatRoomId}
               />
             )}
           </div>

src/features/pickList/types.ts

@@ -1,15 +1,19 @@
-import type { ProductType, TradeMethods, TransactionType } from '@/libs/types/item';
+import type { Color, ProductType, Quality, Size, TradeMethods, TransactionType } from '@/libs/types/item';
 
 export interface AppointmentInterface {
   appointmentId: number;
   itemId: number;
+  chatRoomId: number;
   requesterId: number;
   ownerId: number;
   isCreator: boolean;
   imageUrl: string;
   title: string;
   description: string;
   productTypes: ProductType[];
+  quality: Quality;
+  size: Size;
+  color: Color;
   rentalDate: string;
   returnDate: string;
   rentalLocation: string;
@@ -19,4 +23,6 @@ export interface AppointmentInterface {
   state: 'CONFIRMED' | 'IN_PROGRESS' | 'SUCCESS';
   type: TransactionType;
   tradeMethod: TradeMethods;
+  opponentNickname: string;
+  isReviewed: boolean;
 }