gemi 0.128.0 → 0.129.0

package/dist/client/index.js

@@ -1,4 +1,4 @@
-import { $ as retryDelayFor, A as useLocation, B as getRealtimeClient, C as useRoute, D as I18nProvider, E as I18nContext, G as QueryConfigContext, H as SOCKET_ID_HEADER, I as RealtimeContext, J as USER_QUERY_CONFIG_KEYS, K as QueryManagerContext, L as channelKey, M as isAbsoluteUrl, O as ServerDataContext, P as Action, Q as parseRetryAfter, R as configureRealtime, S as routeDataUrl, T as useNavigate, U as toVariantKey, V as reconnectRealtime, W as applyParams$1, X as DEFAULT_STALE_TIME, Y as pickDefined, Z as isRetryableQueryError, _ as loadDictionary, a as useRouteTransition, b as setActiveLocale, c as ComponentsContext, d as loadViewModule, et as shouldRetryQuery, f as subscribeViewModules, g as recoverFromChunkLoadError, h as isChunkLoadError, i as RouteTransitionProvider, j as domainUrl, k as ServerDataProvider, l as ComponentsProvider, m as configureChunkLoadRecovery, n as useTheme, nt as Subject, o as ClientRouterContext, p as CHUNK_RELOAD_MARKER, q as QueryManagerProvider, r as m, s as ClientRouterProvider, t as ThemeProvider, tt as QueryError, u as initialViewModulesReady, v as loadDictionaryForRender, w as useSearchParams, x as readRoutePayload, y as registerDictionary, z as currentSocketId } from "../chunks/ThemeProvider-BIrCSrFY.js";
+import { $ as DEFAULT_STALE_TIME, A as ServerDataContext, B as configureRealtime, C as readRoutePayload, D as useNavigate, E as useSearchParams, G as reconnectRealtime, H as followLive, I as Action, J as QueryConfigContext, K as toVariantKey, M as useLocation, N as domainUrl, O as I18nContext, P as isAbsoluteUrl, Q as pickDefined, R as RealtimeContext, S as setActiveLocale, T as useRoute, U as loadedModule, V as currentSocketId, X as QueryManagerProvider, Y as QueryManagerContext, Z as USER_QUERY_CONFIG_KEYS, _ as isChunkLoadError, a as useRouteTransition, at as Subject, b as loadDictionaryForRender, c as ClientRouterContext, d as ComponentsProvider, et as isRetryableQueryError, f as initialViewModulesReady, g as configureChunkLoadRecovery, h as CHUNK_RELOAD_MARKER, i as RouteTransitionProvider, it as QueryError, j as ServerDataProvider, k as I18nProvider, l as ClientRouterProvider, m as subscribeViewModules, n as useTheme, nt as retryDelayFor, o as useChannelSubscription, p as loadViewModule, q as applyParams$1, r as m, rt as shouldRetryQuery, s as useCoalesced, t as ThemeProvider, tt as parseRetryAfter, u as ComponentsContext, v as recoverFromChunkLoadError, w as routeDataUrl, x as registerDictionary, y as loadDictionary } from "../chunks/ThemeProvider-DaX0eyqs.js";
 import { n as RouteStateContext, r as RouteStateProvider, t as useParams } from "../chunks/useParams-BN3XXfmG.js";
 import { Fragment, StrictMode, Suspense, createContext, createElement, isValidElement, lazy, memo, use, useCallback, useContext, useDeferredValue, useEffect, useMemo, useRef, useState, useSyncExternalStore, useTransition } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -27,180 +27,6 @@ function isPlainObject(value) {
 	return value !== null && typeof value === "object" && !Array.isArray(value) && Object.getPrototypeOf(value) === Object.prototype;
 }
 //#endregion
