From 48d1592b8ceb8a34e242146f4493043d938414f0 Mon Sep 17 00:00:00 2001
From: Kartik sharma <kartik.sharma@marcoaiot.com>
Date: Sat, 28 Jun 2025 16:44:26 +0530
Subject: [PATCH] =?UTF-8?q?"Directory=20filter=20popup=20closes=20on=20'Cl?=
 =?UTF-8?q?ear'=20button=20click=20=E2=80=93=20it=20should=20remain=20open?=
 =?UTF-8?q?"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/Directory/DirectoryPageHeader.jsx | 36 +++++++++++++++------
 1 file changed, 26 insertions(+), 10 deletions(-)

diff --git a/src/pages/Directory/DirectoryPageHeader.jsx b/src/pages/Directory/DirectoryPageHeader.jsx
index 6f4270a8..b23e8a34 100644
--- a/src/pages/Directory/DirectoryPageHeader.jsx
+++ b/src/pages/Directory/DirectoryPageHeader.jsx
@@ -289,14 +289,13 @@ const DirectoryPageHeader = ({
 
           {/* Filter by funnel icon for Notes view */}
           {viewType === "notes" && (
-            <div className="dropdown" style={{ width: "fit-content", minWidth: "400px" }}> {/* Added minWidth here */}
+            <div className="dropdown" style={{ width: "fit-content", minWidth: "400px" }}>
               <a
                 className="dropdown-toggle hide-arrow cursor-pointer d-flex align-items-center position-relative"
                 data-bs-toggle="dropdown"
                 aria-expanded="false"
               >
                 <i className={`fa-solid fa-filter ms-1 fs-5 ${selectedCreators.length > 0 || selectedOrgs.length > 0 ? "text-primary" : "text-muted"}`}></i>
-                {/* Removed the numerical badge for notes filter */}
               </a>
 
               <div
@@ -329,9 +328,6 @@ const DirectoryPageHeader = ({
                     ))}
                   </div>
 
-                  {/* Divider */}
-                  {/* <div style={{ width: "1px", backgroundColor: "#dee2e6", margin: "0 12px" }}></div> */}
-
                   {/* Organization */}
                   <div className="ps-3" style={{ flex: 1 }}>
                     <p className="text-muted mb-1">Organization</p>
@@ -356,7 +352,8 @@ const DirectoryPageHeader = ({
                 <div className="d-flex justify-content-between mt-3">
                   <button
                     className="btn btn-sm btn-outline-danger"
-                    onClick={() => {
+                    onClick={(e) => {
+                      e.stopPropagation();
                       setSelectedCreators([]);
                       setSelectedOrgs([]);
                       setFilteredOrganizations(allOrganizations);
@@ -365,7 +362,12 @@ const DirectoryPageHeader = ({
                   >
                     Clear
                   </button>
-                  <button className="btn btn-sm btn-primary" onClick={applyCombinedFilter}>
+                  <button
+                    className="btn btn-sm btn-primary"
+                    onClick={(e) => {
+                      applyCombinedFilter();
+                    }}
+                  >
                     Apply Filter
                   </button>
                 </div>
@@ -457,13 +459,27 @@ const DirectoryPageHeader = ({
                 </div>
 
                 <div className="d-flex justify-content-end gap-2 mt-1">
-                  <button className="btn btn-xs btn-secondary" onClick={clearFilter}>Clear</button>
-                  <button className="btn btn-xs btn-primary" onClick={applyFilter}>Apply Filter</button>
+                  <button
+                    className="btn btn-xs btn-secondary"
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      clearFilter();
+                    }}
+                  >
+                    Clear
+                  </button>
+                  <button
+                    className="btn btn-xs btn-primary"
+                    onClick={(e) => {
+                      applyFilter();
+                    }}
+                  >
+                    Apply Filter
+                  </button>
                 </div>
               </ul>
             </div>
           )}
-
         </div>
 
         <div className="col-12 col-md-6 mb-2 px-5 d-flex justify-content-end align-items-center gap-2">