@liveblocks/react 1.10.0-beta1 → 1.10.0-beta2

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.0-beta1";
+var PKG_VERSION = "1.10.0-beta2";
 var PKG_FORMAT = "esm";
 
 // src/ClientSideSuspense.tsx
@@ -164,7 +164,7 @@ import {
 } from "@liveblocks/core";
 function selectedThreads(roomId, state, options) {
   const result = applyOptimisticUpdates3(state);
-  return Object.values(result.threads).filter((thread) => {
+  const threads = Object.values(result.threads).filter((thread) => {
     if (thread.roomId !== roomId)
       return false;
     const query = options.query;
@@ -177,6 +177,7 @@ function selectedThreads(roomId, state, options) {
     }
     return true;
   });
+  return threads.sort((a, b) => a.createdAt.getTime() - b.createdAt.getTime());
 }
 
 // src/comments/lib/upsert-comment.ts
@@ -299,7 +300,17 @@ function useRoomContextBundle() {
   }
   return bundle;
 }
-function createRoomContext(client) {
+function createRoomContext(client, options) {
+  if (options?.resolveUsers) {
+    throw new Error(
+      "The 'resolveUsers' option has moved to 'createClient' from '@liveblocks/client'. Please refer to our Upgrade Guide to learn more, see https://liveblocks.io/docs/platform/upgrading/1.10."
+    );
+  }
+  if (options?.resolveMentionSuggestions) {
+    throw new Error(
+      "The 'resolveMentionSuggestions' option has moved to 'createClient' from '@liveblocks/client'. Please refer to our Upgrade Guide to learn more, see https://liveblocks.io/docs/platform/upgrading/1.10."
+    );
+  }
   const RoomContext = React2.createContext(null);
   const commentsErrorEventSource = makeEventSource();
   const shared = createSharedContext(client);
@@ -308,13 +319,13 @@ function createRoomContext(client) {
       () => /* @__PURE__ */ new Map()
     );
     const stableEnterRoom = React2.useCallback(
-      (roomId, options) => {
+      (roomId, options2) => {
         const cached = cache.get(roomId);
         if (cached)
           return cached;
         const rv = client.enterRoom(
           roomId,
-          options
+          options2
         );
         const origLeave = rv.leave;
         rv.leave = () => {
@@ -507,8 +518,8 @@ function createRoomContext(client) {
   function useBroadcastEvent() {
     const room = useRoom();
     return React2.useCallback(
-      (event, options = { shouldQueueEventIfNotReady: false }) => {
-        room.broadcastEvent(event, options);
+      (event, options2 = { shouldQueueEventIfNotReady: false }) => {
+        room.broadcastEvent(event, options2);
       },
       [room]
     );
@@ -839,7 +850,7 @@ function createRoomContext(client) {
     }
     poller.start(POLLING_INTERVAL);
   }
-  async function getThreadsAndInboxNotifications(room, queryKey, options) {
+  async function getThreadsAndInboxNotifications(room, queryKey, options2) {
     const roomId = room.id;
     return getOrInitRequest(
       queryKey,
@@ -848,7 +859,7 @@ function createRoomContext(client) {
         if (room2 === null) {
           return;
         }
-        return room2.getThreads(options);
+        return room2.getThreads(options2);
       },
       (result) => {
         if (result !== void 0) {
@@ -861,21 +872,18 @@ function createRoomContext(client) {
       }
     );
   }
-  function useThreads(options = { query: { metadata: {} } }) {
+  function useThreads(options2 = { query: { metadata: {} } }) {
     const room = useRoom();
     const queryKey = React2.useMemo(
-      () => generateQueryKey(room.id, options.query),
-      [room, options]
+      () => generateQueryKey(room.id, options2.query),
+      [room, options2]
     );
     React2.useEffect(() => {
-      void getThreadsAndInboxNotifications(room, queryKey, options);
+      void getThreadsAndInboxNotifications(room, queryKey, options2);
       incrementQuerySubscribers(queryKey);
       return () => decrementQuerySubscribers(queryKey);
     }, [room, queryKey]);
-    return useSyncExternalStoreWithSelector(
-      store.subscribe,
-      store.get,
-      store.get,
+    const selector = React2.useCallback(
       (state) => {
         if (state.queries[queryKey] === void 0 || state.queries[queryKey].isLoading) {
           return {
@@ -883,26 +891,44 @@ function createRoomContext(client) {
           };
         }
         return {
-          threads: selectedThreads(room.id, state, options),
+          threads: selectedThreads(room.id, state, options2),
           isLoading: false,
           error: state.queries[queryKey].error
         };
-      }
+      },
+      [room, queryKey]
+      // eslint-disable-line react-hooks/exhaustive-deps
+    );
+    return useSyncExternalStoreWithSelector(
+      store.subscribe,
+      store.get,
+      store.get,
+      selector
     );
   }
-  function useThreadsSuspense(options = { query: { metadata: {} } }) {
+  function useThreadsSuspense(options2 = { query: { metadata: {} } }) {
     const room = useRoom();
     const queryKey = React2.useMemo(
-      () => generateQueryKey(room.id, options?.query),
-      [room, options]
+      () => generateQueryKey(room.id, options2?.query),
+      [room, options2]
     );
     const query = store.get().queries[queryKey];
     if (query === void 0 || query.isLoading) {
-      throw getThreadsAndInboxNotifications(room, queryKey, options);
+      throw getThreadsAndInboxNotifications(room, queryKey, options2);
     }
     if (query.error) {
       throw query.error;
     }
+    const selector = React2.useCallback(
+      (state) => {
+        return {
+          threads: selectedThreads(room.id, state, options2),
+          isLoading: false
+        };
+      },
+      [room, queryKey]
+      // eslint-disable-line react-hooks/exhaustive-deps
+    );
     React2.useEffect(() => {
       incrementQuerySubscribers(queryKey);
       return () => {
@@ -913,20 +939,15 @@ function createRoomContext(client) {
       store.subscribe,
       store.get,
       store.get,
-      (state) => {
-        return {
-          threads: selectedThreads(room.id, state, options),
-          isLoading: false
-        };
-      }
+      selector
     );
   }
   function useCreateThread() {
     const room = useRoom();
     return React2.useCallback(
-      (options) => {
-        const body = options.body;
-        const metadata = "metadata" in options ? options.metadata : {};
+      (options2) => {
+        const body = options2.body;
+        const metadata = "metadata" in options2 ? options2.metadata : {};
         const threadId = createThreadId();
         const commentId = createCommentId();
         const now = /* @__PURE__ */ new Date();
@@ -987,12 +1008,12 @@ function createRoomContext(client) {
   function useEditThreadMetadata() {
     const room = useRoom();
     return React2.useCallback(
-      (options) => {
-        if (!("metadata" in options)) {
+      (options2) => {
+        if (!("metadata" in options2)) {
           return;
         }
-        const threadId = options.threadId;
-        const metadata = options.metadata;
+        const threadId = options2.threadId;
+        const metadata = options2.metadata;
         const optimisticUpdateId = nanoid2();
         store.pushOptimisticUpdate({
           type: "edit-thread-metadata",