.

src/views/ManageActiveJobs.jsx

@@ -1,47 +1,61 @@
-import React, {useState, useEffect} from 'react'
-import ActiveJobs from '../components/MyActiveJobs/ActiveJobs'
-import { useLocation, useNavigate } from 'react-router-dom'
-import usersService from '../services/UsersService'
+import React, { useState, useEffect } from "react";
+import ActiveJobs from "../components/MyActiveJobs/ActiveJobs";
+import { useLocation, useNavigate } from "react-router-dom";
+import usersService from "../services/UsersService";
 
 function ManageActiveJobs() {
+  const ApiCall = new usersService();
 
-  const ApiCall = new usersService()
+  let navigate = useNavigate();
+  let { state } = useLocation();
 
-  let navigate = useNavigate()
-  let {state} = useLocation()
+  let [details, setDetails] = useState({}); // to hold state values
 
-  let [details, setDetails] = useState({}) // to hold state values
+  let [activeJobMesList, setActiveJobMesList] = useState({
+    loading: true,
+    error: false,
+    data: [],
+  });
 
-  let [activeJobMesList, setActiveJobMesList] = useState({loading: true, error: false, data: []})
+  let [activeJobMesListReload, setActiveJobMesListReload] = useState(false); // state to determine when ACTIVE JOB MESSAGE LIST RELOADS/RE-RENDERS
 
-  let [activeJobMesListReload, setActiveJobMesListReload] = useState(false)// state to determine when ACTIVE JOB MESSAGE LIST RELOADS/RE-RENDERS
+  const getActiveJobMesList = () => {
+    // FUNCTION TO GET ACTIVE JOB MESSAGE LIST
+    setActiveJobMesList({ loading: true, error: false, data: [] });
+    let contract = { contract: state.contract };
+    ApiCall.activeJobMesList(contract)
+      .then((res) => {
+        if (res.status != 200 || res.data.internal_return < 0) {
+          setActiveJobMesList({ loading: false, error: false, data: [] });
+          return;
+        }
+        setActiveJobMesList({
+          loading: false,
+          error: false,
+          data: res.data.result_list,
+        });
+      })
+      .catch((error) => {
+        setActiveJobMesList({ loading: false, error: true, data: [] });
+      });
+  };
 
-  const getActiveJobMesList = () => { // FUNCTION TO GET ACTIVE JOB MESSAGE LIST
-    setActiveJobMesList({loading: true, error: false, data: []})
-    let contract = {contract: state.contract}
-    ApiCall.activeJobMesList(contract).then((res)=>{
-      if(res.status != 200 || res.data.internal_return < 0){
-        setActiveJobMesList({loading: false, error: false, data: []})
-        return
-      }
-      setActiveJobMesList({loading: false, error: false, data: res.data.result_list})
-    }).catch((error)=>{
-      setActiveJobMesList({loading: false, error: true, data: []})
-    })
-  }
-
-  useEffect(()=>{
-    if(!state){
-      navigate('/', {replace: true})
-      return
+  useEffect(() => {
+    if (!state) {
+      navigate("/", { replace: true });
+      return;
     }
-    setDetails(state)
-    getActiveJobMesList()
-  },[activeJobMesListReload])
+    setDetails(state);
+    getActiveJobMesList();
+  }, [activeJobMesListReload]);
 
   return (
-    <ActiveJobs details={state} activeJobMesList={activeJobMesList} reloadActiveJobList={setActiveJobMesListReload} />
-  )
+    <ActiveJobs
+      details={state}
+      activeJobMesList={activeJobMesList}
+      reloadActiveJobList={setActiveJobMesListReload}
+    />
+  );
 }
 
-export default ManageActiveJobs
+export default ManageActiveJobs;

src/views/MyActiveJobsPage.jsx

@@ -1,33 +1,33 @@
-import React, { useContext,useState, useEffect } from "react";
+import React, { useContext, useState, useEffect } from "react";
 import usersService from "../services/UsersService";
 //import MyJobs from "../components/MyJobs";
 import MyActiveJobs from "../components/MyActiveJobs";
 import { useSelector } from "react-redux";
 
 export default function MyActiveJobsPage() {
-    let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
-    const [MyJobList, setMyJobList] = useState([]);
-    const api = new usersService();
-//TARGET ENDPOINT[POST]http://10.204.5.100:9083/en/wrench/api/v1/jobmanageractive
-    const getMyJobList = async () => {
-        try {
-            const res = await api.getMyActiveJobList();
-            setMyJobList(res.data);
-        } catch (error) {
-            console.log("Error getting mode");
-        }
-    };
-    useEffect(() => {
-        getMyJobList();
-    }, []);
+  let { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
+  const [MyJobList, setMyJobList] = useState([]);
+  const api = new usersService();
+  //TARGET ENDPOINT[POST]http://10.204.5.100:9083/en/wrench/api/v1/jobmanageractive
+  const getMyJobList = async () => {
+    try {
+      const res = await api.getMyActiveJobList();
+      setMyJobList(res.data);
+    } catch (error) {
+      console.log("Error getting mode");
+    }
+  };
+  useEffect(() => {
+    getMyJobList();
+  }, []);
 
-    // debugger;
-    return (
-        <>
-            <MyActiveJobs
-                MyJobList={MyJobList}
-                commonHeadData={commonHeadBanner.result_list}
-            />
-        </>
-    );
+  // debugger;
+  return (
+    <>
+      <MyActiveJobs
+        MyJobList={MyJobList}
+        commonHeadData={commonHeadBanner.result_list}
+      />
+    </>
+  );
 }

src/views/MyTaskPage.jsx

@@ -1,4 +1,4 @@
-import React, { useContext, useState, useEffect } from "react";
+import React, { useState, useEffect } from "react";
 import MyTasks from "../components/MyTasks";
 // import UsersService from "../services/UsersService";
 import usersService from "../services/UsersService";

src/views/MyWaitingJobsPage.jsx

@@ -1,33 +1,32 @@
-import React, { useContext, useState, useEffect } from "react";
+import { useState, useEffect } from "react";
 import usersService from "../services/UsersService";
-import MyPendingJobs from "../components/MyPendingJobs";
 import { useSelector } from "react-redux";
 import MyWaitingJobs from "../components/MyWaitingJobs";
 
 export default function MyWaitingJobsPage() {
-    let { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
-    const [MyJobList, setMyJobList] = useState([]);
-    const api = new usersService();
+  let { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
+  const [MyJobList, setMyJobList] = useState([]);
+  const api = new usersService();
 
-    const getMyJobList = async () => {
-        try {
-            const res = await api.getMyWiatingJobList();
-            setMyJobList(res.data);
-        } catch (error) {
-            console.log("Error getting mode");
-        }
-    };
-    useEffect(() => {
-        getMyJobList();
-    }, []);
+  const getMyJobList = async () => {
+    try {
+      const res = await api.getMyWiatingJobList();
+      setMyJobList(res.data);
+    } catch (error) {
+      console.log("Error getting mode");
+    }
+  };
+  useEffect(() => {
+    getMyJobList();
+  }, []);
 
-    // debugger;
-    return (
-        <>
-            <MyWaitingJobs
-                MyJobList={MyJobList}
-                commonHeadData={commonHeadBanner.result_list}
-            />
-        </>
-    );
-}
+  // debugger;
+  return (
+    <>
+      <MyWaitingJobs
+        MyJobList={MyJobList}
+        commonHeadData={commonHeadBanner.result_list}
+      />
+    </>
+  );
+}