diff --git a/src/pages/taskmanager/task/hooks/useTaskData.ts b/src/pages/taskmanager/task/hooks/useTaskData.ts index 636f098..c2a5045 100644 --- a/src/pages/taskmanager/task/hooks/useTaskData.ts +++ b/src/pages/taskmanager/task/hooks/useTaskData.ts @@ -6,6 +6,7 @@ import { CreateTaskAttachmentType, CreateTaskRemarkType, CreateTaskType, + GetTaskDetailResponse, UpdateCheckListItemType, UpdateTaskAttachmentType, UpdateTaskType, @@ -137,7 +138,37 @@ export const useUpdateCheckListItem = () => { return useMutation({ mutationFn: ({ id, params }: { id: string; params: UpdateCheckListItemType; taskId: string }) => api.updateCheckListItem(id, params), - onSuccess: (_data, variables) => { + onMutate: async ({ id, params, taskId }) => { + await queryClient.cancelQueries({ queryKey: ["task-detail", taskId] }); + + const previous = queryClient.getQueryData(["task-detail", taskId]); + + queryClient.setQueryData(["task-detail", taskId], (current) => { + if (!current?.data?.checkListItems) return current; + + const checkListItems = current.data.checkListItems.map((item) => + item.id === id ? { ...item, isDone: params.isDone } : item, + ); + const completedCheckListItemCount = checkListItems.filter((item) => item.isDone).length; + + return { + ...current, + data: { + ...current.data, + checkListItems, + completedCheckListItemCount, + }, + }; + }); + + return { previous }; + }, + onError: (_error, variables, context) => { + if (context?.previous) { + queryClient.setQueryData(["task-detail", variables.taskId], context.previous); + } + }, + onSettled: (_data, _error, variables) => { queryClient.invalidateQueries({ queryKey: ["task-detail", variables.taskId] }); queryClient.invalidateQueries({ queryKey: ["tasks-by-task-phase"] }); queryClient.invalidateQueries({ queryKey: ["project"] });