remix-utils/build/react/use-event-source.js

This package contains simple utility functions to use with [React Router](https://reactrouter.com/).

import { createContext, useContext, useEffect, useState } from "react";
const context = createContext(new Map());
export const EventSourceProvider = context.Provider;
/**
 * Subscribe to an event source and return the latest event.
 * @param url The URL of the event source to connect to
 * @param options The options to pass to the EventSource constructor
 * @returns The last event received from the server
 */
export function useEventSource(url, { event = "message", init, enabled = true } = {}) {
    let map = useContext(context);
    let [data, setData] = useState(null);
    useEffect(() => {
        if (!enabled) {
            return undefined;
        }
        let key = [url.toString(), init?.withCredentials].join("::");
        let value = map.get(key) ?? {
            count: 0,
            source: new EventSource(url, init),
        };
        ++value.count;
        map.set(key, value);
        value.source.addEventListener(event, handler);
        // rest data if dependencies change
        setData(null);
        function handler(event) {
            setData(event.data || "UNKNOWN_EVENT_DATA");
        }
        return () => {
            value.source.removeEventListener(event, handler);
            --value.count;
            if (value.count <= 0) {
                value.source.close();
                map.delete(key);
            }
        };
    }, [url, event, init, map, enabled]);
    return data;
}
//# sourceMappingURL=use-event-source.js.map