From cb7c844d1f8eae06c8903ba45e6259cb2967a645 Mon Sep 17 00:00:00 2001
From: Seok93 <gkdltjr@naver.com>
Date: Mon, 30 Sep 2024 23:53:19 +0900
Subject: [PATCH] =?UTF-8?q?Feat:=20#169=20=EC=83=81=ED=83=9C=20=EC=82=AD?=
 =?UTF-8?q?=EC=A0=9C=20API=EB=A5=BC=20=EC=9C=84=ED=95=9C=20React=20Query?=
 =?UTF-8?q?=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/query/useStatusQuery.ts | 38 ++++++++++++++++++++++++++-----
 src/services/statusService.ts     | 18 +++++++++++++++
 2 files changed, 50 insertions(+), 6 deletions(-)

diff --git a/src/hooks/query/useStatusQuery.ts b/src/hooks/query/useStatusQuery.ts
index 2cbf553f..2d8ccf91 100644
--- a/src/hooks/query/useStatusQuery.ts
+++ b/src/hooks/query/useStatusQuery.ts
@@ -2,8 +2,9 @@ import { useMemo } from 'react';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import useToast from '@hooks/useToast';
 import { PROJECT_STATUS_COLORS } from '@constants/projectStatus';
-import { createStatus, getStatusList, updateStatus, updateStatusesOrder } from '@services/statusService';
+import { createStatus, deleteStatus, getStatusList, updateStatus, updateStatusesOrder } from '@services/statusService';
 import { generateProjectQueryKey, generateStatusesQueryKey, generateTasksQueryKey } from '@utils/queryKeyGenergator';
+import { tasksQueryKeys } from '../../../.history/src/constants/queryKey_20240928222918';
 
 import type { Project } from '@/types/ProjectType';
 import type { TaskListWithStatus } from '@/types/TaskType';
@@ -50,7 +51,7 @@ function getUsableStatusColorList(
   return [...statusColorMap.values()];
 }
 
-// ToDo: ProjectStatus 관련 Query 로직 작성하기
+// 프로젝트 상태 목록 조회
 // ToDo: React Query 로직과 initialValue, nameList 등을 구하는 로직이 사실 관련이 없는 것 같음. 분리 고려하기.
 export function useReadStatuses(projectId: Project['projectId'], statusId?: ProjectStatus['statusId']) {
   const {
@@ -95,14 +96,16 @@ export function useReadStatuses(projectId: Project['projectId'], statusId?: Proj
   };
 }
 
+// 프로젝트 상태 생성
 export function useCreateStatus(projectId: Project['projectId']) {
-  const { toastSuccess } = useToast();
+  const { toastSuccess, toastError } = useToast();
   const queryClient = useQueryClient();
 
   const mutation = useMutation({
     mutationFn: (formData: ProjectStatusForm) => createStatus(projectId, formData),
+    onError: () => toastError('프로젝트 상태 등록을 실패 했습니다.  잠시후 다시 등록해주세요.'),
     onSuccess: () => {
-      toastSuccess('프로젝트 상태를 추가하였습니다.');
+      toastSuccess('프로젝트 상태를 등록하였습니다.');
       queryClient.invalidateQueries({
         queryKey: generateProjectQueryKey(projectId),
       });
@@ -112,12 +115,14 @@ export function useCreateStatus(projectId: Project['projectId']) {
   return mutation;
 }
 
+// 프로젝트 상태 수정
 export function useUpdateStatus(projectId: Project['projectId'], statusId: ProjectStatus['statusId']) {
-  const { toastSuccess } = useToast();
+  const { toastSuccess, toastError } = useToast();
   const queryClient = useQueryClient();
 
   const mutation = useMutation({
     mutationFn: (formData: ProjectStatusForm) => updateStatus(projectId, statusId, formData),
+    onError: () => toastError('프로젝트 상태 수정에 실패 했습니다. 잠시후 다시 시도해주세요.'),
     onSuccess: () => {
       toastSuccess('프로젝트 상태를 수정했습니다.');
       queryClient.invalidateQueries({
@@ -129,6 +134,27 @@ export function useUpdateStatus(projectId: Project['projectId'], statusId: Proje
   return mutation;
 }
 
+// 프로젝트 상태 삭제
+export function useDeleteStatus(projectId: Project['projectId']) {
+  const { toastError, toastSuccess } = useToast();
+  const queryClient = useQueryClient();
+  const tasksQueryKeys = generateTasksQueryKey(projectId);
+  const statusesQueryKey = generateStatusesQueryKey(projectId);
+
+  const mutation = useMutation({
+    mutationFn: (statusId: ProjectStatus['statusId']) => deleteStatus(projectId, statusId),
+    onError: () => toastError('프로젝트 상태 삭제에 실패 했습니다. 잠시후 다시 시도해주세요.'),
+    onSuccess: () => {
+      toastSuccess('프로젝트 상태를 삭제 했습니다.');
+      queryClient.invalidateQueries({ queryKey: tasksQueryKeys, exact: true });
+      queryClient.invalidateQueries({ queryKey: statusesQueryKey, exact: true });
+    },
+  });
+
+  return mutation;
+}
+
+// 상태 목록 순서 정렬
 export function useUpdateStatusesOrder(projectId: Project['projectId']) {
   const { toastError } = useToast();
   const queryClient = useQueryClient();
@@ -149,7 +175,7 @@ export function useUpdateStatusesOrder(projectId: Project['projectId']) {
       return { previousStatusTaskList };
     },
     onError: (error, newStatusTaskList, context) => {
-      toastError('프로젝트 상태 순서 변경에 실패 하였습니다. 잠시후 다시 진행해주세요.');
+      toastError('프로젝트 상태 순서 변경에 실패 했습니다. 잠시후 다시 진행해주세요.');
       queryClient.setQueryData(TasksQueryKey, context?.previousStatusTaskList);
     },
     onSuccess: () => {
diff --git a/src/services/statusService.ts b/src/services/statusService.ts
index 242cf79e..a434443b 100644
--- a/src/services/statusService.ts
+++ b/src/services/statusService.ts
@@ -55,6 +55,24 @@ export async function updateStatus(
   return authAxios.patch(`/project/${projectId}/status/${statusId}`, formData, axiosConfig);
 }
 
+/**
+ * 프로젝트 상태 삭제 API
+ *
+ * @export
+ * @async
+ * @param {Project['projectId']} projectId      - 프로젝트 ID
+ * @param {ProjectStatus['statusId']} statusId  - 프로젝트 상태 ID
+ * @param {AxiosRequestConfig} [axiosConfig={}] - axios 요청 옵션 설정 객체
+ * @returns {Promise<AxiosResponse<void>>}
+ */
+export async function deleteStatus(
+  projectId: Project['projectId'],
+  statusId: ProjectStatus['statusId'],
+  axiosConfig: AxiosRequestConfig = {},
+) {
+  return authAxios.delete(`/project/${projectId}/status/${statusId}`, axiosConfig);
+}
+
 /**
  * 상태 순서 변경 API
  *