From 83957f0570a8e1c9cf939898dee167fececaa06d Mon Sep 17 00:00:00 2001 From: Manas <88604968+manaspros@users.noreply.github.com> Date: Wed, 8 Jan 2025 17:17:48 +0530 Subject: [PATCH] Enhance AttendanceScreen functionality: update date selection logic, add previous date color tracking, and improve UI for skipped dates --- src/screens/AttendanceScreen.js | 60 +++++++++++++++++++++++++++-- src/store/course-schedule-notime.js | 12 +++--- src/store/course-schedule.js | 14 ++++--- 3 files changed, 70 insertions(+), 16 deletions(-) diff --git a/src/screens/AttendanceScreen.js b/src/screens/AttendanceScreen.js index f32b711..874a381 100644 --- a/src/screens/AttendanceScreen.js +++ b/src/screens/AttendanceScreen.js @@ -161,17 +161,60 @@ const AttendanceScreen = ({ navigation }) => { setMarkedDates(newMarkedDates); }; + const [previousDateColor, setPreviousDateColor] = useState({}); + const handleDateSelect = (date) => { - const dayOfWeek = getDayOfWeek(date.dateString); + const { dateString } = date; + const dayOfWeek = getDayOfWeek(dateString); + if ( courseSchedules[course]?.[dayOfWeek] && - !courseHolidays[course]?.includes(date.dateString) + !courseHolidays[course]?.includes(dateString) ) { - setSelectedDate(date.dateString); + // Update the previous date color + if (selectedDate) { + setMarkedDates((prev) => ({ + ...prev, + [selectedDate]: { + ...prev[selectedDate], + customStyles: { + ...prev[selectedDate]?.customStyles, + container: { + backgroundColor: previousDateColor[selectedDate] || "white", + }, + }, + }, + })); + } + + setPreviousDateColor((prev) => ({ + ...prev, + [dateString]: + markedDates[dateString]?.customStyles?.container?.backgroundColor || + "white", + })); + + // Change the new date color to blue + setMarkedDates((prev) => ({ + ...prev, + [dateString]: { + ...prev[dateString], + customStyles: { + ...prev[dateString]?.customStyles, + container: { + backgroundColor: "blue", + }, + }, + }, + })); + + // Set the newly selected date + setSelectedDate(dateString); } else { Alert.alert("No classes scheduled or holiday on this day."); } }; + const handleMarkAllClasses = async (status) => { if (!selectedDate) { Alert.alert("Please select a valid date."); @@ -479,6 +522,9 @@ const AttendanceScreen = ({ navigation }) => { Holiday + + Skipped + @@ -570,7 +616,7 @@ const styles = StyleSheet.create({ legendItem: { flexDirection: "row", alignItems: "center", - marginBottom: 2, + marginBottom: 0.5, }, oneClass: { width: 15, @@ -602,6 +648,12 @@ const styles = StyleSheet.create({ backgroundColor: "gray", borderRadius: 5, }, + black: { + width: 15, + height: 15, + backgroundColor: "black", + borderRadius: 5, + }, floatingButtons: { flexDirection: "row", justifyContent: "space-between", diff --git a/src/store/course-schedule-notime.js b/src/store/course-schedule-notime.js index d334a8a..df66718 100644 --- a/src/store/course-schedule-notime.js +++ b/src/store/course-schedule-notime.js @@ -2,30 +2,30 @@ const courseSchedules = { "Introduction to IoT": { startDate: "2025-01-03", Thursday: 1, - Friday: 1, + Friday: 2, endDate: "2025-05-21", }, "Design &Prototyping": { startDate: "2025-01-02", Wednesday: 1, - Thursday: 1, + Thursday: 2, endDate: "2025-05-21", }, "3D Printing": { startDate: "2025-01-03", - Monday: 1, + Monday: 2, Wednesday: 1, endDate: "2025-05-21", }, "Introduction to AI and ML": { startDate: "2025-01-03", - Monday: 2, + Monday: 3, endDate: "2025-05-21", }, "Communication and Discourse Strategies": { startDate: "2025-01-03", Tuesday: 1, - Friday: 1, + Friday: 2, endDate: "2025-05-21", }, Calculus: { @@ -44,7 +44,7 @@ const courseSchedules = { startDate: "2025-01-03", Monday: 2, Wednesday: 1, - Thursday: 1, + Thursday: 2, Friday: 1, endDate: "2025-02-24", }, diff --git a/src/store/course-schedule.js b/src/store/course-schedule.js index 66cba54..c0588e1 100644 --- a/src/store/course-schedule.js +++ b/src/store/course-schedule.js @@ -2,24 +2,24 @@ const courseSchedules = { "Introduction to IoT": { startDate: "2025-01-03", Thursday: { period: 1, time: "12:00 PM - 1:00 PM" }, - Friday: { period: 2, time: "9:00 AM - 11:00 AM" }, + Friday: { period: 1, time: "9:00 AM - 11:00 AM" }, endDate: "2025-05-21", }, "Design &Prototyping": { startDate: "2025-01-02", Wednesday: { period: 1, time: "10:00 AM - 11:00 AM" }, - Thursday: { period: 2, time: "9:00 AM - 11:00 AM" }, + Thursday: { period: 1, time: "9:00 AM - 11:00 AM" }, endDate: "2025-05-21", }, "3D Printing": { startDate: "2025-01-03", - Monday: { period: 2, time: "4:00 PM - 6:00 PM" }, + Monday: { period: 1, time: "4:00 PM - 6:00 PM" }, Wednesday: { period: 1, time: "12:00 PM - 1:00 PM" }, endDate: "2025-05-21", }, "Introduction to AI and ML": { startDate: "2025-01-03", - Monday: { period: 3, time: "2:00 PM - 4:00 PM \n 10:00 AM - 11:00 AM" }, + Monday: { period: 2, time: "2:00 PM - 4:00 PM \n 10:00 AM - 11:00 AM" }, endDate: "2025-05-21", }, "Communication and Discourse Strategies": { @@ -44,7 +44,7 @@ const courseSchedules = { startDate: "2025-01-03", Monday: { period: 2, time: "11:00 AM - 1:00 PM" }, Wednesday: { period: 1, time: "9:00 AM - 10:00 AM" }, - Thursday: { period: 2, time: "2:00 PM - 4:00 PM" }, + Thursday: { period: 1, time: "2:00 PM - 4:00 PM" }, Friday: { period: 1, time: "11:00 AM - 12:00 PM" }, endDate: "2025-02-27", }, @@ -115,7 +115,9 @@ const courseSchedules = { "Optimization Techniques(CSE) 1st Half": { startDate: "2025-01-03", Monday: { period: 1, time: "3:00 PM - 4:00 PM" }, - Wednesday: { period: 2, time: "9:00 AM - 11:00 AM" }, + Tuesday: { period: 2, time: "2:00 PM - 4:00 PM" }, + Wednesday: { period: 2, time: "2:00 PM - 4:00 PM" }, + Thursday: { period: 1, time: "11:00 AM - 12:00 PM" }, endDate: "2025-02-27", }, "Object Oriented Programming(CSE) 2nd Half": {