Correction in Collection list and AttendancePage.

src/components/Documents/Documents.jsx

@@ -142,7 +142,7 @@ const Documents = ({ Document_Entity, Entity }) => {
   return (
     <DocumentContext.Provider value={contextValues}>
       <div className="mt-2">
-        <div className="card page-min-h d-flex p-5">
+        <div className="card page-min-h table-responsive d-flex p-5">
           <DocumentFilterChips filters={filters} filterData={filterData} removeFilterChip={removeFilterChip} />
           <div className="row align-items-center">
             {/* Search */}

src/components/Documents/DocumentsList.jsx

@@ -178,7 +178,7 @@ const DocumentsList = ({
         />
       )}
 
-      <div className="table-responsive">
+      <div className="">
         <table className="table border-top dataTable text-nowrap">
           <thead>
             <tr className="shadow-sm">

src/components/Employee/EmpAttendance.jsx

@@ -71,7 +71,7 @@ const EmpAttendance = () => {
           <AttendLogs Id={attendanceId} />
         </GlobalModel>
       )}
-      <div className="card px-4 mt-3 py-2 " style={{ minHeight: "500px" }}>
+      <div className="table-responsive card px-4 mt-3 py-2 " style={{ minHeight: "500px" }}>
         <div
           className="dataTables_length text-start py-2 d-flex justify-content-between "
           id="DataTables_Table_0_length"
@@ -84,7 +84,7 @@ const EmpAttendance = () => {
             </>
           </div>
         </div>
-        <div className="table-responsive text-nowrap">
+        <div className="text-nowrap">
           {!loading && data.length === 0 && (
             <div className="text-center py-5">No employee logs</div>
           )}

src/components/Organization/OrganizationsList.jsx

@@ -5,17 +5,17 @@ import Avatar from "../common/Avatar";
 import { useDebounce } from "../../utils/appUtils";
 import Pagination from "../common/Pagination";
 
-const OrganizationsList = ({searchText}) => {
-   const [currentPage, setCurrentPage] = useState(1);
-    const searchString = useDebounce(searchText,500)
+const OrganizationsList = ({ searchText }) => {
+  const [currentPage, setCurrentPage] = useState(1);
+  const searchString = useDebounce(searchText, 500)
   const {
     data = [],
     isLoading,
     isFetching,
     isError,
     error,
-  } = useOrganizationsList(ITEMS_PER_PAGE, 1, true,null,searchString);
-    const {onClose, startStep, flowType, onOpen,orgData } = useOrganizationModal();
+  } = useOrganizationsList(ITEMS_PER_PAGE, 1, true, null, searchString);
+  const { onClose, startStep, flowType, onOpen, orgData } = useOrganizationModal();
 
   const organizationsColumns = [
     {
@@ -39,21 +39,21 @@ const OrganizationsList = ({searchText}) => {
       label: "Contact Person",
       getValue: (org) => (
         (
-        <div className="d-flex align-items-center ps-1">
-          <Avatar
-            size="xs"
-            classAvatar="m-0"
-            firstName={(org?.name || "").trim().split(" ")[0] || ""}
-            lastName={(org?.name || "").trim().split(" ")[1] || ""}
-          />
-          <span
-            className="text-truncate d-inline-block "
-            style={{ maxWidth: "150px" }}
-          >
-            {org?.name || "N/A"}
-          </span>
-        </div>
-      )
+          <div className="d-flex align-items-center ps-1">
+            <Avatar
+              size="xs"
+              classAvatar="m-0"
+              firstName={(org?.name || "").trim().split(" ")[0] || ""}
+              lastName={(org?.name || "").trim().split(" ")[1] || ""}
+            />
+            <span
+              className="text-truncate d-inline-block "
+              style={{ maxWidth: "150px" }}
+            >
+              {org?.name || "N/A"}
+            </span>
+          </div>
+        )
       ),
       align: "text-start",
     },
@@ -67,7 +67,7 @@ const OrganizationsList = ({searchText}) => {
       key: "email",
       label: "Email",
       getValue: (org) => (
-         <span
+        <span
           className="text-truncate d-inline-block"
           style={{ maxWidth: "200px" }}
         >
@@ -84,7 +84,7 @@ const OrganizationsList = ({searchText}) => {
     },
   ];
 
-   const paginate = (page) => {
+  const paginate = (page) => {
     if (page >= 1 && page <= (data?.totalPages ?? 1)) {
       setCurrentPage(page);
     }
@@ -93,73 +93,72 @@ const OrganizationsList = ({searchText}) => {
   if (isError) return <div>{error?.message || "Something went wrong"}</div>;
 
   return (
-       <div
-          className="card-datatable table-responsive overflow-auto"
-          id="horizontal-example"
-        >
-          <div className="dataTables_wrapper no-footer px-2 ">
-            <table className="table border-top dataTable text-nowrap">
-            <thead>
-              <tr className="table_header_border">
-                {organizationsColumns.map((col) => (
-                  <th
-                    key={col.key}
-                    className="sorting d-table-cell"
-                    aria-sort="descending"
-                  >
-                    <div className={`${col.align}`}>{col.label}</div>
-                  </th>
-                ))}
-                <th className="sticky-action-column bg-white text-center">
-                  Action
+    <div
+      id="horizontal-example"
+    >
+      <div className="dataTables_wrapper no-footer px-2 ">
+        <table className="table border-top dataTable text-nowrap">
+          <thead>
+            <tr className="table_header_border">
+              {organizationsColumns.map((col) => (
+                <th
+                  key={col.key}
+                  className="sorting d-table-cell"
+                  aria-sort="descending"
+                >
+                  <div className={`${col.align}`}>{col.label}</div>
                 </th>
-              </tr>
-            </thead>
-            <tbody>
-              {data?.data?.length > 0 ? (
-                data?.data?.map((org) => (
-                  <tr key={org.id}>
-                    {organizationsColumns.map((col) => (
-                      <td
-                        key={col.key}
-                        style={{ height: "50px" }}
-                        className={`d-table-cell ${col.align ?? ""}`}
-                      >
-                        {col.customRender
-                          ? col.customRender(org)
-                          : col.getValue(org)}
-                      </td>
-                    ))}
-                    <td className="sticky-action-column ">
-                      <div className="d-flex justify-content-center gap-2">
-                        <i className="bx bx-show text-primary cursor-pointer"  onClick={()=>onOpen({startStep:5,orgData:org.id,flowType:"view"})}></i>
-                        <i className="bx bx-edit text-secondary cursor-pointer" onClick={()=>onOpen({startStep:4,orgData:org,flowType:"edit"})}></i>
-                        <i className="bx bx-trash text-danger cursor-not-allowed"></i>
-                      </div>
+              ))}
+              <th className="sticky-action-column bg-white text-center">
+                Action
+              </th>
+            </tr>
+          </thead>
+          <tbody>
+            {data?.data?.length > 0 ? (
+              data?.data?.map((org) => (
+                <tr key={org.id}>
+                  {organizationsColumns.map((col) => (
+                    <td
+                      key={col.key}
+                      style={{ height: "50px" }}
+                      className={`d-table-cell ${col.align ?? ""}`}
+                    >
+                      {col.customRender
+                        ? col.customRender(org)
+                        : col.getValue(org)}
                     </td>
-                  </tr>
-                ))
-              ) : (
-                <tr>
-                  <td
-                    colSpan={organizationsColumns.length + 1}
-                    className="text-center"
-                  >
-                    <p className="fw-semibold">{isLoading ? "Loading....":"Not Found Organization"}</p>
+                  ))}
+                  <td className="sticky-action-column ">
+                    <div className="d-flex justify-content-center gap-2">
+                      <i className="bx bx-show text-primary cursor-pointer" onClick={() => onOpen({ startStep: 5, orgData: org.id, flowType: "view" })}></i>
+                      <i className="bx bx-edit text-secondary cursor-pointer" onClick={() => onOpen({ startStep: 4, orgData: org, flowType: "edit" })}></i>
+                      <i className="bx bx-trash text-danger cursor-not-allowed"></i>
+                    </div>
                   </td>
                 </tr>
-              )}
-            </tbody>
-          </table>
-          {data?.data?.length > 0 && (
-              <Pagination
-                currentPage={currentPage}
-                totalPages={data.totalPages}
-                onPageChange={paginate}
-              />
+              ))
+            ) : (
+              <tr>
+                <td
+                  colSpan={organizationsColumns.length + 1}
+                  className="text-center"
+                >
+                  <p className="fw-semibold">{isLoading ? "Loading...." : "Not Found Organization"}</p>
+                </td>
+              </tr>
             )}
-        </div>
+          </tbody>
+        </table>
+        {data?.data?.length > 0 && (
+          <Pagination
+            currentPage={currentPage}
+            totalPages={data.totalPages}
+            onPageChange={paginate}
+          />
+        )}
       </div>
+    </div>
   );
 };
 

src/pages/Activities/AttendancePage.jsx

@@ -202,7 +202,7 @@ const AttendancePage = () => {
               </div>
 
               {/* Search + Organization filter */}
-              <div className="col-12 col-md-auto mb-2 mt-md-0 ms-md-auto nav">
+              <div className="col-12 col-md-auto mb-2 mt-3 mt-md-0 ms-md-auto nav">
                 <div className="row g-2">
                   <div className="col-12 col-sm-6">
                     <select

src/pages/Organization/OrganizationPage.jsx

@@ -47,8 +47,10 @@ const OrganizationPage = () => {
           </div>
         </div>
       </div>
-      <div className="card page-min-h px-sm-4">
-        <OrganizationsList searchText={searchText} />
+      <div className="card table-responsive page-min-h">
+        <div className="card-body">
+          <OrganizationsList searchText={searchText} />
+        </div>
       </div>
     </div>
   );