From e1e4ba2b541e8bb329b614186596867614cbacf0 Mon Sep 17 00:00:00 2001
From: Kartik sharma <kartik.sharma@marcoaiot.com>
Date: Tue, 8 Jul 2025 12:45:48 +0530
Subject: [PATCH 1/2] Navigate to "Projects" Page Should Display Only Message
 When No Projects Are Assigned.

---
 src/pages/project/ProjectList.jsx | 162 +++++++++++++++---------------
 1 file changed, 79 insertions(+), 83 deletions(-)

diff --git a/src/pages/project/ProjectList.jsx b/src/pages/project/ProjectList.jsx
index 24e87ca1..a72276ed 100644
--- a/src/pages/project/ProjectList.jsx
+++ b/src/pages/project/ProjectList.jsx
@@ -315,96 +315,91 @@ const ProjectList = () => {
           <p className="text-center text-muted">No projects found.</p>
         )}
 
-        {listView ? (
-          <div className="card cursor-pointer">
-            <div className="card-body p-2">
-              <div className="table-responsive text-nowrap py-2 ">
-                <table className="table m-3">
-                  <thead>
-                    <tr>
-                      <th className="text-start" colSpan={5}>
-                        Project Name
-                      </th>
-                      <th className="mx-2 text-start">Contact Person</th>
-                      <th className="mx-2">START DATE</th>
-                      <th className="mx-2">DEADLINE</th>
-                      <th className="mx-2">Task</th>
-                      <th className="mx-2">Progress</th>
-                      <th className="mx-2">
-                        <div className="dropdown">
-                          <a
-                            className="dropdown-toggle hide-arrow cursor-pointer"
-                            data-bs-toggle="dropdown"
-                            aria-expanded="false"
-                          >
-                            Status <i className="bx bx-filter bx-sm"></i>
-                          </a>
-                          <ul className="dropdown-menu p-2 text-capitalize">
-                            {[
-                              {
-                                id: "b74da4c2-d07e-46f2-9919-e75e49b12731",
-                                label: "Active",
-                              },
-                              {
-                                id: "603e994b-a27f-4e5d-a251-f3d69b0498ba",
-                                label: "On Hold",
-                              },
-                              {
-                                id: "ef1c356e-0fe0-42df-a5d3-8daee355492d",
-                                label: "Inactive",
-                              },
-                              {
-                                id: "33deaef9-9af1-4f2a-b443-681ea0d04f81",
-                                label: "Completed",
-                              },
-                            ].map(({ id, label }) => (
-                              <li key={id}>
-                                <div className="form-check">
-                                  <input
-                                    className="form-check-input  "
-                                    type="checkbox"
-                                    checked={selectedStatuses.includes(id)}
-                                    onChange={() => handleStatusChange(id)}
-                                  />
-                                  <label className="form-check-label">
-                                    {label}
-                                  </label>
-                                </div>
-                              </li>
-                            ))}
-                          </ul>
-                        </div>
-                      </th>
-                      <th
-                        className={`mx-2 ${
-                          HasManageProject ? "d-sm-table-cell" : "d-none"
-                        }`}
-                      >
-                        Action
-                      </th>
-                    </tr>
-                  </thead>
-                  <tbody className="table-border-bottom-0 overflow-auto ">
-                    {currentItems.length === 0 ? (
+       {listView ? (
+          currentItems.length === 0 ? (
+            <div className="text-center text-muted mt-4">
+              No projects found.
+            </div>
+          ) : (
+            <div className="card cursor-pointer">
+              <div className="card-body p-2">
+                <div className="table-responsive text-nowrap py-2 ">
+                  <table className="table m-3">
+                    <thead>
                       <tr>
-                        <td colSpan="12" className="text-center py-4">
-                          No projects found
-                        </td>
+                        <th className="text-start" colSpan={5}>
+                          Project Name
+                        </th>
+                        <th className="mx-2 text-start">Contact Person</th>
+                        <th className="mx-2">START DATE</th>
+                        <th className="mx-2">DEADLINE</th>
+                        <th className="mx-2">Task</th>
+                        <th className="mx-2">Progress</th>
+                        <th className="mx-2">
+                          <div className="dropdown">
+                            <a
+                              className="dropdown-toggle hide-arrow cursor-pointer"
+                              data-bs-toggle="dropdown"
+                              aria-expanded="false"
+                            >
+                              Status <i className="bx bx-filter bx-sm"></i>
+                            </a>
+                            <ul className="dropdown-menu p-2 text-capitalize">
+                              {[
+                                {
+                                  id: "b74da4c2-d07e-46f2-9919-e75e49b12731",
+                                  label: "Active",
+                                },
+                                {
+                                  id: "603e994b-a27f-4e5d-a251-f3d69b0498ba",
+                                  label: "On Hold",
+                                },
+                                {
+                                  id: "ef1c356e-0fe0-42df-a5d3-8daee355492d",
+                                  label: "Inactive",
+                                },
+                                {
+                                  id: "33deaef9-9af1-4f2a-b443-681ea0d04f81",
+                                  label: "Completed",
+                                },
+                              ].map(({ id, label }) => (
+                                <li key={id}>
+                                  <div className="form-check">
+                                    <input
+                                      className="form-check-input"
+                                      type="checkbox"
+                                      checked={selectedStatuses.includes(id)}
+                                      onChange={() => handleStatusChange(id)}
+                                    />
+                                    <label className="form-check-label">{label}</label>
+                                  </div>
+                                </li>
+                              ))}
+                            </ul>
+                          </div>
+                        </th>
+                        <th
+                          className={`mx-2 ${HasManageProject ? "d-sm-table-cell" : "d-none"
+                            }`}
+                        >
+                          Action
+                        </th>
                       </tr>
-                    ) : (
-                      currentItems.map((project) => (
+                    </thead>
+                    <tbody className="table-border-bottom-0 overflow-auto">
+                      {currentItems.map((project) => (
                         <ProjectListView
                           key={project.id}
                           projectData={project}
                           recall={sortingProject}
                         />
-                      ))
-                    )}
-                  </tbody>
-                </table>
-              </div>{" "}
-            </div>{" "}
-          </div>
+                      ))}
+                    </tbody>
+                  </table>
+                </div>
+              </div>
+            </div>
+          )
         ) : (
           <div className="row">
             {currentItems.map((project) => (
@@ -417,6 +412,7 @@ const ProjectList = () => {
           </div>
         )}
 
+
         {!loading && totalPages > 1 && (
           <nav>
             <ul className="pagination pagination-sm justify-content-end py-2">

From 588104a9ddc95fbf9d061293bf5663d35d242112 Mon Sep 17 00:00:00 2001
From: Kartik sharma <kartik.sharma@marcoaiot.com>
Date: Wed, 9 Jul 2025 15:15:53 +0530
Subject: [PATCH 2/2] Nevigate to "Projects" Page Should Display Only Message
 When No Projects Are Assigned.

---
 public/assets/vendor/css/core.css |   2 +-
 src/assets/vendor/css/core.css    |   2 +-
 src/pages/project/ProjectList.jsx | 278 ++++++++++++++++--------------
 3 files changed, 146 insertions(+), 136 deletions(-)

diff --git a/public/assets/vendor/css/core.css b/public/assets/vendor/css/core.css
index d7f7cfcb..7f16ddd1 100644
--- a/public/assets/vendor/css/core.css
+++ b/public/assets/vendor/css/core.css
@@ -2553,7 +2553,7 @@ progress {
 }
 
 .table-responsive {
-  overflow-x: auto;
+  /* overflow-x: auto; */
   -webkit-overflow-scrolling: touch;
 }
 
diff --git a/src/assets/vendor/css/core.css b/src/assets/vendor/css/core.css
index 625896b1..70f4fb09 100644
--- a/src/assets/vendor/css/core.css
+++ b/src/assets/vendor/css/core.css
@@ -2436,7 +2436,7 @@ progress {
 }
 
 .table-responsive {
-  overflow-x: auto;
+  /* overflow-x: auto; */
   -webkit-overflow-scrolling: touch;
 }
 
diff --git a/src/pages/project/ProjectList.jsx b/src/pages/project/ProjectList.jsx
index a72276ed..ecd7f684 100644
--- a/src/pages/project/ProjectList.jsx
+++ b/src/pages/project/ProjectList.jsx
@@ -316,144 +316,154 @@ const ProjectList = () => {
         )}
 
        {listView ? (
-          currentItems.length === 0 ? (
-            <div className="text-center text-muted mt-4">
-              No projects found.
-            </div>
-          ) : (
-            <div className="card cursor-pointer">
-              <div className="card-body p-2">
-                <div className="table-responsive text-nowrap py-2 ">
-                  <table className="table m-3">
-                    <thead>
-                      <tr>
-                        <th className="text-start" colSpan={5}>
-                          Project Name
-                        </th>
-                        <th className="mx-2 text-start">Contact Person</th>
-                        <th className="mx-2">START DATE</th>
-                        <th className="mx-2">DEADLINE</th>
-                        <th className="mx-2">Task</th>
-                        <th className="mx-2">Progress</th>
-                        <th className="mx-2">
-                          <div className="dropdown">
-                            <a
-                              className="dropdown-toggle hide-arrow cursor-pointer"
-                              data-bs-toggle="dropdown"
-                              aria-expanded="false"
-                            >
-                              Status <i className="bx bx-filter bx-sm"></i>
-                            </a>
-                            <ul className="dropdown-menu p-2 text-capitalize">
-                              {[
-                                {
-                                  id: "b74da4c2-d07e-46f2-9919-e75e49b12731",
-                                  label: "Active",
-                                },
-                                {
-                                  id: "603e994b-a27f-4e5d-a251-f3d69b0498ba",
-                                  label: "On Hold",
-                                },
-                                {
-                                  id: "ef1c356e-0fe0-42df-a5d3-8daee355492d",
-                                  label: "Inactive",
-                                },
-                                {
-                                  id: "33deaef9-9af1-4f2a-b443-681ea0d04f81",
-                                  label: "Completed",
-                                },
-                              ].map(({ id, label }) => (
-                                <li key={id}>
-                                  <div className="form-check">
-                                    <input
-                                      className="form-check-input"
-                                      type="checkbox"
-                                      checked={selectedStatuses.includes(id)}
-                                      onChange={() => handleStatusChange(id)}
-                                    />
-                                    <label className="form-check-label">{label}</label>
-                                  </div>
-                                </li>
-                              ))}
-                            </ul>
-                          </div>
-                        </th>
-                        <th
-                          className={`mx-2 ${HasManageProject ? "d-sm-table-cell" : "d-none"
-                            }`}
-                        >
-                          Action
-                        </th>
-                      </tr>
-                    </thead>
-                    <tbody className="table-border-bottom-0 overflow-auto">
-                      {currentItems.map((project) => (
-                        <ProjectListView
-                          key={project.id}
-                          projectData={project}
-                          recall={sortingProject}
-                        />
-                      ))}
-                    </tbody>
-                  </table>
-                </div>
-              </div>
-            </div>
-          )
-        ) : (
-          <div className="row">
-            {currentItems.map((project) => (
-              <ProjectCard
-                key={project.id}
-                projectData={project}
-                recall={sortingProject}
-              />
-            ))}
-          </div>
-        )}
-
-
-        {!loading && totalPages > 1 && (
-          <nav>
-            <ul className="pagination pagination-sm justify-content-end py-2">
-              <li className={`page-item ${currentPage === 1 && "disabled"}`}>
-                <button
-                  className="page-link"
-                  onClick={() => setCurrentPage((p) => Math.max(1, p - 1))}
-                >
-                  &laquo;
-                </button>
-              </li>
-              {[...Array(totalPages)].map((_, i) => (
-                <li
-                  key={i}
-                  className={`page-item ${currentPage === i + 1 && "active"}`}
-                >
-                  <button
-                    className="page-link"
-                    onClick={() => setCurrentPage(i + 1)}
+  <div className="card cursor-pointer">
+    <div className="card-body p-2" style={{ minHeight: "200px" }}>
+      <div className="table-responsive text-nowrap py-2">
+        <table className="table m-3">
+          <thead>
+            <tr>
+              <th className="text-start" colSpan={5}>
+                Project Name
+              </th>
+              <th className="mx-2 text-start">Contact Person</th>
+              <th className="mx-2">START DATE</th>
+              <th className="mx-2">DEADLINE</th>
+              <th className="mx-2">Task</th>
+              <th className="mx-2">Progress</th>
+              <th className="mx-2">
+                <div className="dropdown">
+                  <a
+                    className="dropdown-toggle hide-arrow cursor-pointer"
+                    data-bs-toggle="dropdown"
+                    aria-expanded="false"
                   >
-                    {i + 1}
-                  </button>
-                </li>
-              ))}
-              <li
-                className={`page-item ${
-                  currentPage === totalPages && "disabled"
+                    Status <i className="bx bx-filter bx-sm"></i>
+                  </a>
+                  <ul className="dropdown-menu p-2 text-capitalize">
+                    {[
+                      {
+                        id: "b74da4c2-d07e-46f2-9919-e75e49b12731",
+                        label: "Active",
+                      },
+                      {
+                        id: "603e994b-a27f-4e5d-a251-f3d69b0498ba",
+                        label: "On Hold",
+                      },
+                      {
+                        id: "ef1c356e-0fe0-42df-a5d3-8daee355492d",
+                        label: "Inactive",
+                      },
+                      {
+                        id: "33deaef9-9af1-4f2a-b443-681ea0d04f81",
+                        label: "Completed",
+                      },
+                    ].map(({ id, label }) => (
+                      <li key={id}>
+                        <div className="form-check">
+                          <input
+                            className="form-check-input"
+                            type="checkbox"
+                            checked={selectedStatuses.includes(id)}
+                            onChange={() => handleStatusChange(id)}
+                          />
+                          <label className="form-check-label">{label}</label>
+                        </div>
+                      </li>
+                    ))}
+                  </ul>
+                </div>
+              </th>
+              <th
+                className={`mx-2 ${
+                  HasManageProject ? "d-sm-table-cell" : "d-none"
                 }`}
               >
-                <button
-                  className="page-link"
-                  onClick={() =>
-                    setCurrentPage((p) => Math.min(totalPages, p + 1))
-                  }
+                Action
+              </th>
+            </tr>
+          </thead>
+          <tbody className="table-border-bottom-0" style={{ height: "200px" }}>
+            {currentItems.length === 0 ? (
+              <tr>
+                <td
+                  colSpan="12"
+                  className="text-center"
+                  style={{
+                    verticalAlign: "middle",
+                    height: "200px",
+                    paddingTop: 0,
+                    paddingBottom: 0,
+                  }}
                 >
-                  &raquo;
-                </button>
-              </li>
-            </ul>
-          </nav>
-        )}
+                  <div className="d-flex flex-column justify-content-center align-items-center h-100">
+                    <p className="mb-0">No projects found</p>
+                  </div>
+                </td>
+              </tr>
+            ) : (
+              currentItems.map((project) => (
+                <ProjectListView
+                  key={project.id}
+                  projectData={project}
+                  recall={sortingProject}
+                />
+              ))
+            )}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  </div>
+) : (
+  <div className="row">
+    {currentItems.map((project) => (
+      <ProjectCard
+        key={project.id}
+        projectData={project}
+        recall={sortingProject}
+      />
+    ))}
+  </div>
+)}
+
+{!loading && totalPages > 1 && (
+  <nav>
+    <ul className="pagination pagination-sm justify-content-end py-2">
+      <li className={`page-item ${currentPage === 1 && "disabled"}`}>
+        <button
+          className="page-link"
+          onClick={() => setCurrentPage((p) => Math.max(1, p - 1))}
+        >
+          &laquo;
+        </button>
+      </li>
+      {[...Array(totalPages)].map((_, i) => (
+        <li
+          key={i}
+          className={`page-item ${currentPage === i + 1 && "active"}`}
+        >
+          <button
+            className="page-link"
+            onClick={() => setCurrentPage(i + 1)}
+          >
+            {i + 1}
+          </button>
+        </li>
+      ))}
+      <li className={`page-item ${currentPage === totalPages && "disabled"}`}>
+        <button
+          className="page-link"
+          onClick={() =>
+            setCurrentPage((p) => Math.min(totalPages, p + 1))
+          }
+        >
+          &raquo;
+        </button>
+      </li>
+    </ul>
+  </nav>
+)}
+
       </div>
     </>
   );