Somehow working schedule table

This commit is contained in:
Vencislav Atanasov 2024-09-28 21:41:02 +03:00
parent 3d4e0faf60
commit 477ea115e8
1 changed files with 35 additions and 17 deletions

View File

@ -1,7 +1,7 @@
import { useMemo } from 'react'; import { useMemo } from 'react';
import { sorter, toMidnight } from '../utils.js'; import { sorter, toMidnight } from '../utils.js';
import { langs } from '../Schedule/constants.js'; import { langs } from '../Schedule/constants.js';
import { getTime, isSameDay, toDate } from 'date-fns'; import { compareAsc, getTime, isSameDay, toDate } from 'date-fns';
export default function useScheduleTable({ export default function useScheduleTable({
eventTypeId, eventTypeId,
@ -42,8 +42,30 @@ export default function useScheduleTable({
const isFirstForTheDay = index > 0 && !isSameDay(date, array[index - 1]); const isFirstForTheDay = index > 0 && !isSameDay(date, array[index - 1]);
const isLastForTheDay = array?.[index + 1] && !isSameDay(date, array[index + 1]); const isLastForTheDay = array?.[index + 1] && !isSameDay(date, array[index + 1]);
const eventCells = filteredHalls.map(hall => {
const slot = filteredSlots.find(slot =>
slot.hall_id === hall.id &&
compareAsc(slot.starts_at, date) === 0
);
if (!slot) {
return {
id: 'blank-'.concat(hall.id),
};
}
return {
id: 'slot-'.concat(slot.id),
attributes: {
className: 'schedule-'.concat(slot.event.language).concat(' ').concat(slot.event.track?.css_class),
},
event: slot.event,
};
});
const isEmptyRow = !eventCells.find(slot => !!slot.event);
const showHeader = isFirst || isFirstForTheDay; const showHeader = isFirst || isFirstForTheDay;
const showSlot = !isLast && !isLastForTheDay; const showSlot = !isLast && !isLastForTheDay && !isEmptyRow;
return [ return [
...showHeader ? [{ ...showHeader ? [{
@ -57,21 +79,17 @@ export default function useScheduleTable({
}], }],
}] : [], }] : [],
...showSlot ? [{ ...showSlot ? [{
id: 'slot-'.concat(getTime(date).toString()), id: 'row-'.concat(getTime(date).toString()),
cells: [{ cells: [
id: 'timeslot', {
timeSlot: { id: 'timeslot',
start: date, timeSlot: {
end: nextDate, start: date,
} end: nextDate,
}, { }
id: 2, },
// attributes: { ...eventCells,
// className: 'schedule-'.concat(slot.event.language).concat(' ').concat(slot.event.track?.css_class), ],
// colSpan: 2,
// },
// event: slot.event,
}],
}] : [], }] : [],
]; ];
}); });