diff --git a/src/Schedule/Schedule.jsx b/src/Schedule/Schedule.jsx index ddde193..8871f22 100644 --- a/src/Schedule/Schedule.jsx +++ b/src/Schedule/Schedule.jsx @@ -1,7 +1,7 @@ import PropTypes from 'prop-types'; import useSchedule from '../hooks/useSchedule.js'; import { getSpeakerName, isTrackHidden } from './utils.js'; -import { Fragment } from 'react'; +import { Fragment, useState } from 'react'; import useScheduleTable from '../hooks/useScheduleTable.js'; import Event from './Event.jsx'; import defaultSpeaker from '../assets/default-speaker.png'; @@ -17,6 +17,7 @@ export default function Schedule({ const { speakers, tracks, + eventTypes, halls, events, slots, @@ -25,25 +26,32 @@ export default function Schedule({ isComplete, } = useSchedule(conferenceId); + const [eventTypeId, setEventTypeId] = useState(0); + const { header, rows, } = useScheduleTable({ - tracks, + eventTypeId, halls, events, slots, }); return (<> + {isComplete && } {isLoading && } {isComplete &&
-
+
- - {header.map(hall => )} - + + {header.map(hall => )} + {rows.map(row => diff --git a/src/hooks/useScheduleTable.js b/src/hooks/useScheduleTable.js index 2032ea1..9b60b72 100644 --- a/src/hooks/useScheduleTable.js +++ b/src/hooks/useScheduleTable.js @@ -1,10 +1,17 @@ -export default function useScheduleTable({ - events = {}, - halls = {}, -}) { - const header = Object.values(halls); +import { useMemo } from 'react'; - const rows = Object.values(events).map(event => ({ +export default function useScheduleTable({ + eventTypeId, + halls = {}, + events = {}, + slots = {}, +}) { + const filteredEvents = useMemo(() => Object.values(events).filter(event => eventTypeId > 0 ? event.event_type_id === eventTypeId : true), [eventTypeId, events]); + const filteredEventIds = useMemo(() => new Set(filteredEvents.map(event => event.id)), [filteredEvents]); + const filteredHallIds = useMemo(() => new Set(Object.values(slots).filter(slot => filteredEventIds.has(slot.event_id)).map(slot => slot.hall_id)), [filteredEventIds, slots]); + const header = useMemo(() => Object.values(halls).filter(hall => filteredHallIds.has(hall.id)), [filteredHallIds, halls]); + + const rows = filteredEvents.map(event => ({ id: event.id, cells: [{ id: 1,
{hall.name[lang]}
{hall.name[lang]}