added direct bucket permission

src/components/Directory/BucketList.jsx

@@ -1,4 +1,11 @@
+import { useHasUserPermission } from "../../hooks/useHasUserPermission";
+import { useProfile } from "../../hooks/useProfile";
+import { DIRECTORY_ADMIN, DIRECTORY_MANAGER } from "../../utils/constants";
+
 const BucketList = ({ buckets, loading, searchTerm, onEdit, onDelete }) => {
+  const { profile } = useProfile();
+  const IsDirecrory_Admin = useHasUserPermission(DIRECTORY_ADMIN);
+  const IsDirectory_Manager = useHasUserPermission(DIRECTORY_MANAGER);
   const sorted = buckets.filter((bucket) =>
     bucket.name.toLowerCase().includes(searchTerm.toLowerCase())
   );
@@ -14,21 +21,27 @@ const BucketList = ({ buckets, loading, searchTerm, onEdit, onDelete }) => {
             <div className="card-body p-4">
               <h6 className="card-title d-flex justify-content-between">
                 <span>{bucket.name}</span>
-                <div className="d-flex gap-2">
+                {(IsDirecrory_Admin ||
-                  <i
+                  IsDirectory_Manager ||
-                    className="bx bx-edit bx-sm text-primary cursor-pointer"
+                  bucket?.createdBy?.id === profile?.employeeInfo?.id) && (
-                    onClick={() => onEdit(bucket)}
+                  <div className="d-flex gap-2">
-                  />
+                    <i
-                  <i
+                      className="bx bx-edit bx-sm text-primary cursor-pointer"
-                    className="bx bx-trash bx-sm text-danger cursor-pointer"
+                      onClick={() => onEdit(bucket)}
-                    onClick={() => onDelete(bucket.id)}
+                    />
-                  />
+                    <i
-                </div>
+                      className="bx bx-trash bx-sm text-danger cursor-pointer"
+                      onClick={() => onDelete(bucket?.id)}
+                    />
+                  </div>
+                )}
               </h6>
               <h6 className="card-subtitle mb-2 text-muted">
                 Contacts: {bucket.numberOfContacts || 0}
               </h6>
-              <p className="card-text">{bucket.description || "No description"}</p>
+              <p className="card-text">
+                {bucket.description || "No description"}
+              </p>
             </div>
           </div>
         </div>
@@ -37,4 +50,4 @@ const BucketList = ({ buckets, loading, searchTerm, onEdit, onDelete }) => {
   );
 };
 
-export default BucketList;
+export default BucketList;