@liveblocks/react 1.2.2-comments4 → 1.2.2-comments6

package/dist/index.mjs

@@ -5,7 +5,7 @@ import { detectDupes } from "@liveblocks/core";
 
 // src/version.ts
 var PKG_NAME = "@liveblocks/react";
-var PKG_VERSION = "1.2.2-comments4";
+var PKG_VERSION = "1.2.2-comments6";
 var PKG_FORMAT = "esm";
 
 // src/ClientSideSuspense.tsx
@@ -32,38 +32,7 @@ import { useSyncExternalStoreWithSelector } from "use-sync-external-store/shim/w
 
 // src/comments/CommentsRoom.ts
 import { makePoller } from "@liveblocks/core";
-
-// ../../node_modules/nanoid/index.js
-import crypto from "crypto";
-
-// ../../node_modules/nanoid/url-alphabet/index.js
-var urlAlphabet = "useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";
-
-// ../../node_modules/nanoid/index.js
-var POOL_SIZE_MULTIPLIER = 128;
-var pool;
-var poolOffset;
-var fillPool = (bytes) => {
-  if (!pool || pool.length < bytes) {
-    pool = Buffer.allocUnsafe(bytes * POOL_SIZE_MULTIPLIER);
-    crypto.randomFillSync(pool);
-    poolOffset = 0;
-  } else if (poolOffset + bytes > pool.length) {
-    crypto.randomFillSync(pool);
-    poolOffset = 0;
-  }
-  poolOffset += bytes;
-};
-var nanoid = (size = 21) => {
-  fillPool(size -= 0);
-  let id = "";
-  for (let i = poolOffset - size; i < poolOffset; i++) {
-    id += urlAlphabet[pool[i] & 63];
-  }
-  return id;
-};
-
-// src/comments/CommentsRoom.ts
+import { nanoid } from "nanoid";
 import { useSyncExternalStore } from "use-sync-external-store/shim/index.js";
 
 // src/comments/errors.ts
@@ -137,6 +106,7 @@ function createStore(initialState) {
 }
 
 // src/comments/CommentsRoom.ts
+import { useEffect as useEffect2 } from "react";
 var POLLING_INTERVAL_REALTIME = 3e4;
 var POLLING_INTERVAL = 5e3;
 var THREAD_ID_PREFIX = "th";
@@ -148,6 +118,7 @@ function createCommentsRoom(room, errorEventSource) {
   const store = createStore({
     isLoading: true
   });
+  let fetchThreadsPromise = null;
   let numberOfMutations = 0;
   function endMutation() {
     numberOfMutations--;
@@ -181,7 +152,11 @@ function createCommentsRoom(room, errorEventSource) {
   async function revalidateThreads() {
     pollingHub.threads.pause();
     if (numberOfMutations === 0) {
-      setThreads(await room.getThreads());
+      if (fetchThreadsPromise === null) {
+        fetchThreadsPromise = room.getThreads();
+      }
+      setThreads(await fetchThreadsPromise);
+      fetchThreadsPromise = null;
     }
     pollingHub.threads.resume();
   }
@@ -202,8 +177,10 @@ function createCommentsRoom(room, errorEventSource) {
       });
     }
     pollingHub.threads.start(getPollingInterval());
-    revalidateThreads();
     return () => {
+      if (store.subscribersCount() > 1) {
+        return;
+      }
       pollingHub.threads.stop();
       unsubscribeRealtimeEvents?.();
       unsubscribeRealtimeEvents = void 0;
@@ -217,6 +194,30 @@ function createCommentsRoom(room, errorEventSource) {
       isLoading: false
     });
   }
