Initial microslots implementation

This commit is contained in:
Vencislav Atanasov 2024-09-26 21:19:27 +03:00
parent 01f29b80c5
commit 277e3a215b
1 changed files with 41 additions and 25 deletions

View File

@ -15,6 +15,10 @@ export default function useScheduleTable({
const days = Array.from(new Set(filteredSlots.map(slot => const days = Array.from(new Set(filteredSlots.map(slot =>
getMidnightTimestamp(slot.starts_at) getMidnightTimestamp(slot.starts_at)
))).map(ts => new Date(ts)); ))).map(ts => new Date(ts));
const microslots = Array.from(new Set(filteredSlots.flatMap(slot => [
slot.starts_at.getTime(),
slot.ends_at.getTime(),
]))).map(ts => new Date(ts)).sort();
const filteredHallIds = new Set(filteredSlots.map(slot => slot.hall_id)); const filteredHallIds = new Set(filteredSlots.map(slot => slot.hall_id));
const filteredHalls = halls.filter(hall => filteredHallIds.has(hall.id)); const filteredHalls = halls.filter(hall => filteredHallIds.has(hall.id));
const hallSlots = Object.fromEntries(filteredHalls.map(hall => [ const hallSlots = Object.fromEntries(filteredHalls.map(hall => [
@ -31,31 +35,43 @@ export default function useScheduleTable({
}, },
...filteredHalls, ...filteredHalls,
]; ];
const rows = days.flatMap(day => [{
id: 'header-'.concat(day.getTime().toString()), const rows = microslots.flatMap((date, index, array) => {
cells: [{ const isFirst = index === 0;
id: 1, const isLast = index === array.length - 1;
attributes: { const isFirstForTheDay = index > 0 && !isSameDay(date, array[index - 1]);
colSpan: header.length, const isLastForTheDay = array?.[index + 1] && !isSameDay(date, array[index + 1]);
},
day, const showHeader = isFirst || isFirstForTheDay;
}] const showSlot = !isLast && !isLastForTheDay;
},
...filteredSlots.filter(slot => isSameDay(slot.starts_at, day)).map(slot => ({ return [
id: slot.id, ...showHeader ? [{
cells: [{ id: 'header-'.concat(date.getTime().toString()),
id: 1, cells: [{
day, // TODO replace with slot time id: 1,
}, { attributes: {
id: 2, colSpan: header.length,
attributes: { },
className: 'schedule-'.concat(slot.event.language).concat(' ').concat(slot.event.track?.css_class), day: date,
colSpan: 2, }]
}, }] : [],
event: slot.event, ...showSlot ? [{
}], id: 'slot-'.concat(date.getTime().toString()),
})) cells: [{
]); id: 1,
day: date, // TODO replace with slot time
}, {
id: 2,
}],
// attributes: {
// className: 'schedule-'.concat(slot.event.language).concat(' ').concat(slot.event.track?.css_class),
// colSpan: 2,
// },
// event: slot.event,
}] : [],
];
});
return { return {
header, header,