import type { Schedule } from '~/shared/types/schedule'; let source: EventSource | null = null; let sourceRefs = 0; export const useSchedule = () => { const asyncData = useAsyncData( 'schedule', () => $fetch("/api/schedule"), { default: () => ({ events: [], locations: [] }) }, ) const { data: schedule } = asyncData; onMounted(() => { console.log("useSchedule onMounted", sourceRefs); sourceRefs += 1; if (sourceRefs !== 1) { console.log("Event source already open"); return; } console.log("Opening event source"); source = new EventSource("/api/events"); source.addEventListener("message", (message) => { console.log("Message", message.data); }); source.addEventListener("update", (message) => { const updatedSchedule: Schedule = JSON.parse(message.data); console.log("Update", updatedSchedule); schedule.value = updatedSchedule; }); }) onUnmounted(() => { console.log("useSchedule onUnmounted", sourceRefs); sourceRefs -= 1; if (source && sourceRefs === 0) { console.log("Closing event source") source.close(); source = null; } if (sourceRefs < 0) { throw Error("Source reference count below zero"); } }); return asyncData.then(({ data }) => data); }