src/components/jobPopout/PendingJobsPopout.jsx

@@ -24,6 +24,7 @@ function PendingJobsPopout({ details, onClose, situation }) {
   const [pendingJobLoader, setPendingJobLoader] = useState({
     extend: false,
     offer: false,
+    cancel: false,
   });
 
   let [requestMessage, setRequestMessage] = useState({
@@ -81,6 +82,28 @@ function PendingJobsPopout({ details, onClose, situation }) {
             setRequestMessage({ status: false, message: "" });
           }, 3000);
         });
+    } else if (name == "cancel") {
+      // RUNS THIS IF JOB OFFER IS CANCELLED
+      reqData = { ...pendingData, reason: "cancel", offer_result: 3333 };
+      setPendingJobLoader({ cancel: true });
+      apiCall
+        .pendingCancelOffer(reqData)
+        .then((res) => {
+          setRequestMessage({ status: true, message: res.data.status });
+          setTimeout(() => {
+            setPendingJobLoader({ cancel: false });
+            setRequestMessage({ status: false, message: "" });
+            onClose();
+            dispatch(tableReload({ type: "PENDINGTABLE" }));
+          }, 4000);
+        })
+        .catch((error) => {
+          setRequestMessage("Try Again");
+          setTimeout(() => {
+            setPendingJobLoader({ cancel: false });
+            setRequestMessage({ status: false, message: "" });
+          }, 3000);
+        });
     } else return;
     // try {
     //   if (name === "extend") {
@@ -274,9 +297,16 @@ function PendingJobsPopout({ details, onClose, situation }) {
             <div className="mt-10 md:mt-32 md:flex md:justify-center">
               <button
                 className="px-2 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
-                onClick={onClose}
+                onClick={handlePendingJobsBtn}
+                name="cancel"
               >
-                Cancel Offer
+                {pendingJobLoader.cancel ? (
+                  <div className="w-[96px] flex justify-center items-center h-full">
+                    <LoadingSpinner size={5} color="sky-blue" />
+                  </div>
+                ) : (
+                  "Cancel Offer"
+                )}
               </button>
             </div>
           </div>

src/services/UsersService.js

@@ -40,12 +40,12 @@ class usersService {
     return this.postAuxEnd("/dashdata", postData);
   }
 
-  getRecentActivities(){
+  getRecentActivities() {
     var postData = {
       uid: localStorage.getItem("uid"),
       member_id: localStorage.getItem("member_id"),
       sessionid: localStorage.getItem("session_token"),
-      action: 11202
+      action: 11202,
     };
     return this.postAuxEnd("/recentactivities", postData);
   }
@@ -378,7 +378,7 @@ class usersService {
       page: 0,
       offset: 0,
       limit: 100,
-      allstatus: 0
+      allstatus: 0,
     };
     return this.postAuxEnd("/activetaskslist", postData);
   }
@@ -608,7 +608,7 @@ class usersService {
       sessionid: localStorage.getItem("session_token"),
       page: 0,
       limit: 100,
-      ...reqdata
+      ...reqdata,
     };
     return this.postAuxEnd("/familyupdate", postData);
   }
@@ -792,6 +792,17 @@ class usersService {
     return this.postAuxEnd("/pendingjobsendtome", postData);
   }
 
