Ucalgary_Baja/BajaUofCWebsite
4
0
Fork 0
mirror of https://github.com/UofCBaja/BajaUofCWebsite.git synced 2025-06-15 13:24:17 -06:00
Code Issues Packages Projects Releases Wiki Activity

feat(TimeSlotSelector): Mapped out time slot buttons.

Browse Source
This commit is contained in:
ahmad.ahmad1 2025-02-01 16:01:19 -07:00
parent 6cbd1cc4f5
commit 583be5dcd2
1 changed files with 24 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/Interivew Booking/TimeSlotSelector.jsx
View File

@ -36,7 +36,7 @@ const TimeSlotSelector = ({ onTimeSlotSelect }) => {
};
const handleTimeSlotChange = (e) => {
let startTime = e.target.value;
let startTime = e.target.innerHTML;
onTimeSlotSelect((prev) => ({ ...prev, startTime }));
};
@ -53,17 +53,30 @@ const TimeSlotSelector = ({ onTimeSlotSelect }) => {
) : (
<>
<h4>Available Time Slots for {selectedDate}:</h4>
{timeSlots.length > 0 ? (
<select onChange={handleTimeSlotChange}>
<option value="">Select a time slot</option>
{timeSlots.map((time, index) => (
<option key={index} value={time}>
{time}
</option>
))}
</select>
{selectedDate === undefined ? (
<>
<p>Please select a date.</p>
</>
) : timeSlots.length > 0 ? (
<>
{Object.values(timeSlots).map((time) => {
return (
<button
key={time}
onClick={(self) => {
console.log(self.target.innerHTML);
handleTimeSlotChange(self);
}}
>
{time}
</button>
);
})}
</>
) : (
<p>No available time slots for the selected date.</p>
<>
<p>No available time slots for the selected date.</p>
</>
)}
</>
)}