fix check list ticked

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<GetTaskDetailResponse>(["task-detail", taskId]);
+
+      queryClient.setQueryData<GetTaskDetailResponse>(["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"] });