From 5c8a6c8c65cfe88c0fd997a9589f455c0bd902c8 Mon Sep 17 00:00:00 2001
From: Kartik Sharma <kartik.sharma@marcoaiot.com>
Date: Wed, 8 Oct 2025 18:15:28 +0530
Subject: [PATCH 1/2] Directory tab inside Project Profile page not displayed
 properly (tab within tab issue)

---
 src/pages/Directory/DirectoryPage.jsx | 168 +++++++++++++-------------
 1 file changed, 83 insertions(+), 85 deletions(-)

diff --git a/src/pages/Directory/DirectoryPage.jsx b/src/pages/Directory/DirectoryPage.jsx
index 9580e339..485718fb 100644
--- a/src/pages/Directory/DirectoryPage.jsx
+++ b/src/pages/Directory/DirectoryPage.jsx
@@ -139,9 +139,8 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                 <ul className="nav nav-tabs">
                   <li className="nav-item cursor-pointer">
                     <a
-                      className={`nav-link ${
-                        activeTab === "notes" ? "active" : ""
-                      } fs-6`}
+                      className={`nav-link ${activeTab === "notes" ? "active" : ""
+                        } fs-6`}
                       onClick={(e) => handleTabClick("notes", e)}
                     >
                       <i className="bx bx-notepad bx-sm me-1_5"></i>
@@ -150,9 +149,8 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                   </li>
                   <li className="nav-item cursor-pointer">
                     <a
-                      className={`nav-link ${
-                        activeTab === "contacts" ? "active" : ""
-                      } fs-6`}
+                      className={`nav-link ${activeTab === "contacts" ? "active" : ""
+                        } fs-6`}
                       onClick={(e) => handleTabClick("contacts", e)}
                     >
                       <i className="bx bxs-contact bx-sm me-1_5"></i>
@@ -160,94 +158,94 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                     </a>
                   </li>
                 </ul>
-              </div>
 
-              <div className="mb-1 px-2 py-3">
-                <div className="d-flex align-items-center justify-content-between">
-                  <div className="d-flex align-items-center gap-3">
-                    {activeTab === "notes" && (
-                      <input
-                        type="search"
-                        className="form-control form-control-sm"
-                        placeholder="Search notes..."
-                        value={searchNote}
-                        onChange={(e) => setSearchNote(e.target.value)}
-                      />
-                    )}
+                <div className="mb-1 px-2 py-3">
+                  <div className="d-flex align-items-center justify-content-between">
+                    <div className="d-flex align-items-center gap-3">
+                      {activeTab === "notes" && (
+                        <input
+                          type="search"
+                          className="form-control form-control-sm"
+                          placeholder="Search notes..."
+                          value={searchNote}
+                          onChange={(e) => setSearchNote(e.target.value)}
+                        />
+                      )}
 
-                    {activeTab === "contacts" && (
-                      <div className="d-flex align-items-center gap-3">
-                        <div className="d-flex gap-2 align-items-center">
-                          <input
-                            type="search"
-                            className="form-control form-control-sm"
-                            placeholder="Search contacts..."
-                            value={searchContact}
-                            onChange={(e) => setsearchContact(e.target.value)}
-                          />
-                         
+                      {activeTab === "contacts" && (
+                        <div className="d-flex align-items-center gap-3">
+                          <div className="d-flex gap-2 align-items-center">
+                            <input
+                              type="search"
+                              className="form-control form-control-sm"
+                              placeholder="Search contacts..."
+                              value={searchContact}
+                              onChange={(e) => setsearchContact(e.target.value)}
+                            />
+                            <button
+                              className={`btn btn-sm p-1 ${gridView ? " btn-primary" : " btn-outline-primary"
+                                }`}
+                              onClick={() => setGridView(true)}
+                            >
+                              <i className="bx bx-grid-alt"></i>
+                            </button>
 
-                          <button
-                            className={`btn btn-sm p-1 ${
-                              gridView ? " btn-primary" : " btn-outline-primary"
-                            }`}
-                            onClick={() => setGridView(true)}
-                          >
-                            <i className="bx bx-grid-alt"></i>
-                          </button>
-
-                           <button
-                            className={`btn btn-sm p-1 ${
-                              !gridView ? "btn-primary" : "btn-outline-primary"
-                            }`}
-                            onClick={() => setGridView(false)}
-                          >
-                            <i className="bx bx-list-ul"></i>
-                          </button>
+                            <button
+                              className={`btn btn-sm p-1 ${!gridView ? "btn-primary" : "btn-outline-primary"
+                                }`}
+                              onClick={() => setGridView(false)}
+                            >
+                              <i className="bx bx-list-ul"></i>
+                            </button>
+                          </div>
                         </div>
-
-                        <div className="form-check form-switch d-flex align-items-center m-0">
-                          <input
-                            type="checkbox"
-                            className="form-check-input"
-                            role="switch"
-                            id="inactiveEmployeesCheckbox"
-                            checked={showActive}
-                            onChange={(e) => setShowActive(e.target.checked)}
-                          />
-                          <label
-                            className="form-check-label ms-2"
-                            htmlFor="inactiveEmployeesCheckbox"
+                      )}
+                    </div>
+                    <div class="dropdown z-2">
+                      <button type="button"
+                        class="btn btn-xs btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0 m-0" data-bs-toggle="dropdown" aria-expanded="true">
+                        <i class="bx bx-dots-vertical-rounded text-muted p-0" data-bs-toggle="tooltip"
+                          data-bs-offset="0,8" data-bs-placement="top" data-bs-custom-class="tooltip-dark" title="More Action">
+                        </i>
+                      </button>
+                      <ul class="dropdown-menu dropdown-menu-end p-5" data-popper-placement="bottom-end"
+                      >
+                        <li>
+                          <a
+                            className="dropdown-item cursor-pointer"
+                            onClick={() => handleExport("csv")}
                           >
-                            {showActive ? "Active" : "Inactive"} Contacts
-                          </label>
-                        </div>
-                      </div>
-                    )}
-                  </div>
+                            <i className="bx bx-file"></i> Export to CSV
+                          </a>
+                        </li>
+                        {activeTab === "contacts" && (
+                          <li>
+                            <div className="form-check form-switch d-flex align-items-center m-0">
+                              <input
+                                type="checkbox"
+                                className="form-check-input"
+                                role="switch"
+                                id="inactiveEmployeesCheckbox"
+                                checked={showActive}
+                                onChange={(e) => setShowActive(e.target.checked)}
+                              />
+                              <label
+                                className="form-check-label ms-2"
+                                htmlFor="inactiveEmployeesCheckbox"
+                              >
+                                {showActive ? "Active" : "Inactive"} Contacts
+                              </label>
+                            </div>
+                          </li>
+                        )}
+                      </ul>
+                    </div>
 
