added float button

src/pages/Directory/Directory.jsx

@@ -18,6 +18,7 @@ import ConfirmModal from "../../components/common/ConfirmModal";
 import DirectoryListTableHeader from "./DirectoryListTableHeader";
 import DirectoryPageHeader from "./DirectoryPageHeader";
 import ManageBucket from "../../components/Directory/ManageBucket";
+import {useFab} from "../../Context/FabContext";
 
 const Directory = () =>
 {
@@ -36,11 +37,12 @@ const Directory = () =>
   const [openBucketModal,setOpenBucketModal] = useState(false)
 
   const [tempSelectedBucketIds, setTempSelectedBucketIds] = useState([]);
-  const [tempSelectedCategoryIds, setTempSelectedCategoryIds] = useState([]);
+  const [ tempSelectedCategoryIds, setTempSelectedCategoryIds ] = useState( [] );
+    const {setActions} = useFab()
 
-  const { contacts, loading } = useDirectory(IsActive);
+  const { contacts, loading , refetch} = useDirectory(IsActive);
   const { contactCategory, loading: contactCategoryLoading } =
-    useContactCategory();
+  useContactCategory();
   const {buckets} = useBuckets();
   
   const submitContact = async (data) => {
@@ -56,15 +58,17 @@ const Directory = () =>
         );
         showToast("Contact updated successfully", "success");
         setIsOpenModal(false);
-        setSelectedContact(null);
+        setSelectedContact( null );
       } else {
         response = await DirectoryRepository.CreateContact(data);
         updatedContacts = [...contacts_cache, response.data];
         showToast("Contact created successfully", "success");
         setIsOpenModal(false);
       }
-       cacheData("Contacts", {data:updatedContacts,isActive:IsActive});
+  
-      setContactList(updatedContacts);
+      // cacheData("Contacts", {data:updatedContacts,isActive:IsActive});
+      // setContactList(updatedContacts);
+      refetch()
     } catch (error) {
       const msg =
         error.response?.data?.message ||
@@ -80,7 +84,7 @@ const Directory = () =>
       const contacts_cache = getCachedData("contacts")?.data || [];
 
       const response = await DirectoryRepository.DeleteContact(deleteContact);
-      const updatedContacts = ContactList.filter((c) => c.id !== deleteContact);
+      const updatedContacts = ContactList.filter( ( c ) => c.id !== deleteContact );
       setContactList(updatedContacts);
       cacheData("Contacts", {data:updatedContacts,isActive:IsActive});
       showToast("Contact deleted successfully", "success");
@@ -155,7 +159,7 @@ const Directory = () =>
 
       return matchesSearch && matchesCategory && matchesBucket;
     }).sort((a, b) => a.name.localeCompare(b.name));
-  }, [ContactList, searchText, selectedCategoryIds, selectedBucketIds]);
+  }, [ContactList, searchText, selectedCategoryIds, selectedBucketIds,selectedContact]);
 
   const applyFilter = () => {
     setSelectedBucketIds(tempSelectedBucketIds);
@@ -192,8 +196,30 @@ const Directory = () =>
     }
   };
 
+
+   useEffect(() => {
+    setActions([
+      {
+        label: "New Contact",
+        icon: "bx bx-plus-circle",
+         color: "warning",
+        onClick: () =>  setIsOpenModal(true),
+      },
+           {
+        label: "Manage Bucket",
+             icon: "fa-solid fa-bucket fs-5 ",
+         color: "primary",
+        onClick: () => setOpenBucketModal(true),
+      },
+   
+    ]);
+
+    return () => setActions([]); // Clean up
+  }, []);
+
   return (
     <div className="container-xxl flex-grow-1 container-p-y">
+    
       <Breadcrumb
         data={[
           { label: "Home", link: "/dashboard" },
@@ -333,6 +359,8 @@ const Directory = () =>
             ))}
           </div>
         )}
+        <div>
+  </div>
 
         {!loading && currentItems < ITEMS_PER_PAGE && (
           <nav aria-label="Page ">