Feat: 레이블 카테고리 api 및 쿼리 구현

frontend/src/api/categoryApi.ts

@@ -0,0 +1,31 @@
+import api from '@/api/axiosConfig';
+import { LabelCategoryRequest, LabelCategoryResponse } from '@/types';
+
+// 레이블 카테고리 리스트 조회
+export async function getProjectCategories(projectId: number) {
+  return api.get<LabelCategoryResponse[]>(`/projects/${projectId}/categories`).then(({ data }) => data);
+}
+
+// 레이블 카테고리 추가
+export async function addProjectCategories(projectId: number, categoryData: LabelCategoryRequest) {
+  return api.post(`/projects/${projectId}/categories`, categoryData).then(({ data }) => data);
+}
+
+// 레이블 카테고리 단일 조회
+export async function getCategoryById(projectId: number, categoryId: number) {
+  return api.get<LabelCategoryResponse>(`/projects/${projectId}/categories/${categoryId}`).then(({ data }) => data);
+}
+
+// 레이블 카테고리 삭제
+export async function deleteCategory(projectId: number, categoryId: number) {
+  return api.delete(`/projects/${projectId}/categories/${categoryId}`).then(({ data }) => data);
+}
+
+// 레이블 카테고리 존재 여부 조회
+export async function checkCategoryExists(projectId: number, categoryName: string) {
+  return api
+    .get<boolean>(`/projects/${projectId}/categories/exist`, {
+      params: { categoryName },
+    })
+    .then(({ data }) => data);
+}

frontend/src/api/modelApi.ts

@@ -2,21 +2,21 @@ import api from '@/api/axiosConfig';
 import { ModelRequest, ModelResponse, ProjectModelsResponse, ModelCategoryResponse } from '@/types';
 
 export async function updateModelName(projectId: number, modelId: number, modelData: ModelRequest) {
-  return api.put<ModelResponse>(`/api/projects/${projectId}/models/${modelId}`, modelData).then(({ data }) => data);
+  return api.put<ModelResponse>(`/projects/${projectId}/models/${modelId}`, modelData).then(({ data }) => data);
 }
 
 export async function trainModel(projectId: number) {
-  return api.post(`/api/projects/${projectId}/train`).then(({ data }) => data);
+  return api.post(`/projects/${projectId}/train`).then(({ data }) => data);
 }
 
 export async function getProjectModels(projectId: number) {
-  return api.get<ProjectModelsResponse>(`/api/projects/${projectId}/models`).then(({ data }) => data);
+  return api.get<ProjectModelsResponse>(`/projects/${projectId}/models`).then(({ data }) => data);
 }
 
 export async function addProjectModel(projectId: number, modelData: ModelRequest) {
-  return api.post<ModelResponse>(`/api/projects/${projectId}/models`, modelData).then(({ data }) => data);
+  return api.post<ModelResponse>(`/projects/${projectId}/models`, modelData).then(({ data }) => data);
 }
 
 export async function getModelCategories(modelId: number) {
-  return api.get<ModelCategoryResponse[]>(`/api/models/${modelId}/categories`).then(({ data }) => data);
+  return api.get<ModelCategoryResponse[]>(`/models/${modelId}/categories`).then(({ data }) => data);
 }

frontend/src/queries/category/useAddCategoryQuery.ts

@@ -0,0 +1,14 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { addProjectCategories } from '@/api/categoryApi';
+import { LabelCategoryRequest } from '@/types';
+
+export default function useAddCategoryQuery(projectId: number) {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: (categoryData: LabelCategoryRequest) => addProjectCategories(projectId, categoryData),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['projectCategories', projectId] });
+    },
+  });
+}

frontend/src/queries/category/useCategoryByIdQuery.ts

@@ -0,0 +1,9 @@
+import { getCategoryById } from '@/api/categoryApi';
+import { useSuspenseQuery } from '@tanstack/react-query';
+
+export default function useCategoryByIdQuery(projectId: number, categoryId: number) {
+  return useSuspenseQuery({
+    queryKey: ['category', projectId, categoryId],
+    queryFn: () => getCategoryById(projectId, categoryId),
+  });
+}

frontend/src/queries/category/useCheckCategoryExistsQuery.ts

@@ -0,0 +1,9 @@
+import { checkCategoryExists } from '@/api/categoryApi';
+import { useSuspenseQuery } from '@tanstack/react-query';
+
+export default function useCheckCategoryExistsQuery(projectId: number, categoryName: string) {
+  return useSuspenseQuery({
+    queryKey: ['categoryExists', projectId, categoryName],
+    queryFn: () => checkCategoryExists(projectId, categoryName),
+  });
+}

frontend/src/queries/category/useDeleteCategoryQuery.ts

@@ -0,0 +1,13 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { deleteCategory } from '@/api/categoryApi';
+
+export default function useDeleteCategoryQuery(projectId: number, categoryId: number) {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: () => deleteCategory(projectId, categoryId),
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['projectCategories', projectId] });
+    },
+  });
+}

frontend/src/queries/category/useProjectCategoriesQuery.ts

@@ -0,0 +1,9 @@
+import { getProjectCategories } from '@/api/categoryApi';
+import { useSuspenseQuery } from '@tanstack/react-query';
+
+export default function useProjectCategoriesQuery(projectId: number) {
+  return useSuspenseQuery({
+    queryKey: ['projectCategories', projectId],
+    queryFn: () => getProjectCategories(projectId),
+  });
+}

frontend/src/types/index.ts

@@ -300,3 +300,14 @@ export interface ModelCategoryResponse {
 
 // 프로젝트 모델 리스트 응답 DTO
 export interface ProjectModelsResponse extends Array<ModelResponse> {}
+
+// 카테고리 요청 DTO
+export interface LabelCategoryRequest {
+  labelCategoryList: number[];
+}
+
+// 카테고리 응답 DTO
+export interface LabelCategoryResponse {
+  id: number;
+  name: string;
+}