Refactor: 변경된 응답에 맞게 핸들러 수정

frontend/src/mocks/handlers.ts

@@ -1,6 +1,5 @@
 import { http, HttpResponse } from 'msw';
 import {
-  BaseResponse,
   ProjectResponse,
   FolderResponse,
   ImageResponse,
@@ -9,36 +8,25 @@ import {
   RefreshTokenResponse,
   AutoLabelingResponse,
   ProjectListResponse,
+  ErrorResponse,
 } from '@/types';
 
 export const handlers = [
   // Auth Handlers
   http.post('/api/auth/reissue', () => {
     // 토큰 재발급 핸들러
-    const response: BaseResponse<RefreshTokenResponse> = {
+    const response: RefreshTokenResponse = {
-      status: 200,
+      accessToken: 'newAccessToken',
-      code: 0,
-      message: '토큰 재발급 성공',
-      data: { accessToken: 'newAccessToken' },
-      errors: [],
-      isSuccess: true,
     };
     return HttpResponse.json(response);
   }),
 
   http.get('/api/auth/profile', () => {
     // 사용자 프로필 핸들러
-    const response: BaseResponse<MemberResponse> = {
+    const response: MemberResponse = {
-      status: 200,
-      code: 0,
-      message: '사용자 정보 가져오기 성공',
-      data: {
       id: 1,
       nickname: 'javajoha',
       profileImage: 'profile.jpg',
-      },
-      errors: [],
-      isSuccess: true,
     };
     return HttpResponse.json(response);
   }),
@@ -47,20 +35,13 @@ export const handlers = [
   http.get('/api/workspaces/:workspaceId', ({ params }) => {
     // 워크스페이스 조회 핸들러
     const { workspaceId } = params;
-    const response: BaseResponse<WorkspaceResponse> = {
+    const response: WorkspaceResponse = {
-      status: 200,
-      code: 0,
-      message: '워크스페이스 조회 성공',
-      data: {
       id: parseInt(workspaceId as string, 10),
-        memberId: '1',
+      memberId: 1,
-        title: 'Workspace Title',
+      title: 'workspace1',
-        content: 'Workspace Content',
+      content: '갤럭시 s24 불량 검증',
-        createdAt: '2024-09-12T00:00:00Z',
+      createdAt: '2024-09-18T05:04:44.668Z',
-        updatedAt: '2024-09-12T00:00:00Z',
+      updatedAt: '2024-09-18T05:04:44.668Z',
-      },
-      errors: [],
-      isSuccess: true,
     };
     return HttpResponse.json(response);
   }),
@@ -68,20 +49,13 @@ export const handlers = [
   http.put('/api/workspaces/:workspaceId', ({ params }) => {
     // 워크스페이스 수정 핸들러
     const { workspaceId } = params;
-    const response: BaseResponse<WorkspaceResponse> = {
+    const response: WorkspaceResponse = {
-      status: 200,
-      code: 0,
-      message: '워크스페이스 수정 성공',
-      data: {
       id: parseInt(workspaceId as string, 10),
-        memberId: '1',
+      memberId: 1,
       title: 'Updated Workspace Title',
       content: 'Updated Workspace Content',
-        createdAt: '2024-09-12T00:00:00Z',
+      createdAt: '2024-09-18T05:04:44.668Z',
-        updatedAt: '2024-09-12T01:00:00Z',
+      updatedAt: '2024-09-18T06:00:00.668Z',
-      },
-      errors: [],
-      isSuccess: true,
     };
     return HttpResponse.json(response);
   }),
@@ -89,79 +63,74 @@ export const handlers = [
   http.delete('/api/workspaces/:workspaceId', ({ params }) => {
     const { workspaceId } = params;
     console.log(workspaceId);
-    const response: BaseResponse<null> = {
+    return HttpResponse.json({});
-      status: 200,
-      code: 0,
-      message: '워크스페이스 삭제 성공',
-      data: null,
-      errors: [],
-      isSuccess: true,
-    };
-    return HttpResponse.json(response);
   }),
 
   http.get('/api/workspaces', () => {
     // 워크스페이스 목록 조회 핸들러
-    const response: BaseResponse<{ workspaceResponses: WorkspaceResponse[] }> = {
+    const response: WorkspaceResponse[] = [
-      status: 200,
-      code: 0,
-      message: '워크스페이스 목록 조회 성공',
-      data: {
-        workspaceResponses: [
       {
         id: 1,
-            memberId: '1',
+        memberId: 1,
         title: 'Workspace 1',
         content: 'Content 1',
-            createdAt: '2024-09-12T00:00:00Z',
+        createdAt: '2024-09-18T05:04:44.668Z',
-            updatedAt: '2024-09-12T00:00:00Z',
+        updatedAt: '2024-09-18T05:04:44.668Z',
       },
-        ],
+    ];
-      },
-      errors: [],
-      isSuccess: true,
-    };
     return HttpResponse.json(response);
   }),
 
   // Project Handlers
+  http.get('/api/workspaces/:workspaceId/projects', ({ request, params }) => {
+    const workspaceId = parseInt(params.workspaceId as string, 10);
+
+    const url = new URL(request.url);
+    const lastProjectId = parseInt(url.searchParams.get('lastProjectId') || '0', 10);
+    const limit = parseInt(url.searchParams.get('limit') || '10', 10);
+
+    const projects: ProjectResponse[] = Array.from({ length: limit }, (_, index) => ({
+      id: lastProjectId + index + 1,
+      title: `프로젝트 ${lastProjectId + index + 1}`,
+      workspaceId,
+      projectType: ['classification', 'detection', 'segmentation'][index % 3] as
+        | 'classification'
+        | 'detection'
+        | 'segmentation',
+      createdAt: new Date().toISOString(),
+      updatedAt: new Date().toISOString(),
+    }));
+
+    // 응답 생성
+    const response: ProjectListResponse = {
+      workspaceResponses: projects,
+    };
+
+    return HttpResponse.json(response);
+  }),
   http.get('/api/projects/:projectId', ({ params }) => {
     // 프로젝트 조회 핸들러
     const { projectId } = params;
-    const response: BaseResponse<ProjectResponse> = {
+    const response: ProjectResponse = {
-      status: 200,
-      code: 0,
-      message: '프로젝트 조회 성공',
-      data: {
       id: parseInt(projectId as string, 10),
       title: 'Project Title',
       workspaceId: 1,
       projectType: 'classification',
-        createdAt: '2024-09-12T00:00:00Z',
+      createdAt: '2024-09-18T05:04:44.668Z',
-        updatedAt: '2024-09-12T00:00:00Z',
+      updatedAt: '2024-09-18T05:04:44.668Z',
-      },
-      errors: [],
-      isSuccess: true,
     };
     return HttpResponse.json(response);
   }),
 
   http.post('/api/workspaces/:workspaceId/projects', () => {
     // 프로젝트 생성 핸들러
-    const response: BaseResponse<ProjectResponse> = {
+    const response: ProjectResponse = {
-      status: 200,
-      code: 0,
-      message: '프로젝트 생성 성공',
-      data: {
       id: 3,
       title: 'New Project',
       workspaceId: 1,
       projectType: 'detection',
-        createdAt: '2024-09-12T01:00:00Z',
+      createdAt: '2024-09-18T05:04:44.668Z',
-        updatedAt: '2024-09-12T01:00:00Z',
+      updatedAt: '2024-09-18T05:04:44.668Z',
-      },
-      errors: [],
-      isSuccess: true,
     };
     return HttpResponse.json(response);
   }),
@@ -169,20 +138,13 @@ export const handlers = [
   http.put('/api/projects/:projectId', ({ params }) => {
     // 프로젝트 수정 핸들러
     const { projectId } = params;
-    const response: BaseResponse<ProjectResponse> = {
+    const response: ProjectResponse = {
-      status: 200,
-      code: 0,
-      message: '프로젝트 수정 성공',
-      data: {
       id: parseInt(projectId as string, 10),
       title: 'Updated Project Title',
       workspaceId: 1,
       projectType: 'segmentation',
-        createdAt: '2024-09-12T00:00:00Z',
+      createdAt: '2024-09-18T05:04:44.668Z',
-        updatedAt: '2024-09-12T01:00:00Z',
+      updatedAt: '2024-09-18T06:00:00.668Z',
-      },
-      errors: [],
-      isSuccess: true,
     };
     return HttpResponse.json(response);
   }),
@@ -190,25 +152,13 @@ export const handlers = [
   http.delete('/api/projects/:projectId', ({ params }) => {
     const { projectId } = params;
     console.log(projectId);
-
+    return HttpResponse.json({});
-    const response: BaseResponse<null> = {
-      status: 200,
-      code: 0,
-      message: '프로젝트 삭제 성공',
-      data: null,
-      errors: [],
-      isSuccess: true,
-    };
-    return HttpResponse.json(response);
   }),
 
+  // Folder and Image Handlers
   http.get('/api/projects/:projectId/folders/:folderId', ({ params }) => {
     const { folderId } = params;
-    const response: BaseResponse<FolderResponse> = {
+    const response: FolderResponse = {
-      status: 200,
-      code: 0,
-      message: '폴더 조회 성공',
-      data: {
       id: parseInt(folderId as string, 10),
       title: 'My Folder',
       images: [
@@ -235,131 +185,28 @@ export const handlers = [
           title: 'Bike',
         },
       ],
-      },
-      errors: [
-        {
-          field: 'id',
-          code: '1001',
-          message: 'ID format issue',
-          objectName: 'FolderResponse',
-        },
-      ],
-      isSuccess: true,
     };
     return HttpResponse.json(response);
   }),
 
-  http.get('/api/workspaces/:workspaceId/projects', ({ request, params }) => {
-    // request.params로 workspaceId 가져오기
-    const workspaceIdParam = params.workspaceId;
-    const workspaceId = parseInt(Array.isArray(workspaceIdParam) ? workspaceIdParam[0] : workspaceIdParam, 10);
-
-    // URL 인스턴스를 통해 요청 URL을 다룹니다.
-    const url = new URL(request.url);
-    // const memberId = parseInt(url.searchParams.get('memberId') || '0', 10);
-    const lastProjectId = parseInt(url.searchParams.get('lastProjectId') || '0', 10);
-    const limit = parseInt(url.searchParams.get('limit') || '10', 10);
-
-    // 프로젝트 데이터 예시 생성
-    const projects: ProjectResponse[] = Array.from({ length: limit }, (_, index) => ({
-      id: lastProjectId + index + 1,
-      title: `프로젝트 ${lastProjectId + index + 1}`,
-      workspaceId,
-      projectType: ['classification', 'detection', 'segmentation'][index % 3] as
-        | 'classification'
-        | 'detection'
-        | 'segmentation',
-      createdAt: new Date().toISOString(),
-      updatedAt: new Date().toISOString(),
-    }));
-
-    // 응답 생성
-    const response: BaseResponse<ProjectListResponse> = {
-      status: 200,
-      code: 0,
-      message: '프로젝트 목록 조회 성공',
-      data: {
-        workspaceResponses: projects,
-      },
-      errors: [],
-      isSuccess: true,
-    };
-
-    return HttpResponse.json(response);
-  }),
-
-  http.post('/api/projects/:projectId/folders', () => {
-    // 폴더 생성 핸들러
-    const response: BaseResponse<FolderResponse> = {
-      status: 200,
-      code: 0,
-      message: '폴더 생성 성공',
-      data: {
-        id: 2,
-        title: 'New Folder',
-        images: [],
-        children: [],
-      },
-      errors: [],
-      isSuccess: true,
-    };
-    return HttpResponse.json(response);
-  }),
-
-  // Image Handlers
   http.get('/api/projects/:projectId/folders/:folderId/images/:imageId', ({ params }) => {
     // 이미지 조회 핸들러
     const { imageId } = params;
-    const response: BaseResponse<ImageResponse> = {
+    const response: ImageResponse = {
-      status: 200,
-      code: 0,
-      message: '이미지 조회 성공',
-      data: {
       id: parseInt(imageId as string, 10),
       imageTitle: 'Image Title',
       imageUrl: 'image-url.jpg',
       status: 'PENDING',
-      },
-      errors: [],
-      isSuccess: true,
     };
     return HttpResponse.json(response);
   }),
 
-  http.put('/api/projects/:projectId/folders/:folderId/images/:imageId', () => {
+  // Auto Labeling Handler
-    // 이미지 이동 핸들러
+  http.post('/api/projects/:projectId/label/auto', () => {
-    const response: BaseResponse<null> = {
+    const response: AutoLabelingResponse = {
-      status: 200,
+      imageId: 1,
-      code: 0,
+      imageUrl: 'image-url.jpg',
-      message: '이미지 이동 성공',
+      data: `{
-      data: null,
-      errors: [],
-      isSuccess: true,
-    };
-    return HttpResponse.json(response);
-  }),
-
-  // Labeling Handlers
-  http.post('/api/projects/:projectId/label/image/:imageId', () => {
-    // 이미지 단위 레이블링 핸들러
-    const response: BaseResponse<Record<string, never>> = {
-      status: 200,
-      code: 0,
-      message: '이미지 레이블링 저장 성공',
-      data: {},
-      errors: [],
-      isSuccess: true,
-    };
-    return HttpResponse.json(response);
-  }),
-
-  // 오토 레이블링 핸들러
-  http.post('/api/projects/:projectId/label/auto', ({ params }) => {
-    const { projectId } = params;
-    console.log(projectId);
-
-    // 오토 레이블링 결과를 문자열로 준비 (예시: Classification)
-    const classificationData = `{
         "version": "0.1.0",
         "task_type": "cls",
         "shapes": [
@@ -376,78 +223,19 @@ export const handlers = [
         "imageHeight": 2000,
         "imageWidth": 4000,
         "imageDepth": 4
-      }`;
+      }`,
-
-    // // 오토 레이블링 결과를 문자열로 준비 (예시: Detection)
-    // const detectionData = `{
-    //     "version": "0.1.0",
-    //     "task_type": "det",
-    //     "shapes": [
-    //       {
-    //         "label": "NG",
-    //         "color": "#FF0000",
-    //         "points": [[0, 0], [200, 200]],
-    //         "group_id": null,
-    //         "shape_type": "rectangle",
-    //         "flags": {}
-    //       },
-    //       {
-    //         "label": "NG",
-    //         "color": "#FF0000",
-    //         "points": [[0, 0], [200, 200]],
-    //         "group_id": null,
-    //         "shape_type": "rectangle",
-    //         "flags": {}
-    //       }
-    //     ],
-    //     "split": "none",
-    //     "imageHeight": 2000,
-    //     "imageWidth": 4000,
-    //     "imageDepth": 4
-    //   }`;
-
-    // // 오토 레이블링 결과를 문자열로 준비 (예시: Segmentation)
-    // const segmentationData = `{
-    //     "version": "0.1.0",
-    //     "task_type": "seg",
-    //     "shapes": [
-    //       {
-    //         "label": "NG",
-    //         "color": "#FF0000",
-    //         "points": [[0, 0], [200, 200]],
-    //         "group_id": null,
-    //         "shape_type": "linestrip",
-    //         "flags": {}
-    //       },
-    //       {
-    //         "label": "NG",
-    //         "color": "#FF0000",
-    //         "points": [[0, 0], [200, 200]],
-    //         "group_id": null,
-    //         "shape_type": "polygon",
-    //         "flags": {}
-    //       }
-    //     ],
-    //     "split": "none",
-    //     "imageHeight": 2000,
-    //     "imageWidth": 4000,
-    //     "imageDepth": 4
-    //   }`;
-
-    // AutoLabelingResponse 예시
-    const response: BaseResponse<AutoLabelingResponse> = {
-      status: 200,
-      code: 0,
-      message: '프로젝트 오토 레이블링 성공',
-      data: {
-        imageId: 1,
-        imageUrl: 'image-url.jpg',
-        data: classificationData,
-      },
-      errors: [],
-      isSuccess: true,
     };
-
     return HttpResponse.json(response);
   }),
+
+  // Error Handler Example
+  http.get('/api/error', () => {
+    const errorResponse: ErrorResponse = {
+      status: 400,
+      code: 1003,
+      message: '필수 요청 파라미터가 입력되지 않았습니다.',
+      isSuccess: false,
+    };
+    return HttpResponse.json(errorResponse);
+  }),
 ];