diff --git a/src/components/Activities/AttendcesLogs.jsx b/src/components/Activities/AttendcesLogs.jsx index 50da1262..6d59d320 100644 --- a/src/components/Activities/AttendcesLogs.jsx +++ b/src/components/Activities/AttendcesLogs.jsx @@ -4,7 +4,7 @@ import Avatar from "../common/Avatar"; import { convertShortTime } from "../../utils/dateUtils"; import RenderAttendanceStatus from "./RenderAttendanceStatus"; import { useSelector, useDispatch } from "react-redux"; -import { fetchAttendanceData, setAttendanceData } from "../../slices/apiSlice/attedanceLogsSlice"; // Corrected typo: atttendanceLogsSlice to attedanceLogsSlice +import { fetchAttendanceData, setAttendanceData } from "../../slices/apiSlice/attedanceLogsSlice"; import DateRangePicker from "../common/DateRangePicker"; import eventBus from "../../services/eventBus"; @@ -36,7 +36,7 @@ const usePagination = (data, itemsPerPage) => { totalPages: maxPage, currentItems, paginate, - resetPage, // Ensure resetPage is returned here + resetPage, }; }; @@ -182,10 +182,10 @@ const AttendanceLog = ({ resetPage, // Destructure resetPage here } = usePagination(processedData, 20); - // Effect to reset pagination when search query or showOnlyCheckout changes + // Effect to reset pagination when search query changes useEffect(() => { resetPage(); - }, [searchQuery, showOnlyCheckout, resetPage]); // Add resetPage to dependencies + }, [searchQuery, resetPage]); // Add resetPage to dependencies const handler = useCallback( (msg) => { @@ -196,8 +196,7 @@ const AttendanceLog = ({ startDate <= checkIn && checkIn <= endDate ) { - // Create a new array to avoid direct mutation of Redux state data - const updatedAttendance = attendanceLogsData.map((item) => // Use attendanceLogsData + const updatedAttendance = data.map((item) => item.id === msg.response.id ? { ...item, ...msg.response } : item @@ -205,7 +204,7 @@ const AttendanceLog = ({ dispatch(setAttendanceData(updatedAttendance)); // Update Redux store } }, - [projectId, dateRange, attendanceLogsData, dispatch] // Added attendanceLogsData to dependencies + [projectId, dateRange, data, dispatch] ); useEffect(() => {