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"
                               >