family page

src/components/FamilyAcc/FamilyTable.jsx

@@ -1,10 +1,12 @@
 import React, { useState } from "react";
 import dataImage1 from "../../assets/images/data-table-user-1.png";
 import LoadingSpinner from "../Spinners/LoadingSpinner";
+import { useNavigate, useLocation } from "react-router-dom";
 
 export default function FamilyTable({ className, familyList, loader }) {
   const filterCategories = ["All Categories", "Explore", "Featured"];
   const [selectedCategory, setCategory] = useState(filterCategories[0]);
+  const navigate = useNavigate();
   return (
     <div
       className={`update-table w-full p-8 bg-white dark:bg-dark-white overflow-y-auto rounded-2xl section-shadow min-h-[520px] max-h-[600px] ${
@@ -24,7 +26,7 @@ export default function FamilyTable({ className, familyList, loader }) {
                   <th className="py-4">Name</th>
                   <th className="py-4 text-center">Last Login</th>
                   <th className="py-4 text-center">No of Tasks</th>
-                  <th className="py-4 text-right">Status</th>
+                  <th className="py-4 text-right"></th>
                 </tr>
               </thead>
               <tbody className="overflow-y-scroll h-auto">
@@ -79,6 +81,9 @@ export default function FamilyTable({ className, familyList, loader }) {
                             </td>
                             <td className="text-right py-4 px-2 flex items-center justify-center">
                               <button
+                                  onClick={() => {
+                                    navigate("/manage-family");
+                                  }}
                                 type="button"
                                 className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
                               >

src/components/Partials/Layout.jsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, {useEffect, useState} from "react";
 import { useDispatch, useSelector } from "react-redux";
 import { useNavigate } from "react-router-dom";
 import { toast } from "react-toastify";
@@ -9,6 +9,8 @@ import Header from "./Header";
 import MobileSidebar from "./MobileSideBar";
 import RightSideBar from "./RightSideBar";
 import Sidebar from "./Sidebar";
+import usersService from "../../services/UsersService";
+
 
 export default function Layout({ children }) {
   const { drawer } = useSelector((state) => state.drawer);
@@ -28,6 +30,33 @@ export default function Layout({ children }) {
 
     navigate("/login", { replace: true });
   };
+
+  //---------------------------------------
+  /* LET U DEAL WITH JOB LIST - we need to centralize this list  */
+  const {jobListTable} = useSelector((state) => state.tableReload)
+  const [MyJobList, setMyJobList] = useState({loading: true, data:[]});
+  const api = new usersService();
+
+  const getMyJobList = async () => {
+    setMyJobList({loading: true, data:[]})
+    try {
+      const res = await api.getMyJobList();
+      setMyJobList({loading: false, data:res.data})
+      // setMyJobList(res.data);
+    } catch (error) {
+      setMyJobList({loading: false, data:[]})
+      console.log("Error getting mode");
+    }
+  };
+  useEffect(() => {
+    getMyJobList();
+  }, [jobListTable]);
+  // const getJobList = ()=>{
+  //   let  jobLists  = useSelector((state) => state.jobLists);
+  //   return jobLists;
+  // }
+  //---------------------------------------
+
   return (
     <>
       <div className="nft-main-wrapper-layout">

src/components/Partials/Sidebar.jsx

@@ -10,7 +10,7 @@ export default function Sidebar({ sidebar, action, logoutModalHandler }) {
   const darkMode = useContext(DarkModeContext);
 
   let { userDetails } = useSelector((state) => state.userDetails);
-
+  //const jobLists =  getJobList(); // pass from upper - we need in a lot of places
   let { jobLists } = useSelector((state) => state.jobLists);
   const marketData = jobLists?.result_list;
   let noOfJobs = marketData?.length <= 0 ? "0" : marketData?.length;