added pading in check-in check-out form

src/components/Activities/AttendcesLogs.jsx

@@ -133,8 +133,11 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
 
 
  useEffect(() => {
+  if (data?.length) {
     filtering(data);
-  }, [data, showPending]);
+  }
+}, [data, showPending]);
+
 
   // New useEffect to handle search filtering
   const filteredSearchData = useMemo(() => {
@@ -148,31 +151,6 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
     });
   }, [processedData, searchTerm]);
 
-  //   const filteredSearchData = useMemo(() => {
-  //   let tempData = processedData;
-
-  //   if (searchTerm) {
-  //     const lowercasedSearchTerm = searchTerm.toLowerCase();
-  //     tempData = tempData.filter((item) => {
-  //       const fullName = `${item.firstName} ${item.lastName}`.toLowerCase();
-  //       return fullName.includes(lowercasedSearchTerm);
-  //     });
-  //   }
-
-  //   if (filters?.selectedOrganization) {
-  //     tempData = tempData.filter(
-  //       (item) => item.organization?.name === filters.selectedOrganization
-  //     );
-  //   }
-
-  //   if (filters?.selectedServices?.length > 0) {
-  //     tempData = tempData.filter((item) =>
-  //       filters.selectedServices.includes(item.service?.name)
-  //     );
-  //   }
-
-  //   return tempData;
-  // }, [processedData, searchTerm, filters]);
 
 
   const {

src/components/Activities/CheckCheckOutForm.jsx

@@ -110,8 +110,8 @@ const CheckInCheckOut = ({ modeldata, closeModal, handleSubmitForm }) => {
   }, [projectNames, projectId, loading]);
 
   return (
-    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+    <form className="row p-2" onSubmit={handleSubmit(onSubmit)}>
-      <div className="col-12 d-flex justify-content-center">
+      <div className="col-12 d-flex justify-content-center mt-2">
         <label className="fs-5 text-dark text-center">
           {modeldata?.checkInTime && !modeldata?.checkOutTime
             ? `Check out for ${currentProject?.name}`
@@ -220,7 +220,7 @@ export const Regularization = ({ modeldata, closeModal, handleSubmitForm }) => {
   };
 
   return (
-    <form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
+    <form className="row " onSubmit={handleSubmit(onSubmit)}>
       <div className="col-12 col-md-12">
         <p>Regularize Attendance</p>
         <label className="form-label" htmlFor="description">

src/pages/Directory/DirectoryPage.jsx

@@ -1,4 +1,3 @@
-
 import {
   useState,
   Suspense,
@@ -22,7 +21,13 @@ import ContactProfile from "../../components/Directory/ContactProfile";
 import GlobalModel from "../../components/common/GlobalModel";
 import ConfirmModal from "../../components/common/ConfirmModal";
 import { useSelectedProject } from "../../slices/apiDataManager";
-import { exportToCSV, exportToExcel, exportToPDF, exportToPDF1, printTable } from "../../utils/tableExportUtils";
+import {
+  exportToCSV,
+  exportToExcel,
+  exportToPDF,
+  exportToPDF1,
+  printTable,
+} from "../../utils/tableExportUtils";
 
 const NotesPage = lazy(() => import("./NotesPage"));
 const ContactsPage = lazy(() => import("./ContactsPage"));
@@ -80,10 +85,16 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
           exportToPDF1(exportData, "Notes");
         } else {
           // Columns for Contacts PDF
-        const columns = ["Email", "Phone", "Organization", "Category", "Tags"];
+          const columns = [
+            "Email",
+            "Phone",
+            "Organization",
+            "Category",
+            "Tags",
+          ];
 
           // Sanitize and trim long text to avoid PDF overflow
-        const sanitizedData = exportData.map(item => ({
+          const sanitizedData = exportData.map((item) => ({
             Email: (item.Email || "").slice(0, 40),
             Phone: (item.Phone || "").slice(0, 20),
             Organization: (item.Organization || "").slice(0, 30),
@@ -103,8 +114,7 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
       default:
         console.warn("Unsupported export type");
     }
-};
+  };
-
 
   const { data, isLoading, isError, error } = useBucketList();
 
@@ -173,7 +183,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" : ""
+                      className={`nav-link ${
+                        activeTab === "notes" ? "active" : ""
                       } fs-6`}
                       onClick={(e) => handleTabClick("notes", e)}
                     >
@@ -183,7 +194,8 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                   </li>
                   <li className="nav-item cursor-pointer">
                     <a
-                      className={`nav-link ${activeTab === "contacts" ? "active" : ""
+                      className={`nav-link ${
+                        activeTab === "contacts" ? "active" : ""
                       } fs-6`}
                       onClick={(e) => handleTabClick("contacts", e)}
                     >
@@ -216,16 +228,23 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                               value={searchContact}
                               onChange={(e) => setsearchContact(e.target.value)}
                             />
+                            <div className="d-none d-md-flex gap-2">
+                              {" "}
                               <button
-                              className={`btn btn-sm p-1 ${gridView ? " btn-primary" : " btn-outline-primary"
+                                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"
+                                className={`btn btn-sm p-1 ${
+                                  !gridView
+                                    ? "btn-primary"
+                                    : "btn-outline-primary"
                                 }`}
                                 onClick={() => setGridView(false)}
                               >
@@ -233,6 +252,7 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                               </button>
                             </div>
                           </div>
+                        </div>
                       )}
                     </div>
                     <div className="dropdown z-2">
@@ -246,7 +266,7 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                         <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" }}>
+                      <ul className="dropdown-menu dropdown-menu-end shadow-sm ">
                         {activeTab === "contacts" && (
                           <li className="dropdown-item d-flex align-items-center">
                             <div className="form-check form-switch mb-0">
@@ -256,30 +276,73 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
                                 role="switch"
                                 id="inactiveContactsSwitch"
                                 checked={showActive}
-                                onChange={(e) => setShowActive(e.target.checked)}
+                                onChange={(e) =>
+                                  setShowActive(e.target.checked)
+                                }
                               />
                             </div>
-                            <span>{showActive ? "Active Contacts" : "Inactive Contacts"}</span>
+                            <span>
+                              {showActive
+                                ? "Active Contacts"
+                                : "Inactive Contacts"}
+                            </span>
                           </li>
                         )}
                         <li>
-                          <button className="dropdown-item d-flex align-items-center gap-2" onClick={() => handleExport("csv")}>
+                          <button
-                            <i className="bx bx-file"></i><span>Export to CSV</span>
+                            className="dropdown-item d-flex align-items-center gap-2"
+                            onClick={() => handleExport("csv")}
+                          >
+                            <i className="bx bx-file"></i>
+                            <span>Export to CSV</span>
                           </button>
                         </li>
                         <li>
-                          <button className="dropdown-item d-flex align-items-center gap-2" onClick={() => handleExport("excel")}>
+                          <button
-                            <i className="bx bx-spreadsheet"></i><span>Export to Excel</span>
+                            className="dropdown-item d-flex align-items-center gap-2"
+                            onClick={() => handleExport("excel")}
+                          >
+                            <i className="bx bx-spreadsheet"></i>
+                            <span>Export to Excel</span>
                           </button>
                         </li>
                         <li>
-                          <button className="dropdown-item d-flex align-items-center gap-2" onClick={() => handleExport("pdf")}>
+                          <button
-                            <i className="bx bxs-file-pdf"></i><span>Export to PDF</span>
+                            className="dropdown-item d-flex align-items-center gap-2"
+                            onClick={() => handleExport("pdf")}
+                          >
+                            <i className="bx bxs-file-pdf"></i>
+                            <span>Export to PDF</span>
                           </button>
                         </li>
+                        <li className={`d-block d-md-none ${activeTab === "contacts" ? "d-block":"d-none"}`}>
+                          <span
+                            className={`dropdown-item  ${
+                              gridView ? " text-primary" : ""
+                            }`}
+                            onClick={() => setGridView(true)}
+                          >
+                            <i className="bx bx-grid-alt"></i> Card View
+                          </span>
+                        </li>
+
+                        <li className={` d-block d-md-none ${activeTab === "contacts" ? "d-block":"d-none"}`}>
+                          <span
+                            className={`dropdown-item  ${
+                              !gridView ? "text-primary" : ""
+                            }`}
+                            onClick={() => setGridView(false)}
+                          >
+                            <i className="bx bx-list-ul"></i> List View
+                          </span>
+                        </li>
 
                         {/* Divider */}
-                        {activeTab === "contacts" && <li><hr className="dropdown-divider" /></li>}
+                        {activeTab === "contacts" && (
+                          <li>
+                            <hr className="dropdown-divider" />
+                          </li>
+                        )}
                       </ul>
                     </div>
                   </div>