@liveblocks/react 2.8.0-beta2 → 2.8.0-beta4

package/dist/{chunk-OBLKSEC3.mjs → chunk-G35ZEFD6.mjs}

@@ -1,6 +1,6 @@
 // src/version.ts
 var PKG_NAME = "@liveblocks/react";
-var PKG_VERSION = "2.8.0-beta2";
+var PKG_VERSION = "2.8.0-beta4";
 var PKG_FORMAT = "esm";
 
 // src/ClientSideSuspense.tsx
@@ -182,30 +182,35 @@ import {
   nanoid,
   nn
 } from "@liveblocks/core";
-var QUERY_STATE_LOADING = Object.freeze({ isLoading: true });
-var QUERY_STATE_OK = Object.freeze({ isLoading: false, data: void 0 });
-var INBOX_NOTIFICATIONS_QUERY = "INBOX_NOTIFICATIONS";
+var ASYNC_LOADING = Object.freeze({ isLoading: true });
+var ASYNC_OK = Object.freeze({ isLoading: false, data: void 0 });
 function makeNotificationSettingsQueryKey(roomId) {
   return `${roomId}:NOTIFICATION_SETTINGS`;
 }
+function makeVersionsQueryKey(roomId) {
+  return `${roomId}-VERSIONS`;
+}
 var UmbrellaStore = class {
   constructor() {
     this._prevState = null;
     this._stateCached = null;
     this._store = createStore({
       rawThreadsById: {},
-      queries: {},
+      // queries: {},
+      query1: void 0,
+      queries2: {},
+      queries3: {},
+      queries4: {},
       optimisticUpdates: [],
       inboxNotificationsById: {},
       notificationSettingsByRoomId: {},
       versionsByRoomId: {}
     });
-    this.getThreads = this.getThreads.bind(this);
-    this.getInboxNotifications = this.getInboxNotifications.bind(this);
+    this.getFullState = this.getFullState.bind(this);
     this.getInboxNotificationsAsync = this.getInboxNotificationsAsync.bind(this);
-    this.getVersions = this.getVersions.bind(this);
     this.subscribeThreads = this.subscribeThreads.bind(this);
-    this.subscribeInboxNotifications = this.subscribeInboxNotifications.bind(this);
+    this.subscribeUserThreads = this.subscribeUserThreads.bind(this);
+    this.subscribeThreadsOrInboxNotifications = this.subscribeThreadsOrInboxNotifications.bind(this);
     this.subscribeNotificationSettings = this.subscribeNotificationSettings.bind(this);
     this.subscribeVersions = this.subscribeVersions.bind(this);
     this._hasOptimisticUpdates = this._hasOptimisticUpdates.bind(this);
@@ -219,31 +224,59 @@ var UmbrellaStore = class {
     }
     return this._stateCached;
   }
-  getThreads() {
-    return this.get();
+  batch(callback) {
+    return this._store.batch(callback);
   }
-  getInboxNotifications() {
+  getFullState() {
     return this.get();
   }
+  /**
+   * Returns the async result of the given queryKey. If the query is success,
+   * then it will return the entire store's state in the payload.
+   */
+  // TODO: This return type is a bit weird! Feels like we haven't found the
+  // right abstraction here yet.
+  getThreadsAsync(queryKey) {
+    const internalState = this._store.get();
+    const query = internalState.queries2[queryKey];
+    if (query === void 0 || query.isLoading) {
+      return ASYNC_LOADING;
+    }
+    if (query.error) {
+      return query;
+    }
+    return { isLoading: false, fullState: this.getFullState() };
+  }
+  getUserThreadsAsync(queryKey) {
+    const internalState = this._store.get();
+    const query = internalState.queries2[queryKey];
+    if (query === void 0 || query.isLoading) {
+      return ASYNC_LOADING;
+    }
+    if (query.error) {
+      return query;
+    }
+    return { isLoading: false, fullState: this.getFullState() };
+  }
   // NOTE: This will read the async result, but WILL NOT start loading at the moment!
   getInboxNotificationsAsync() {
     const internalState = this._store.get();
-    const query = internalState.queries[INBOX_NOTIFICATIONS_QUERY];
+    const query = internalState.query1;
     if (query === void 0 || query.isLoading) {
-      return QUERY_STATE_LOADING;
+      return ASYNC_LOADING;
     }
     if (query.error !== void 0) {
       return query;
     }
-    const inboxNotifications = this.get().inboxNotifications;
+    const inboxNotifications = this.getFullState().inboxNotifications;
     return { isLoading: false, inboxNotifications };
   }
   // NOTE: This will read the async result, but WILL NOT start loading at the moment!
   getNotificationSettingsAsync(roomId) {
     const state = this.get();
-    const query = state.queries[makeNotificationSettingsQueryKey(roomId)];
+    const query = state.queries3[makeNotificationSettingsQueryKey(roomId)];
     if (query === void 0 || query.isLoading) {
-      return QUERY_STATE_LOADING;
+      return ASYNC_LOADING;
     }
     if (query.error !== void 0) {
       return query;
@@ -253,8 +286,19 @@ var UmbrellaStore = class {
       settings: nn(state.notificationSettingsByRoomId[roomId])
     };
   }
-  getVersions() {
-    return this.get();
+  getVersionsAsync(roomId) {
+    const state = this.get();
+    const query = state.queries4[makeVersionsQueryKey(roomId)];
+    if (query === void 0 || query.isLoading) {
+      return ASYNC_LOADING;
+    }
+    if (query.error !== void 0) {
+      return query;
+    }
+    return {
+      isLoading: false,
+      versions: nn(state.versionsByRoomId[roomId])
+    };
   }
   /**
    * @private Only used by the E2E test suite.
@@ -274,7 +318,10 @@ var UmbrellaStore = class {
   subscribeThreads(callback) {
     return this.subscribe(callback);
   }
-  subscribeInboxNotifications(callback) {
+  subscribeUserThreads(callback) {
+    return this.subscribe(callback);
+  }
+  subscribeThreadsOrInboxNotifications(callback) {
     return this.subscribe(callback);
   }
   subscribeNotificationSettings(callback) {
@@ -314,11 +361,35 @@ var UmbrellaStore = class {
       }
     }));
   }
-  setQueryState(queryKey, queryState) {
+  setQuery1State(queryState) {
+    this._store.set((state) => ({
+      ...state,
+      query1: queryState
+    }));
+  }
+  setQuery2State(queryKey, queryState) {
+    this._store.set((state) => ({
+      ...state,
+      queries2: {
+        ...state.queries2,
+        [queryKey]: queryState
+      }
+    }));
+  }
+  setQuery3State(queryKey, queryState) {
+    this._store.set((state) => ({
+      ...state,
+      queries3: {
+        ...state.queries3,
+        [queryKey]: queryState
+      }
+    }));
+  }
+  setQuery4State(queryKey, queryState) {
     this._store.set((state) => ({
       ...state,
-      queries: {
-        ...state.queries,
+      queries4: {
+        ...state.queries4,
         [queryKey]: queryState
       }
     }));
@@ -531,7 +602,7 @@ var UmbrellaStore = class {
       }
     });
   }
-  updateThreadsAndNotifications(threads, inboxNotifications, deletedThreads, deletedInboxNotifications, queryKey) {
+  updateThreadsAndNotifications(threads, inboxNotifications, deletedThreads, deletedInboxNotifications) {
     this._store.batch(() => {
       this.updateThreadsCache(
         (cache) => applyThreadUpdates(cache, {
@@ -545,9 +616,6 @@ var UmbrellaStore = class {
           deletedNotifications: deletedInboxNotifications
         })
       );
-      if (queryKey !== void 0) {
-        this.setQueryOK(queryKey);
-      }
     });
   }
   /**
@@ -562,7 +630,7 @@ var UmbrellaStore = class {
   }
   updateRoomInboxNotificationSettings(roomId, settings, queryKey) {
     this._store.batch(() => {
-      this.setQueryOK(queryKey);
+      this.setQuery3OK(queryKey);
       this.setNotificationSettings(roomId, settings);
     });
   }
@@ -570,7 +638,7 @@ var UmbrellaStore = class {
     this._store.batch(() => {
       this.setVersions(roomId, versions);
       if (queryKey !== void 0) {
-        this.setQueryOK(queryKey);
+        this.setQuery4OK(queryKey);
       }
     });
   }
@@ -588,30 +656,61 @@ var UmbrellaStore = class {
   //
   // Query State APIs
   //
-  setQueryLoading(queryKey) {
-    this.setQueryState(queryKey, QUERY_STATE_LOADING);
+  // Query 1
+  setQuery1Loading() {
+    this.setQuery1State(ASYNC_LOADING);
+  }
+  setQuery1OK() {
+    this.setQuery1State(ASYNC_OK);
+  }
+  setQuery1Error(error) {
+    this.setQuery1State({ isLoading: false, error });
+  }
+  // Query 2
+  setQuery2Loading(queryKey) {
+    this.setQuery2State(queryKey, ASYNC_LOADING);
+  }
+  setQuery2OK(queryKey) {
+    this.setQuery2State(queryKey, ASYNC_OK);
+  }
+  setQuery2Error(queryKey, error) {
+    this.setQuery2State(queryKey, { isLoading: false, error });
+  }
+  // Query 3
+  setQuery3Loading(queryKey) {
+    this.setQuery3State(queryKey, ASYNC_LOADING);
   }
-  setQueryOK(queryKey) {
-    this.setQueryState(queryKey, QUERY_STATE_OK);
+  setQuery3OK(queryKey) {
+    this.setQuery3State(queryKey, ASYNC_OK);
   }
-  setQueryError(queryKey, error) {
-    this.setQueryState(queryKey, { isLoading: false, error });
+  setQuery3Error(queryKey, error) {
+    this.setQuery3State(queryKey, { isLoading: false, error });
+  }
+  // Query 4
+  setQuery4Loading(queryKey) {
+    this.setQuery4State(queryKey, ASYNC_LOADING);
+  }
+  setQuery4OK(queryKey) {
+    this.setQuery4State(queryKey, ASYNC_OK);
+  }
+  setQuery4Error(queryKey, error) {
+    this.setQuery4State(queryKey, { isLoading: false, error });
   }
 };
 function internalToExternalState(state) {
-  const output = {
-    threads: { ...state.rawThreadsById },
-    inboxNotifications: { ...state.inboxNotificationsById },
-    notificationSettings: { ...state.notificationSettingsByRoomId }
+  const computed = {
+    threadsById: { ...state.rawThreadsById },
+    inboxNotificationsById: { ...state.inboxNotificationsById },
+    notificationSettingsByRoomId: { ...state.notificationSettingsByRoomId }
   };
   for (const optimisticUpdate of state.optimisticUpdates) {
     switch (optimisticUpdate.type) {
       case "create-thread": {
-        output.threads[optimisticUpdate.thread.id] = optimisticUpdate.thread;
+        computed.threadsById[optimisticUpdate.thread.id] = optimisticUpdate.thread;
         break;
       }
       case "edit-thread-metadata": {
-        const thread = output.threads[optimisticUpdate.threadId];
+        const thread = computed.threadsById[optimisticUpdate.threadId];
         if (thread === void 0) {
           break;
         }
@@ -621,7 +720,7 @@ function internalToExternalState(state) {
         if (thread.updatedAt !== void 0 && thread.updatedAt > optimisticUpdate.updatedAt) {
           break;
         }
-        output.threads[thread.id] = {
+        computed.threadsById[thread.id] = {
           ...thread,
           updatedAt: optimisticUpdate.updatedAt,
           metadata: {
@@ -632,49 +731,51 @@ function internalToExternalState(state) {
         break;
       }
       case "mark-thread-as-resolved": {
-        const thread = output.threads[optimisticUpdate.threadId];
+        const thread = computed.threadsById[optimisticUpdate.threadId];
         if (thread === void 0) {
           break;
         }
         if (thread.deletedAt !== void 0) {
           break;
         }
-        output.threads[thread.id] = {
+        computed.threadsById[thread.id] = {
           ...thread,
           resolved: true
         };
         break;
       }
       case "mark-thread-as-unresolved": {
-        const thread = output.threads[optimisticUpdate.threadId];
+        const thread = computed.threadsById[optimisticUpdate.threadId];
         if (thread === void 0) {
           break;
         }
         if (thread.deletedAt !== void 0) {
           break;
         }
-        output.threads[thread.id] = {
+        computed.threadsById[thread.id] = {
           ...thread,
           resolved: false
         };
         break;
       }
       case "create-comment": {
-        const thread = output.threads[optimisticUpdate.comment.threadId];
+        const thread = computed.threadsById[optimisticUpdate.comment.threadId];
         if (thread === void 0) {
           break;
         }
-        output.threads[thread.id] = applyUpsertComment(
+        computed.threadsById[thread.id] = applyUpsertComment(
           thread,
           optimisticUpdate.comment
         );
-        const inboxNotification = Object.values(output.inboxNotifications).find(
+        const inboxNotification = Object.values(
+          computed.inboxNotificationsById
+        ).find(
           (notification) => notification.kind === "thread" && notification.threadId === thread.id
         );
         if (inboxNotification === void 0) {
           break;
         }
-        output.inboxNotifications[inboxNotification.id] = {
+        computed.inboxNotificationsById[inboxNotification.id] = {
           ...inboxNotification,
           notifiedAt: optimisticUpdate.comment.createdAt,
           readAt: optimisticUpdate.comment.createdAt
@@ -682,22 +783,22 @@ function internalToExternalState(state) {
         break;
       }
       case "edit-comment": {
-        const thread = output.threads[optimisticUpdate.comment.threadId];
+        const thread = computed.threadsById[optimisticUpdate.comment.threadId];
         if (thread === void 0) {
           break;
         }
-        output.threads[thread.id] = applyUpsertComment(
+        computed.threadsById[thread.id] = applyUpsertComment(
           thread,
           optimisticUpdate.comment
         );
         break;
       }
       case "delete-comment": {
-        const thread = output.threads[optimisticUpdate.threadId];
+        const thread = computed.threadsById[optimisticUpdate.threadId];
         if (thread === void 0) {
           break;
         }
-        output.threads[thread.id] = applyDeleteComment(
+        computed.threadsById[thread.id] = applyDeleteComment(
           thread,
           optimisticUpdate.commentId,
           optimisticUpdate.deletedAt
@@ -705,12 +806,12 @@ function internalToExternalState(state) {
         break;
       }
       case "delete-thread": {
-        const thread = output.threads[optimisticUpdate.threadId];
+        const thread = computed.threadsById[optimisticUpdate.threadId];
         if (thread === void 0) {
           break;
         }
-        output.threads[optimisticUpdate.threadId] = {
-          ...output.threads[optimisticUpdate.threadId],
+        computed.threadsById[optimisticUpdate.threadId] = {
+          ...thread,
           deletedAt: optimisticUpdate.deletedAt,
           updatedAt: optimisticUpdate.deletedAt,
           comments: []
@@ -718,11 +819,11 @@ function internalToExternalState(state) {
         break;
       }
       case "add-reaction": {
-        const thread = output.threads[optimisticUpdate.threadId];
+        const thread = computed.threadsById[optimisticUpdate.threadId];
         if (thread === void 0) {
           break;
         }
-        output.threads[thread.id] = applyAddReaction(
+        computed.threadsById[thread.id] = applyAddReaction(
           thread,
           optimisticUpdate.commentId,
           optimisticUpdate.reaction
@@ -730,11 +831,11 @@ function internalToExternalState(state) {
         break;
       }
       case "remove-reaction": {
-        const thread = output.threads[optimisticUpdate.threadId];
+        const thread = computed.threadsById[optimisticUpdate.threadId];
         if (thread === void 0) {
           break;
         }
-        output.threads[thread.id] = applyRemoveReaction(
+        computed.threadsById[thread.id] = applyRemoveReaction(
           thread,
           optimisticUpdate.commentId,
           optimisticUpdate.emoji,
@@ -744,36 +845,41 @@ function internalToExternalState(state) {
         break;
       }
       case "mark-inbox-notification-as-read": {
-        output.inboxNotifications[optimisticUpdate.inboxNotificationId] = {
-          ...state.inboxNotificationsById[optimisticUpdate.inboxNotificationId],
-          readAt: optimisticUpdate.readAt
-        };
+        const ibn = computed.inboxNotificationsById[optimisticUpdate.inboxNotificationId];
+        if (ibn === void 0) {
+          break;
+        }
+        computed.inboxNotificationsById[optimisticUpdate.inboxNotificationId] = { ...ibn, readAt: optimisticUpdate.readAt };
         break;
       }
       case "mark-all-inbox-notifications-as-read": {
-        for (const id in output.inboxNotifications) {
-          output.inboxNotifications[id] = {
-            ...output.inboxNotifications[id],
+        for (const id in computed.inboxNotificationsById) {
+          const ibn = computed.inboxNotificationsById[id];
+          if (ibn === void 0) {
+            break;
+          }
+          computed.inboxNotificationsById[id] = {
+            ...ibn,
             readAt: optimisticUpdate.readAt
           };
         }
         break;
       }
       case "delete-inbox-notification": {
-        const {
-          [optimisticUpdate.inboxNotificationId]: _,
-          ...inboxNotifications
-        } = output.inboxNotifications;
-        output.inboxNotifications = inboxNotifications;
+        delete computed.inboxNotificationsById[optimisticUpdate.inboxNotificationId];
         break;
       }
       case "delete-all-inbox-notifications": {
-        output.inboxNotifications = {};
+        computed.inboxNotificationsById = {};
         break;
       }
       case "update-notification-settings": {
-        output.notificationSettings[optimisticUpdate.roomId] = {
-          ...output.notificationSettings[optimisticUpdate.roomId],
+        const settings = computed.notificationSettingsByRoomId[optimisticUpdate.roomId];
+        if (settings === void 0) {
+          break;
+        }
+        computed.notificationSettingsByRoomId[optimisticUpdate.roomId] = {
+          ...settings,
           ...optimisticUpdate.settings
         };
       }
@@ -781,23 +887,28 @@ function internalToExternalState(state) {
   }
   const cleanedThreads = (
     // Don't expose any soft-deleted threads
-    Object.values(output.threads).filter(
-      (thread) => !thread.deletedAt
+    Object.values(computed.threadsById).filter((thread) => !thread.deletedAt).filter(
+      (thread) => (
+        // Only keep a thread if there is at least one non-deleted comment
+        thread.comments.some((c) => c.deletedAt === void 0)
+      )
     )
   );
   const cleanedNotifications = (
     // Sort so that the most recent notifications are first
-    Object.values(output.inboxNotifications).sort(
-      (a, b) => b.notifiedAt.getTime() - a.notifiedAt.getTime()
-    )
+    Object.values(computed.inboxNotificationsById).filter(
+      (ibn) => ibn.kind === "thread" ? computed.threadsById[ibn.threadId] && computed.threadsById[ibn.threadId]?.deletedAt === void 0 : true
+    ).sort((a, b) => b.notifiedAt.getTime() - a.notifiedAt.getTime())
   );
   return {
     inboxNotifications: cleanedNotifications,
-    inboxNotificationsById: output.inboxNotifications,
-    notificationSettingsByRoomId: output.notificationSettings,
-    queries: state.queries,
+    inboxNotificationsById: computed.inboxNotificationsById,
+    notificationSettingsByRoomId: computed.notificationSettingsByRoomId,
+    queries2: state.queries2,
+    queries3: state.queries3,
+    queries4: state.queries4,
     threads: cleanedThreads,
-    threadsById: output.threads,
+    threadsById: computed.threadsById,
     versionsByRoomId: state.versionsByRoomId
   };
 }
@@ -919,12 +1030,11 @@ function applyDeleteComment(thread, commentId, deletedAt) {
       attachments: []
     } : comment
   );
-  if (!updatedComments.some((comment) => comment.deletedAt === void 0)) {
+  if (updatedComments.every((comment) => comment.deletedAt !== void 0)) {
     return {
       ...thread,
       deletedAt,
-      updatedAt: deletedAt,
-      comments: []
+      updatedAt: deletedAt
     };
   }
   return {
@@ -1133,25 +1243,29 @@ function makeExtrasForClient(client) {
   async function fetchInboxNotifications() {
     if (lastRequestedAt === void 0) {
       const result = await client.getInboxNotifications();
-      store.updateThreadsAndNotifications(
-        result.threads,
-        result.inboxNotifications,
-        [],
-        [],
-        INBOX_NOTIFICATIONS_QUERY
-      );
+      store.batch(() => {
+        store.updateThreadsAndNotifications(
+          result.threads,
+          result.inboxNotifications,
+          [],
+          []
+        );
+        store.setQuery1OK();
+      });
       lastRequestedAt = result.requestedAt;
     } else {
       const result = await client.getInboxNotificationsSince({
         since: lastRequestedAt
       });
-      store.updateThreadsAndNotifications(
-        result.threads.updated,
-        result.inboxNotifications.updated,
-        result.threads.deleted,
-        result.inboxNotifications.deleted,
-        INBOX_NOTIFICATIONS_QUERY
-      );
+      store.batch(() => {
+        store.updateThreadsAndNotifications(
+          result.threads.updated,
+          result.inboxNotifications.updated,
+          result.threads.deleted,
+          result.inboxNotifications.deleted
+        );
+        store.setQuery1OK();
+      });
       if (lastRequestedAt < result.requestedAt) {
         lastRequestedAt = result.requestedAt;
       }
@@ -1167,7 +1281,7 @@ function makeExtrasForClient(client) {
     }
   });
   const waitUntilInboxNotificationsLoaded = memoizeOnSuccess(async () => {
-    store.setQueryLoading(INBOX_NOTIFICATIONS_QUERY);
+    store.setQuery1Loading();
     try {
       await autoRetry(
         () => fetchInboxNotifications(),
@@ -1175,7 +1289,7 @@ function makeExtrasForClient(client) {
         [5e3, 5e3, 1e4, 15e3]
       );
     } catch (err) {
-      store.setQueryError(INBOX_NOTIFICATIONS_QUERY, err);
+      store.setQuery1Error(err);
       throw err;
     }
   });
@@ -1183,23 +1297,21 @@ function makeExtrasForClient(client) {
     void waitUntilInboxNotificationsLoaded().catch(() => {
     });
   }
-  function useEnableInboxNotificationsPolling() {
-    useEffect3(() => {
-      pollerSubscribers++;
-      poller.start(POLLING_INTERVAL);
-      return () => {
-        if (pollerSubscribers <= 0) {
-          console.warn(
-            `Internal unexpected behavior. Cannot decrease subscriber count for query "${INBOX_NOTIFICATIONS_QUERY}"`
-          );
-          return;
-        }
-        pollerSubscribers--;
-        if (pollerSubscribers <= 0) {
-          poller.stop();
-        }
-      };
-    }, []);
+  function startPolling() {
+    pollerSubscribers++;
+    poller.start(POLLING_INTERVAL);
+    return () => {
+      if (pollerSubscribers <= 0) {
+        console.warn(
+          "Unexpected internal error: cannot decrease subscriber count for inbox notifications."
+        );
+        return;
+      }
+      pollerSubscribers--;
+      if (pollerSubscribers <= 0) {
+        poller.stop();
+      }
+    };
   }
   const userThreadsPoller = makePoller(refreshUserThreads);
   let isFetchingUserThreadsUpdates = false;
@@ -1214,13 +1326,15 @@ function makeExtrasForClient(client) {
         since
       });
       isFetchingUserThreadsUpdates = false;
-      store.updateThreadsAndNotifications(
-        updates.threads.updated,
-        [],
-        updates.threads.deleted,
-        [],
-        USER_THREADS_QUERY
-      );
+      store.batch(() => {
+        store.updateThreadsAndNotifications(
+          updates.threads.updated,
+          [],
+          updates.threads.deleted,
+          []
+        );
+        store.setQuery2OK(USER_THREADS_QUERY);
+      });
       userThreadslastRequestedAt = updates.requestedAt;
     } catch (err) {
       isFetchingUserThreadsUpdates = false;
@@ -1257,16 +1371,18 @@ function makeExtrasForClient(client) {
     if (existingRequest !== void 0) return existingRequest;
     const request = client[kInternal].getThreads(options);
     userThreadsRequestsByQuery.set(queryKey, request);
-    store.setQueryLoading(queryKey);
+    store.setQuery2Loading(queryKey);
     try {
       const result = await request;
-      store.updateThreadsAndNotifications(
-        result.threads,
-        result.inboxNotifications,
-        [],
-        [],
-        queryKey
-      );
+      store.batch(() => {
+        store.updateThreadsAndNotifications(
+          result.threads,
+          result.inboxNotifications,
+          [],
+          []
+        );
+        store.setQuery2OK(queryKey);
+      });
       if (userThreadslastRequestedAt === void 0 || userThreadslastRequestedAt < result.requestedAt) {
         userThreadslastRequestedAt = result.requestedAt;
       }
@@ -1278,13 +1394,13 @@ function makeExtrasForClient(client) {
           retryCount: retryCount + 1
         });
       }, retryCount);
-      store.setQueryError(queryKey, err);
+      store.setQuery2Error(queryKey, err);
     }
     return;
   }
   return {
     store,
-    useEnableInboxNotificationsPolling,
+    startPolling,
     waitUntilInboxNotificationsLoaded,
     loadInboxNotifications,
     incrementUserThreadsQuerySubscribers,
@@ -1329,13 +1445,11 @@ function makeLiveblocksContextBundle(client) {
   return bundle;
 }
 function useInboxNotifications_withClient(client) {
-  const { loadInboxNotifications, store, useEnableInboxNotificationsPolling } = getExtrasForClient(client);
-  useEffect3(() => {
-    loadInboxNotifications();
-  }, [loadInboxNotifications]);
-  useEnableInboxNotificationsPolling();
+  const { loadInboxNotifications, store, startPolling } = getExtrasForClient(client);
+  useEffect3(loadInboxNotifications, [loadInboxNotifications]);
+  useEffect3(startPolling, [startPolling]);
   return useSyncExternalStoreWithSelector(
-    store.subscribeInboxNotifications,
+    store.subscribeThreadsOrInboxNotifications,
     store.getInboxNotificationsAsync,
     store.getInboxNotificationsAsync,
     identity,
@@ -1351,13 +1465,11 @@ function useInboxNotificationsSuspense_withClient(client) {
   return result;
 }
 function useUnreadInboxNotificationsCount_withClient(client) {
-  const { store, loadInboxNotifications, useEnableInboxNotificationsPolling } = getExtrasForClient(client);
-  useEffect3(() => {
-    loadInboxNotifications();
-  }, [loadInboxNotifications]);
-  useEnableInboxNotificationsPolling();
+  const { store, loadInboxNotifications, startPolling } = getExtrasForClient(client);
+  useEffect3(loadInboxNotifications, [loadInboxNotifications]);
+  useEffect3(startPolling, [startPolling]);
   return useSyncExternalStoreWithSelector(
-    store.subscribeInboxNotifications,
+    store.subscribeThreadsOrInboxNotifications,
     store.getInboxNotificationsAsync,
     store.getInboxNotificationsAsync,
     selectorFor_useUnreadInboxNotificationsCount,
@@ -1464,6 +1576,7 @@ function useDeleteAllInboxNotifications_withClient(client) {
 }
 function useInboxNotificationThread_withClient(client, inboxNotificationId) {
   const { store } = getExtrasForClient(client);
+  const getter = store.getFullState;
   const selector = useCallback2(
     (state) => {
       const inboxNotification = state.inboxNotificationsById[inboxNotificationId] ?? raise(`Inbox notification with ID "${inboxNotificationId}" not found`);
@@ -1480,9 +1593,10 @@ function useInboxNotificationThread_withClient(client, inboxNotificationId) {
     [inboxNotificationId]
   );
   return useSyncExternalStoreWithSelector(
-    store.subscribeInboxNotifications,
-    store.getInboxNotifications,
-    store.getInboxNotifications,
+    store.subscribeThreadsOrInboxNotifications,
+    // Re-evaluate if we need to update any time the notification changes over time
+    getter,
+    getter,
     selector
   );
 }
@@ -1670,37 +1784,29 @@ function useUserThreads_experimental(options = {
     void getUserThreads(queryKey, options);
     return incrementUserThreadsQuerySubscribers(queryKey);
   }, [queryKey, incrementUserThreadsQuerySubscribers, getUserThreads, options]);
+  const getter = useCallback2(
+    () => store.getUserThreadsAsync(queryKey),
+    [store, queryKey]
+  );
   const selector = useCallback2(
-    (state) => {
-      const query = state.queries[queryKey];
-      if (query === void 0 || query.isLoading) {
-        return {
-          isLoading: true
-        };
+    (result) => {
+      if (!result.fullState) {
+        return result;
       }
-      if (query.error !== void 0) {
-        return {
-          threads: [],
-          error: query.error,
-          isLoading: false
-        };
-      }
-      return {
-        threads: selectThreads(state, {
-          roomId: null,
-          // Do _not_ filter by roomId
-          query: options.query,
-          orderBy: "last-update"
-        }),
-        isLoading: false
-      };
+      const threads = selectThreads(result.fullState, {
+        roomId: null,
+        // Do _not_ filter by roomId
+        query: options.query,
+        orderBy: "last-update"
+      });
+      return { isLoading: false, threads };
     },
-    [queryKey, options]
+    [options]
   );
   return useSyncExternalStoreWithSelector(
-    store.subscribeThreads,
-    store.getThreads,
-    store.getThreads,
+    store.subscribeUserThreads,
+    getter,
+    getter,
     selector,
     shallow2
     // NOTE: Using 2-level-deep shallow check here, because the result of selectThreads() is not stable!
@@ -1721,13 +1827,14 @@ function useUserThreadsSuspense_experimental(options = {
     const { incrementUserThreadsQuerySubscribers } = getExtrasForClient(client);
     return incrementUserThreadsQuerySubscribers(queryKey);
   }, [client, queryKey]);
-  const query = store.getThreads().queries[queryKey];
+  const query = store.getFullState().queries2[queryKey];
   if (query === void 0 || query.isLoading) {
     throw getUserThreads(queryKey, options);
   }
   if (query.error) {
     throw query.error;
   }
+  const getter = store.getFullState;
   const selector = useCallback2(
     (state) => {
       return {
@@ -1743,9 +1850,9 @@ function useUserThreadsSuspense_experimental(options = {
     [options]
   );
   return useSyncExternalStoreWithSelector(
-    store.subscribeThreads,
-    store.getThreads,
-    store.getThreads,
+    store.subscribeUserThreads,
+    getter,
+    getter,
     selector,
     shallow2
     // NOTE: Using 2-level-deep shallow check here, because the result of selectThreads() is not stable!
@@ -1924,7 +2031,7 @@ import { useSyncExternalStoreWithSelector as useSyncExternalStoreWithSelector2 }
 import * as React4 from "react";
 function handleScrollToCommentOnLoad(shouldScrollOnLoad, state) {
   if (shouldScrollOnLoad === false) return;
-  if (state.isLoading) return;
+  if (!state.threads) return;
   const isWindowDefined = typeof window !== "undefined";
   if (!isWindowDefined) return;
   const hash = window.location.hash;
@@ -2108,12 +2215,12 @@ function makeExtrasForClient2(client) {
     }
   }
   async function getRoomVersions(room, { retryCount } = { retryCount: 0 }) {
-    const queryKey = getVersionsQueryKey(room.id);
+    const queryKey = makeVersionsQueryKey(room.id);
     const existingRequest = requestsByQuery.get(queryKey);
     if (existingRequest !== void 0) return existingRequest;
     const request = room[kInternal2].listTextVersions();
     requestsByQuery.set(queryKey, request);
-    store.setQueryLoading(queryKey);
+    store.setQuery4Loading(queryKey);
     try {
       const result = await request;
       const data = await result.json();
@@ -2132,7 +2239,7 @@ function makeExtrasForClient2(client) {
           retryCount: retryCount + 1
         });
       }, retryCount);
-      store.setQueryError(queryKey, err);
+      store.setQuery4Error(queryKey, err);
     }
     return;
   }
@@ -2141,17 +2248,19 @@ function makeExtrasForClient2(client) {
     if (existingRequest !== void 0) return existingRequest;
     const request = room.getThreads(options);
     requestsByQuery.set(queryKey, request);
-    store.setQueryLoading(queryKey);
+    store.setQuery2Loading(queryKey);
     try {
       const result = await request;
-      store.updateThreadsAndNotifications(
-        result.threads,
-        // TODO: Figure out how to remove this casting
-        result.inboxNotifications,
-        [],
-        [],
-        queryKey
-      );
+      store.batch(() => {
+        store.updateThreadsAndNotifications(
+          result.threads,
+          // TODO: Figure out how to remove this casting
+          result.inboxNotifications,
+          [],
+          []
+        );
+        store.setQuery2OK(queryKey);
+      });
       const lastRequestedAt = lastRequestedAtByRoom.get(room.id);
       if (lastRequestedAt === void 0 || lastRequestedAt > result.requestedAt) {
         lastRequestedAtByRoom.set(room.id, result.requestedAt);
@@ -2164,7 +2273,7 @@ function makeExtrasForClient2(client) {
           retryCount: retryCount + 1
         });
       }, retryCount);
-      store.setQueryError(queryKey, err);
+      store.setQuery2Error(queryKey, err);
     }
     return;
   }
@@ -2175,7 +2284,7 @@ function makeExtrasForClient2(client) {
     try {
       const request = room.getNotificationSettings();
       requestsByQuery.set(queryKey, request);
-      store.setQueryLoading(queryKey);
+      store.setQuery3Loading(queryKey);
       const settings = await request;
       store.updateRoomInboxNotificationSettings(room.id, settings, queryKey);
     } catch (err) {
@@ -2185,7 +2294,7 @@ function makeExtrasForClient2(client) {
           retryCount: retryCount + 1
         });
       }, retryCount);
-      store.setQueryError(queryKey, err);
+      store.setQuery3Error(queryKey, err);
     }
     return;
   }
@@ -2395,7 +2504,7 @@ function RoomProviderInner(props) {
         return;
       }
       const { thread, inboxNotification } = info;
-      const existingThread = store.getThreads().threadsById[message.threadId];
+      const existingThread = store.getFullState().threadsById[message.threadId];
       switch (message.type) {
         case ServerMsgCode.COMMENT_EDITED:
         case ServerMsgCode.THREAD_METADATA_UPDATED:
@@ -2727,32 +2836,31 @@ function useThreads(options = {
     void getThreadsAndInboxNotifications(room, queryKey, options);
     return incrementQuerySubscribers(queryKey);
   }, [room, queryKey]);
+  const getter = React5.useCallback(
+    () => store.getThreadsAsync(queryKey),
+    [store, queryKey]
+  );
   const selector = React5.useCallback(
-    (state2) => {
-      const query = state2.queries[queryKey];
-      if (query === void 0 || query.isLoading) {
-        return {
-          isLoading: true
-        };
+    (result) => {
+      if (!result.fullState) {
+        return result;
       }
-      return {
-        threads: selectThreads(state2, {
-          roomId: room.id,
-          query: options.query,
-          orderBy: "age"
-        }),
-        isLoading: false,
-        error: query.error
-      };
+      const threads = selectThreads(result.fullState, {
+        roomId: room.id,
+        query: options.query,
+        orderBy: "age"
+      });
+      return { isLoading: false, threads };
     },
-    [room, queryKey]
+    [room.id, queryKey]
     // eslint-disable-line react-hooks/exhaustive-deps
   );
   const state = useSyncExternalStoreWithSelector2(
     store.subscribeThreads,
-    store.getThreads,
-    store.getThreads,
-    selector
+    getter,
+    getter,
+    selector,
+    shallow2
   );
   useScrollToCommentOnLoadEffect(scrollOnLoad, state);
   return state;
@@ -2831,7 +2939,7 @@ function useDeleteThread() {
   return React5.useCallback(
     (threadId) => {
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      const thread = store.getThreads().threadsById[threadId];
+      const thread = store.getFullState().threadsById[threadId];
       const userId = getCurrentUserId(room);
       if (thread?.comments?.[0]?.userId !== userId) {
         throw new Error("Only the thread creator can delete the thread");
@@ -2949,7 +3057,7 @@ function useEditComment() {
     ({ threadId, commentId, body, attachments }) => {
       const editedAt = /* @__PURE__ */ new Date();
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      const thread = store.getThreads().threadsById[threadId];
+      const thread = store.getFullState().threadsById[threadId];
       if (thread === void 0) {
         console3.warn(
           `Internal unexpected behavior. Cannot edit comment in thread "${threadId}" because the thread does not exist in the cache.`
@@ -3123,7 +3231,7 @@ function useMarkThreadAsRead() {
     (threadId) => {
       const { store, onMutationFailure } = getExtrasForClient2(client);
       const inboxNotification = Object.values(
-        store.getInboxNotifications().inboxNotificationsById
+        store.getFullState().inboxNotificationsById
       ).find(
         (inboxNotification2) => inboxNotification2.kind === "thread" && inboxNotification2.threadId === threadId
       );
@@ -3248,8 +3356,8 @@ function useThreadSubscription(threadId) {
   );
   return useSyncExternalStoreWithSelector2(
     store.subscribeThreads,
-    store.getThreads,
-    store.getThreads,
+    store.getFullState,
+    store.getFullState,
     selector
   );
 }
@@ -3335,34 +3443,44 @@ function useHistoryVersionData(versionId) {
 function useHistoryVersions() {
   const client = useClient();
   const room = useRoom();
-  const queryKey = getVersionsQueryKey(room.id);
   const { store, getRoomVersions } = getExtrasForClient2(client);
+  const getter = React5.useCallback(
+    () => store.getVersionsAsync(room.id),
+    [store, room.id]
+  );
   React5.useEffect(() => {
     void getRoomVersions(room);
   }, [room]);
-  const selector = React5.useCallback(
-    (state2) => {
-      const query = state2.queries[queryKey];
-      if (query === void 0 || query.isLoading) {
-        return {
-          isLoading: true
-        };
-      }
-      return {
-        versions: state2.versionsByRoomId[room.id],
-        isLoading: false,
-        error: query.error
-      };
-    },
-    [room, queryKey]
-    // eslint-disable-line react-hooks/exhaustive-deps
+  const state = useSyncExternalStoreWithSelector2(
+    store.subscribeVersions,
+    getter,
+    getter,
+    identity2,
+    shallow4
+  );
+  return state;
+}
+function useHistoryVersionsSuspense() {
+  const client = useClient();
+  const room = useRoom();
+  const { store } = getExtrasForClient2(client);
+  const getter = React5.useCallback(
+    () => store.getVersionsAsync(room.id),
+    [store, room.id]
   );
   const state = useSyncExternalStoreWithSelector2(
     store.subscribeVersions,
-    store.getVersions,
-    store.getVersions,
-    selector
+    getter,
+    getter,
+    identity2,
+    shallow4
   );
+  if (state.isLoading) {
+    const { getRoomVersions } = getExtrasForClient2(client);
+    throw getRoomVersions(room);
+  } else if (state.error) {
+    throw state.error;
+  }
   return state;
 }
 function useUpdateRoomNotificationSettings() {
@@ -3461,7 +3579,7 @@ function useThreadsSuspense(options = {
     [room, options]
   );
   const { store, getThreadsAndInboxNotifications } = getExtrasForClient2(client);
-  const query = store.getThreads().queries[queryKey];
+  const query = store.getFullState().queries2[queryKey];
   if (query === void 0 || query.isLoading) {
     throw getThreadsAndInboxNotifications(room, queryKey, options);
   }
@@ -3488,8 +3606,8 @@ function useThreadsSuspense(options = {
   }, [client, queryKey]);
   const state = useSyncExternalStoreWithSelector2(
     store.subscribeThreads,
-    store.getThreads,
-    store.getThreads,
+    store.getFullState,
+    store.getFullState,
     selector
   );
   useScrollToCommentOnLoadEffect(scrollOnLoad, state);
@@ -3554,45 +3672,12 @@ function useAttachmentUrlSuspense(attachmentId) {
     error: void 0
   };
 }
-function useHistoryVersionsSuspense() {
-  const client = useClient();
-  const room = useRoom();
-  const queryKey = getVersionsQueryKey(room.id);
-  const { store, getRoomVersions } = getExtrasForClient2(client);
-  const query = store.getVersions().queries[queryKey];
-  if (query === void 0 || query.isLoading) {
-    throw getRoomVersions(room);
-  }
-  if (query.error) {
-    throw query.error;
-  }
-  const selector = React5.useCallback(
-    (state2) => {
-      return {
-        versions: state2.versionsByRoomId[room.id],
-        isLoading: false
-      };
-    },
-    [room, queryKey]
-    // eslint-disable-line react-hooks/exhaustive-deps
-  );
-  const state = useSyncExternalStoreWithSelector2(
-    store.subscribeVersions,
-    store.getVersions,
-    store.getVersions,
-    selector
-  );
-  return state;
-}
 function createRoomContext(client) {
   return getOrCreateRoomContextBundle(client);
 }
 function generateQueryKey(roomId, options) {
   return `${roomId}-${stringify2(options ?? {})}`;
 }
-function getVersionsQueryKey(roomId) {
-  return `${roomId}-VERSIONS`;
-}
 var _RoomProvider = RoomProvider;
 var _useBroadcastEvent = useBroadcastEvent;
 var _useOthersListener = useOthersListener;
@@ -3715,4 +3800,4 @@ export {
   _useStorageRoot,
   _useUpdateMyPresence
 };
-//# sourceMappingURL=chunk-OBLKSEC3.mjs.map
+//# sourceMappingURL=chunk-G35ZEFD6.mjs.map