-                  <div className="btn-group">
-                    <button
-                      className="btn btn-sm btn-label-secondary dropdown-toggle"
-                      type="button"
-                      data-bs-toggle="dropdown"
-                      aria-expanded="false"
-                    >
-                      <i className="bx bx-export me-2 bx-sm"></i>Export
-                    </button>
-                    <ul className="dropdown-menu">
-                      <li>
-                        <a
-                          className="dropdown-item cursor-pointer"
-                          onClick={() => handleExport("csv")}
-                        >
-                          <i className="bx bx-file me-1"></i> CSV
-                        </a>
-                      </li>
-                    </ul>
                   </div>
                 </div>
+
               </div>
+
             </div>
           </div>
 
-- 
2.43.0


From b2e2214143434f14debe4cf235cd5267d7dedda6 Mon Sep 17 00:00:00 2001
From: Kartik Sharma <kartik.sharma@marcoaiot.com>
Date: Thu, 9 Oct 2025 10:58:58 +0530
Subject: [PATCH 2/2] Changes directory View.

---
 src/pages/Directory/DirectoryPage.jsx | 45 ++++++++++++++-------------
 1 file changed, 24 insertions(+), 21 deletions(-)

diff --git a/src/pages/Directory/DirectoryPage.jsx b/src/pages/Directory/DirectoryPage.jsx
index 485718fb..5f819e69 100644
--- a/src/pages/Directory/DirectoryPage.jsx
+++ b/src/pages/Directory/DirectoryPage.jsx
@@ -201,41 +201,44 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                         </div>
                       )}
                     </div>
-                    <div class="dropdown z-2">
-                      <button type="button"
-                        class="btn btn-xs btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0 m-0" data-bs-toggle="dropdown" aria-expanded="true">
-                        <i class="bx bx-dots-vertical-rounded text-muted p-0" data-bs-toggle="tooltip"
-                          data-bs-offset="0,8" data-bs-placement="top" data-bs-custom-class="tooltip-dark" title="More Action">
-                        </i>
-                      </button>
-                      <ul class="dropdown-menu dropdown-menu-end p-5" data-popper-placement="bottom-end"
+                    <div className="dropdown z-2">
+                      <button
+                        type="button"
+                        className="btn btn-icon p-0 m-0"
+                        data-bs-toggle="dropdown"
+                        aria-expanded="false"
+                        title="More Actions"
                       >
+                        <i className="bx bx-dots-vertical-rounded text-muted bx-md"></i>
+                      </button>
+
+                      <ul className="dropdown-menu dropdown-menu-end shadow-sm p-2" style={{ minWidth: "220px" }}>
                         <li>
-                          <a
-                            className="dropdown-item cursor-pointer"
+                          <button
+                            className="dropdown-item d-flex align-items-center gap-2"
                             onClick={() => handleExport("csv")}
                           >
-                            <i className="bx bx-file"></i> Export to CSV
-                          </a>
+                            <i className="bx bx-file"></i>
+                            <span>Export to CSV</span>
+                          </button>
                         </li>
+
+                        {/* Divider */}
+                        {activeTab === "contacts" && <li><hr className="dropdown-divider" /></li>}
+
                         {activeTab === "contacts" && (
-                          <li>
-                            <div className="form-check form-switch d-flex align-items-center m-0">
+                          <li className="dropdown-item d-flex align-items-center">
+                            <div className="form-check form-switch mb-0">
                               <input
                                 type="checkbox"
                                 className="form-check-input"
                                 role="switch"
-                                id="inactiveEmployeesCheckbox"
+                                id="inactiveContactsSwitch"
                                 checked={showActive}
                                 onChange={(e) => setShowActive(e.target.checked)}
                               />
-                              <label
-                                className="form-check-label ms-2"
-                                htmlFor="inactiveEmployeesCheckbox"
-                              >
-                                {showActive ? "Active" : "Inactive"} Contacts
-                              </label>
                             </div>
+                            <span>{showActive ? "Active Contacts" : "Inactive Contacts"}</span>
                           </li>
                         )}
                       </ul>
-- 
2.43.0