diff --git a/src/components/Activities/AttendcesLogs.jsx b/src/components/Activities/AttendcesLogs.jsx
index 71bc74b3..c42ce1ab 100644
--- a/src/components/Activities/AttendcesLogs.jsx
+++ b/src/components/Activities/AttendcesLogs.jsx
@@ -10,16 +10,17 @@ import { getCachedData } from "../../slices/apiDataManager";
 import usePagination from "../../hooks/usePagination";
 
 const AttendanceLog = ({ handleModalData, projectId }) => {
-  const [attendances, setAttendnaces] = useState([]);
-  const [selectedDate, setSelectedDate] = useState("");
   const [dateRange, setDateRange] = useState({ startDate: "", endDate: "" });
   const dispatch = useDispatch();
   const { data, loading, error } = useSelector((store) => store.attendanceLogs);
   const [isRefreshing, setIsRefreshing] = useState(true);
-  const [dates, setDates] = useState([]);
+  const [processedData, setProcessedData] = useState([]);
 
   const today = new Date();
-  today.setHours(0, 0, 0, 0); // Strip time to compare dates only
+  today.setHours(0, 0, 0, 0);
+
+  const yesterday = new Date();
+  yesterday.setDate(yesterday.getDate() - 1);
 
   const isSameDay = (dateStr) => {
     if (!dateStr) return false;
@@ -41,38 +42,6 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
     return nameA.localeCompare(nameB);
   };
 
-  const group1 = data
-    .filter((d) => d.activity === 1 && isSameDay(d.checkInTime))
-    .sort(sortByName);
-  const group2 = data
-    .filter((d) => d.activity === 4 && isSameDay(d.checkOutTime))
-    .sort(sortByName);
-  const group3 = data
-    .filter((d) => d.activity === 1 && isBeforeToday(d.checkInTime))
-    .sort(sortByName);
-  const group4 = data
-    .filter( ( d ) => d.activity === 4 && isBeforeToday( d.checkOutTime ) )
-    
-    const group5 = data
-    .filter((d) => d.activity === 2 && isBeforeToday(d.checkOutTime))
-    .sort(sortByName);
-  const group6 = data.filter((d) => d.activity === 5).sort(sortByName);
-
-  const sortedFinalList = [
-    ...group1,
-    ...group2,
-    ...group3,
-    ...group4,
-    ...group5,
-     ...group6,
-  ];
-
-  const currentDate = new Date().toLocaleDateString("en-CA");
-  const { currentPage, totalPages, currentItems, paginate } = usePagination(
-    sortedFinalList,
-    10
-  );
-
   useEffect(() => {
     const { startDate, endDate } = dateRange;
     if (startDate && endDate) {
@@ -87,14 +56,47 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
   }, [dateRange, projectId, isRefreshing]);
 
   useEffect(() => {
-    const attendanceDate = [
-      ...new Set(sortedFinalList.map((item) => item.checkInTime.split("T")[0])),
-    ].sort((a, b) => new Date(b) - new Date(a));
-    if (attendanceDate != dates) {
-      setDates(attendanceDate);
-    }
+    const group1 = data
+      .filter((d) => d.activity === 1 && isSameDay(d.checkInTime))
+      .sort(sortByName);
+    const group2 = data
+      .filter((d) => d.activity === 4 && isSameDay(d.checkOutTime))
+      .sort(sortByName);
+    const group3 = data
+      .filter((d) => d.activity === 1 && isBeforeToday(d.checkInTime))
+      .sort(sortByName);
+    const group4 = data
+      .filter((d) => d.activity === 4 && isBeforeToday(d.checkOutTime));
+    const group5 = data
+      .filter((d) => d.activity === 2 && isBeforeToday(d.checkOutTime))
+      .sort(sortByName);
+    const group6 = data.filter((d) => d.activity === 5).sort(sortByName);
+
+    const sortedList = [...group1, ...group2, ...group3, ...group4, ...group5, ...group6];
+
+    // Group by date
+    const groupedByDate = sortedList.reduce((acc, item) => {
+      const date = (item.checkInTime || item.checkOutTime)?.split("T")[0];
+      if (date) {
+        acc[date] = acc[date] || [];
+        acc[date].push(item);
+      }
+      return acc;
+    }, {});
+
+    // Sort dates in descending order
+    const sortedDates = Object.keys(groupedByDate).sort((a, b) => new Date(b) - new Date(a));
+
+    // Create the final sorted array
+    const finalData = sortedDates.flatMap((date) => groupedByDate[date]);
+    setProcessedData(finalData);
   }, [data]);
 
+  const { currentPage, totalPages, currentItems: paginatedAttendances, paginate } = usePagination(
+    processedData,
+    10
+  );
+
   return (
     <>
       <div
@@ -102,13 +104,12 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
         id="DataTables_Table_0_length"
       >
         <div className="col-md-3 my-0 ">
-          <DateRangePicker onRangeChange={setDateRange} />
+          <DateRangePicker onRangeChange={setDateRange} defaultStartDate={yesterday} />
         </div>
         <div className="col-md-2 m-0 text-end">
           <i
-            className={`bx bx-refresh cursor-pointer fs-4 ${
-              loading ? "spin" : ""
-            }`}
+            className={`bx bx-refresh cursor-pointer fs-4 ${loading ? "spin" : ""
+              }`}
             title="Refresh"
             onClick={() => setIsRefreshing(!isRefreshing)}
           />
@@ -124,8 +125,7 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
                 </th>
                 <th className="border-top-1">Date</th>
                 <th>
-                  <i className="bx bxs-down-arrow-alt text-success"></i>{" "}
-                  Check-In
+                  <i className="bx bxs-down-arrow-alt text-success"></i> Check-In
                 </th>
                 <th>
                   <i className="bx bxs-up-arrow-alt text-danger"></i> Check-Out
@@ -135,106 +135,87 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
             </thead>
             <tbody>
               {loading && <td colSpan={5}>Loading...</td>}
-              {dates.map((date, i) => {
-                return (
-                  <React.Fragment key={i}>
-                    {currentItems.some(
-                      (item) => item.checkInTime.split("T")[0] === date
-                    ) && (
-                      <tr className="table-row-header">
-                        <td colSpan={7} className="text-start">
-                          <strong>{date}</strong>
-                        </td>
-                      </tr>
-                    )}
-                    {currentItems
-                      ?.filter((item) => item.checkInTime.includes(date))
-                      .map((attendance, index) => (
-                        <tr key={index}>
-                          <td colSpan={2}>
-                            <div className="d-flex justify-content-start align-items-center">
-                              <Avatar
-                                firstName={attendance.firstName}
-                                lastName={attendance.lastName}
-                              />
-                              <div className="d-flex flex-column">
-                                <a
-                                  href="#"
-                                  className="text-heading text-truncate"
-                                >
-                                  <span className="fw-normal">
-                                    {attendance.firstName} {attendance.lastName}
-                                  </span>
-                                </a>
-                              </div>
-                            </div>
-                          </td>
-                          <td>
-                            {" "}
-                            {moment(attendance.checkInTime).format(
-                              "DD-MMM-YYYY"
-                            )}
-                          </td>
-                          <td>{convertShortTime(attendance.checkInTime)}</td>
-                          <td>
-                            {attendance.checkOutTime
-                              ? convertShortTime(attendance.checkOutTime)
-                              : "--"}
-                          </td>
-                          <td className="text-center">
-                            <RenderAttendanceStatus
-                              attendanceData={attendance}
-                              handleModalData={handleModalData}
-                              Tab={2}
-                              currentDate={currentDate}
-                            />
-                          </td>
-                        </tr>
-                      ))}
-                  </React.Fragment>
+              {paginatedAttendances.reduce((acc, attendance, index, arr) => {
+                const currentDate = moment(attendance.checkInTime || attendance.checkOutTime).format("YYYY-MM-DD");
+                const previousAttendance = arr[index - 1];
+                const previousDate = previousAttendance ? moment(previousAttendance.checkInTime || previousAttendance.checkOutTime).format("YYYY-MM-DD") : null;
+
+                if (!previousDate || currentDate !== previousDate) {
+                  acc.push(
+                    <tr key={`header-${currentDate}`} className="table-row-header">
+                      <td colSpan={6} className="text-start">
+                        <strong>{moment(currentDate).format("YYYY-MM-DD")}</strong>
+                      </td>
+                    </tr>
+                  );
+                }
+                acc.push(
+                  <tr key={index}>
+                    <td colSpan={2}>
+                      <div className="d-flex justify-content-start align-items-center">
+                        <Avatar
+                          firstName={attendance.firstName}
+                          lastName={attendance.lastName}
+                        />
+                        <div className="d-flex flex-column">
+                          <a
+                            href="#"
+                            className="text-heading text-truncate"
+                          >
+                            <span className="fw-normal">
+                              {attendance.firstName} {attendance.lastName}
+                            </span>
+                          </a>
+                        </div>
+                      </div>
+                    </td>
+                    <td>
+                      {moment(attendance.checkInTime || attendance.checkOutTime).format("DD-MMM-YYYY")}
+                    </td>
+                    <td>{convertShortTime(attendance.checkInTime)}</td>
+                    <td>
+                      {attendance.checkOutTime ? convertShortTime(attendance.checkOutTime) : "--"}
+                    </td>
+                    <td className="text-center">
+                      <RenderAttendanceStatus
+                        attendanceData={attendance}
+                        handleModalData={handleModalData}
+                        Tab={2}
+                        currentDate={today.toLocaleDateString("en-CA")}
+                      />
+                    </td>
+                  </tr>
                 );
-              })}
+                return acc;
+              }, [])}
             </tbody>
           </table>
         )}
         {!loading && data.length === 0 && <span>No employee logs</span>}
-        {error && <td colSpan={5}>{error}</td>}
+        {error && <td colSpan={6}>{error}</td>}
       </div>
-      {!loading && (
+      {!loading && processedData.length > 10 && (
         <nav aria-label="Page ">
           <ul className="pagination pagination-sm justify-content-end py-1">
-            <li className={`page-item  ${currentPage === 1 ? "disabled" : ""}`}>
-              <button
-                className="page-link btn-xs"
-                onClick={() => paginate(currentPage - 1)}
-              >
+            <li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
+              <button className="page-link btn-xs" onClick={() => paginate(currentPage - 1)}>
                 &laquo;
               </button>
             </li>
-            {[...Array(totalPages)].map((_, index) => (
+            {Array.from({ length: totalPages }, (_, i) => i + 1).map((pageNumber) => (
               <li
-                key={index}
-                className={`page-item ${
-                  currentPage === index + 1 ? "active" : ""
-                }`}
+                key={pageNumber}
+                className={`page-item ${currentPage === pageNumber ? "active" : ""}`}
               >
-                <button
-                  className="page-link "
-                  onClick={() => paginate(index + 1)}
-                >
-                  {index + 1}
+                <button className="page-link" onClick={() => paginate(pageNumber)}>
+                  {pageNumber}
                 </button>
               </li>
             ))}
             <li
-              className={`page-item ${
-                currentPage === totalPages ? "disabled" : ""
-              }`}
+              className={`page-item ${currentPage === totalPages ? "disabled" : ""}`}
             >
-              <button
-                className="page-link "
-                onClick={() => paginate(currentPage + 1)}
-              >
+              <button className="page-link" onClick={() => paginate(currentPage + 1)}>
                 &raquo;
               </button>
             </li>
@@ -245,4 +226,4 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
   );
 };
 
-export default AttendanceLog;
+export default AttendanceLog;
\ No newline at end of file
diff --git a/src/components/common/DateRangePicker.jsx b/src/components/common/DateRangePicker.jsx
index 33352ba5..a9e0577c 100644
--- a/src/components/common/DateRangePicker.jsx
+++ b/src/components/common/DateRangePicker.jsx
@@ -1,10 +1,10 @@
 import React, { useEffect, useRef } from "react";
 
-const DateRangePicker = ({ onRangeChange, DateDifference = 15 }) => {
+const DateRangePicker = ({ onRangeChange, DateDifference = 7,defaultStartDate = new Date() -1 }) => {
   const inputRef = useRef(null);
 
   useEffect(() => {
-    const today = new Date();
+    const today = defaultStartDate;
     const fifteenDaysAgo = new Date();
     fifteenDaysAgo.setDate(today.getDate() - DateDifference);