+  pendingCancelOffer(reqData) {
+    var postData = {
+      uid: localStorage.getItem("uid"),
+      member_id: localStorage.getItem("member_id"),
+      sessionid: localStorage.getItem("session_token"),
+      action: 13043,
+      ...reqData,
+    };
+    return this.postAuxEnd("/pendingjobcancel", postData);
+  }
+
   // FUNCTION TO GET ACTIVE JOB MESSAGE LIST
   activeJobMesList(reqData) {
     var postData = {
@@ -1088,52 +1099,51 @@ class usersService {
     return this.postAuxEnd("/blogdata", postData);
   }
 
+  // FUNCTION TO CANCEL TASK OR SEND REMINDER BY FAMILY MEMBER
+  suggestStatus(reqData) {
+    var postData = {
+      uid: localStorage.getItem("uid"),
+      member_id: localStorage.getItem("member_id"),
+      sessionid: localStorage.getItem("session_token"),
+      action: 22026,
+      ...reqData,
+    };
+    return this.postAuxEnd("/suggeststatus", postData);
+  }
 
-    // FUNCTION TO CANCEL TASK OR SEND REMINDER BY FAMILY MEMBER
-    suggestStatus(reqData) {
-      var postData = {
-        uid: localStorage.getItem("uid"),
-        member_id: localStorage.getItem("member_id"),
-        sessionid: localStorage.getItem("session_token"),
-        action: 22026,
-        ...reqData,
-      };
-      return this.postAuxEnd("/suggeststatus", postData);
-    }
+  // FUNCTION TO GET FAMILY WALLET
+  getFamilyWallet(reqData) {
+    var postData = {
+      uid: localStorage.getItem("uid"),
+      member_id: localStorage.getItem("member_id"),
+      sessionid: localStorage.getItem("session_token"),
+      action: 22012,
+      ...reqData,
+    };
+    return this.postAuxEnd("/familywallet", postData);
+  }
 
-    // FUNCTION TO GET FAMILY WALLET
-    getFamilyWallet(reqData) {
-      var postData = {
-        uid: localStorage.getItem("uid"),
-        member_id: localStorage.getItem("member_id"),
-        sessionid: localStorage.getItem("session_token"),
-        action: 22012,
-        ...reqData,
-      };
-      return this.postAuxEnd("/familywallet", postData);
-    }
-  
-    // FUNCTION TO START FAMILY TRANSFER
-    familyTransferStart(reqData) {
-      var postData = {
-        uid: localStorage.getItem("uid"),
-        member_id: localStorage.getItem("member_id"),
-        sessionid: localStorage.getItem("session_token"),
-        ...reqData,
-      };
-      return this.postAuxEnd("/familytransferstart", postData);
-    }
+  // FUNCTION TO START FAMILY TRANSFER
+  familyTransferStart(reqData) {
+    var postData = {
+      uid: localStorage.getItem("uid"),
+      member_id: localStorage.getItem("member_id"),
+      sessionid: localStorage.getItem("session_token"),
+      ...reqData,
+    };
+    return this.postAuxEnd("/familytransferstart", postData);
+  }
 
-    // FUNCTION TO PERFORM FAMILY TRANSFER
-    familyTransfer(reqData) {
-      var postData = {
-        uid: localStorage.getItem("uid"),
-        member_id: localStorage.getItem("member_id"),
-        sessionid: localStorage.getItem("session_token"),
-        ...reqData,
-      };
-      return this.postAuxEnd("/familytransfer", postData);
-    }
+  // FUNCTION TO PERFORM FAMILY TRANSFER
+  familyTransfer(reqData) {
+    var postData = {
+      uid: localStorage.getItem("uid"),
+      member_id: localStorage.getItem("member_id"),
+      sessionid: localStorage.getItem("session_token"),
+      ...reqData,
+    };
+    return this.postAuxEnd("/familytransfer", postData);
+  }
 
   /*
     - 20:27:30.118 FLOG_MAX [757411]: 	REQ_STRING(username)
@@ -1247,9 +1257,9 @@ class usersService {
         console.log(response);
         // res = response;
         console.log("~~~~~~~ Toks2 POST ~~~~~~~~");
-        if(response.data.internal_return == '-9999'){
-          localStorage.clear()
-          window.location.href=`/login?sessionExpired=true`
+        if (response.data.internal_return == "-9999") {
+          localStorage.clear();
+          window.location.href = `/login?sessionExpired=true`;
         }
         return response;
       })

src/views/MyPendingJobsPage.jsx

@@ -22,7 +22,7 @@ export default function MyPendingJobsPage() {
   };
   
   useEffect(() => {
-    getMyJobList();
+    getMyJobList(); 
   }, [pendingListTable]);
 
   // debugger;