Active jobs layout

src/views/MyTaskPage.jsx

@@ -1,16 +1,31 @@
-import React from "react";
+import React, { useContext,useState, useEffect } from "react";
 import MyTasks from "../components/MyTasks";
 import UsersService from "../services/UsersService";
 import usersService from "../services/UsersService";
 
 export default function MyTaskPage() {
 
-    const userApi = new usersService();
-    const activeJobList  = userApi.getActiveJobList();
+    // const userApi = new usersService();
+    // const activeJobList  = userApi.getMyJobList();
+    const [ActiveJobList, setActiveJobList] = useState([]);
+    const api = new usersService();
+
+    const getActiveJobList = async () => {
+        try {
+            const res = await api.getActiveJobList();
+            setActiveJobList(res.data);
+        } catch (error) {
+            console.log("Error getting mode");
+        }
+    };
+    useEffect(() => {
+        getActiveJobList();
+    }, []);
+
     //debugger;
     return (
         <>
-            <MyTasks />
+            <MyTasks ActiveJobList={ActiveJobList}/>
         </>
     );
 }