-//#region client/realtime/useChannelSubscription.ts
-var CLOSED = {
-	status: "closed",
-	code: null
-};
-var IDLE = {
-	status: "idle",
-	code: null
-};
-/**
-* The one subscription primitive the channel hooks share. Subscribes only in
-* an effect, so a server render, a static page or an island that never
-* mounts opens no socket; on the server it reports `closed`. Handlers may
-* change between renders without resubscribing.
-*/
-function useChannelSubscription(pattern, params, handlers, enabled) {
-	const active = enabled && pattern !== null;
-	const [state, setState] = useState(active ? CLOSED : IDLE);
-	const provided = useContext(RealtimeContext);
-	const handlersRef = useRef(handlers);
-	handlersRef.current = handlers;
-	const paramsRef = useRef(params);
-	paramsRef.current = params;
-	useEffect(() => {
-		if (!active || pattern === null) {
-			setState(IDLE);
-			return;
-		}
-		const socket = provided ?? getRealtimeClient();
-		if (!socket) return;
-		const release = socket.subscribe(pattern, paramsRef.current, {
-			onEvent: (event, data) => handlersRef.current.onEvent?.(event, data),
-			onResync: () => handlersRef.current.onResync?.(),
-			onStatus: (status, code) => setState((previous) => previous.status === status && previous.code === code ? previous : {
-				status,
-				code
-			})
-		});
-		return () => {
-			release();
-			setState(CLOSED);
-		};
-	}, [
-		provided,
-		pattern === null ? null : channelKey(pattern, params),
-		active
-	]);
-	if (typeof window === "undefined") return active ? CLOSED : IDLE;
-	return state;
-}
-/**
-* `fn`, run at most once per `ms`: the first call starts the window, and the
-* calls inside it fold into the one run at its end. Stable across renders;
-* a pending run is dropped on unmount.
-*/
-function useCoalesced(fn, ms = 150) {
-	const fnRef = useRef(fn);
-	fnRef.current = fn;
-	const timer = useRef(null);
-	useEffect(() => () => {
-		if (timer.current) clearTimeout(timer.current);
-		timer.current = null;
-	}, []);
-	const coalesced = useRef(null);
-	coalesced.current ??= () => {
-		if (timer.current) return;
-		timer.current = setTimeout(() => {
-			timer.current = null;
-			fnRef.current();
-		}, ms);
-	};
-	return coalesced.current;
-}
-//#endregion
-//#region client/useChannel.ts
-var warnedWithoutResync = /* @__PURE__ */ new Set();
-/**
-* Subscribes to a broadcast channel while the component is mounted.
-*
-* ```tsx
-* const { status } = useChannel("site.:siteId", { params: { siteId } }, {
-*   on: { changed: (d) => mutate({ path: "/pages/:pageId", params: { pageId } }) },
-*   onResync: () => mutate({ path: "/pages/:pageId", params: { pageId } }),
-* });
-* ```
-*
-* Events are hints, delivered at most once: pair `on` with `onResync`, which
-* runs whenever some may have been missed. `useChannelInvalidate` does both
-* for the common case. On the server, and until the effect runs, `status` is
-* `closed`.
-*/
-function useChannel(pattern, options = {}, config = {}) {
-	const configRef = useRef(config);
-	configRef.current = config;
-	const hasOn = config.on !== void 0 && Object.keys(config.on).length > 0;
-	const hasResync = config.onResync !== void 0;
-	useEffect(() => {
-		if (process.env.NODE_ENV === "production") return;
-		if (!hasOn || hasResync || warnedWithoutResync.has(pattern)) return;
-		warnedWithoutResync.add(pattern);
-		console.warn(`[gemi] useChannel("${pattern}") has \`on\` handlers but no \`onResync\`. Broadcast events are hints delivered at most once: after a reconnect or a gap the events in between are gone, so refetch in \`onResync\` (or use useChannelInvalidate).`);
-	}, [
-		pattern,
-		hasOn,
-		hasResync
-	]);
-	return useChannelSubscription(pattern, options.params ?? {}, {
-		onEvent: (event, data) => {
-			const handler = configRef.current.on?.[event];
-			handler?.(data);
-		},
-		onResync: () => configRef.current.onResync?.()
-	}, config.enabled !== false);
-}
-/**
-* Refetches `paths` on any event on the channel and on every resync. Only
-* the variants being rendered refetch now; the rest are marked stale. Events
-* are coalesced: a burst within 150 ms refetches once.
-*
-* ```tsx
-* useChannelInvalidate("page.:pageId", { pageId }, ["/pages/:pageId", "/pages/:pageId/pictures"]);
-* ```
-*/
-function useChannelInvalidate(pattern, params, paths, config = {}) {
-	const { getResource } = useContext(QueryManagerContext);
-	const routeParams = useParams();
-	const channelParams = params ?? {};
-	const latest = useRef({
-		paths,
-		routeParams,
-		channelParams,
-		getResource
-	});
-	latest.current = {
-		paths,
-		routeParams,
-		channelParams,
-		getResource
-	};
-	const invalidate = () => {
-		const { paths, routeParams, channelParams, getResource } = latest.current;
-		for (const entry of paths) {
-			const target = typeof entry === "string" ? { path: entry } : entry;
-			const resource = getResource(applyParams$1(target.path, {
-				...routeParams,
-				...channelParams,
-				...target.params
-			}));
-			const keys = target.search ? [toVariantKey(target.search)] : resource.variantKeys();
-			for (const key of keys) resource.invalidate(key);
-		}
-	};
-	return useChannelSubscription(pattern, channelParams, {
-		onEvent: useCoalesced(invalidate),
-		onResync: invalidate
-	}, config.enabled !== false);
-}
-function resolveLiveChannel(live) {
-	if (!live) return null;
-	if (typeof live === "string") return {
-		pattern: live,
-		params: {}
-	};
-	if (Array.isArray(live)) return {
-		pattern: live[0],
-		params: live[1] ?? {}
-	};
-	const object = live;
-	return {
-		pattern: object.channel,
-		params: object.params ?? {}
-	};
-}
-//#endregion
 //#region client/useQuery.ts
 /**
 * A DOM event or React's synthetic one. Never a plain object, so a cached
@@ -275,18 +101,15 @@ function useFrameworkQuery(url, ...args) {
 	const lazy = config.lazy;
 	const configRef = useRef(config);
 	configRef.current = config;
-	const liveChannel = resolveLiveChannel(config.live);
+	const realtime = useContext(RealtimeContext);
+	const [liveOpen, setLiveOpen] = useState(false);
 	const liveResourceRef = useRef(resource);
 	liveResourceRef.current = resource;
-	const refreshLive = useCallback(() => {
-		const target = liveResourceRef.current;
-		for (const key of target.variantKeys()) target.invalidate(key);
-	}, []);
-	const refreshLiveOnEvent = useCoalesced(refreshLive);
-	const liveOpen = useChannelSubscription(liveChannel?.pattern ?? null, liveChannel?.params ?? {}, {
-		onEvent: refreshLiveOnEvent,
-		onResync: refreshLive
-	}, liveChannel !== null).status === "open";
+	const liveKey = config.live ? JSON.stringify(config.live) : null;
+	useEffect(() => {
+		if (liveKey === null) return;
+		return followLive(realtime, JSON.parse(liveKey), () => liveResourceRef.current, setLiveOpen);
+	}, [realtime, liveKey]);
 	const refreshIntervalRef = useRef(null);
 	const fetchedRef = useRef(!lazy);
 	const pollRef = useRef({
@@ -927,6 +750,16 @@ function withMutationErrorHelpers(error) {
 	return error;
 }
 //#endregion
+//#region services/broadcast/socketHeader.ts
+/**
+* The request header a client sends its socket id in, for `toOthers`.
+*
+* A module of its own, re-exported by `./protocol`: every mutation in the
+* browser reads it, and anything else in `./protocol` it pulled along would
+* land in every route's entry chunk instead of the lazily loaded socket's.
+*/
+var SOCKET_ID_HEADER = "x-gemi-socket";
+//#endregion
 //#region client/useSetQueryData.ts
 /**
 * Write into every variant `target` names. `next` is the value to write, or
@@ -1382,16 +1215,8 @@ function filenameOf(response) {
 }
 //#endregion
 //#region client/useSubscription.ts
-var MIN_RETRY_MS = 1e3;
-var MAX_RETRY_MS = 3e4;
-/** The server answered in a way retrying will not change (401, 403, 404). */
-var FatalStatus = class extends Error {
-	status;
-	constructor(status) {
-		super(`The subscription was refused with ${status}.`);
-		this.status = status;
-	}
-};
+/** `./subscriptionStream`, loaded on first use. Replaceable in tests. */
+var streamModule = { load: () => import("../chunks/subscriptionStream-CULcRbx0.js") };
 /**
 * Follows a route that answers with `ChangeFeed.stream`, as long as the
 * component is mounted: each change reaches `onChange`, in order, exactly
@@ -1442,105 +1267,27 @@ function useSubscription(url, options = {}, config = {}) {
 			return;
 		}
 		let stopped = false;
-		let request = null;
-		let resume = null;
-		let retryMs = MIN_RETRY_MS;
-		const hidden = () => pauseWhenHidden && typeof document !== "undefined" && document.visibilityState === "hidden";
-		const onVisibilityChange = () => {
-			if (hidden()) request?.abort();
-			else resume?.();
-		};
-		if (typeof document !== "undefined") document.addEventListener("visibilitychange", onVisibilityChange);
-		const wait = (ms) => new Promise((resolve) => {
-			const timer = setTimeout(done, ms);
-			function done() {
-				clearTimeout(timer);
-				resume = null;
-				resolve();
-			}
-			resume = done;
+		let stop = null;
+		streamModule.load().then((module) => {
+			const { follow } = loadedModule(module);
+			if (stopped) return;
+			stop = follow({
+				endpoint,
+				pauseWhenHidden,
+				cursor,
+				callbacks,
+				setState
+			});
+		}).catch((error) => {
+			if (!stopped) setState((s) => ({
+				...s,
+				status: "closed",
+				error
+			}));
 		});
-		(async () => {
-			while (!stopped) {
-				if (hidden()) {
-					setState((s) => ({
-						...s,
-						status: "paused"
-					}));
-					await new Promise((resolve) => resume = resolve);
-					resume = null;
-					continue;
-				}
-				setState((s) => ({
-					...s,
-					status: "connecting"
-				}));
-				const controller = request = new AbortController();
-				let delay = retryMs;
-				try {
-					const headers = { Accept: "text/event-stream" };
-					if (cursor.current) headers["Last-Event-ID"] = cursor.current;
-					const response = await fetch(endpoint, {
-						headers,
-						signal: controller.signal
-					});
-					if (!response.ok || !response.body) {
-						const status = response.status;
-						if (status >= 400 && status < 500 && status !== 408 && status !== 429) throw new FatalStatus(status);
-						const retryAfter = Number(response.headers.get("Retry-After"));
-						if (Number.isFinite(retryAfter) && retryAfter > 0) delay = retryAfter * 1e3;
-						throw new Error(`The subscription answered ${status}.`);
-					}
-					for await (const { id, message } of readEvents(response.body)) {
-						if (stopped) return;
-						if (id !== void 0) cursor.current = id;
-						if (message.type === "ready") {
-							retryMs = MIN_RETRY_MS;
-							delay = MIN_RETRY_MS;
-							setState({
-								status: "open",
-								cursor: cursor.current,
-								error: null
-							});
-						} else {
-							setState((s) => ({
-								...s,
-								cursor: cursor.current
-							}));
-							if (message.type === "change") callbacks.current.onChange?.(message);
-							else if (message.type === "reset") callbacks.current.onReset?.(message);
-						}
-					}
-				} catch (error) {
-					if (stopped) return;
-					if (error instanceof FatalStatus) {
-						setState((s) => ({
-							...s,
-							status: "closed",
-							error
-						}));
-						return;
-					}
-					if (controller.signal.aborted) continue;
-					setState((s) => ({
-						...s,
-						error
-					}));
-				}
-				if (stopped || controller.signal.aborted) continue;
-				setState((s) => ({
-					...s,
-					status: "connecting"
-				}));
-				await wait(delay);
-				retryMs = Math.min(retryMs * 2, MAX_RETRY_MS);
-			}
-		})();
 		return () => {
 			stopped = true;
-			request?.abort();
-			resume?.();
-			if (typeof document !== "undefined") document.removeEventListener("visibilitychange", onVisibilityChange);
+			stop?.();
 		};
 	}, [
 		endpoint,
@@ -1550,48 +1297,89 @@ function useSubscription(url, options = {}, config = {}) {
 	]);
 	return state;
 }
+//#endregion
+//#region client/useChannel.ts
+var warnedWithoutResync = /* @__PURE__ */ new Set();
 /**
-* The events of an SSE body: `id` and the JSON `data`. Comments (keepalives)
-* and events without data are skipped; an event whose data is not JSON is
-* dropped rather than ending the stream.
+* Subscribes to a broadcast channel while the component is mounted.
+*
+* ```tsx
+* const { status } = useChannel("site.:siteId", { params: { siteId } }, {
+*   on: { changed: (d) => mutate({ path: "/pages/:pageId", params: { pageId } }) },
+*   onResync: () => mutate({ path: "/pages/:pageId", params: { pageId } }),
+* });
+* ```
+*
+* Events are hints, delivered at most once: pair `on` with `onResync`, which
+* runs whenever some may have been missed. `useChannelInvalidate` does both
+* for the common case. On the server, and until the effect runs, `status` is
+* `closed`.
 */
