@emeryld/rrroutes-client 2.6.0 → 2.6.1

package/dist/index.mjs

@@ -1568,7 +1568,7 @@ function useSocketConnection(args) {
 }
 
 // src/sockets/socketedRoute/socket.client.helper.ts
-import { useEffect as useEffect2, useMemo as useMemo2, useState as useState2 } from "react";
+import { useEffect as useEffect2, useMemo as useMemo2, useRef as useRef5, useState as useState2 } from "react";
 function normalizeRooms(rooms) {
   if (rooms == null) return [];
   const list = Array.isArray(rooms) ? rooms : [rooms];
@@ -1582,6 +1582,92 @@ function normalizeRooms(rooms) {
   }
   return normalized;
 }
+var objectReferenceIds = /* @__PURE__ */ new WeakMap();
+var objectReferenceCounter = 0;
+function describeObjectReference(value) {
+  if (value == null) return null;
+  const valueType = typeof value;
+  if (valueType !== "object" && valueType !== "function") return null;
+  const obj = value;
+  let id = objectReferenceIds.get(obj);
+  if (!id) {
+    id = ++objectReferenceCounter;
+    objectReferenceIds.set(obj, id);
+  }
+  return `ref#${id}`;
+}
+function safeJsonKey(value) {
+  try {
+    const serialized = JSON.stringify(value ?? null);
+    return serialized ?? "null";
+  } catch {
+    return "[unserializable]";
+  }
+}
+function arrayShallowEqual(a, b) {
+  if (a.length !== b.length) return false;
+  for (let i = 0; i < a.length; i += 1) {
+    if (a[i] !== b[i]) return false;
+  }
+  return true;
+}
+function roomStateEqual(prev, next) {
+  return arrayShallowEqual(prev.rooms, next.rooms) && safeJsonKey(prev.joinMeta) === safeJsonKey(next.joinMeta) && safeJsonKey(prev.leaveMeta) === safeJsonKey(next.leaveMeta);
+}
+function safeDescribeHookValue2(value) {
+  if (value == null) return value;
+  const valueType = typeof value;
+  if (valueType === "string" || valueType === "number" || valueType === "boolean") {
+    return value;
+  }
+  if (valueType === "bigint" || valueType === "symbol") return String(value);
+  if (valueType === "function")
+    return `[function ${value.name || "anonymous"}]`;
+  if (Array.isArray(value)) return `[array length=${value.length}]`;
+  const ctorName = value.constructor?.name ?? "object";
+  const keys = Object.keys(value);
+  const keyPreview = keys.slice(0, 4).join(",");
+  const suffix = keys.length > 4 ? ",\u2026" : "";
+  const ref = describeObjectReference(value);
+  return `[${ctorName}${ref ? ` ${ref}` : ""} keys=${keyPreview}${suffix}]`;
+}
+function createHookDebugEvent2(prev, next, phase) {
+  const reason = prev ? "change" : "init";
+  const changed = Object.keys(next).reduce((acc, dependency) => {
+    const prevValue = prev ? prev[dependency] : void 0;
+    const nextValue = next[dependency];
+    if (!prev || !Object.is(prevValue, nextValue)) {
+      acc.push({
+        dependency,
+        previous: safeDescribeHookValue2(prevValue),
+        next: safeDescribeHookValue2(nextValue)
+      });
+    }
+    return acc;
+  }, []);
+  if (!changed.length) return null;
+  return { type: "hook", phase, reason, changes: changed };
+}
+function dbg2(debug, event) {
+  if (!debug?.logger) return;
+  if (!debug[event.type]) return;
+  debug.logger(event);
+}
+function trackHookTrigger2({
+  ref,
+  phase,
+  debug,
+  snapshot
+}) {
+  const prev = ref.current;
+  ref.current = snapshot;
+  if (!debug?.logger || !debug?.hook) return;
+  const event = createHookDebugEvent2(prev, snapshot, phase);
+  if (event) dbg2(debug, event);
+}
+function isSocketClientUnavailableError(err) {
+  return err instanceof Error && err.message.includes("SocketClient not found");
+}
 function mergeRoomState(prev, toRoomsResult) {
   const merged = new Set(prev.rooms);
   for (const r of normalizeRooms(toRoomsResult.rooms)) merged.add(r);
@@ -1620,65 +1706,194 @@ function roomsFromData(data, toRooms) {
   return state;
 }
 function buildSocketedRoute(options) {
-  const { built, toRooms, applySocket, useSocketClient: useSocketClient2 } = options;
+  const { built, toRooms, applySocket, useSocketClient: useSocketClient2, debug } = options;
   const { useEndpoint: useInnerEndpoint, ...rest } = built;
   const useEndpoint = (...useArgs) => {
-    const client = useSocketClient2();
+    let client = null;
+    let socketClientError = null;
+    try {
+      client = useSocketClient2();
+    } catch (err) {
+      if (!isSocketClientUnavailableError(err)) throw err;
+      socketClientError = err;
+    }
     const endpointResult = useInnerEndpoint(
       ...useArgs
     );
-    const argsKey = useMemo2(() => JSON.stringify(useArgs[0] ?? null), [useArgs]);
+    const argsKey = useMemo2(() => safeJsonKey(useArgs[0] ?? null), [useArgs]);
     const [roomState, setRoomState] = useState2(
       () => roomsFromData(endpointResult.data, toRooms)
     );
+    const renderCountRef = useRef5(0);
+    const clientReadyRef = useRef5(null);
+    const onReceiveEffectDebugRef = useRef5(null);
+    const deriveRoomsEffectDebugRef = useRef5(null);
+    const joinRoomsEffectDebugRef = useRef5(null);
+    const applySocketEffectDebugRef = useRef5(null);
+    renderCountRef.current += 1;
     const roomsKey = useMemo2(() => roomState.rooms.join("|"), [roomState.rooms]);
     const joinMetaKey = useMemo2(
-      () => JSON.stringify(roomState.joinMeta ?? null),
+      () => safeJsonKey(roomState.joinMeta ?? null),
       [roomState.joinMeta]
     );
     const leaveMetaKey = useMemo2(
-      () => JSON.stringify(roomState.leaveMeta ?? null),
+      () => safeJsonKey(roomState.leaveMeta ?? null),
       [roomState.leaveMeta]
     );
+    const hasClient = !!client;
+    if (clientReadyRef.current !== hasClient) {
+      clientReadyRef.current = hasClient;
+      dbg2(debug, {
+        type: "client",
+        phase: hasClient ? "ready" : "missing",
+        err: hasClient ? void 0 : String(socketClientError)
+      });
+    }
+    dbg2(debug, {
+      type: "render",
+      renderCount: renderCountRef.current,
+      hasClient,
+      argsKey,
+      rooms: roomState.rooms,
+      roomsKey,
+      joinMetaKey,
+      leaveMetaKey
+    });
     useEffect2(() => {
+      trackHookTrigger2({
+        ref: onReceiveEffectDebugRef,
+        phase: "endpoint_on_receive_effect",
+        debug,
+        snapshot: {
+          endpointResultRef: describeObjectReference(endpointResult),
+          endpointDataRef: describeObjectReference(endpointResult.data),
+          toRoomsRef: describeObjectReference(toRooms)
+        }
+      });
       const unsubscribe = endpointResult.onReceive((data) => {
-        setRoomState(
-          (prev) => mergeRoomState(prev, toRooms(data))
-        );
+        setRoomState((prev) => {
+          const next = mergeRoomState(prev, toRooms(data));
+          return roomStateEqual(prev, next) ? prev : next;
+        });
       });
       return unsubscribe;
-    }, [endpointResult, toRooms]);
+    }, [endpointResult, toRooms, debug]);
     useEffect2(() => {
-      setRoomState(
-        roomsFromData(endpointResult.data, toRooms)
+      trackHookTrigger2({
+        ref: deriveRoomsEffectDebugRef,
+        phase: "derive_rooms_effect",
+        debug,
+        snapshot: {
+          endpointDataRef: describeObjectReference(endpointResult.data),
+          toRoomsRef: describeObjectReference(toRooms)
+        }
+      });
+      const next = roomsFromData(
+        endpointResult.data,
+        toRooms
       );
-    }, [endpointResult.data, toRooms]);
+      setRoomState((prev) => roomStateEqual(prev, next) ? prev : next);
+    }, [endpointResult.data, toRooms, debug]);
     useEffect2(() => {
-      if (roomState.rooms.length === 0) return;
+      trackHookTrigger2({
+        ref: joinRoomsEffectDebugRef,
+        phase: "join_rooms_effect",
+        debug,
+        snapshot: {
+          hasClient: !!client,
+          clientRef: describeObjectReference(client),
+          roomsKey,
+          joinMetaKey,
+          leaveMetaKey
+        }
+      });
+      if (!client) {
+        dbg2(debug, {
+          type: "room",
+          phase: "join_skip",
+          rooms: roomState.rooms,
+          reason: "socket_client_missing"
+        });
+        return;
+      }
+      if (roomState.rooms.length === 0) {
+        dbg2(debug, {
+          type: "room",
+          phase: "join_skip",
+          rooms: [],
+          reason: "no_rooms"
+        });
+        return;
+      }
       const { joinMeta, leaveMeta } = roomState;
-      if (!joinMeta || !leaveMeta) return;
+      if (!joinMeta || !leaveMeta) {
+        dbg2(debug, {
+          type: "room",
+          phase: "join_skip",
+          rooms: roomState.rooms,
+          reason: "missing_meta"
+        });
+        return;
+      }
       let active = true;
+      dbg2(debug, {
+        type: "room",
+        phase: "join_attempt",
+        rooms: roomState.rooms
+      });
       (async () => {
         try {
           await client.joinRooms(roomState.rooms, joinMeta);
-        } catch {
+        } catch (err) {
+          dbg2(debug, {
+            type: "room",
+            phase: "join_error",
+            rooms: roomState.rooms,
+            err: String(err)
+          });
         }
       })();
       return () => {
-        if (!active || roomState.rooms.length === 0) return;
+        if (!active) return;
         active = false;
-        void client.leaveRooms(roomState.rooms, leaveMeta).catch(() => {
+        if (roomState.rooms.length === 0) {
+          dbg2(debug, {
+            type: "room",
+            phase: "leave_skip",
+            rooms: [],
+            reason: "no_rooms"
+          });
+          return;
+        }
+        dbg2(debug, {
+          type: "room",
+          phase: "leave_attempt",
+          rooms: roomState.rooms
+        });
+        void client.leaveRooms(roomState.rooms, leaveMeta).catch((err) => {
+          dbg2(debug, {
+            type: "room",
+            phase: "leave_error",
+            rooms: roomState.rooms,
+            err: String(err)
+          });
         });
       };
-    }, [
-      client,
-      roomsKey,
-      roomState.joinMeta,
-      roomState.leaveMeta,
-      joinMetaKey,
-      leaveMetaKey
-    ]);
+    }, [client, roomsKey, joinMetaKey, leaveMetaKey, debug]);
     useEffect2(() => {
+      trackHookTrigger2({
+        ref: applySocketEffectDebugRef,
+        phase: "apply_socket_effect",
+        debug,
+        snapshot: {
+          hasClient: !!client,
+          clientRef: describeObjectReference(client),
+          applySocketKeys: Object.keys(applySocket).sort().join(","),
+          argsKey,
+          toRoomsRef: describeObjectReference(toRooms)
+        }
+      });
+      if (!client) return;
       const entries = Object.entries(applySocket).filter(
         ([_event, fn]) => typeof fn === "function"
       );
@@ -1687,8 +1902,12 @@ function buildSocketedRoute(options) {
           built.setData(
             (prev) => {
               const next = fn(prev, payload, meta);
+              const nextRoomState = roomsFromData(
+                next,
+                toRooms
+              );
               setRoomState(
-                roomsFromData(next, toRooms)
+                (prevRoomState) => roomStateEqual(prevRoomState, nextRoomState) ? prevRoomState : nextRoomState
               );
               return next;
             },
@@ -1697,7 +1916,7 @@ function buildSocketedRoute(options) {
         })
       );
       return () => unsubscribes.forEach((u) => u?.());
-    }, [client, applySocket, built, argsKey, toRooms]);
+    }, [client, applySocket, built, argsKey, toRooms, debug]);
     return { ...endpointResult, rooms: roomState.rooms };
   };
   return {