+  function useThreadsInternal() {
+    useEffect2(subscribe, []);
+    return useSyncExternalStore(
+      store.subscribe,
+      store.get,
+      store.get
+    );
+  }
+  function useThreads() {
+    useEffect2(() => {
+      void revalidateThreads();
+    }, []);
+    return useThreadsInternal();
+  }
+  function useThreadsSuspense() {
+    const result = useThreadsInternal();
+    if (result.isLoading) {
+      throw revalidateThreads();
+    }
+    if (result.error) {
+      throw result.error;
+    }
+    return result.threads;
+  }
   function getCurrentUserId() {
     const self = room.getSelf();
     if (self === null || self.id === void 0) {
@@ -390,23 +391,6 @@ function createCommentsRoom(room, errorEventSource) {
       )
     ).finally(endMutation);
   }
-  function useThreads() {
-    return useSyncExternalStore(
-      store.subscribe,
-      store.get,
-      store.get
-    );
-  }
-  function useThreadsSuspense() {
-    const result = useThreads();
-    if (result.isLoading) {
-      throw new Promise(store.subscribeOnce);
-    }
-    if (result.error) {
-      throw result.error;
-    }
-    return result.threads;
-  }
   return {
     useThreads,
     useThreadsSuspense,
@@ -414,13 +398,12 @@ function createCommentsRoom(room, errorEventSource) {
     editThreadMetadata,
     createComment,
     editComment,
-    deleteComment,
-    subscribe
+    deleteComment
   };
 }
 
 // src/comments/lib/use-async-cache.ts
-import { useCallback, useEffect as useEffect2, useMemo, useRef as useRef2 } from "react";
+import { useCallback, useEffect as useEffect3, useMemo, useRef as useRef2 } from "react";
 import { useSyncExternalStore as useSyncExternalStore2 } from "use-sync-external-store/shim/index.js";
 
 // src/comments/lib/use-initial.ts
