rm loading state

src/components/Resource/ResourceDetailsUpdate.tsx

@@ -1,4 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
+import { useMutation } from "@tanstack/react-query";
 import { t } from "i18next";
 import { navigate, useQueryParams } from "raviger";
 import { useEffect, useReducer, useState } from "react";
@@ -27,8 +28,8 @@ import useAppHistory from "@/hooks/useAppHistory";
 import { RESOURCE_STATUS_CHOICES } from "@/common/constants";
 
 import routes from "@/Utils/request/api";
+import mutate from "@/Utils/request/mutate";
 import query from "@/Utils/request/query";
-import request from "@/Utils/request/request";
 import { UpdateResourceRequest } from "@/types/resourceRequest/resourceRequest";
 
 interface resourceProps {
@@ -63,7 +64,6 @@ const initialState = {
 export const ResourceDetailsUpdate = (props: resourceProps) => {
   const { goBack } = useAppHistory();
   const [qParams, _] = useQueryParams();
-  const [isLoading, setIsLoading] = useState(true);
   const [assignedUser, SetAssignedUser] = useState<UserModel>();
   const resourceFormReducer = (state = initialState, action: any) => {
     switch (action.type) {
@@ -145,15 +145,24 @@ export const ResourceDetailsUpdate = (props: resourceProps) => {
         },
       });
     }
-    setIsLoading(false);
   }, [resourceDetails]);
 
+  const { mutate: updateResource, isPending: updateResourceLoading } =
+    useMutation({
+      mutationFn: mutate(routes.updateResource, {
+        pathParams: { id: props.id },
+      }),
+      onSuccess: (data) => {
+        dispatch({ type: "set_form", form: data });
+        toast.success(t("request_updated_successfully"));
+        navigate(`/facility/${props.facilityId}/resource/${props.id}`);
+      },
+    });
+
   const handleSubmit = async () => {
     const validForm = validateForm();
 
     if (validForm) {
-      setIsLoading(true);
-
       const resourceData: UpdateResourceRequest = {
         id: props.id,
         status: state.form.status,
@@ -172,24 +181,11 @@ export const ResourceDetailsUpdate = (props: resourceProps) => {
         approving_facility: state.form.approving_facility?.id,
         related_patient: state.form.related_patient?.id,
       };
-
-      const { res, data } = await request(routes.updateResource, {
-        pathParams: { id: props.id },
-        body: resourceData,
-      });
-      setIsLoading(false);
-
-      if (res && res.status == 200 && data) {
-        dispatch({ type: "set_form", form: data });
-        toast.success(t("request_updated_successfully"));
-        navigate(`/facility/${props.facilityId}/resource/${props.id}`);
-      } else {
-        setIsLoading(false);
-      }
+      updateResource(resourceData);
     }
   };
 
-  if (isLoading) {
+  if (updateResourceLoading || !resourceDetails) {
     return <Loading />;
   }