**I have a list of appointment time that I am getting from the database, I want to check if the array below i.e time3 contains any appointment time then I disable that time on the client side , but the problem is when ı use conditionals in reactjs its disables all the times **
const time3 = [
["08:00", "08:10", "08:20", "08:30", "08:40", "08:50"],
["09:00", "09:10", "09:20", "09:30", "09:40", "09:50"],
["10:00", "10:10", "10:20", "10:30", "10:40", "10:50"],
["11:00", "11:10", "11:20", "11:30", "11:40", "11:50"],
["12:00", "12:10", "12:20", "12:30", "12:40", "12:50"],
["13:00", "13:10", "13:20", "13:30", "13:40", "13:50"],
["14:00", "14:10", "14:20", "14:30", "14:40", "14:50"],
["15:00", "15:10", "15:20", "15:30", "15:40", "15:50"],
["16:00", "16:10", "16:20", "16:30", "16:40", "16:50"],
["17:00", "17:10", "17:20", "17:30", "17:40", "17:50"],
["18:00", "18:10", "18:20", "18:30", "18:40", "18:50"]
]
let timeArrayList = []
time3.map((timesArray) => {
return timesArray.map((time) => {
return timeArrayList.push(time)
})
})
This is what I am rendering
{
time3.map((time, i) => {
return (
<Panel header={time[0]}>
{time.map((t, i) => {
return (
<>
<button
key={i}
value={t}
disabled={timeArrayList.includes(t) ? true : false}
>
{t}
</button>
</>
);
})}
</Panel>
);
});
}
All the array elements are being disabled can you help , I am also open to refactoring the code especially the array to make it muuch more easier for me to access the elements