Complete punchin and punchout operations UserPunchin.jsx module
[ ] On click of the punchin button, punchin data should be written to the attendance collection in Firestore
[ ] On component mount, fetch the attendance record for the current day from Firestore.
[ ] Use this data to maintain the attendance state. If there is an existing punch-in time for the day, set the state accordingly to reflect that the user is punched in. Ensure the component reflects the correct punch-in/punch-out status and total duration for the day.
Complete punchin and punchout operations
UserPunchin.jsxmoduleattendancecollection in Firestore