@liveblocks/react 1.10.3 → 1.11.0-test1

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.10.3";
+var PKG_VERSION = "1.11.0-test1";
 var PKG_FORMAT = "esm";
 
 // src/ClientSideSuspense.tsx
@@ -895,7 +895,33 @@ function createRoomContext(client, options) {
       return;
     }
   }
-  function useThreads(options2 = { query: { metadata: {} } }) {
+  function handleScrollToCommentOnLoad(isQueryLoading, shouldScrollOnLoad, state) {
+    if (shouldScrollOnLoad === false)
+      return;
+    if (isQueryLoading === true)
+      return;
+    const isWindowDefined = typeof window !== "undefined";
+    if (!isWindowDefined)
+      return;
+    const hash = window.location.hash;
+    const commentId = hash.slice(1);
+    if (!commentId.startsWith("cm_"))
+      return;
+    const comment = document.getElementById(commentId);
+    if (comment === null)
+      return;
+    const comments = state.threads.flatMap((thread) => thread.comments);
+    const isCommentInThreads = comments.some(
+      (comment2) => comment2.id === commentId
+    );
+    if (!isCommentInThreads)
+      return;
+    comment.scrollIntoView();
+  }
+  function useThreads(options2 = {
+    query: { metadata: {} }
+  }) {
+    const { scrollOnLoad = true } = options2;
     const room = useRoom();
     const queryKey = React2.useMemo(
       () => generateQueryKey(room.id, options2.query),
@@ -907,15 +933,15 @@ function createRoomContext(client, options) {
       return () => decrementQuerySubscribers(queryKey);
     }, [room, queryKey]);
     const selector = React2.useCallback(
-      (state) => {
-        const query = state.queries[queryKey];
+      (state2) => {
+        const query = state2.queries[queryKey];
         if (query === void 0 || query.isLoading) {
           return {
             isLoading: true
           };
         }
         return {
-          threads: selectedThreads(room.id, state, options2),
+          threads: selectedThreads(room.id, state2, options2),
           isLoading: false,
           error: query.error
         };
@@ -923,17 +949,30 @@ function createRoomContext(client, options) {
       [room, queryKey]
       // eslint-disable-line react-hooks/exhaustive-deps
     );
-    return useSyncExternalStoreWithSelector(
+    const state = useSyncExternalStoreWithSelector(
       store.subscribe,
       store.get,
       store.get,
       selector
     );
+    React2.useEffect(
+      () => {
+        if (state.isLoading === true)
+          return;
+        handleScrollToCommentOnLoad(state.isLoading, scrollOnLoad, state);
+      },
+      // eslint-disable-next-line react-hooks/exhaustive-deps -- We only want to run this effect once
+      [state.isLoading]
+    );
+    return state;
   }
-  function useThreadsSuspense(options2 = { query: { metadata: {} } }) {
+  function useThreadsSuspense(options2 = {
+    query: { metadata: {} }
+  }) {
+    const { scrollOnLoad = true } = options2;
     const room = useRoom();
     const queryKey = React2.useMemo(
-      () => generateQueryKey(room.id, options2?.query),
+      () => generateQueryKey(room.id, options2.query),
       [room, options2]
     );
     const query = store.get().queries[queryKey];
@@ -944,9 +983,9 @@ function createRoomContext(client, options) {
       throw query.error;
     }
     const selector = React2.useCallback(
-      (state) => {
+      (state2) => {
         return {
-          threads: selectedThreads(room.id, state, options2),
+          threads: selectedThreads(room.id, state2, options2),
           isLoading: false
         };
       },
@@ -959,12 +998,20 @@ function createRoomContext(client, options) {
         decrementQuerySubscribers(queryKey);
       };
     }, [queryKey]);
-    return useSyncExternalStoreWithSelector(
+    const state = useSyncExternalStoreWithSelector(
       store.subscribe,
       store.get,
       store.get,
       selector
     );
+    React2.useEffect(
+      () => {
+        handleScrollToCommentOnLoad(state.isLoading, scrollOnLoad, state);
+      },
+      // eslint-disable-next-line react-hooks/exhaustive-deps -- We only want to run this effect once
+      [state.isLoading]
+    );
+    return state;
   }
   function useCreateThread() {
     const room = useRoom();
@@ -1804,6 +1851,12 @@ function useSharedContextBundle() {
     );
   }
 }
+var missingUserError = new Error(
+  "resolveUsers didn't return anything for this user ID."
+);
+var missingRoomInfoError = new Error(
+  "resolveRoomsInfo didn't return anything for this room ID."
+);
 function createSharedContext(client) {
   const usersStore = client[kInternal2].usersStore;
   const roomsInfoStore = client[kInternal2].roomsInfoStore;
@@ -1821,8 +1874,10 @@ function createSharedContext(client) {
       getUserState
     );
     return state ? {
-      ...state,
-      user: state.data
+      isLoading: state.isLoading,
+      user: state.data,
+      // Return an error if `undefined` was returned by `resolveUsers` for this user ID
+      error: !state.isLoading && !state.data && !state.error ? missingUserError : state.error
     } : { isLoading: true };
   }
   function useUserSuspense(userId) {
@@ -1837,14 +1892,18 @@ function createSharedContext(client) {
     if (userState.error) {
       throw userState.error;
     }
+    if (!userState.data) {
+      throw missingUserError;
+    }
     const state = useSyncExternalStore2(
       usersStore.subscribe,
       getUserState,
       getUserState
     );
     return {
-      ...state,
-      user: state?.data
+      isLoading: false,
+      user: state?.data,
+      error: state?.error
     };
   }
   function useRoomInfo(roomId) {
@@ -1861,8 +1920,10 @@ function createSharedContext(client) {
       getRoomInfoState
     );
     return state ? {
-      ...state,
-      info: state.data
+      isLoading: state.isLoading,
+      info: state.data,
+      // Return an error if `undefined` was returned by `resolveRoomsInfo` for this room ID
+      error: !state.isLoading && !state.data && !state.error ? missingRoomInfoError : state.error
     } : { isLoading: true };
   }
   function useRoomInfoSuspense(roomId) {
@@ -1877,14 +1938,18 @@ function createSharedContext(client) {
     if (roomInfoState.error) {
       throw roomInfoState.error;
     }
+    if (!roomInfoState.data) {
+      throw missingRoomInfoError;
+    }
     const state = useSyncExternalStore2(
       roomsInfoStore.subscribe,
       getRoomInfoState,
       getRoomInfoState
     );
     return {
-      ...state,
-      info: state?.data
+      isLoading: false,
+      info: state?.data,
+      error: state?.error
     };
   }
   const bundle = {