diff --git a/apps/antalmanac/src/components/Map/Map.tsx b/apps/antalmanac/src/components/Map/Map.tsx index bc4d493d5..4516c7ef3 100644 --- a/apps/antalmanac/src/components/Map/Map.tsx +++ b/apps/antalmanac/src/components/Map/Map.tsx @@ -148,7 +148,7 @@ export default function CourseMap() { const [searchParams] = useSearchParams(); const [selectedDayIndex, setSelectedDay] = useState(0); const [markers, setMarkers] = useState(getCoursesPerBuilding()); - const [customEventMarkers] = useState(getCustomEventPerBuilding()); + const [customEventMarkers, setCustomEventMarkers] = useState(getCustomEventPerBuilding()); const [calendarEvents, setCalendarEvents] = useState(AppStore.getCourseEventsInCalendar()); useEffect(() => { @@ -181,6 +181,20 @@ export default function CourseMap() { }; }, []); + useEffect(() => { + const updateCustomEventMarkers = () => { + setCustomEventMarkers(getCustomEventPerBuilding()); + }; + + AppStore.on('customEventsChange', updateCustomEventMarkers); + AppStore.on('currentScheduleIndexChange', updateCustomEventMarkers); + + return () => { + AppStore.removeListener('customEventsChange', updateCustomEventMarkers); + AppStore.removeListener('currentScheduleIndexChange', updateCustomEventMarkers); + }; + }, []); + useEffect(() => { const locationID = Number(searchParams.get('location') ?? 0); const building = locationID in buildingCatalogue ? buildingCatalogue[locationID] : undefined; @@ -275,16 +289,13 @@ export default function CourseMap() { */ const startDestPairs = useMemo(() => { const allEvents = [...markersToDisplay, ...customEventMarkersToDisplay]; - return allEvents.reduce( - (acc, cur, index) => { - acc.push([cur]); - if (index > 0) { - acc[index - 1].push(cur); - } - return acc; - }, - [] as (typeof allEvents)[] - ); + return allEvents.reduce((acc, cur, index) => { + acc.push([cur]); + if (index > 0) { + acc[index - 1].push(cur); + } + return acc; + }, [] as (typeof allEvents)[]); }, [markersToDisplay, customEventMarkersToDisplay]); return (