@emeryld/rrroutes-client 2.2.6 → 2.2.8

package/dist/index.cjs

@@ -36,7 +36,6 @@ __export(index_exports, {
   buildRouter: () => buildRouter,
   buildSocketProvider: () => buildSocketProvider,
   createRouteClient: () => createRouteClient,
-  createSocketedRouteHook: () => createSocketedRouteHook,
   defaultFetcher: () => defaultFetcher,
   useSocketClient: () => useSocketClient,
   useSocketConnection: () => useSocketConnection
@@ -69,19 +68,9 @@ var defaultFetcher = async (req) => {
 };
 
 // src/routesV3.client.index.ts
+var import_react = require("react");
 var import_react_query = require("@tanstack/react-query");
 var import_rrroutes_contract = require("@emeryld/rrroutes-contract");
-function splitUseEndpointArgs(useArgs, expectsArgs) {
-  if (useArgs.length === 0) return { args: void 0, options: void 0 };
-  if (!expectsArgs) {
-    return { args: void 0, options: useArgs[0] };
-  }
-  const [maybeArgs, maybeOptions] = useArgs;
-  return {
-    args: maybeArgs,
-    options: useArgs.length > 1 ? maybeOptions : void 0
-  };
-}
 var toUpper = (m) => m.toUpperCase();
 function zParse(value, schema) {
   return schema ? schema.parse(value) : value;
@@ -333,14 +322,31 @@ function createRouteClient(opts) {
     };
     if (isGet && isFeed) {
       const useEndpoint2 = (...useArgs) => {
-        const { args, options } = splitUseEndpointArgs(useArgs, expectsArgs);
+        const args = useArgs[0];
         emit({ type: "useEndpoint", leaf: leafLabel, variant: "infiniteGet" });
         const tuple = toArgsTuple(args);
         const params = args?.params;
         const query = args?.query;
         const buildOptions = rqOpts ?? {};
+        const listenersRef = (0, import_react.useRef)(/* @__PURE__ */ new Set());
+        const notifyOnReceive = (0, import_react.useCallback)(
+          (data) => {
+            buildOptions?.onReceive?.(data);
+            listenersRef.current.forEach((listener) => listener(data));
+          },
+          []
+        );
+        const registerOnReceive = (0, import_react.useCallback)(
+          (listener) => {
+            listenersRef.current.add(listener);
+            return () => {
+              listenersRef.current.delete(listener);
+            };
+          },
+          []
+        );
         const { normalizedQuery, normalizedParams } = buildUrl(leaf, baseUrl, params, query);
-        return (0, import_react_query.useInfiniteQuery)({
+        const queryResult = (0, import_react_query.useInfiniteQuery)({
           ...buildOptions,
           queryKey: getQueryKeys(...tuple),
           initialPageParam: void 0,
@@ -353,14 +359,12 @@ function createRouteClient(opts) {
             };
             return fetchEndpoint(tuple, {
               queryOverride: pageQuery,
-              onReceive: (data) => {
-                buildOptions?.onReceive?.(data);
-                options?.onReceive?.(data);
-              }
+              onReceive: notifyOnReceive
             });
           }
           // NOTE: TData is InfiniteData<T>, so we don't need a select here.
         }, queryClient);
+        return { ...queryResult, onReceive: registerOnReceive };
       };
       return {
         getQueryKeys,
@@ -372,24 +376,39 @@ function createRouteClient(opts) {
     }
     if (isGet) {
       const useEndpoint2 = (...useArgs) => {
-        const { args, options } = splitUseEndpointArgs(useArgs, expectsArgs);
+        const args = useArgs[0];
         emit({ type: "useEndpoint", leaf: leafLabel, variant: "get" });
         const tuple = toArgsTuple(args);
         const params = args?.params;
         const query = args?.query;
         const buildOptions = rqOpts ?? {};
+        const listenersRef = (0, import_react.useRef)(/* @__PURE__ */ new Set());
+        const notifyOnReceive = (0, import_react.useCallback)(
+          (data) => {
+            buildOptions?.onReceive?.(data);
+            listenersRef.current.forEach((listener) => listener(data));
+          },
+          []
+        );
+        const registerOnReceive = (0, import_react.useCallback)(
+          (listener) => {
+            listenersRef.current.add(listener);
+            return () => {
+              listenersRef.current.delete(listener);
+            };
+          },
+          []
+        );
         buildUrl(leaf, baseUrl, params, query);
-        return (0, import_react_query.useQuery)({
+        const queryResult = (0, import_react_query.useQuery)({
           ...buildOptions,
           queryKey: getQueryKeys(...tuple),
           placeholderData: import_react_query.keepPreviousData,
           queryFn: () => fetchEndpoint(tuple, {
-            onReceive: (data) => {
-              buildOptions?.onReceive?.(data);
-              options?.onReceive?.(data);
-            }
+            onReceive: notifyOnReceive
           })
         }, queryClient);
+        return { ...queryResult, onReceive: registerOnReceive };
       };
       return {
         getQueryKeys,
@@ -415,18 +434,29 @@ function createRouteClient(opts) {
       return result;
     };
     const useEndpoint = (...useArgs) => {
-      const { args, options } = splitUseEndpointArgs(useArgs, expectsArgs);
+      const args = useArgs[0];
       emit({ type: "useEndpoint", leaf: leafLabel, variant: "mutation" });
       const tuple = toArgsTuple(args);
-      return (0, import_react_query.useMutation)({
+      const listenersRef = (0, import_react.useRef)(/* @__PURE__ */ new Set());
+      const notifyListeners = (0, import_react.useCallback)((data) => {
+        listenersRef.current.forEach((listener) => listener(data));
+      }, []);
+      const registerOnReceive = (0, import_react.useCallback)((listener) => {
+        listenersRef.current.add(listener);
+        return () => {
+          listenersRef.current.delete(listener);
+        };
+      }, []);
+      const mutationResult = (0, import_react_query.useMutation)({
         ...mutationBuildOptions,
         mutationKey: getQueryKeys(...tuple),
         mutationFn: async (body) => {
           const result = await fetchMutation(...[...tuple, body]);
-          options?.onReceive?.(result);
+          notifyListeners(result);
           return result;
         }
       }, queryClient);
+      return { ...mutationResult, onReceive: registerOnReceive };
     };
     return {
       getQueryKeys,
@@ -685,271 +715,6 @@ function useSocketConnection(args) {
   }, [client, event, onMessage, autoJoin, autoLeave, ...normalizedRooms]);
 }
 
-// src/sockets/socketedRoute/socket.client.helper.ts
-var import_react = require("react");
-function createSocketedRouteHook(args) {
-  const { buildRoute, useClient = () => useSocketClient() } = args;
-  return function useSocketedRoute(params) {
-    const { routeKey, socketEvent, handlers, buildOptions, buildMeta, debug, useOptions } = params;
-    const renderRef = (0, import_react.useRef)(0);
-    const prevInputsRef = (0, import_react.useRef)();
-    const debugName = buildMeta?.name;
-    const render = ++renderRef.current;
-    const renderChanged = [];
-    const prevInputs = prevInputsRef.current;
-    if (prevInputs) {
-      if (!Object.is(prevInputs.routeKey, routeKey)) renderChanged.push("routeKey");
-      if (!Object.is(prevInputs.socketEvent, socketEvent)) renderChanged.push("socketEvent");
-      if (!Object.is(prevInputs.buildOptions, buildOptions)) renderChanged.push("buildOptions");
-      if (!Object.is(prevInputs.buildMeta, buildMeta)) renderChanged.push("buildMeta");
-      if (!Object.is(prevInputs.debug, debug)) renderChanged.push("debug");
-      if (!Object.is(prevInputs.args, useOptions?.args)) renderChanged.push("args");
-      if (!Object.is(prevInputs.options, useOptions?.options)) renderChanged.push("options");
-    }
-    prevInputsRef.current = {
-      routeKey,
-      socketEvent,
-      buildOptions,
-      buildMeta,
-      debug,
-      args: useOptions?.args,
-      options: useOptions?.options
-    };
-    const debugRef = (0, import_react.useRef)(debug);
-    (0, import_react.useEffect)(() => {
-      debugRef.current = debug;
-    }, [debug]);
-    const emitDebug = (0, import_react.useCallback)(
-      (event) => {
-        const d = debugRef.current;
-        if (!d?.logger) return;
-        if (!d[event.type]) return;
-        const name = event.name ?? debugName;
-        if (d.only && name && !d.only.includes(name)) return;
-        d.logger({ ...event, name });
-      },
-      [debugName]
-    );
-    const verboseRef = (0, import_react.useRef)(!!debug?.verbose);
-    (0, import_react.useEffect)(() => {
-      verboseRef.current = !!debug?.verbose;
-    }, [debug]);
-    const handlersRef = (0, import_react.useRef)(handlers);
-    (0, import_react.useEffect)(() => {
-      handlersRef.current = handlers;
-    }, [handlers]);
-    const endpoint = (0, import_react.useMemo)(
-      () => buildRoute(routeKey, buildOptions, buildMeta),
-      [buildRoute, routeKey, buildOptions, buildMeta]
-    );
-    (0, import_react.useEffect)(() => {
-      emitDebug({
-        type: "build",
-        routeKey,
-        socketEvent,
-        options: verboseRef.current ? { buildOptions, buildMeta, useOptions } : void 0
-      });
-    }, [emitDebug, routeKey, socketEvent, buildOptions, buildMeta, useOptions]);
-    const client = useClient();
-    const [rooms, setRooms] = (0, import_react.useState)([]);
-    const roomsKey = rooms.slice().sort().join("|");
-    const roomsRef = (0, import_react.useRef)([]);
-    roomsRef.current = rooms;
-    const prevRoomsKeyRef = (0, import_react.useRef)(roomsKey);
-    const prevClientRef = (0, import_react.useRef)(client);
-    const prevRouteKeyRef = (0, import_react.useRef)(routeKey);
-    const prevSocketEventRef = (0, import_react.useRef)(socketEvent);
-    const prevSubscribeDepsRef = (0, import_react.useRef)({
-      client,
-      socketEvent,
-      routeArgs: useOptions?.args,
-      routeKey
-    });
-    (0, import_react.useEffect)(() => {
-      emitDebug({
-        type: "render",
-        render,
-        routeKey,
-        socketEvent,
-        changed: renderChanged,
-        rooms: verboseRef.current ? roomsRef.current : void 0
-      });
-    }, [emitDebug, render, routeKey, socketEvent]);
-    const applyRooms = (0, import_react.useCallback)(
-      (page, source) => {
-        const onReceiveRooms = handlersRef.current.onReceiveRooms;
-        if (!onReceiveRooms) return;
-        setRooms((prev) => {
-          const next = onReceiveRooms(page, prev);
-          const unique = Array.from(new Set(next.filter(Boolean)));
-          if (prev.length === unique.length && prev.every((room, idx) => room === unique[idx])) {
-            emitDebug({
-              type: "rooms",
-              phase: "derive",
-              routeKey,
-              socketEvent,
-              rooms: unique,
-              prev,
-              reason: "unchanged",
-              meta: verboseRef.current ? { page, source } : void 0,
-              source
-            });
-            return prev;
-          }
-          emitDebug({
-            type: "rooms",
-            phase: "derive",
-            routeKey,
-            socketEvent,
-            rooms: unique,
-            prev,
-            meta: verboseRef.current ? { page, source } : void 0,
-            source
-          });
-          return unique;
-        });
-      },
-      [emitDebug, routeKey, socketEvent]
-    );
-    const routeArgs = useOptions?.args;
-    const callerOptions = useOptions?.options;
-    const mergedOptions = (0, import_react.useMemo)(
-      () => ({
-        ...callerOptions ?? {},
-        onReceive(page) {
-          callerOptions?.onReceive?.(page);
-          applyRooms(page, "onReceive");
-          emitDebug({
-            type: "onReceive",
-            routeKey,
-            socketEvent,
-            page: verboseRef.current ? page : void 0,
-            rooms: verboseRef.current ? roomsRef.current : void 0
-          });
-        }
-      }),
-      [callerOptions, applyRooms, emitDebug, routeKey, socketEvent]
-    );
-    const endpointArgs = routeArgs ? [routeArgs, mergedOptions] : [mergedOptions];
-    const { data } = endpoint.useEndpoint(...endpointArgs);
-    (0, import_react.useEffect)(() => {
-      if (!data) return;
-      const pages = data?.pages;
-      if (Array.isArray(pages)) {
-        pages.forEach((p) => applyRooms(p, "hydrate"));
-        return;
-      }
-      applyRooms(data, "hydrate");
-    }, [data, applyRooms]);
-    (0, import_react.useEffect)(() => {
-      const prev = prevSubscribeDepsRef.current;
-      const changedDeps = [];
-      if (prev.client !== client) changedDeps.push("client");
-      if (prev.socketEvent !== socketEvent) changedDeps.push("socketEvent");
-      if (!Object.is(prev.routeArgs, routeArgs)) changedDeps.push("args");
-      if (prev.routeKey !== routeKey) changedDeps.push("routeKey");
-      prevSubscribeDepsRef.current = { client, socketEvent, routeArgs, routeKey };
-      emitDebug({
-        type: "effect",
-        effect: "subscribe",
-        phase: "run",
-        changedDeps: changedDeps.length ? changedDeps : void 0
-      });
-      const stop = client.on(socketEvent, (payload, meta) => {
-        const updater = (prev2) => handlersRef.current.handleMessage(prev2, payload, meta);
-        const setDataArgs = routeArgs ? [routeArgs] : [];
-        endpoint.setData(updater, ...setDataArgs);
-        emitDebug({
-          type: "receive",
-          routeKey,
-          socketEvent,
-          payload: verboseRef.current ? payload : void 0,
-          envelope: verboseRef.current ? {
-            eventName: meta.envelope.eventName,
-            sentAt: meta.envelope.sentAt,
-            sentTo: meta.envelope.sentTo,
-            metadata: meta.envelope.metadata
-          } : void 0
-        });
-        emitDebug({
-          type: "setData",
-          routeKey,
-          socketEvent,
-          args: verboseRef.current ? routeArgs : void 0
-        });
-      });
-      emitDebug({ type: "subscribe", phase: "start", routeKey, socketEvent });
-      return () => {
-        emitDebug({ type: "subscribe", phase: "stop", routeKey, socketEvent });
-        stop();
-        emitDebug({ type: "effect", effect: "subscribe", phase: "cleanup" });
-      };
-    }, [client, socketEvent, endpoint, routeArgs, emitDebug, routeKey]);
-    (0, import_react.useEffect)(() => {
-      let cancelled = false;
-      const { joinMeta, leaveMeta } = handlersRef.current;
-      const changedDeps = [];
-      if (prevRoomsKeyRef.current !== roomsKey) changedDeps.push("rooms");
-      if (prevClientRef.current !== client) changedDeps.push("client");
-      if (prevRouteKeyRef.current !== routeKey) changedDeps.push("routeKey");
-      if (prevSocketEventRef.current !== socketEvent) changedDeps.push("socketEvent");
-      prevRoomsKeyRef.current = roomsKey;
-      prevClientRef.current = client;
-      prevRouteKeyRef.current = routeKey;
-      prevSocketEventRef.current = socketEvent;
-      emitDebug({
-        type: "effect",
-        effect: "rooms",
-        phase: "run",
-        changedDeps: changedDeps.length ? changedDeps : void 0,
-        rooms
-      });
-      (async () => {
-        if (!rooms.length) return;
-        emitDebug({
-          type: "rooms",
-          phase: "join",
-          routeKey,
-          socketEvent,
-          rooms,
-          meta: verboseRef.current ? joinMeta : void 0
-        });
-        try {
-          await client.joinRooms(rooms, joinMeta);
-        } catch {
-        }
-        if (cancelled) {
-          try {
-            await client.leaveRooms(rooms, leaveMeta);
-          } catch {
-          }
-        }
-      })();
-      return () => {
-        cancelled = true;
-        if (!rooms.length) return;
-        client.leaveRooms(rooms, leaveMeta).catch(() => {
-        });
-        emitDebug({
-          type: "rooms",
-          phase: "leave",
-          routeKey,
-          socketEvent,
-          rooms,
-          meta: verboseRef.current ? leaveMeta : void 0
-        });
-        emitDebug({
-          type: "effect",
-          effect: "rooms",
-          phase: "cleanup",
-          rooms
-        });
-      };
-    }, [client, roomsKey, rooms, emitDebug, routeKey, socketEvent]);
-    return { data, rooms };
-  };
-}
-
 // src/sockets/socket.client.index.ts
 var SocketClient = class {
   constructor(events, opts) {
@@ -1573,7 +1338,6 @@ var SocketClient = class {
   buildRouter,
   buildSocketProvider,
   createRouteClient,
-  createSocketedRouteHook,
   defaultFetcher,
   useSocketClient,
   useSocketConnection