From 244f1f53955bd8dd39a70853f9f7c06b8dda405e Mon Sep 17 00:00:00 2001 From: Seok93 Date: Wed, 4 Sep 2024 19:51:45 +0900 Subject: [PATCH 1/4] =?UTF-8?q?Feat:=20#102=20=EC=83=81=ED=83=9C=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD=20API=EB=A5=BC=20=EC=9C=84=ED=95=9C=20React?= =?UTF-8?q?=20Query=20=EC=B2=98=EB=A6=AC=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 | 20 +++++++++++++++++++- src/services/statusService.ts | 20 ++++++++++++++++++++ 2 files changed, 39 insertions(+), 1 deletion(-) diff --git a/src/hooks/query/useStatusQuery.ts b/src/hooks/query/useStatusQuery.ts index f2787b45..6578cf3d 100644 --- a/src/hooks/query/useStatusQuery.ts +++ b/src/hooks/query/useStatusQuery.ts @@ -1,8 +1,9 @@ +import { queryClient } from '@hooks/query/queryClient'; 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 } from '@services/statusService'; +import { createStatus, getStatusList, updateStatus } from '@services/statusService'; import type { Project } from '@/types/ProjectType'; import type { ProjectStatus, ProjectStatusForm, UsableColor } from '@/types/ProjectStatusType'; @@ -108,3 +109,20 @@ export function useCreateStatus(projectId: Project['projectId']) { return mutation; } + +export function useUpdateStatus(projectId: Project['projectId'], statusId: ProjectStatus['statusId']) { + const { toastSuccess } = useToast(); + const queryClient = useQueryClient(); + + const mutation = useMutation({ + mutationFn: (formData: ProjectStatusForm) => updateStatus(projectId, statusId, formData), + onSuccess: () => { + toastSuccess('프로젝트 상태를 수정했습니다.'); + queryClient.invalidateQueries({ + queryKey: ['projects', projectId, 'statuses'], + }); + }, + }); + + return mutation; +} diff --git a/src/services/statusService.ts b/src/services/statusService.ts index 37049a84..ccb663a4 100644 --- a/src/services/statusService.ts +++ b/src/services/statusService.ts @@ -33,3 +33,23 @@ export async function createStatus( ) { return authAxios.post(`/project/${projectId}/status`, formData, axiosConfig); } + +/** + * 프로젝트 상태 수정 API + * + * @export + * @async + * @param {Project['projectId']} projectId - 프로젝트 ID + * @param {ProjectStatus['statusId']} statusId - 프로젝트 상태 ID + * @param {ProjectStatusForm} formData - 상태 정보 객체 + * @param {AxiosRequestConfig} [axiosConfig={}] - axios 요청 옵션 설정 객체 + * @returns {Promise>} + */ +export async function updateStatus( + projectId: Project['projectId'], + statusId: ProjectStatus['statusId'], + formData: ProjectStatusForm, + axiosConfig: AxiosRequestConfig = {}, +) { + return authAxios.patch(`/project/${projectId}/status/${statusId}`, formData, axiosConfig); +} From 1499a8e84cb7a5551feae784c07461833cda7ef6 Mon Sep 17 00:00:00 2001 From: Seok93 Date: Wed, 4 Sep 2024 19:54:38 +0900 Subject: [PATCH 2/4] =?UTF-8?q?Feat:=20#102=20=ED=94=84=EB=A1=9C=EC=A0=9D?= =?UTF-8?q?=ED=8A=B8=20=EC=83=81=ED=83=9C=20=EB=B3=80=EA=B2=BD=20API=20MSW?= =?UTF-8?q?=20=EC=B2=98=EB=A6=AC=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/mocks/services/statusServiceHandler.ts | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/src/mocks/services/statusServiceHandler.ts b/src/mocks/services/statusServiceHandler.ts index 66722752..457ea6fe 100644 --- a/src/mocks/services/statusServiceHandler.ts +++ b/src/mocks/services/statusServiceHandler.ts @@ -29,6 +29,23 @@ const statusServiceHandler = [ return new HttpResponse(null, { status: 200 }); }), + // 프로젝트 상태 수정 API + http.patch(`${BASE_URL}/project/:projectId/status/:statusId`, async ({ request, params }) => { + const accessToken = request.headers.get('Authorization'); + const { projectId, statusId } = params; + const formData = (await request.json()) as ProjectStatusForm; + + if (!accessToken) return new HttpResponse(null, { status: 401 }); + + const status = STATUS_DUMMY.find( + (status) => status.projectId === Number(projectId) && status.statusId === Number(statusId), + ); + if (!status) return new HttpResponse(null, { status: 404 }); + + status.statusName = formData.statusName; + status.colorCode = formData.colorCode; + return new HttpResponse(null, { status: 204 }); + }), ]; export default statusServiceHandler; From 9f557cdb20a7f1205688a5195ca21011297eada5 Mon Sep 17 00:00:00 2001 From: Seok93 Date: Wed, 4 Sep 2024 19:55:22 +0900 Subject: [PATCH 3/4] =?UTF-8?q?Feat:=20#102=20=ED=94=84=EB=A1=9C=EC=A0=9D?= =?UTF-8?q?=ED=8A=B8=20=EC=83=81=ED=83=9C=20=EB=B3=80=EA=B2=BD=20=EA=B8=B0?= =?UTF-8?q?=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 --- .../modal/project-status/UpdateModalProjectStatus.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/src/components/modal/project-status/UpdateModalProjectStatus.tsx b/src/components/modal/project-status/UpdateModalProjectStatus.tsx index fa6c43a1..f586622c 100644 --- a/src/components/modal/project-status/UpdateModalProjectStatus.tsx +++ b/src/components/modal/project-status/UpdateModalProjectStatus.tsx @@ -2,6 +2,7 @@ import ModalLayout from '@layouts/ModalLayout'; import ModalPortal from '@components/modal/ModalPortal'; import ModalProjectStatusForm from '@components/modal/project-status/ModalProjectStatusForm'; import ModalFormButton from '@components/modal/ModalFormButton'; +import { useUpdateStatus } from '@hooks/query/useStatusQuery'; import type { SubmitHandler } from 'react-hook-form'; import type { Project } from '@/types/ProjectType'; @@ -18,10 +19,12 @@ export default function UpdateModalProjectStatus({ statusId, onClose: handleClose, }: UpdateModalProjectStatusProps) { - // ToDo: 상태 수정을 위한 네트워크 로직 추가 + const updateMutation = useUpdateStatus(project.projectId, statusId); + + // ToDo: Error 처리 추가 const handleSubmit: SubmitHandler = async (data) => { - console.log(statusId, '수정 폼 제출'); - console.log(data); + updateMutation.mutate(data); + updateMutation.reset(); handleClose(); }; From a78271ea3115c9bbc3d0255963c438b0616c809d Mon Sep 17 00:00:00 2001 From: Seok93 Date: Wed, 4 Sep 2024 20:18:54 +0900 Subject: [PATCH 4/4] =?UTF-8?q?Fix:=20#102=20=EC=83=81=ED=83=9C=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD=EC=8B=9C=20=EB=88=84=EB=9D=BD=EB=90=9C=20?= =?UTF-8?q?=EC=83=81=ED=83=9C=20=EC=88=9C=EC=84=9C=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/mocks/services/statusServiceHandler.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/mocks/services/statusServiceHandler.ts b/src/mocks/services/statusServiceHandler.ts index 457ea6fe..bf086c3d 100644 --- a/src/mocks/services/statusServiceHandler.ts +++ b/src/mocks/services/statusServiceHandler.ts @@ -44,6 +44,7 @@ const statusServiceHandler = [ status.statusName = formData.statusName; status.colorCode = formData.colorCode; + status.sortOrder = formData.sortOrder; return new HttpResponse(null, { status: 204 }); }), ];