-async function* readEvents(body) {
-	const reader = body.getReader();
-	const decoder = new TextDecoder();
-	let buffer = "";
-	try {
-		for (;;) {
-			const { done, value } = await reader.read();
-			if (done) return;
-			buffer = (buffer + decoder.decode(value, { stream: true })).replace(/\r\n?/g, "\n");
-			let boundary = buffer.indexOf("\n\n");
-			while (boundary !== -1) {
-				const block = buffer.slice(0, boundary);
-				buffer = buffer.slice(boundary + 2);
-				boundary = buffer.indexOf("\n\n");
-				let id;
-				const data = [];
-				for (const line of block.split("\n")) {
-					if (line === "" || line.startsWith(":")) continue;
-					const colon = line.indexOf(":");
-					const field = colon === -1 ? line : line.slice(0, colon);
-					let text = colon === -1 ? "" : line.slice(colon + 1);
-					if (text.startsWith(" ")) text = text.slice(1);
-					if (field === "id") id = text;
-					else if (field === "data") data.push(text);
-				}
-				if (data.length === 0) continue;
-				try {
-					yield {
-						id,
-						message: JSON.parse(data.join("\n"))
-					};
-				} catch {}
-			}
+function useChannel(pattern, options = {}, config = {}) {
+	const configRef = useRef(config);
+	configRef.current = config;
+	const hasOn = config.on !== void 0 && Object.keys(config.on).length > 0;
+	const hasResync = config.onResync !== void 0;
+	useEffect(() => {
+		if (process.env.NODE_ENV === "production") return;
+		if (!hasOn || hasResync || warnedWithoutResync.has(pattern)) return;
+		warnedWithoutResync.add(pattern);
+		console.warn(`[gemi] useChannel("${pattern}") has \`on\` handlers but no \`onResync\`. Broadcast events are hints delivered at most once: after a reconnect or a gap the events in between are gone, so refetch in \`onResync\` (or use useChannelInvalidate).`);
+	}, [
+		pattern,
+		hasOn,
+		hasResync
+	]);
+	return useChannelSubscription(pattern, options.params ?? {}, {
+		onEvent: (event, data) => {
+			const handler = configRef.current.on?.[event];
+			handler?.(data);
+		},
+		onResync: () => configRef.current.onResync?.()
+	}, config.enabled !== false);
+}
+/**
+* Refetches `paths` on any event on the channel and on every resync. Only
+* the variants being rendered refetch now; the rest are marked stale. Events
+* are coalesced: a burst within 150 ms refetches once.
+*
+* ```tsx
+* useChannelInvalidate("page.:pageId", { pageId }, ["/pages/:pageId", "/pages/:pageId/pictures"]);
+* ```
+*/
+function useChannelInvalidate(pattern, params, paths, config = {}) {
+	const { getResource } = useContext(QueryManagerContext);
+	const routeParams = useParams();
+	const channelParams = params ?? {};
+	const latest = useRef({
+		paths,
+		routeParams,
+		channelParams,
+		getResource
+	});
+	latest.current = {
+		paths,
+		routeParams,
+		channelParams,
+		getResource
+	};
+	const invalidate = () => {
+		const { paths, routeParams, channelParams, getResource } = latest.current;
+		for (const entry of paths) {
+			const target = typeof entry === "string" ? { path: entry } : entry;
+			const resource = getResource(applyParams$1(target.path, {
+				...routeParams,
+				...channelParams,
+				...target.params
+			}));
+			const keys = target.search ? [toVariantKey(target.search)] : resource.variantKeys();
+			for (const key of keys) resource.invalidate(key);
 		}
-	} finally {
-		await reader.cancel().catch(() => {});
-	}
+	};
+	return useChannelSubscription(pattern, channelParams, {
+		onEvent: useCoalesced(invalidate),
+		onResync: invalidate
+	}, config.enabled !== false);
 }
 //#endregion
 //#region client/Mutation.tsx