recentlt past due task added

src/views/MyTaskPage.jsx

@@ -4,8 +4,13 @@ import MyTasks from "../components/MyTasks";
 import usersService from "../services/UsersService";
 
 import { useSelector } from "react-redux";
+import RecentlyPastDue from "../components/MyTasks/RecentlyPastDue";
 
 export default function MyTaskPage() {
+  const api = new usersService();
+  const queryParams = new URLSearchParams(location?.search);
+  const tab = queryParams.get("tab")?.toLowerCase();
+
   const { myTaskTable } = useSelector((state) => state.tableReload);
 
   let { commonHeadBanner } = useSelector((state) => state.commonHeadBanner);
@@ -16,7 +21,8 @@ export default function MyTaskPage() {
     data: [],
   });
   const [MyActiveOffersList, setMyActiveOffersList] = useState([]);
-  const api = new usersService();
+
+  const [recentPastDue, setRecentPastDue] = useState({loading: true, data: {}});
 
   const getMyActiveJobList = async () => {
     setMyActiveJobList({ loading: true, status: false, data: [] });
@@ -32,6 +38,7 @@ export default function MyTaskPage() {
       console.log("Error getting tasks");
     }
   };
+
   const getMyActiveOffersList = async () => {
     // setMyActiveOffersList({loading: true, status:false, data:[]});
     try {
@@ -42,6 +49,21 @@ export default function MyTaskPage() {
       console.log("Error getting offers");
     }
   };
+
+  const getRecentPastDue = async () => {
+    try {
+      const res = await api.getRecentPastDueList();
+      setRecentPastDue({loading: false, data:res?.data});
+    } catch (error) {
+      setRecentPastDue({loading: false, data:{}});
+      console.log("Error getting offers");
+    }
+  };
+
+  useEffect(()=>{
+    getRecentPastDue()
+  },[])
+
   useEffect(() => {
     const fetchData = async () => {
       await Promise.all([getMyActiveJobList(), getMyActiveOffersList()]);
@@ -52,10 +74,20 @@ export default function MyTaskPage() {
 
   //debugger;
   return (
-    <MyTasks
-      ActiveJobList={MyActiveJobList}
-      MyActiveOffersList={MyActiveOffersList}
-      commonHeadData={commonHeadBanner?.result_list}
-    />
+    <>
+    {tab == 'pastdue' ?
+      <RecentlyPastDue
+        recentPastDue={recentPastDue}
+        imageServer={recentPastDue?.data?.session_image_server}
+        commonHeadData={commonHeadBanner?.result_list}
+      />
+    :
+      <MyTasks
+        ActiveJobList={MyActiveJobList}
+        MyActiveOffersList={MyActiveOffersList}
+        commonHeadData={commonHeadBanner?.result_list}
+      />
+    }
+    </>
   );
 }