Added price to review due task

src/views/ManageActiveJobs.jsx

@@ -1,31 +1,37 @@
-import React, { useState, useEffect } from "react";
-import ActiveJobs from "../components/MyActiveJobs/ActiveJobs";
+import React, { useEffect, useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";
+import ActiveJobs from "../components/MyActiveJobs/ActiveJobs";
 import usersService from "../services/UsersService";
 
+/**
+ * This code defines a React functional component called `ManageActiveJobs`.
+ * It fetches a list of active job messages and renders the `ActiveJobs` component with the necessary props.
+ */
 function ManageActiveJobs() {
   const ApiCall = new usersService();
 
-  let navigate = useNavigate();
-  let { state } = useLocation();
+  const navigate = useNavigate();
+  const { state } = useLocation();
 
-  let [details, setDetails] = useState({}); // to hold state values
+  const [details, setDetails] = useState({});
 
-  let [activeJobMesList, setActiveJobMesList] = useState({
+  const [activeJobMesList, setActiveJobMesList] = useState({
     loading: true,
     error: false,
     data: [],
   });
 
-  let [activeJobMesListReload, setActiveJobMesListReload] = useState(false); // state to determine when ACTIVE JOB MESSAGE LIST RELOADS/RE-RENDERS
+  const [activeJobMesListReload, setActiveJobMesListReload] = useState(false);
 
+  /**
+   * Fetches the active job message list.
+   */
   const getActiveJobMesList = () => {
-    // FUNCTION TO GET ACTIVE JOB MESSAGE LIST
     setActiveJobMesList({ loading: true, error: false, data: [] });
-    let contract = { contract: state.contract };
+    const contract = { contract: state.contract };
     ApiCall.activeJobMesList(contract)
       .then((res) => {
-        if (res.status != 200 || res.data.internal_return < 0) {
+        if (res.status !== 200 || res.data.internal_return < 0) {
           setActiveJobMesList({ loading: false, error: false, data: [] });
           return;
         }

src/views/MyReviewDueJobsPage.jsx

@@ -1,31 +1,36 @@
-import React, { useContext,useState, useEffect } from "react";
-import usersService from "../services/UsersService";
-import MyReviewDueJobs from "../components/MyActiveJobs/MyReviewDueJobs";
+import React, { useEffect, useState } from "react";
 import { useSelector } from "react-redux";
+import MyReviewDueJobs from "../components/MyActiveJobs/MyReviewDueJobs";
+import usersService from "../services/UsersService";
 
+/**
+ * React component that fetches a list of review due jobs and renders the `MyReviewDueJobs` component with the fetched data.
+ */
 export default function MyReviewDueJobsPage() {
-    let {commonHeadBanner} = useSelector(state => state.commonHeadBanner)
-    const [MyJobList, setMyJobList] = useState([]);
-    const api = new usersService();
-    const getMyJobList = async () => {
-        try {
-            const res = await api.getMyReviewDueJobList();
-            setMyJobList(res.data);
-        } catch (error) {
-            console.log("Error getting mode");
-        }
-    };
-    useEffect(() => {
-        getMyJobList();
-    }, []);
+  const { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
+  const [myJobList, setMyJobList] = useState([]);
 
-    // debugger;
-    return (
-        <>
-            <MyReviewDueJobs
-                MyJobList={MyJobList}
-                commonHeadData={commonHeadBanner.result_list}
-            />
-        </>
-    );
+  useEffect(() => {
+    const api = new usersService();
+
+    const getMyJobList = async () => {
+      try {
+        const res = await api.getMyReviewDueJobList();
+        setMyJobList(res.data);
+      } catch (error) {
+        console.log("Error getting mode");
+      }
+    };
+
+    getMyJobList();
+  }, []);
+
+  return (
+    <>
+      <MyReviewDueJobs
+        myJobList={myJobList}
+        commonHeadData={commonHeadBanner.result_list}
+      />
+    </>
+  );
 }