@@ -459,7 +442,7 @@ function useAsyncCache(cache, key, options) {
   const state = useSyncExternalStore2(subscribe, getState, getState);
   const previousData = useRef2();
   let data = state.data;
-  useEffect2(() => {
+  useEffect3(() => {
     previousData.current = { key, data: state.data };
   }, [key, state]);
   if (frozenOptions?.suspense && state.isLoading && cacheItem) {
@@ -480,12 +463,12 @@ function useAsyncCache(cache, key, options) {
 }
 
 // src/comments/lib/use-debounce.ts
-import { useEffect as useEffect3, useRef as useRef3, useState as useState2 } from "react";
+import { useEffect as useEffect4, useRef as useRef3, useState as useState2 } from "react";
 var DEFAULT_DELAY = 500;
 function useDebounce(value, delay = DEFAULT_DELAY) {
   const timeout = useRef3();
   const [debouncedValue, setDebouncedValue] = useState2(value);
-  useEffect3(() => {
+  useEffect4(() => {
     if (delay === false) {
       return;
     }
@@ -519,6 +502,18 @@ function useInitial2(value) {
   return useRef4(value).current;
 }
 
+// src/lib/stable-stringify.ts
+function stableStringify(object, ...args) {
+  const sortedObject = Object.keys(object).sort().reduce(
+    (sortedObject2, key) => {
+      sortedObject2[key] = object[key];
+      return sortedObject2;
+    },
+    {}
+  );
+  return JSON.stringify(sortedObject, ...args);
+}
+
 // src/factory.tsx
 var noop2 = () => {
 };
@@ -573,24 +568,21 @@ function makeMutationContext(room) {
   };
 }
 var hasWarnedIfNoResolveUser = false;
-var hasWarnedIfNoResolveMentionSuggestions = false;
 function warnIfNoResolveUser(usersCache) {
   if (!hasWarnedIfNoResolveUser && !usersCache && process.env.NODE_ENV !== "production") {
-    console.warn("The resolveUser option wasn't set in createRoomContext.");
-    hasWarnedIfNoResolveUser = true;
-  }
-}
-function warnIfNoResolveMentionSuggestions(mentionSuggestionsCache) {
-  if (!hasWarnedIfNoResolveMentionSuggestions && !mentionSuggestionsCache && process.env.NODE_ENV !== "production") {
     console.warn(
-      "The resolveMentionSuggestions option wasn't set in createRoomContext."
+      "Set the resolveUser option in createRoomContext to specify user info."
     );
-    hasWarnedIfNoResolveMentionSuggestions = true;
+    hasWarnedIfNoResolveUser = true;
   }
 }
 var ContextBundle = React2.createContext(null);
 function useRoomContextBundle() {
-  return React2.useContext(ContextBundle);
+  const bundle = React2.useContext(ContextBundle);
+  if (bundle === null) {
+    throw new Error("RoomProvider is missing from the React tree.");
+  }
+  return bundle;
 }
 function createRoomContext(client, options) {
   const RoomContext = React2.createContext(null);
@@ -647,14 +639,21 @@ function createRoomContext(client, options) {
         }
       );
       setRoom(room2);
-      const unsubscribe = getCommentsRoom(room2).subscribe();
       return () => {
-        unsubscribe();
-        commentsRooms.delete(room2.id);
+        const commentsRoom = commentsRooms.get(roomId);
+        if (commentsRoom) {
+          commentsRooms.delete(roomId);
+        }
         client.leave(roomId);
       };
     }, [roomId, frozen]);
-    return /* @__PURE__ */ React2.createElement(RoomContext.Provider, { value: room }, /* @__PURE__ */ React2.createElement(ContextBundle.Provider, { value: bundle }, props.children));
+    return /* @__PURE__ */ React2.createElement(RoomContext.Provider, { value: room }, /* @__PURE__ */ React2.createElement(
+      ContextBundle.Provider,
+      {
+        value: internalBundle
+      },
+      props.children
+    ));
   }
   function connectionIdSelector(others) {
     return others.map((user) => user.connectionId);
@@ -1064,7 +1063,7 @@ function createRoomContext(client, options) {
   }) : void 0;
   function useUser(userId) {
     const resolverKey = React2.useMemo(
-      () => JSON.stringify({ userId }),
+      () => stableStringify({ userId }),
       [userId]
     );
     const state = useAsyncCache(usersCache, resolverKey);
@@ -1083,7 +1082,7 @@ function createRoomContext(client, options) {
   }
   function useUserSuspense(userId) {
     const resolverKey = React2.useMemo(
-      () => JSON.stringify({ userId }),
+      () => stableStringify({ userId }),
       [userId]
     );
     const state = useAsyncCache(usersCache, resolverKey, {
@@ -1107,16 +1106,12 @@ function createRoomContext(client, options) {
     const room = useRoom();
     const debouncedSearch = useDebounce(search, 500);
     const resolverKey = React2.useMemo(
-      () => debouncedSearch !== void 0 ? JSON.stringify({ text: debouncedSearch, roomId: room.id }) : null,
+      () => debouncedSearch !== void 0 ? stableStringify({ text: debouncedSearch, roomId: room.id }) : null,
       [debouncedSearch, room.id]
     );
     const { data } = useAsyncCache(mentionSuggestionsCache, resolverKey, {
       keepPreviousDataWhileLoading: true
     });
-    React2.useEffect(
-      () => warnIfNoResolveMentionSuggestions(mentionSuggestionsCache),
-      []
-    );
     return data;
   }
   const bundle = {
@@ -1155,7 +1150,6 @@ function createRoomContext(client, options) {
     useCreateComment,
     useEditComment,
     useDeleteComment,
-    useMentionSuggestions,
     suspense: {
       RoomContext,
       RoomProvider,
@@ -1194,6 +1188,11 @@ function createRoomContext(client, options) {
       useDeleteComment
     }
   };
+  const internalBundle = {
+    ...bundle,
+    hasResolveMentionSuggestions: resolveMentionSuggestions !== void 0,
+    useMentionSuggestions
+  };
   return bundle;
 }