add task mutation hook

src/Components/Tasks/AddTask.tsx

@@ -40,6 +40,7 @@ import { companyController } from "../../API/LayoutApi/companies";
 import { TCompany } from "../../types/Company/TCompany";
 import { customerController } from "../../API/LayoutApi/customers";
 import { TCustomer } from "../../types/Customer/TCustomer";
+import { useCreateTask } from "../../Hooks/Tasks";
 
 const { Option } = Select;
 const AddTask = ({
@@ -120,7 +121,7 @@ const AddTask = ({
             page: 1,
             page_size: 5,
           },
-          companyId
+          companyId,
         )
         .then((data) => {
           setCustomerData(data.data);
@@ -210,20 +211,49 @@ const AddTask = ({
     }
   };
 
+  const createTaskMutation = useCreateTask();
+
+  // const handleSubmit = (values: any) => {
+  //   if (createTaskMutation.isLoading) return; // 🔒 double submit block
+
+  //   const payload = {
+  //     ...values,
+  //     attachment_ids: fileIds,
+  //     note:
+  //       (text ? text + ", " : "") +
+  //       (note ? note + ", " : "") +
+  //       (note2 ? note2 + ", " : ""),
+  //   };
+
+  //   createTaskMutation.mutate(payload, {
+  //     onSuccess: () => {
+  //       form.resetFields();
+  //       setOpen(false);
+  //     },
+  //     onError: (error) => {
+  //       console.error(error);
+  //     },
+  //   });
+  // };
+
   const handleSubmit = async (values: any) => {
+    if (createTaskMutation.isLoading) return;
+
     values.attachment_ids = fileIds;
     values.note =
       (text ? text + ", " : "") +
       (note ? note + ", " : "") +
       (note2 ? note2 + ", " : "");
 
-    try {
+    createTaskMutation.mutate(values, {
-      await taskController.addTaskController(values);
+      onSuccess: () => {
         form.resetFields();
         setOpen(false);
-    } catch (error) {
+      },
+      onError: (error) => {
         console.error(error);
-    }
+      },
+    });
   };
 
   return (
@@ -252,12 +282,17 @@ const AddTask = ({
         okText="Create"
         cancelText="Cancel"
         onCancel={() => {
+          if (createTaskMutation.isLoading) return;
           form.resetFields();
           setOpen(false);
         }}
         onOk={() => form.submit()}
         bodyStyle={{ height: 685 }}
         centered={false}
+        okButtonProps={{
+          loading: createTaskMutation.isLoading,
+          disabled: createTaskMutation.isLoading,
+        }}
       >
         <FormAnt
           form={form}

src/Hooks/Tasks/index.ts

@@ -1,4 +1,4 @@
-import { useQuery } from "react-query";
+import { useMutation, useQuery } from "react-query";
 import { TTasksGetParams, taskController } from "../../API/LayoutApi/tasks";
 
 export const useTasks = ({
@@ -20,7 +20,7 @@ export const useTasks = ({
         page_size,
         team_monitoring,
       }),
-    { refetchOnWindowFocus: false }
+    { refetchOnWindowFocus: false },
   );
 };
 
@@ -28,7 +28,7 @@ export const useTaskOne = (taskId: number | undefined) => {
   return useQuery(
     [`task/${taskId}/`, taskId],
     () => taskController.taskOne(taskId),
-    { refetchOnWindowFocus: false }
+    { refetchOnWindowFocus: false },
   );
 };
 
@@ -36,6 +36,12 @@ export const useTaskHistory = (Id: number | undefined) => {
   return useQuery(
     [`customer/${Id}/`, Id],
     () => taskController.getHistory(Id),
-    { refetchOnWindowFocus: false }
+    { refetchOnWindowFocus: false },
+  );
+};
+
+export const useCreateTask = () => {
+  return useMutation((payload: any) =>
+    taskController.addTaskController(payload),
   );
 };