@liveblocks/react 2.7.0-versions2 → 2.7.1

package/dist/{chunk-YGRZXVI6.js → chunk-TNEGW2UU.js}

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/version.ts
 var PKG_NAME = "@liveblocks/react";
-var PKG_VERSION = "2.7.0-versions2";
+var PKG_VERSION = "2.7.1";
 var PKG_FORMAT = "cjs";
 
 // src/ClientSideSuspense.tsx
-var _react = require('react'); var React = _interopRequireWildcard(_react); var React4 = _interopRequireWildcard(_react); var React3 = _interopRequireWildcard(_react);
+var _react = require('react'); var React = _interopRequireWildcard(_react); var React2 = _interopRequireWildcard(_react); var React5 = _interopRequireWildcard(_react); var React4 = _interopRequireWildcard(_react);
 function ClientSideSuspense(props) {
   const [mounted, setMounted] = React.useState(false);
   React.useEffect(() => {
@@ -13,169 +13,18 @@ function ClientSideSuspense(props) {
   return /* @__PURE__ */ React.createElement(React.Suspense, { fallback: props.fallback }, mounted ? typeof props.children === "function" ? props.children() : props.children : props.fallback);
 }
 
-// src/comments/lib/selected-threads.ts
+// src/contexts.ts
 
-
-var _core = require('@liveblocks/core');
-function selectedUserThreads(state) {
-  const result = _core.applyOptimisticUpdates.call(void 0, state);
-  const threads = Object.values(result.threads).filter(
-    (thread) => {
-      if (thread.deletedAt !== void 0) {
-        return false;
-      }
-      return true;
-    }
-  );
-  return threads.sort(
-    (a, b) => (_nullishCoalesce(b.updatedAt, () => ( b.createdAt))).getTime() - (_nullishCoalesce(a.updatedAt, () => ( a.createdAt))).getTime()
-  );
+var RoomContext = React2.createContext(null);
+function useRoomOrNull() {
+  return React2.useContext(RoomContext);
 }
-function selectedThreads(roomId, state, options) {
-  const result = _core.applyOptimisticUpdates.call(void 0, state);
-  const threads = Object.values(result.threads).filter(
-    (thread) => {
-      if (thread.roomId !== roomId) return false;
-      if (thread.deletedAt !== void 0) {
-        return false;
-      }
-      const query = options.query;
-      if (!query) return true;
-      if (query.resolved !== void 0 && thread.resolved !== query.resolved) {
-        return false;
-      }
-      for (const key in query.metadata) {
-        const metadataValue = thread.metadata[key];
-        const filterValue = query.metadata[key];
-        if (assertFilterIsStartsWithOperator(filterValue) && assertMetadataValueIsString(metadataValue)) {
-          if (metadataValue.startsWith(filterValue.startsWith)) {
-            return true;
-          }
-        }
-        if (metadataValue !== filterValue) {
-          return false;
-        }
-      }
-      return true;
-    }
-  );
-  return threads.sort((a, b) => a.createdAt.getTime() - b.createdAt.getTime());
+function useIsInsideRoom() {
+  const room = useRoomOrNull();
+  return room !== null;
 }
-var assertFilterIsStartsWithOperator = (filter) => {
-  if (typeof filter === "object" && typeof filter.startsWith === "string") {
-    return true;
-  } else {
-    return false;
-  }
-};
-var assertMetadataValueIsString = (value) => {
-  return typeof value === "string";
-};
-
-// src/comments/errors.ts
-var CreateThreadError = class extends Error {
-  constructor(cause, context) {
-    super("Create thread failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "CreateThreadError";
-  }
-};
-var DeleteThreadError = class extends Error {
-  constructor(cause, context) {
-    super("Delete thread failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "DeleteThreadError";
-  }
-};
-var EditThreadMetadataError = class extends Error {
-  constructor(cause, context) {
-    super("Edit thread metadata failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "EditThreadMetadataError";
-  }
-};
-var MarkThreadAsResolvedError = class extends Error {
-  constructor(cause, context) {
-    super("Mark thread as resolved failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "MarkThreadAsResolvedError";
-  }
-};
-var MarkThreadAsUnresolvedError = class extends Error {
-  constructor(cause, context) {
-    super("Mark thread as unresolved failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "MarkThreadAsUnresolvedError";
-  }
-};
-var CreateCommentError = class extends Error {
-  constructor(cause, context) {
-    super("Create comment failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "CreateCommentError";
-  }
-};
-var EditCommentError = class extends Error {
-  constructor(cause, context) {
-    super("Edit comment failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "EditCommentError";
-  }
-};
-var DeleteCommentError = class extends Error {
-  constructor(cause, context) {
-    super("Delete comment failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "DeleteCommentError";
-  }
-};
-var AddReactionError = class extends Error {
-  constructor(cause, context) {
-    super("Add reaction failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "AddReactionError";
-  }
-};
-var RemoveReactionError = class extends Error {
-  constructor(cause, context) {
-    super("Remove reaction failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "RemoveReactionError";
-  }
-};
-var MarkInboxNotificationAsReadError = class extends Error {
-  constructor(cause, context) {
-    super("Mark inbox notification as read failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "MarkInboxNotificationAsReadError";
-  }
-};
-var UpdateNotificationSettingsError = class extends Error {
-  constructor(cause, context) {
-    super("Update notification settings failed.");
-    this.cause = cause;
-    this.context = context;
-    this.name = "UpdateNotificationSettingsError";
-  }
-};
-
-// src/room.tsx
-var _client = require('@liveblocks/client');
-
-
-
 
+// src/liveblocks.tsx
 
 
 
@@ -185,6 +34,7 @@ var _client = require('@liveblocks/client');
 
 
 
+var _core = require('@liveblocks/core');
 
 
 
@@ -192,27 +42,52 @@ var _client = require('@liveblocks/client');
 
 
 
+var _indexjs = require('use-sync-external-store/shim/index.js');
 var _withselectorjs = require('use-sync-external-store/shim/with-selector.js');
 
-// src/comments/lib/select-notification-settings.ts
-
-
+// src/lib/compare.ts
+function byFirstCreated(a, b) {
+  return a.createdAt.getTime() - b.createdAt.getTime();
+}
+function isMoreRecentlyUpdated(a, b) {
+  return byMostRecentlyUpdated(a, b) < 0;
+}
+function byMostRecentlyUpdated(a, b) {
+  return (_nullishCoalesce(b.updatedAt, () => ( b.createdAt))).getTime() - (_nullishCoalesce(a.updatedAt, () => ( a.createdAt))).getTime();
+}
 
+// src/lib/guards.ts
 
-function selectNotificationSettings(roomId, state) {
-  const { notificationSettings } = _core.applyOptimisticUpdates.call(void 0, state);
-  return _core.nn.call(void 0, notificationSettings[roomId]);
+function isStartsWith(blob) {
+  return _core.isPlainObject.call(void 0, blob) && isString(blob.startsWith);
+}
+function isString(value) {
+  return typeof value === "string";
 }
 
-// src/comments/lib/selected-inbox-notifications.ts
-
-function selectedInboxNotifications(state) {
-  const result = _core.applyOptimisticUpdates.call(void 0, state);
-  return Object.values(result.inboxNotifications).sort(
-    // Sort so that the most recent notifications are first
-    (a, b) => b.notifiedAt.getTime() - a.notifiedAt.getTime()
+// src/lib/querying.ts
+function makeThreadsFilter(query) {
+  return (thread) => matchesQuery(thread, query) && matchesMetadata(thread, query);
+}
+function matchesQuery(thread, q) {
+  return q.resolved === void 0 || thread.resolved === q.resolved;
+}
+function matchesMetadata(thread, q) {
+  const metadata = thread.metadata;
+  return q.metadata === void 0 || Object.entries(q.metadata).every(
+    ([key, op]) => (
+      // Boolean logic: op? => value matches the operator
+      op === void 0 || matchesOperator(metadata[key], op)
+    )
   );
 }
+function matchesOperator(value, op) {
+  if (isStartsWith(op)) {
+    return isString(value) && value.startsWith(op.startsWith);
+  } else {
+    return value === op;
+  }
+}
 
 // src/lib/retry-error.ts
 
@@ -243,6 +118,21 @@ async function autoRetry(promiseFn, maxTries, backoff) {
   }
 }
 
+// src/lib/shallow2.ts
+
+function shallow2(a, b) {
+  if (!_core.isPlainObject.call(void 0, a) || !_core.isPlainObject.call(void 0, b)) {
+    return _core.shallow.call(void 0, a, b);
+  }
+  const keysA = Object.keys(a);
+  if (keysA.length !== Object.keys(b).length) {
+    return false;
+  }
+  return keysA.every(
+    (key) => Object.prototype.hasOwnProperty.call(b, key) && _core.shallow.call(void 0, a[key], b[key])
+  );
+}
+
 // src/lib/use-initial.ts
 
 
@@ -300,12 +190,7 @@ var use = (
   }
 );
 
-// src/liveblocks.tsx
-
-
-
-
-
+// src/umbrella-store.ts
 
 
 
@@ -313,13 +198,810 @@ var use = (
 
 
 
+var UmbrellaStore = class {
+  constructor() {
+    this._prevState = null;
+    this._stateCached = null;
+    this._store = _core.createStore.call(void 0, {
+      rawThreadsById: {},
+      queries: {},
+      optimisticUpdates: [],
+      inboxNotificationsById: {},
+      notificationSettingsByRoomId: {},
+      versionsByRoomId: {}
+    });
+    this.getThreads = this.getThreads.bind(this);
+    this.getInboxNotifications = this.getInboxNotifications.bind(this);
+    this.getNotificationSettings = this.getNotificationSettings.bind(this);
+    this.getVersions = this.getVersions.bind(this);
+    this.subscribeThreads = this.subscribeThreads.bind(this);
+    this.subscribeInboxNotifications = this.subscribeInboxNotifications.bind(this);
+    this.subscribeNotificationSettings = this.subscribeNotificationSettings.bind(this);
+    this.subscribeVersions = this.subscribeVersions.bind(this);
+    this._hasOptimisticUpdates = this._hasOptimisticUpdates.bind(this);
+    this._subscribeOptimisticUpdates = this._subscribeOptimisticUpdates.bind(this);
+  }
+  get() {
+    const rawState = this._store.get();
+    if (this._prevState !== rawState || this._stateCached === null) {
+      this._prevState = rawState;
+      this._stateCached = applyOptimisticUpdates(rawState);
+    }
+    return this._stateCached;
+  }
+  getThreads() {
+    return this.get();
+  }
+  getInboxNotifications() {
+    return this.get();
+  }
+  getNotificationSettings() {
+    return this.get();
+  }
+  getVersions() {
+    return this.get();
+  }
+  /**
+   * @private Only used by the E2E test suite.
+   */
+  _hasOptimisticUpdates() {
+    return this._store.get().optimisticUpdates.length > 0;
+  }
+  subscribe(callback) {
+    return this._store.subscribe(callback);
+  }
+  /**
+   * @private Only used by the E2E test suite.
+   */
+  _subscribeOptimisticUpdates(callback) {
+    return this.subscribe(callback);
+  }
+  subscribeThreads(callback) {
+    return this.subscribe(callback);
+  }
+  subscribeInboxNotifications(callback) {
+    return this.subscribe(callback);
+  }
+  subscribeNotificationSettings(callback) {
+    return this.subscribe(callback);
+  }
+  subscribeVersions(callback) {
+    return this.subscribe(callback);
+  }
+  // Direct low-level cache mutations ------------------------------------------------- {{{
+  updateThreadsCache(mapFn) {
+    this._store.set((state) => {
+      const threads = mapFn(state.rawThreadsById);
+      return threads !== state.rawThreadsById ? { ...state, rawThreadsById: threads } : state;
+    });
+  }
+  updateInboxNotificationsCache(mapFn) {
+    this._store.set((state) => {
+      const inboxNotifications = mapFn(state.inboxNotificationsById);
+      return inboxNotifications !== state.inboxNotificationsById ? { ...state, inboxNotificationsById: inboxNotifications } : state;
+    });
+  }
+  setNotificationSettings(roomId, settings) {
+    this._store.set((state) => ({
+      ...state,
+      notificationSettingsByRoomId: {
+        ...state.notificationSettingsByRoomId,
+        [roomId]: settings
+      }
+    }));
+  }
+  setVersions(roomId, versions) {
+    this._store.set((state) => ({
+      ...state,
+      versionsByRoomId: {
+        ...state.versionsByRoomId,
+        [roomId]: versions
+      }
+    }));
+  }
+  setQueryState(queryKey, queryState) {
+    this._store.set((state) => ({
+      ...state,
+      queries: {
+        ...state.queries,
+        [queryKey]: queryState
+      }
+    }));
+  }
+  updateOptimisticUpdatesCache(mapFn) {
+    this._store.set((state) => ({
+      ...state,
+      optimisticUpdates: mapFn(state.optimisticUpdates)
+    }));
+  }
+  // ---------------------------------------------------------------------------------- }}}
+  /** @internal - Only call this method from unit tests. */
+  force_set(callback) {
+    return this._store.set(callback);
+  }
+  /**
+   * Updates an existing inbox notification with a new value, replacing the
+   * corresponding optimistic update.
+   *
+   * This will not update anything if the inbox notification ID isn't found in
+   * the cache.
+   */
+  updateInboxNotification(inboxNotificationId, optimisticUpdateId, callback) {
+    this._store.batch(() => {
+      this.removeOptimisticUpdate(optimisticUpdateId);
+      this.updateInboxNotificationsCache((cache) => {
+        const existing = cache[inboxNotificationId];
+        if (!existing) {
+          return cache;
+        }
+        const inboxNotifications = {
+          ...cache,
+          [inboxNotificationId]: callback(existing)
+        };
+        return inboxNotifications;
+      });
+    });
+  }
+  /**
+   * Updates *all* inbox notifications by running a mapper function over all of
+   * them, replacing the corresponding optimistic update.
+   */
+  updateAllInboxNotifications(optimisticUpdateId, mapFn) {
+    this._store.batch(() => {
+      this.removeOptimisticUpdate(optimisticUpdateId);
+      this.updateInboxNotificationsCache((cache) => _core.mapValues.call(void 0, cache, mapFn));
+    });
+  }
+  /**
+   * Deletes an existing inbox notification, replacing the corresponding
+   * optimistic update.
+   */
+  deleteInboxNotification(inboxNotificationId, optimisticUpdateId) {
+    this._store.batch(() => {
+      this.removeOptimisticUpdate(optimisticUpdateId);
+      this.updateInboxNotificationsCache((cache) => {
+        const { [inboxNotificationId]: removed, ...newCache } = cache;
+        return removed === void 0 ? cache : newCache;
+      });
+    });
+  }
+  /**
+   * Deletes *all* inbox notifications, replacing the corresponding optimistic
+   * update.
+   */
+  deleteAllInboxNotifications(optimisticUpdateId) {
+    this._store.batch(() => {
+      this.removeOptimisticUpdate(optimisticUpdateId);
+      this.updateInboxNotificationsCache(() => ({}));
+    });
+  }
+  /**
+   * Creates an new thread, replacing the corresponding optimistic update.
+   */
+  createThread(optimisticUpdateId, thread) {
+    this._store.batch(() => {
+      this.removeOptimisticUpdate(optimisticUpdateId);
+      this.updateThreadsCache((cache) => ({ ...cache, [thread.id]: thread }));
+    });
+  }
+  /**
+   * Updates an existing thread with a new value, replacing the corresponding
+   * optimistic update.
+   *
+   * This will not update anything if:
+   * - The thread ID isn't found in the cache; or
+   * - The thread ID was already deleted from the cache; or
+   * - The thread ID in the cache was updated more recently than the optimistic
+   *   update's timestamp (if given)
+   */
+  updateThread(threadId, optimisticUpdateId, callback, updatedAt) {
+    this._store.batch(() => {
+      if (optimisticUpdateId !== null) {
+        this.removeOptimisticUpdate(optimisticUpdateId);
+      }
+      this.updateThreadsCache((cache) => {
+        const existing = cache[threadId];
+        if (!existing) {
+          return cache;
+        }
+        if (existing.deletedAt !== void 0) {
+          return cache;
+        }
+        if (!!updatedAt && !!existing.updatedAt && existing.updatedAt > updatedAt) {
+          return cache;
+        }
+        return { ...cache, [threadId]: callback(existing) };
+      });
+    });
+  }
+  patchThread(threadId, optimisticUpdateId, patch, updatedAt) {
+    return this.updateThread(
+      threadId,
+      optimisticUpdateId,
+      (thread) => ({ ...thread, ..._core.compactObject.call(void 0, patch) }),
+      updatedAt
+    );
+  }
+  addReaction(threadId, optimisticUpdateId, commentId, reaction, createdAt) {
+    this.updateThread(
+      threadId,
+      optimisticUpdateId,
+      (thread) => applyAddReaction(thread, commentId, reaction),
+      createdAt
+    );
+  }
+  removeReaction(threadId, optimisticUpdateId, commentId, emoji, userId, removedAt) {
+    this.updateThread(
+      threadId,
+      optimisticUpdateId,
+      (thread) => applyRemoveReaction(thread, commentId, emoji, userId, removedAt),
+      removedAt
+    );
+  }
+  /**
+   * Soft-deletes an existing thread by setting its `deletedAt` value,
+   * replacing the corresponding optimistic update.
+   *
+   * This will not update anything if:
+   * - The thread ID isn't found in the cache; or
+   * - The thread ID was already deleted from the cache
+   */
+  deleteThread(threadId, optimisticUpdateId) {
+    return this.updateThread(
+      threadId,
+      optimisticUpdateId,
+      // A deletion is actually an update of the deletedAt property internally
+      (thread) => ({ ...thread, updatedAt: /* @__PURE__ */ new Date(), deletedAt: /* @__PURE__ */ new Date() })
+    );
+  }
+  /**
+   * Creates an existing comment and ensures the associated notification is
+   * updated correctly, replacing the corresponding optimistic update.
+   */
+  createComment(newComment, optimisticUpdateId) {
+    this._store.batch(() => {
+      this.removeOptimisticUpdate(optimisticUpdateId);
+      const existingThread = this._store.get().rawThreadsById[newComment.threadId];
+      if (!existingThread) {
+        return;
+      }
+      this.updateThreadsCache((cache) => ({
+        ...cache,
+        [newComment.threadId]: applyUpsertComment(existingThread, newComment)
+      }));
+      this.updateInboxNotificationsCache((cache) => {
+        const existingNotification = Object.values(cache).find(
+          (notification) => notification.kind === "thread" && notification.threadId === newComment.threadId
+        );
+        if (!existingNotification) {
+          return cache;
+        }
+        return {
+          ...cache,
+          [existingNotification.id]: {
+            ...existingNotification,
+            notifiedAt: newComment.createdAt,
+            readAt: newComment.createdAt
+          }
+        };
+      });
+    });
+  }
+  editComment(threadId, optimisticUpdateId, editedComment) {
+    return this.updateThread(
+      threadId,
+      optimisticUpdateId,
+      (thread) => applyUpsertComment(thread, editedComment)
+    );
+  }
+  deleteComment(threadId, optimisticUpdateId, commentId, deletedAt) {
+    return this.updateThread(
+      threadId,
+      optimisticUpdateId,
+      (thread) => applyDeleteComment(thread, commentId, deletedAt),
+      deletedAt
+    );
+  }
+  updateThreadAndNotification(thread, inboxNotification) {
+    this._store.batch(() => {
+      this.updateThreadsCache((cache) => {
+        const existingThread = cache[thread.id];
+        return existingThread === void 0 || isMoreRecentlyUpdated(thread, existingThread) ? { ...cache, [thread.id]: thread } : cache;
+      });
+      if (inboxNotification !== void 0) {
+        this.updateInboxNotificationsCache((cache) => ({
+          ...cache,
+          [inboxNotification.id]: inboxNotification
+        }));
+      }
+    });
+  }
+  updateThreadsAndNotifications(threads, inboxNotifications, deletedThreads, deletedInboxNotifications, queryKey) {
+    this._store.batch(() => {
+      this.updateThreadsCache(
+        (cache) => applyThreadUpdates(cache, {
+          newThreads: threads,
+          deletedThreads
+        })
+      );
+      this.updateInboxNotificationsCache(
+        (cache) => applyNotificationsUpdates(cache, {
+          newInboxNotifications: inboxNotifications,
+          deletedNotifications: deletedInboxNotifications
+        })
+      );
+      if (queryKey !== void 0) {
+        this.setQueryOK(queryKey);
+      }
+    });
+  }
+  /**
+   * Updates existing notification setting for a room with a new value,
+   * replacing the corresponding optimistic update.
+   */
+  updateRoomInboxNotificationSettings2(roomId, optimisticUpdateId, settings) {
+    this._store.batch(() => {
+      this.removeOptimisticUpdate(optimisticUpdateId);
+      this.setNotificationSettings(roomId, settings);
+    });
+  }
+  updateRoomInboxNotificationSettings(roomId, settings, queryKey) {
+    this._store.batch(() => {
+      this.setQueryOK(queryKey);
+      this.setNotificationSettings(roomId, settings);
+    });
+  }
+  updateRoomVersions(roomId, versions, queryKey) {
+    this._store.batch(() => {
+      this.setVersions(roomId, versions);
+      if (queryKey !== void 0) {
+        this.setQueryOK(queryKey);
+      }
+    });
+  }
+  addOptimisticUpdate(optimisticUpdate) {
+    const id = _core.nanoid.call(void 0, );
+    const newUpdate = { ...optimisticUpdate, id };
+    this.updateOptimisticUpdatesCache((cache) => [...cache, newUpdate]);
+    return id;
+  }
+  removeOptimisticUpdate(optimisticUpdateId) {
+    this.updateOptimisticUpdatesCache(
+      (cache) => cache.filter((ou) => ou.id !== optimisticUpdateId)
+    );
+  }
+  //
+  // Query State APIs
+  //
+  setQueryLoading(queryKey) {
+    this.setQueryState(queryKey, { isLoading: true });
+  }
+  setQueryOK(queryKey) {
+    this.setQueryState(queryKey, { isLoading: false, data: void 0 });
+  }
+  setQueryError(queryKey, error) {
+    this.setQueryState(queryKey, { isLoading: false, error });
+  }
+};
+function applyOptimisticUpdates(state) {
+  const output = {
+    threads: { ...state.rawThreadsById },
+    inboxNotifications: { ...state.inboxNotificationsById },
+    notificationSettings: { ...state.notificationSettingsByRoomId }
+  };
+  for (const optimisticUpdate of state.optimisticUpdates) {
+    switch (optimisticUpdate.type) {
+      case "create-thread": {
+        output.threads[optimisticUpdate.thread.id] = optimisticUpdate.thread;
+        break;
+      }
+      case "edit-thread-metadata": {
+        const thread = output.threads[optimisticUpdate.threadId];
+        if (thread === void 0) {
+          break;
+        }
+        if (thread.deletedAt !== void 0) {
+          break;
+        }
+        if (thread.updatedAt !== void 0 && thread.updatedAt > optimisticUpdate.updatedAt) {
+          break;
+        }
+        output.threads[thread.id] = {
+          ...thread,
+          updatedAt: optimisticUpdate.updatedAt,
+          metadata: {
+            ...thread.metadata,
+            ...optimisticUpdate.metadata
+          }
+        };
+        break;
+      }
+      case "mark-thread-as-resolved": {
+        const thread = output.threads[optimisticUpdate.threadId];
+        if (thread === void 0) {
+          break;
+        }
+        if (thread.deletedAt !== void 0) {
+          break;
+        }
+        output.threads[thread.id] = {
+          ...thread,
+          resolved: true
+        };
+        break;
+      }
+      case "mark-thread-as-unresolved": {
+        const thread = output.threads[optimisticUpdate.threadId];
+        if (thread === void 0) {
+          break;
+        }
+        if (thread.deletedAt !== void 0) {
+          break;
+        }
+        output.threads[thread.id] = {
+          ...thread,
+          resolved: false
+        };
+        break;
+      }
+      case "create-comment": {
+        const thread = output.threads[optimisticUpdate.comment.threadId];
+        if (thread === void 0) {
+          break;
+        }
+        output.threads[thread.id] = applyUpsertComment(
+          thread,
+          optimisticUpdate.comment
+        );
+        const inboxNotification = Object.values(output.inboxNotifications).find(
+          (notification) => notification.kind === "thread" && notification.threadId === thread.id
+        );
+        if (inboxNotification === void 0) {
+          break;
+        }
+        output.inboxNotifications[inboxNotification.id] = {
+          ...inboxNotification,
+          notifiedAt: optimisticUpdate.comment.createdAt,
+          readAt: optimisticUpdate.comment.createdAt
+        };
+        break;
+      }
+      case "edit-comment": {
+        const thread = output.threads[optimisticUpdate.comment.threadId];
+        if (thread === void 0) {
+          break;
+        }
+        output.threads[thread.id] = applyUpsertComment(
+          thread,
+          optimisticUpdate.comment
+        );
+        break;
+      }
+      case "delete-comment": {
+        const thread = output.threads[optimisticUpdate.threadId];
+        if (thread === void 0) {
+          break;
+        }
+        output.threads[thread.id] = applyDeleteComment(
+          thread,
+          optimisticUpdate.commentId,
+          optimisticUpdate.deletedAt
+        );
+        break;
+      }
+      case "delete-thread": {
+        const thread = output.threads[optimisticUpdate.threadId];
+        if (thread === void 0) {
+          break;
+        }
+        output.threads[optimisticUpdate.threadId] = {
+          ...output.threads[optimisticUpdate.threadId],
+          deletedAt: optimisticUpdate.deletedAt,
+          updatedAt: optimisticUpdate.deletedAt,
+          comments: []
+        };
+        break;
+      }
+      case "add-reaction": {
+        const thread = output.threads[optimisticUpdate.threadId];
+        if (thread === void 0) {
+          break;
+        }
+        output.threads[thread.id] = applyAddReaction(
+          thread,
+          optimisticUpdate.commentId,
+          optimisticUpdate.reaction
+        );
+        break;
+      }
+      case "remove-reaction": {
+        const thread = output.threads[optimisticUpdate.threadId];
+        if (thread === void 0) {
+          break;
+        }
+        output.threads[thread.id] = applyRemoveReaction(
+          thread,
+          optimisticUpdate.commentId,
+          optimisticUpdate.emoji,
+          optimisticUpdate.userId,
+          optimisticUpdate.removedAt
+        );
+        break;
+      }
+      case "mark-inbox-notification-as-read": {
+        output.inboxNotifications[optimisticUpdate.inboxNotificationId] = {
+          ...state.inboxNotificationsById[optimisticUpdate.inboxNotificationId],
+          readAt: optimisticUpdate.readAt
+        };
+        break;
+      }
+      case "mark-all-inbox-notifications-as-read": {
+        for (const id in output.inboxNotifications) {
+          output.inboxNotifications[id] = {
+            ...output.inboxNotifications[id],
+            readAt: optimisticUpdate.readAt
+          };
+        }
+        break;
+      }
+      case "delete-inbox-notification": {
+        const {
+          [optimisticUpdate.inboxNotificationId]: _,
+          ...inboxNotifications
+        } = output.inboxNotifications;
+        output.inboxNotifications = inboxNotifications;
+        break;
+      }
+      case "delete-all-inbox-notifications": {
+        output.inboxNotifications = {};
+        break;
+      }
+      case "update-notification-settings": {
+        output.notificationSettings[optimisticUpdate.roomId] = {
+          ...output.notificationSettings[optimisticUpdate.roomId],
+          ...optimisticUpdate.settings
+        };
+      }
+    }
+  }
+  const cleanedThreads = (
+    // Don't expose any soft-deleted threads
+    Object.values(output.threads).filter(
+      (thread) => !thread.deletedAt
+    )
+  );
+  const cleanedNotifications = (
+    // Sort so that the most recent notifications are first
+    Object.values(output.inboxNotifications).sort(
+      (a, b) => b.notifiedAt.getTime() - a.notifiedAt.getTime()
+    )
+  );
+  return {
+    inboxNotifications: cleanedNotifications,
+    inboxNotificationsById: output.inboxNotifications,
+    notificationSettingsByRoomId: output.notificationSettings,
+    queries: state.queries,
+    threads: cleanedThreads,
+    threadsById: output.threads,
+    versionsByRoomId: state.versionsByRoomId
+  };
+}
+function applyThreadUpdates(existingThreads, updates) {
+  const updatedThreads = { ...existingThreads };
+  updates.newThreads.forEach((thread) => {
+    const existingThread = updatedThreads[thread.id];
+    if (existingThread) {
+      if (isMoreRecentlyUpdated(existingThread, thread)) {
+        return;
+      }
+    }
+    updatedThreads[thread.id] = thread;
+  });
+  updates.deletedThreads.forEach(({ id, deletedAt }) => {
+    const existingThread = updatedThreads[id];
+    if (existingThread === void 0) return;
+    existingThread.deletedAt = deletedAt;
+    existingThread.updatedAt = deletedAt;
+    existingThread.comments = [];
+  });
+  return updatedThreads;
+}
+function applyNotificationsUpdates(existingInboxNotifications, updates) {
+  const updatedInboxNotifications = { ...existingInboxNotifications };
+  updates.newInboxNotifications.forEach((notification) => {
+    const existingNotification = updatedInboxNotifications[notification.id];
+    if (existingNotification) {
+      const result = compareInboxNotifications(
+        existingNotification,
+        notification
+      );
+      if (result === 1) return;
+    }
+    updatedInboxNotifications[notification.id] = notification;
+  });
+  updates.deletedNotifications.forEach(
+    ({ id }) => delete updatedInboxNotifications[id]
+  );
+  return updatedInboxNotifications;
+}
+function compareInboxNotifications(inboxNotificationA, inboxNotificationB) {
+  if (inboxNotificationA.notifiedAt > inboxNotificationB.notifiedAt) {
+    return 1;
+  } else if (inboxNotificationA.notifiedAt < inboxNotificationB.notifiedAt) {
+    return -1;
+  }
+  if (inboxNotificationA.readAt && inboxNotificationB.readAt) {
+    return inboxNotificationA.readAt > inboxNotificationB.readAt ? 1 : inboxNotificationA.readAt < inboxNotificationB.readAt ? -1 : 0;
+  } else if (inboxNotificationA.readAt || inboxNotificationB.readAt) {
+    return inboxNotificationA.readAt ? 1 : -1;
+  }
+  return 0;
+}
+function applyUpsertComment(thread, comment) {
+  if (thread.deletedAt !== void 0) {
+    return thread;
+  }
+  if (comment.threadId !== thread.id) {
+    _core.console.warn(
+      `Comment ${comment.id} does not belong to thread ${thread.id}`
+    );
+    return thread;
+  }
+  const existingComment = thread.comments.find(
+    (existingComment2) => existingComment2.id === comment.id
+  );
+  if (existingComment === void 0) {
+    const updatedAt = new Date(
+      Math.max(_optionalChain([thread, 'access', _2 => _2.updatedAt, 'optionalAccess', _3 => _3.getTime, 'call', _4 => _4()]) || 0, comment.createdAt.getTime())
+    );
+    const updatedThread = {
+      ...thread,
+      updatedAt,
+      comments: [...thread.comments, comment]
+    };
+    return updatedThread;
+  }
+  if (existingComment.deletedAt !== void 0) {
+    return thread;
+  }
+  if (existingComment.editedAt === void 0 || comment.editedAt === void 0 || existingComment.editedAt <= comment.editedAt) {
+    const updatedComments = thread.comments.map(
+      (existingComment2) => existingComment2.id === comment.id ? comment : existingComment2
+    );
+    const updatedThread = {
+      ...thread,
+      updatedAt: new Date(
+        Math.max(
+          _optionalChain([thread, 'access', _5 => _5.updatedAt, 'optionalAccess', _6 => _6.getTime, 'call', _7 => _7()]) || 0,
+          _optionalChain([comment, 'access', _8 => _8.editedAt, 'optionalAccess', _9 => _9.getTime, 'call', _10 => _10()]) || comment.createdAt.getTime()
+        )
+      ),
+      comments: updatedComments
+    };
+    return updatedThread;
+  }
+  return thread;
+}
+function applyDeleteComment(thread, commentId, deletedAt) {
+  if (thread.deletedAt !== void 0) {
+    return thread;
+  }
+  const existingComment = thread.comments.find(
+    (comment) => comment.id === commentId
+  );
+  if (existingComment === void 0) {
+    return thread;
+  }
+  if (existingComment.deletedAt !== void 0) {
+    return thread;
+  }
+  const updatedComments = thread.comments.map(
+    (comment) => comment.id === commentId ? {
+      ...comment,
+      deletedAt,
+      body: void 0
+    } : comment
+  );
+  if (!updatedComments.some((comment) => comment.deletedAt === void 0)) {
+    return {
+      ...thread,
+      deletedAt,
+      updatedAt: deletedAt,
+      comments: []
+    };
+  }
+  return {
+    ...thread,
+    updatedAt: deletedAt,
+    comments: updatedComments
+  };
+}
+function applyAddReaction(thread, commentId, reaction) {
+  if (thread.deletedAt !== void 0) {
+    return thread;
+  }
+  const existingComment = thread.comments.find(
+    (comment) => comment.id === commentId
+  );
+  if (existingComment === void 0) {
+    return thread;
+  }
+  if (existingComment.deletedAt !== void 0) {
+    return thread;
+  }
+  const updatedComments = thread.comments.map(
+    (comment) => comment.id === commentId ? {
+      ...comment,
+      reactions: upsertReaction(comment.reactions, reaction)
+    } : comment
+  );
+  return {
+    ...thread,
+    updatedAt: new Date(
+      Math.max(reaction.createdAt.getTime(), _optionalChain([thread, 'access', _11 => _11.updatedAt, 'optionalAccess', _12 => _12.getTime, 'call', _13 => _13()]) || 0)
+    ),
+    comments: updatedComments
+  };
+}
+function applyRemoveReaction(thread, commentId, emoji, userId, removedAt) {
+  if (thread.deletedAt !== void 0) {
+    return thread;
+  }
+  const existingComment = thread.comments.find(
+    (comment) => comment.id === commentId
+  );
+  if (existingComment === void 0) {
+    return thread;
+  }
+  if (existingComment.deletedAt !== void 0) {
+    return thread;
+  }
+  const updatedComments = thread.comments.map(
+    (comment) => comment.id === commentId ? {
+      ...comment,
+      reactions: comment.reactions.map(
+        (reaction) => reaction.emoji === emoji ? {
+          ...reaction,
+          users: reaction.users.filter((user) => user.id !== userId)
+        } : reaction
+      ).filter((reaction) => reaction.users.length > 0)
+      // Remove reactions with no users left
+    } : comment
+  );
+  return {
+    ...thread,
+    updatedAt: new Date(
+      Math.max(removedAt.getTime(), _optionalChain([thread, 'access', _14 => _14.updatedAt, 'optionalAccess', _15 => _15.getTime, 'call', _16 => _16()]) || 0)
+    ),
+    comments: updatedComments
+  };
+}
+function upsertReaction(reactions, reaction) {
+  const existingReaction = reactions.find(
+    (existingReaction2) => existingReaction2.emoji === reaction.emoji
+  );
+  if (existingReaction === void 0) {
+    return [
+      ...reactions,
+      {
+        emoji: reaction.emoji,
+        createdAt: reaction.createdAt,
+        users: [{ id: reaction.userId }]
+      }
+    ];
+  }
+  if (existingReaction.users.some((user) => user.id === reaction.userId) === false) {
+    return reactions.map(
+      (existingReaction2) => existingReaction2.emoji === reaction.emoji ? {
+        ...existingReaction2,
+        users: [...existingReaction2.users, { id: reaction.userId }]
+      } : existingReaction2
+    );
+  }
+  return reactions;
+}
 
-
-
-
-
-var _indexjs = require('use-sync-external-store/shim/index.js');
-
+// src/liveblocks.tsx
 var ClientContext = _react.createContext.call(void 0, null);
 function missingUserError(userId) {
   return new Error(`resolveUsers didn't return anything for user '${userId}'`);
@@ -329,6 +1011,7 @@ function missingRoomInfoError(roomId) {
     `resolveRoomsInfo didn't return anything for room '${roomId}'`
   );
 }
+var _umbrellaStores = /* @__PURE__ */ new WeakMap();
 var _extras = /* @__PURE__ */ new WeakMap();
 var _bundles = /* @__PURE__ */ new WeakMap();
 var POLLING_INTERVAL = 60 * 1e3;
@@ -348,32 +1031,13 @@ function selectorFor_useInboxNotifications(state) {
     };
   }
   return {
-    inboxNotifications: selectedInboxNotifications(state),
-    isLoading: false
-  };
-}
-function selectorFor_useUserThreads(state) {
-  const query = state.queries[USER_THREADS_QUERY];
-  if (query === void 0 || query.isLoading) {
-    return {
-      isLoading: true
-    };
-  }
-  if (query.error !== void 0) {
-    return {
-      threads: [],
-      error: query.error,
-      isLoading: false
-    };
-  }
-  return {
-    threads: selectedUserThreads(state),
+    inboxNotifications: state.inboxNotifications,
     isLoading: false
   };
 }
 function selectUnreadInboxNotificationsCount(state) {
   let count = 0;
-  for (const notification of selectedInboxNotifications(state)) {
+  for (const notification of state.inboxNotifications) {
     if (notification.readAt === null || notification.readAt < notification.notifiedAt) {
       count++;
     }
@@ -399,7 +1063,7 @@ function selectorFor_useUnreadInboxNotificationsCount(state) {
   };
 }
 function selectorFor_useUser(state, userId) {
-  if (state === void 0 || _optionalChain([state, 'optionalAccess', _2 => _2.isLoading])) {
+  if (state === void 0 || _optionalChain([state, 'optionalAccess', _17 => _17.isLoading])) {
     return _nullishCoalesce(state, () => ( { isLoading: true }));
   }
   if (state.error) {
@@ -417,7 +1081,7 @@ function selectorFor_useUser(state, userId) {
   };
 }
 function selectorFor_useRoomInfo(state, roomId) {
-  if (state === void 0 || _optionalChain([state, 'optionalAccess', _3 => _3.isLoading])) {
+  if (state === void 0 || _optionalChain([state, 'optionalAccess', _18 => _18.isLoading])) {
     return _nullishCoalesce(state, () => ( { isLoading: true }));
   }
   if (state.error) {
@@ -434,6 +1098,19 @@ function selectorFor_useRoomInfo(state, roomId) {
     info: state.data
   };
 }
+function selectThreads(state, options) {
+  let threads = state.threads;
+  if (options.roomId !== null) {
+    threads = threads.filter((thread) => thread.roomId === options.roomId);
+  }
+  const query = options.query;
+  if (query) {
+    threads = threads.filter(makeThreadsFilter(query));
+  }
+  return threads.sort(
+    options.orderBy === "last-update" ? byMostRecentlyUpdated : byFirstCreated
+  );
+}
 function getOrCreateContextBundle(client) {
   let bundle = _bundles.get(client);
   if (!bundle) {
@@ -442,6 +1119,14 @@ function getOrCreateContextBundle(client) {
   }
   return bundle;
 }
+function getUmbrellaStoreForClient(client) {
+  let store = _umbrellaStores.get(client);
+  if (!store) {
+    store = new UmbrellaStore();
+    _umbrellaStores.set(client, store);
+  }
+  return store;
+}
 function getExtrasForClient(client) {
   let extras = _extras.get(client);
   if (!extras) {
@@ -451,8 +1136,7 @@ function getExtrasForClient(client) {
   return extras;
 }
 function makeExtrasForClient(client) {
-  const internals = client[_core.kInternal];
-  const store = internals.cacheStore;
+  const store = getUmbrellaStoreForClient(client);
   let lastRequestedAt;
   async function fetchInboxNotifications() {
     if (lastRequestedAt === void 0) {
@@ -491,9 +1175,7 @@ function makeExtrasForClient(client) {
     }
   });
   const waitUntilInboxNotificationsLoaded = _core.memoizeOnSuccess.call(void 0, async () => {
-    store.setQueryState(INBOX_NOTIFICATIONS_QUERY, {
-      isLoading: true
-    });
+    store.setQueryLoading(INBOX_NOTIFICATIONS_QUERY);
     try {
       await autoRetry(
         () => fetchInboxNotifications(),
@@ -501,10 +1183,7 @@ function makeExtrasForClient(client) {
         [5e3, 5e3, 1e4, 15e3]
       );
     } catch (err) {
-      store.setQueryState(INBOX_NOTIFICATIONS_QUERY, {
-        isLoading: false,
-        error: err
-      });
+      store.setQueryError(INBOX_NOTIFICATIONS_QUERY, err);
       throw err;
     }
   });
@@ -530,87 +1209,94 @@ function makeExtrasForClient(client) {
       };
     }, []);
   }
-  let userThreadsPollerSubscribers = 0;
-  const userThreadsPoller = _core.makePoller.call(void 0, async () => {
+  const userThreadsPoller = _core.makePoller.call(void 0, refreshUserThreads);
+  let isFetchingUserThreadsUpdates = false;
+  async function refreshUserThreads() {
+    const since = userThreadslastRequestedAt;
+    if (since === void 0 || isFetchingUserThreadsUpdates) {
+      return;
+    }
     try {
-      await waitUntilUserThreadsLoaded();
-      await fetchUserThreads();
+      isFetchingUserThreadsUpdates = true;
+      const updates = await client[_core.kInternal].getThreadsSince({
+        since
+      });
+      isFetchingUserThreadsUpdates = false;
+      store.updateThreadsAndNotifications(
+        updates.threads.updated,
+        [],
+        updates.threads.deleted,
+        [],
+        USER_THREADS_QUERY
+      );
+      userThreadslastRequestedAt = updates.requestedAt;
     } catch (err) {
-      console.warn(`Polling new user threads failed: ${String(err)}`);
+      isFetchingUserThreadsUpdates = false;
+      return;
     }
-  });
-  let userThreadslastRequestedAt;
-  function loadUserThreads() {
-    void waitUntilUserThreadsLoaded().catch(() => {
-    });
   }
-  const waitUntilUserThreadsLoaded = _core.memoizeOnSuccess.call(void 0, async () => {
-    store.setQueryState(USER_THREADS_QUERY, {
-      isLoading: true
-    });
+  const userThreadsSubscribersByQuery = /* @__PURE__ */ new Map();
+  const userThreadsRequestsByQuery = /* @__PURE__ */ new Map();
+  function incrementUserThreadsQuerySubscribers(queryKey) {
+    const subscribers = _nullishCoalesce(userThreadsSubscribersByQuery.get(queryKey), () => ( 0));
+    userThreadsSubscribersByQuery.set(queryKey, subscribers + 1);
+    userThreadsPoller.start(POLLING_INTERVAL);
+    return () => {
+      const subscribers2 = userThreadsSubscribersByQuery.get(queryKey);
+      if (subscribers2 === void 0 || subscribers2 <= 0) {
+        console.warn(
+          `Internal unexpected behavior. Cannot decrease subscriber count for query "${queryKey}"`
+        );
+        return;
+      }
+      userThreadsSubscribersByQuery.set(queryKey, subscribers2 - 1);
+      let totalSubscribers = 0;
+      for (const subscribers3 of userThreadsSubscribersByQuery.values()) {
+        totalSubscribers += subscribers3;
+      }
+      if (totalSubscribers <= 0) {
+        userThreadsPoller.stop();
+      }
+    };
+  }
+  let userThreadslastRequestedAt;
+  async function getUserThreads(queryKey, options, { retryCount } = { retryCount: 0 }) {
+    const existingRequest = userThreadsRequestsByQuery.get(queryKey);
+    if (existingRequest !== void 0) return existingRequest;
+    const request = client[_core.kInternal].getThreads(options);
+    userThreadsRequestsByQuery.set(queryKey, request);
+    store.setQueryLoading(queryKey);
     try {
-      await autoRetry(() => fetchUserThreads(), 5, [5e3, 5e3, 1e4, 15e3]);
-    } catch (err) {
-      store.setQueryState(USER_THREADS_QUERY, {
-        isLoading: false,
-        error: err
-      });
-      throw err;
-    }
-  });
-  async function fetchUserThreads() {
-    if (userThreadslastRequestedAt === void 0) {
-      const result = await client[_core.kInternal].getThreads();
+      const result = await request;
       store.updateThreadsAndNotifications(
         result.threads,
         result.inboxNotifications,
         [],
         [],
-        USER_THREADS_QUERY
-      );
-      userThreadslastRequestedAt = result.requestedAt;
-    } else {
-      const result = await client[_core.kInternal].getThreadsSince({
-        since: userThreadslastRequestedAt
-      });
-      store.updateThreadsAndNotifications(
-        result.threads.updated,
-        result.inboxNotifications.updated,
-        result.threads.deleted,
-        result.inboxNotifications.deleted,
-        USER_THREADS_QUERY
+        queryKey
       );
-      if (userThreadslastRequestedAt < result.requestedAt) {
-        userThreadslastRequestedAt = result.requestedAt;
-      }
-    }
-  }
-  function useEnableUserThreadsPolling() {
-    _react.useEffect.call(void 0, () => {
-      userThreadsPollerSubscribers++;
-      userThreadsPoller.start(POLLING_INTERVAL);
-      return () => {
-        if (userThreadsPollerSubscribers <= 0) {
-          console.warn(
-            `Internal unexpected behavior. Cannot decrease subscriber count for query "${USER_THREADS_QUERY}"`
-          );
-          return;
-        }
-        userThreadsPollerSubscribers--;
-        if (userThreadsPollerSubscribers <= 0) {
-          userThreadsPoller.stop();
-        }
-      };
-    }, []);
+      if (userThreadslastRequestedAt === void 0 || userThreadslastRequestedAt < result.requestedAt) {
+        userThreadslastRequestedAt = result.requestedAt;
+      }
+      userThreadsPoller.start(POLLING_INTERVAL);
+    } catch (err) {
+      userThreadsRequestsByQuery.delete(queryKey);
+      retryError(() => {
+        void getUserThreads(queryKey, options, {
+          retryCount: retryCount + 1
+        });
+      }, retryCount);
+      store.setQueryError(queryKey, err);
+    }
+    return;
   }
   return {
     store,
     useEnableInboxNotificationsPolling,
     waitUntilInboxNotificationsLoaded,
     loadInboxNotifications,
-    useEnableUserThreadsPolling,
-    waitUntilUserThreadsLoaded,
-    loadUserThreads
+    incrementUserThreadsQuerySubscribers,
+    getUserThreads
   };
 }
 function makeLiveblocksContextBundle(client) {
@@ -633,7 +1319,7 @@ function makeLiveblocksContextBundle(client) {
     useDeleteInboxNotification: useDeleteInboxNotification2,
     useDeleteAllInboxNotifications: useDeleteAllInboxNotifications2,
     useInboxNotificationThread: useInboxNotificationThread2,
-    useUserThreads_experimental: () => useUserThreads_withClient(client),
+    useUserThreads_experimental,
     ...shared.classic,
     suspense: {
       LiveblocksProvider: LiveblocksProvider2,
@@ -644,34 +1330,12 @@ function makeLiveblocksContextBundle(client) {
       useDeleteInboxNotification: useDeleteInboxNotification2,
       useDeleteAllInboxNotifications: useDeleteAllInboxNotifications2,
       useInboxNotificationThread: useInboxNotificationThread2,
-      useUserThreads_experimental: () => useUserThreadsSuspense_withClient(client),
+      useUserThreads_experimental: useUserThreadsSuspense_experimental,
       ...shared.suspense
     }
   };
   return bundle;
 }
-function useUserThreads_withClient(client) {
-  const { loadUserThreads, store, useEnableUserThreadsPolling } = getExtrasForClient(client);
-  _react.useEffect.call(void 0, () => {
-    loadUserThreads();
-  }, [loadUserThreads]);
-  useEnableUserThreadsPolling();
-  return _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
-    selectorFor_useUserThreads,
-    _core.shallow
-  );
-}
-function useUserThreadsSuspense_withClient(client) {
-  const { waitUntilUserThreadsLoaded } = getExtrasForClient(client);
-  use(waitUntilUserThreadsLoaded());
-  const result = useUserThreads_withClient(client);
-  _core.assert.call(void 0, !result.error, "Did not expect error");
-  _core.assert.call(void 0, !result.isLoading, "Did not expect loading");
-  return result;
-}
 function useInboxNotifications_withClient(client) {
   const { loadInboxNotifications, store, useEnableInboxNotificationsPolling } = getExtrasForClient(client);
   _react.useEffect.call(void 0, () => {
@@ -679,9 +1343,9 @@ function useInboxNotifications_withClient(client) {
   }, [loadInboxNotifications]);
   useEnableInboxNotificationsPolling();
   return _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeInboxNotifications,
+    store.getInboxNotifications,
+    store.getInboxNotifications,
     selectorFor_useInboxNotifications,
     _core.shallow
   );
@@ -701,9 +1365,9 @@ function useUnreadInboxNotificationsCount_withClient(client) {
   }, [loadInboxNotifications]);
   useEnableInboxNotificationsPolling();
   return _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeInboxNotifications,
+    store.getInboxNotifications,
+    store.getInboxNotifications,
     selectorFor_useUnreadInboxNotificationsCount,
     _core.shallow
   );
@@ -720,48 +1384,22 @@ function useMarkInboxNotificationAsRead_withClient(client) {
   return _react.useCallback.call(void 0, 
     (inboxNotificationId) => {
       const { store } = getExtrasForClient(client);
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const readAt = /* @__PURE__ */ new Date();
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "mark-inbox-notification-as-read",
-        id: optimisticUpdateId,
         inboxNotificationId,
         readAt
       });
       client.markInboxNotificationAsRead(inboxNotificationId).then(
         () => {
-          store.set((state) => {
-            const existingNotification = state.inboxNotifications[inboxNotificationId];
-            if (existingNotification === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: state.optimisticUpdates.filter(
-                  (update) => update.id !== optimisticUpdateId
-                )
-              };
-            }
-            return {
-              ...state,
-              inboxNotifications: {
-                ...state.inboxNotifications,
-                [inboxNotificationId]: {
-                  ...existingNotification,
-                  readAt
-                }
-              },
-              optimisticUpdates: state.optimisticUpdates.filter(
-                (update) => update.id !== optimisticUpdateId
-              )
-            };
-          });
+          store.updateInboxNotification(
+            inboxNotificationId,
+            optimisticUpdateId,
+            (inboxNotification) => ({ ...inboxNotification, readAt })
+          );
         },
         () => {
-          store.set((state) => ({
-            ...state,
-            optimisticUpdates: state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            )
-          }));
+          store.removeOptimisticUpdate(optimisticUpdateId);
         }
       );
     },
@@ -771,37 +1409,20 @@ function useMarkInboxNotificationAsRead_withClient(client) {
 function useMarkAllInboxNotificationsAsRead_withClient(client) {
   return _react.useCallback.call(void 0, () => {
     const { store } = getExtrasForClient(client);
-    const optimisticUpdateId = _core.nanoid.call(void 0, );
     const readAt = /* @__PURE__ */ new Date();
-    store.pushOptimisticUpdate({
+    const optimisticUpdateId = store.addOptimisticUpdate({
       type: "mark-all-inbox-notifications-as-read",
-      id: optimisticUpdateId,
       readAt
     });
     client.markAllInboxNotificationsAsRead().then(
       () => {
-        store.set((state) => ({
-          ...state,
-          inboxNotifications: Object.fromEntries(
-            Array.from(Object.entries(state.inboxNotifications)).map(
-              ([id, inboxNotification]) => [
-                id,
-                { ...inboxNotification, readAt }
-              ]
-            )
-          ),
-          optimisticUpdates: state.optimisticUpdates.filter(
-            (update) => update.id !== optimisticUpdateId
-          )
-        }));
+        store.updateAllInboxNotifications(
+          optimisticUpdateId,
+          (inboxNotification) => ({ ...inboxNotification, readAt })
+        );
       },
       () => {
-        store.set((state) => ({
-          ...state,
-          optimisticUpdates: state.optimisticUpdates.filter(
-            (update) => update.id !== optimisticUpdateId
-          )
-        }));
+        store.removeOptimisticUpdate(optimisticUpdateId);
       }
     );
   }, [client]);
@@ -810,43 +1431,21 @@ function useDeleteInboxNotification_withClient(client) {
   return _react.useCallback.call(void 0, 
     (inboxNotificationId) => {
       const { store } = getExtrasForClient(client);
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const deletedAt = /* @__PURE__ */ new Date();
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "delete-inbox-notification",
-        id: optimisticUpdateId,
         inboxNotificationId,
         deletedAt
       });
       client.deleteInboxNotification(inboxNotificationId).then(
         () => {
-          store.set((state) => {
-            const existingNotification = state.inboxNotifications[inboxNotificationId];
-            if (existingNotification === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: state.optimisticUpdates.filter(
-                  (update) => update.id !== optimisticUpdateId
-                )
-              };
-            }
-            const { [inboxNotificationId]: _, ...inboxNotifications } = state.inboxNotifications;
-            return {
-              ...state,
-              inboxNotifications,
-              optimisticUpdates: state.optimisticUpdates.filter(
-                (update) => update.id !== optimisticUpdateId
-              )
-            };
-          });
+          store.deleteInboxNotification(
+            inboxNotificationId,
+            optimisticUpdateId
+          );
         },
         () => {
-          store.set((state) => ({
-            ...state,
-            optimisticUpdates: state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            )
-          }));
+          store.removeOptimisticUpdate(optimisticUpdateId);
         }
       );
     },
@@ -856,30 +1455,17 @@ function useDeleteInboxNotification_withClient(client) {
 function useDeleteAllInboxNotifications_withClient(client) {
   return _react.useCallback.call(void 0, () => {
     const { store } = getExtrasForClient(client);
-    const optimisticUpdateId = _core.nanoid.call(void 0, );
     const deletedAt = /* @__PURE__ */ new Date();
-    store.pushOptimisticUpdate({
+    const optimisticUpdateId = store.addOptimisticUpdate({
       type: "delete-all-inbox-notifications",
-      id: optimisticUpdateId,
       deletedAt
     });
     client.deleteAllInboxNotifications().then(
       () => {
-        store.set((state) => ({
-          ...state,
-          inboxNotifications: {},
-          optimisticUpdates: state.optimisticUpdates.filter(
-            (update) => update.id !== optimisticUpdateId
-          )
-        }));
+        store.deleteAllInboxNotifications(optimisticUpdateId);
       },
       () => {
-        store.set((state) => ({
-          ...state,
-          optimisticUpdates: state.optimisticUpdates.filter(
-            (update) => update.id !== optimisticUpdateId
-          )
-        }));
+        store.removeOptimisticUpdate(optimisticUpdateId);
       }
     );
   }, [client]);
@@ -888,13 +1474,13 @@ function useInboxNotificationThread_withClient(client, inboxNotificationId) {
   const { store } = getExtrasForClient(client);
   const selector = _react.useCallback.call(void 0, 
     (state) => {
-      const inboxNotification = _nullishCoalesce(state.inboxNotifications[inboxNotificationId], () => ( _core.raise.call(void 0, `Inbox notification with ID "${inboxNotificationId}" not found`)));
+      const inboxNotification = _nullishCoalesce(state.inboxNotificationsById[inboxNotificationId], () => ( _core.raise.call(void 0, `Inbox notification with ID "${inboxNotificationId}" not found`)));
       if (inboxNotification.kind !== "thread") {
         _core.raise.call(void 0, 
           `Inbox notification with ID "${inboxNotificationId}" is not of kind "thread"`
         );
       }
-      const thread = _nullishCoalesce(state.threads[inboxNotification.threadId], () => ( _core.raise.call(void 0, 
+      const thread = _nullishCoalesce(state.threadsById[inboxNotification.threadId], () => ( _core.raise.call(void 0, 
         `Thread with ID "${inboxNotification.threadId}" not found, this inbox notification might not be of kind "thread"`
       )));
       return thread;
@@ -902,9 +1488,9 @@ function useInboxNotificationThread_withClient(client, inboxNotificationId) {
     [inboxNotificationId]
   );
   return _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeInboxNotifications,
+    store.getInboxNotifications,
+    store.getInboxNotifications,
     selector
   );
 }
@@ -1018,19 +1604,19 @@ function createSharedContext(client) {
       useClient: useClient2,
       useUser: (userId) => useUser_withClient(client, userId),
       useRoomInfo: (roomId) => useRoomInfo_withClient(client, roomId),
-      useIsInsideRoom: _useIsInsideRoom
+      useIsInsideRoom
     },
     suspense: {
       useClient: useClient2,
       useUser: (userId) => useUserSuspense_withClient(client, userId),
       useRoomInfo: (roomId) => useRoomInfoSuspense_withClient(client, roomId),
-      useIsInsideRoom: _useIsInsideRoom
+      useIsInsideRoom
     }
   };
 }
 function useEnsureNoLiveblocksProvider(options) {
   const existing = useClientOrNull();
-  if (!_optionalChain([options, 'optionalAccess', _4 => _4.allowNesting]) && existing !== null) {
+  if (!_optionalChain([options, 'optionalAccess', _19 => _19.allowNesting]) && existing !== null) {
     throw new Error(
       "You cannot nest multiple LiveblocksProvider instances in the same React tree."
     );
@@ -1077,11 +1663,101 @@ function LiveblocksProvider(props) {
 function createLiveblocksContext(client) {
   return getOrCreateContextBundle(client);
 }
-function useUserThreads_experimental() {
-  return useUserThreads_withClient(useClient());
+function useUserThreads_experimental(options = {
+  query: {
+    metadata: {}
+  }
+}) {
+  const queryKey = React.default.useMemo(
+    () => makeUserThreadsQueryKey(options.query),
+    [options]
+  );
+  const client = useClient();
+  const { store, incrementUserThreadsQuerySubscribers, getUserThreads } = getExtrasForClient(client);
+  _react.useEffect.call(void 0, () => {
+    void getUserThreads(queryKey, options);
+    return incrementUserThreadsQuerySubscribers(queryKey);
+  }, [queryKey, incrementUserThreadsQuerySubscribers, getUserThreads, options]);
+  const selector = _react.useCallback.call(void 0, 
+    (state) => {
+      const query = state.queries[queryKey];
+      if (query === void 0 || query.isLoading) {
+        return {
+          isLoading: true
+        };
+      }
+      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
+      };
+    },
+    [queryKey, options]
+  );
+  return _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
+    store.subscribeThreads,
+    store.getThreads,
+    store.getThreads,
+    selector,
+    shallow2
+    // NOTE: Using 2-level-deep shallow check here, because the result of selectThreads() is not stable!
+  );
 }
-function useUserThreadsSuspense_experimental() {
-  return useUserThreadsSuspense_withClient(useClient());
+function useUserThreadsSuspense_experimental(options = {
+  query: {
+    metadata: {}
+  }
+}) {
+  const queryKey = React.default.useMemo(
+    () => makeUserThreadsQueryKey(options.query),
+    [options]
+  );
+  const client = useClient();
+  const { store, getUserThreads } = getExtrasForClient(client);
+  React.default.useEffect(() => {
+    const { incrementUserThreadsQuerySubscribers } = getExtrasForClient(client);
+    return incrementUserThreadsQuerySubscribers(queryKey);
+  }, [client, queryKey]);
+  const query = store.getThreads().queries[queryKey];
+  if (query === void 0 || query.isLoading) {
+    throw getUserThreads(queryKey, options);
+  }
+  if (query.error) {
+    throw query.error;
+  }
+  const selector = _react.useCallback.call(void 0, 
+    (state) => {
+      return {
+        threads: selectThreads(state, {
+          roomId: null,
+          // Do _not_ filter by roomId
+          query: options.query,
+          orderBy: "last-update"
+        }),
+        isLoading: false
+      };
+    },
+    [options]
+  );
+  return _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
+    store.subscribeThreads,
+    store.getThreads,
+    store.getThreads,
+    selector,
+    shallow2
+    // NOTE: Using 2-level-deep shallow check here, because the result of selectThreads() is not stable!
+  );
 }
 function useInboxNotifications() {
   return useInboxNotifications_withClient(useClient());
@@ -1132,6 +1808,125 @@ var _useUser = useUser;
 var _useUserSuspense = useUserSuspense;
 var _useUserThreads_experimental = useUserThreads_experimental;
 var _useUserThreadsSuspense_experimental = useUserThreadsSuspense_experimental;
+var makeUserThreadsQueryKey = (options) => `${USER_THREADS_QUERY}:${_core.stringify.call(void 0, options)}`;
+
+// src/types/errors.ts
+var CreateThreadError = class extends Error {
+  constructor(cause, context) {
+    super("Create thread failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "CreateThreadError";
+  }
+};
+var DeleteThreadError = class extends Error {
+  constructor(cause, context) {
+    super("Delete thread failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "DeleteThreadError";
+  }
+};
+var EditThreadMetadataError = class extends Error {
+  constructor(cause, context) {
+    super("Edit thread metadata failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "EditThreadMetadataError";
+  }
+};
+var MarkThreadAsResolvedError = class extends Error {
+  constructor(cause, context) {
+    super("Mark thread as resolved failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "MarkThreadAsResolvedError";
+  }
+};
+var MarkThreadAsUnresolvedError = class extends Error {
+  constructor(cause, context) {
+    super("Mark thread as unresolved failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "MarkThreadAsUnresolvedError";
+  }
+};
+var CreateCommentError = class extends Error {
+  constructor(cause, context) {
+    super("Create comment failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "CreateCommentError";
+  }
+};
+var EditCommentError = class extends Error {
+  constructor(cause, context) {
+    super("Edit comment failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "EditCommentError";
+  }
+};
+var DeleteCommentError = class extends Error {
+  constructor(cause, context) {
+    super("Delete comment failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "DeleteCommentError";
+  }
+};
+var AddReactionError = class extends Error {
+  constructor(cause, context) {
+    super("Add reaction failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "AddReactionError";
+  }
+};
+var RemoveReactionError = class extends Error {
+  constructor(cause, context) {
+    super("Remove reaction failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "RemoveReactionError";
+  }
+};
+var MarkInboxNotificationAsReadError = class extends Error {
+  constructor(cause, context) {
+    super("Mark inbox notification as read failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "MarkInboxNotificationAsReadError";
+  }
+};
+var UpdateNotificationSettingsError = class extends Error {
+  constructor(cause, context) {
+    super("Update notification settings failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "UpdateNotificationSettingsError";
+  }
+};
+
+// src/room.tsx
+var _client = require('@liveblocks/client');
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 // src/use-scroll-to-comment-on-load-effect.ts
 
@@ -1153,7 +1948,7 @@ function handleScrollToCommentOnLoad(shouldScrollOnLoad, state) {
   comment.scrollIntoView();
 }
 function useScrollToCommentOnLoadEffect(shouldScrollOnLoad, state) {
-  React3.useEffect(
+  React4.useEffect(
     () => {
       handleScrollToCommentOnLoad(shouldScrollOnLoad, state);
     },
@@ -1196,6 +1991,10 @@ function alwaysNull() {
 function selectorFor_useOthersConnectionIds(others) {
   return others.map((user) => user.connectionId);
 }
+function selectNotificationSettings(roomId, state) {
+  const notificationSettings = state.notificationSettingsByRoomId;
+  return _core.nn.call(void 0, notificationSettings[roomId]);
+}
 function makeMutationContext(room) {
   const cannotUseUntil = "This mutation cannot be used until";
   const needsPresence = `${cannotUseUntil} connected to the Liveblocks room`;
@@ -1235,7 +2034,7 @@ function getCurrentUserId(room) {
 }
 function handleApiError(err) {
   const message = `Request failed with status ${err.status}: ${err.message}`;
-  if (_optionalChain([err, 'access', _5 => _5.details, 'optionalAccess', _6 => _6.error]) === "FORBIDDEN") {
+  if (_optionalChain([err, 'access', _20 => _20.details, 'optionalAccess', _21 => _21.error]) === "FORBIDDEN") {
     const detailedMessage = [message, err.details.suggestion, err.details.docs].filter(Boolean).join("\n");
     _core.console.error(detailedMessage);
   }
@@ -1260,7 +2059,7 @@ function getExtrasForClient2(client) {
   return extras;
 }
 function makeExtrasForClient2(client) {
-  const store = client[_core.kInternal].cacheStore;
+  const store = getUmbrellaStoreForClient(client);
   const DEFAULT_DEDUPING_INTERVAL = 2e3;
   const lastRequestedAtByRoom = /* @__PURE__ */ new Map();
   const requestsByQuery = /* @__PURE__ */ new Map();
@@ -1329,9 +2128,7 @@ function makeExtrasForClient2(client) {
     if (existingRequest !== void 0) return existingRequest;
     const request = room[_core.kInternal].listTextVersions();
     requestsByQuery.set(queryKey, request);
-    store.setQueryState(queryKey, {
-      isLoading: true
-    });
+    store.setQueryLoading(queryKey);
     try {
       const result = await request;
       const data = await result.json();
@@ -1350,10 +2147,7 @@ function makeExtrasForClient2(client) {
           retryCount: retryCount + 1
         });
       }, retryCount);
-      store.setQueryState(queryKey, {
-        isLoading: false,
-        error: err
-      });
+      store.setQueryError(queryKey, err);
     }
     return;
   }
@@ -1362,9 +2156,7 @@ function makeExtrasForClient2(client) {
     if (existingRequest !== void 0) return existingRequest;
     const request = room.getThreads(options);
     requestsByQuery.set(queryKey, request);
-    store.setQueryState(queryKey, {
-      isLoading: true
-    });
+    store.setQueryLoading(queryKey);
     try {
       const result = await request;
       store.updateThreadsAndNotifications(
@@ -1387,10 +2179,7 @@ function makeExtrasForClient2(client) {
           retryCount: retryCount + 1
         });
       }, retryCount);
-      store.setQueryState(queryKey, {
-        isLoading: false,
-        error: err
-      });
+      store.setQueryError(queryKey, err);
     }
     return;
   }
@@ -1400,9 +2189,7 @@ function makeExtrasForClient2(client) {
     try {
       const request = room.getNotificationSettings();
       requestsByQuery.set(queryKey, request);
-      store.setQueryState(queryKey, {
-        isLoading: true
-      });
+      store.setQueryLoading(queryKey);
       const settings = await request;
       store.updateRoomInboxNotificationSettings(room.id, settings, queryKey);
     } catch (err) {
@@ -1412,21 +2199,13 @@ function makeExtrasForClient2(client) {
           retryCount: retryCount + 1
         });
       }, retryCount);
-      store.setQueryState(queryKey, {
-        isLoading: false,
-        error: err
-      });
+      store.setQueryError(queryKey, err);
     }
     return;
   }
   const commentsErrorEventSource = _core.makeEventSource.call(void 0, );
   function onMutationFailure(innerError, optimisticUpdateId, createPublicError) {
-    store.set((state) => ({
-      ...state,
-      optimisticUpdates: state.optimisticUpdates.filter(
-        (update) => update.id !== optimisticUpdateId
-      )
-    }));
+    store.removeOptimisticUpdate(optimisticUpdateId);
     if (innerError instanceof _core.CommentsApiError) {
       const error = handleApiError(innerError);
       commentsErrorEventSource.notify(createPublicError(error));
@@ -1449,10 +2228,9 @@ function makeExtrasForClient2(client) {
     onMutationFailure
   };
 }
-var RoomContext = React4.createContext(null);
 function makeRoomContextBundle(client) {
   function RoomProvider_withImplicitLiveblocksProvider(props) {
-    return /* @__PURE__ */ React4.createElement(LiveblocksProviderWithClient, { client, allowNesting: true }, /* @__PURE__ */ React4.createElement(RoomProvider, { ...props }));
+    return /* @__PURE__ */ React5.createElement(LiveblocksProviderWithClient, { client, allowNesting: true }, /* @__PURE__ */ React5.createElement(RoomProvider, { ...props }));
   }
   const shared = createSharedContext(client);
   const bundle = {
@@ -1554,10 +2332,10 @@ function makeRoomContextBundle(client) {
 }
 function RoomProvider(props) {
   const client = useClient();
-  const [cache] = React4.useState(
+  const [cache] = React5.useState(
     () => /* @__PURE__ */ new Map()
   );
-  const stableEnterRoom = React4.useCallback(
+  const stableEnterRoom = React5.useCallback(
     (roomId, options) => {
       const cached = cache.get(roomId);
       if (cached) return cached;
@@ -1572,7 +2350,7 @@ function RoomProvider(props) {
     },
     [client, cache]
   );
-  return /* @__PURE__ */ React4.createElement(
+  return /* @__PURE__ */ React5.createElement(
     RoomProviderInner,
     {
       ...props,
@@ -1589,10 +2367,10 @@ function RoomProviderInner(props) {
         "RoomProvider id property is required. For more information: https://liveblocks.io/docs/errors/liveblocks-react/RoomProvider-id-property-is-required"
       );
     }
-    if (typeof roomId !== "string") {
+    if (!isString(roomId)) {
       throw new Error("RoomProvider id property should be a string.");
     }
-    const majorReactVersion = parseInt(React4.version) || 1;
+    const majorReactVersion = parseInt(React5.version) || 1;
     const oldReactVersion = majorReactVersion < 18;
     _core.errorIf.call(void 0, 
       oldReactVersion && props.unstable_batchedUpdates === void 0,
@@ -1609,27 +2387,27 @@ function RoomProviderInner(props) {
     unstable_batchedUpdates: props.unstable_batchedUpdates,
     autoConnect: _nullishCoalesce(props.autoConnect, () => ( typeof window !== "undefined"))
   });
-  const [{ room }, setRoomLeavePair] = React4.useState(
+  const [{ room }, setRoomLeavePair] = React5.useState(
     () => stableEnterRoom(roomId, {
       ...frozenProps,
       autoConnect: false
       // Deliberately using false here on the first render, see below
     })
   );
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     const { store } = getExtrasForClient2(client);
     async function handleCommentEvent(message) {
       if (message.type === _core.ServerMsgCode.THREAD_DELETED) {
-        store.deleteThread(message.threadId);
+        store.deleteThread(message.threadId, null);
         return;
       }
       const info = await room.getThread(message.threadId);
       if (!info.thread) {
-        store.deleteThread(message.threadId);
+        store.deleteThread(message.threadId, null);
         return;
       }
       const { thread, inboxNotification } = info;
-      const existingThread = store.get().threads[message.threadId];
+      const existingThread = store.getThreads().threadsById[message.threadId];
       switch (message.type) {
         case _core.ServerMsgCode.COMMENT_EDITED:
         case _core.ServerMsgCode.THREAD_METADATA_UPDATED:
@@ -1651,11 +2429,11 @@ function RoomProviderInner(props) {
       (message) => void handleCommentEvent(message)
     );
   }, [client, room]);
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     const { getThreadsUpdates } = getExtrasForClient2(client);
     void getThreadsUpdates(room.id);
   }, [client, room.id]);
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     function handleIsOnline() {
       const { getThreadsUpdates } = getExtrasForClient2(client);
       void getThreadsUpdates(room.id);
@@ -1665,7 +2443,7 @@ function RoomProviderInner(props) {
       window.removeEventListener("online", handleIsOnline);
     };
   }, [client, room.id]);
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     const pair = stableEnterRoom(roomId, frozenProps);
     setRoomLeavePair(pair);
     const { room: room2, leave } = pair;
@@ -1676,7 +2454,7 @@ function RoomProviderInner(props) {
       leave();
     };
   }, [roomId, frozenProps, stableEnterRoom]);
-  return /* @__PURE__ */ React4.createElement(RoomContext.Provider, { value: room }, props.children);
+  return /* @__PURE__ */ React5.createElement(RoomContext.Provider, { value: room }, props.children);
 }
 function useRoom() {
   const room = useRoomOrNull();
@@ -1685,10 +2463,6 @@ function useRoom() {
   }
   return room;
 }
-function useIsInsideRoom() {
-  const room = useRoomOrNull();
-  return room !== null;
-}
 function useStatus() {
   const room = useRoom();
   const subscribe = room.events.status.subscribe;
@@ -1697,7 +2471,7 @@ function useStatus() {
   return useSyncExternalStore2(subscribe, getSnapshot, getServerSnapshot);
 }
 function useStorageStatus(options) {
-  const smooth = useInitial(_nullishCoalesce(_optionalChain([options, 'optionalAccess', _7 => _7.smooth]), () => ( false)));
+  const smooth = useInitial(_nullishCoalesce(_optionalChain([options, 'optionalAccess', _22 => _22.smooth]), () => ( false)));
   if (smooth) {
     return useStorageStatusSmooth();
   } else {
@@ -1713,9 +2487,9 @@ function useStorageStatusImmediate() {
 }
 function useStorageStatusSmooth() {
   const room = useRoom();
-  const [status, setStatus] = React4.useState(room.getStorageStatus);
+  const [status, setStatus] = React5.useState(room.getStorageStatus);
   const oldStatus = useLatest(room.getStorageStatus());
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     let timeoutId;
     const unsub = room.events.storageStatus.subscribe((newStatus) => {
       if (oldStatus.current === "synchronizing" && newStatus === "synchronized") {
@@ -1737,7 +2511,7 @@ function useBatch() {
 }
 function useBroadcastEvent() {
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     (event, options = { shouldQueueEventIfNotReady: false }) => {
       room.broadcastEvent(event, options);
     },
@@ -1747,7 +2521,7 @@ function useBroadcastEvent() {
 function useOthersListener(callback) {
   const room = useRoom();
   const savedCallback = useLatest(callback);
-  React4.useEffect(
+  React5.useEffect(
     () => room.events.others.subscribe((event) => savedCallback.current(event)),
     [room, savedCallback]
   );
@@ -1755,7 +2529,7 @@ function useOthersListener(callback) {
 function useLostConnectionListener(callback) {
   const room = useRoom();
   const savedCallback = useLatest(callback);
-  React4.useEffect(
+  React5.useEffect(
     () => room.events.lostConnection.subscribe(
       (event) => savedCallback.current(event)
     ),
@@ -1765,7 +2539,7 @@ function useLostConnectionListener(callback) {
 function useErrorListener(callback) {
   const room = useRoom();
   const savedCallback = useLatest(callback);
-  React4.useEffect(
+  React5.useEffect(
     () => room.events.error.subscribe((e) => savedCallback.current(e)),
     [room, savedCallback]
   );
@@ -1773,7 +2547,7 @@ function useErrorListener(callback) {
 function useEventListener(callback) {
   const room = useRoom();
   const savedCallback = useLatest(callback);
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     const listener = (eventData) => {
       savedCallback.current(eventData);
     };
@@ -1806,7 +2580,7 @@ function useSelf(maybeSelector, isEqual) {
   const subscribe = room.events.self.subscribe;
   const getSnapshot = room.getSelf;
   const selector = _nullishCoalesce(maybeSelector, () => ( identity));
-  const wrappedSelector = React4.useCallback(
+  const wrappedSelector = React5.useCallback(
     (me) => me !== null ? selector(me) : null,
     [selector]
   );
@@ -1844,11 +2618,11 @@ function useOthers(selector, isEqual) {
   );
 }
 function useOthersMapped(itemSelector, itemIsEqual) {
-  const wrappedSelector = React4.useCallback(
+  const wrappedSelector = React5.useCallback(
     (others) => others.map((other) => [other.connectionId, itemSelector(other)]),
     [itemSelector]
   );
-  const wrappedIsEqual = React4.useCallback(
+  const wrappedIsEqual = React5.useCallback(
     (a, b) => {
       const eq = _nullishCoalesce(itemIsEqual, () => ( Object.is));
       return a.length === b.length && a.every((atuple, index) => {
@@ -1865,14 +2639,14 @@ function useOthersConnectionIds() {
 }
 var NOT_FOUND = Symbol();
 function useOther(connectionId, selector, isEqual) {
-  const wrappedSelector = React4.useCallback(
+  const wrappedSelector = React5.useCallback(
     (others) => {
       const other2 = others.find((other3) => other3.connectionId === connectionId);
       return other2 !== void 0 ? selector(other2) : NOT_FOUND;
     },
     [connectionId, selector]
   );
-  const wrappedIsEqual = React4.useCallback(
+  const wrappedIsEqual = React5.useCallback(
     (prev, curr) => {
       if (prev === NOT_FOUND || curr === NOT_FOUND) {
         return prev === curr;
@@ -1903,15 +2677,15 @@ function useStorageRoot() {
 function useStorage(selector, isEqual) {
   const room = useRoom();
   const rootOrNull = useMutableStorageRoot();
-  const wrappedSelector = React4.useCallback(
+  const wrappedSelector = React5.useCallback(
     (rootOrNull2) => rootOrNull2 !== null ? selector(rootOrNull2) : null,
     [selector]
   );
-  const subscribe = React4.useCallback(
+  const subscribe = React5.useCallback(
     (onStoreChange) => rootOrNull !== null ? room.subscribe(rootOrNull, onStoreChange, { isDeep: true }) : noop2,
     [room, rootOrNull]
   );
-  const getSnapshot = React4.useCallback(() => {
+  const getSnapshot = React5.useCallback(() => {
     if (rootOrNull === null) {
       return null;
     } else {
@@ -1931,7 +2705,7 @@ function useStorage(selector, isEqual) {
 }
 function useMutation(callback, deps) {
   const room = useRoom();
-  return React4.useMemo(
+  return React5.useMemo(
     () => {
       return (...args) => (
         // eslint-disable-next-line @typescript-eslint/no-unsafe-return
@@ -1956,16 +2730,16 @@ function useThreads(options = {
   const { scrollOnLoad = true } = options;
   const client = useClient();
   const room = useRoom();
-  const queryKey = React4.useMemo(
+  const queryKey = React5.useMemo(
     () => generateQueryKey(room.id, options.query),
     [room, options]
   );
   const { store, getThreadsAndInboxNotifications, incrementQuerySubscribers } = getExtrasForClient2(client);
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     void getThreadsAndInboxNotifications(room, queryKey, options);
     return incrementQuerySubscribers(queryKey);
   }, [room, queryKey]);
-  const selector = React4.useCallback(
+  const selector = React5.useCallback(
     (state2) => {
       const query = state2.queries[queryKey];
       if (query === void 0 || query.isLoading) {
@@ -1974,7 +2748,11 @@ function useThreads(options = {
         };
       }
       return {
-        threads: selectedThreads(room.id, state2, options),
+        threads: selectThreads(state2, {
+          roomId: room.id,
+          query: options.query,
+          orderBy: "age"
+        }),
         isLoading: false,
         error: query.error
       };
@@ -1983,9 +2761,9 @@ function useThreads(options = {
     // eslint-disable-line react-hooks/exhaustive-deps
   );
   const state = _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeThreads,
+    store.getThreads,
+    store.getThreads,
     selector
   );
   useScrollToCommentOnLoadEffect(scrollOnLoad, state);
@@ -1995,14 +2773,14 @@ function useCommentsErrorListener(callback) {
   const client = useClient();
   const savedCallback = useLatest(callback);
   const { commentsErrorEventSource } = getExtrasForClient2(client);
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     return commentsErrorEventSource.subscribe(savedCallback.current);
   }, [savedCallback, commentsErrorEventSource]);
 }
 function useCreateThread() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     (options) => {
       const body = options.body;
       const metadata = _nullishCoalesce(options.metadata, () => ( {}));
@@ -2029,26 +2807,15 @@ function useCreateThread() {
         comments: [newComment],
         resolved: false
       };
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "create-thread",
         thread: newThread,
-        id: optimisticUpdateId,
         roomId: room.id
       });
       room.createThread({ threadId, commentId, body, metadata }).then(
         (thread) => {
-          store.set((state) => ({
-            ...state,
-            threads: {
-              ...state.threads,
-              [threadId]: thread
-            },
-            optimisticUpdates: state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            )
-          }));
+          store.createThread(optimisticUpdateId, thread);
         },
         (err) => onMutationFailure(
           err,
@@ -2070,44 +2837,23 @@ function useCreateThread() {
 function useDeleteThread() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     (threadId) => {
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      const thread = store.get().threads[threadId];
+      const thread = store.getThreads().threadsById[threadId];
       const userId = getCurrentUserId(room);
-      if (_optionalChain([thread, 'optionalAccess', _8 => _8.comments, 'optionalAccess', _9 => _9[0], 'optionalAccess', _10 => _10.userId]) !== userId) {
+      if (_optionalChain([thread, 'optionalAccess', _23 => _23.comments, 'optionalAccess', _24 => _24[0], 'optionalAccess', _25 => _25.userId]) !== userId) {
         throw new Error("Only the thread creator can delete the thread");
       }
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "delete-thread",
-        id: optimisticUpdateId,
         roomId: room.id,
         threadId,
         deletedAt: /* @__PURE__ */ new Date()
       });
       room.deleteThread(threadId).then(
         () => {
-          store.set((state) => {
-            const existingThread = state.threads[threadId];
-            if (existingThread === void 0) {
-              return state;
-            }
-            return {
-              ...state,
-              threads: {
-                ...state.threads,
-                [threadId]: {
-                  ...existingThread,
-                  updatedAt: /* @__PURE__ */ new Date(),
-                  deletedAt: /* @__PURE__ */ new Date()
-                }
-              },
-              optimisticUpdates: state.optimisticUpdates.filter(
-                (update) => update.id !== optimisticUpdateId
-              )
-            };
-          });
+          store.deleteThread(threadId, optimisticUpdateId);
         },
         (err) => onMutationFailure(
           err,
@@ -2122,7 +2868,7 @@ function useDeleteThread() {
 function useEditThreadMetadata() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     (options) => {
       if (!options.metadata) {
         return;
@@ -2130,53 +2876,23 @@ function useEditThreadMetadata() {
       const threadId = options.threadId;
       const metadata = options.metadata;
       const updatedAt = /* @__PURE__ */ new Date();
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "edit-thread-metadata",
         metadata,
-        id: optimisticUpdateId,
         threadId,
         updatedAt
       });
-      room.editThreadMetadata({ metadata, threadId }).then(
-        (metadata2) => {
-          store.set((state) => {
-            const existingThread = state.threads[threadId];
-            const updatedOptimisticUpdates = state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            );
-            if (existingThread === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            if (existingThread.deletedAt !== void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            if (existingThread.updatedAt && existingThread.updatedAt > updatedAt) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            return {
-              ...state,
-              threads: {
-                ...state.threads,
-                [threadId]: {
-                  ...existingThread,
-                  metadata: metadata2
-                }
-              },
-              optimisticUpdates: updatedOptimisticUpdates
-            };
-          });
-        },
+      room.editThreadMetadata({ threadId, metadata }).then(
+        (metadata2) => (
+          // Replace the optimistic update by the real thing
+          store.patchThread(
+            threadId,
+            optimisticUpdateId,
+            { metadata: metadata2 },
+            updatedAt
+          )
+        ),
         (err) => onMutationFailure(
           err,
           optimisticUpdateId,
@@ -2194,7 +2910,7 @@ function useEditThreadMetadata() {
 function useCreateComment() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     ({ threadId, body }) => {
       const commentId = _core.createCommentId.call(void 0, );
       const createdAt = /* @__PURE__ */ new Date();
@@ -2208,50 +2924,14 @@ function useCreateComment() {
         body,
         reactions: []
       };
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "create-comment",
-        comment,
-        id: optimisticUpdateId
+        comment
       });
       room.createComment({ threadId, commentId, body }).then(
         (newComment) => {
-          store.set((state) => {
-            const existingThread = state.threads[threadId];
-            const updatedOptimisticUpdates = state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            );
-            if (existingThread === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            const inboxNotification = Object.values(
-              state.inboxNotifications
-            ).find(
-              (notification) => notification.kind === "thread" && notification.threadId === threadId
-            );
-            const updatedInboxNotifications = inboxNotification !== void 0 ? {
-              ...state.inboxNotifications,
-              [inboxNotification.id]: {
-                ...inboxNotification,
-                notifiedAt: newComment.createdAt,
-                readAt: newComment.createdAt
-              }
-            } : state.inboxNotifications;
-            return {
-              ...state,
-              threads: {
-                ...state.threads,
-                [threadId]: _core.upsertComment.call(void 0, existingThread, newComment)
-                // Upsert the new comment into the thread comments list (if applicable)
-              },
-              inboxNotifications: updatedInboxNotifications,
-              optimisticUpdates: updatedOptimisticUpdates
-            };
-          });
+          store.createComment(newComment, optimisticUpdateId);
         },
         (err) => onMutationFailure(
           err,
@@ -2272,12 +2952,11 @@ function useCreateComment() {
 function useEditComment() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     ({ threadId, commentId, body }) => {
       const editedAt = /* @__PURE__ */ new Date();
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      const thread = store.get().threads[threadId];
+      const thread = store.getThreads().threadsById[threadId];
       if (thread === void 0) {
         _core.console.warn(
           `Internal unexpected behavior. Cannot edit comment in thread "${threadId}" because the thread does not exist in the cache.`
@@ -2293,38 +2972,17 @@ function useEditComment() {
         );
         return;
       }
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "edit-comment",
         comment: {
           ...comment,
           editedAt,
           body
-        },
-        id: optimisticUpdateId
+        }
       });
       room.editComment({ threadId, commentId, body }).then(
         (editedComment) => {
-          store.set((state) => {
-            const existingThread = state.threads[threadId];
-            const updatedOptimisticUpdates = state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            );
-            if (existingThread === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            return {
-              ...state,
-              threads: {
-                ...state.threads,
-                [threadId]: _core.upsertComment.call(void 0, existingThread, editedComment)
-                // Upsert the edited comment into the thread comments list (if applicable)
-              },
-              optimisticUpdates: updatedOptimisticUpdates
-            };
-          });
+          store.editComment(threadId, optimisticUpdateId, editedComment);
         },
         (err) => onMutationFailure(
           err,
@@ -2344,41 +3002,25 @@ function useEditComment() {
 function useDeleteComment() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     ({ threadId, commentId }) => {
       const deletedAt = /* @__PURE__ */ new Date();
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "delete-comment",
         threadId,
         commentId,
         deletedAt,
-        id: optimisticUpdateId,
         roomId: room.id
       });
       room.deleteComment({ threadId, commentId }).then(
         () => {
-          store.set((state) => {
-            const existingThread = state.threads[threadId];
-            const updatedOptimisticUpdates = state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            );
-            if (existingThread === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            return {
-              ...state,
-              threads: {
-                ...state.threads,
-                [threadId]: _core.deleteComment.call(void 0, existingThread, commentId, deletedAt)
-              },
-              optimisticUpdates: updatedOptimisticUpdates
-            };
-          });
+          store.deleteComment(
+            threadId,
+            optimisticUpdateId,
+            commentId,
+            deletedAt
+          );
         },
         (err) => onMutationFailure(
           err,
@@ -2397,13 +3039,12 @@ function useDeleteComment() {
 function useAddReaction() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     ({ threadId, commentId, emoji }) => {
       const createdAt = /* @__PURE__ */ new Date();
       const userId = getCurrentUserId(room);
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "add-reaction",
         threadId,
         commentId,
@@ -2411,35 +3052,17 @@ function useAddReaction() {
           emoji,
           userId,
           createdAt
-        },
-        id: optimisticUpdateId
+        }
       });
       room.addReaction({ threadId, commentId, emoji }).then(
         (addedReaction) => {
-          store.set((state) => {
-            const existingThread = state.threads[threadId];
-            const updatedOptimisticUpdates = state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            );
-            if (existingThread === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            return {
-              ...state,
-              threads: {
-                ...state.threads,
-                [threadId]: _core.addReaction.call(void 0, 
-                  existingThread,
-                  commentId,
-                  addedReaction
-                )
-              },
-              optimisticUpdates: updatedOptimisticUpdates
-            };
-          });
+          store.addReaction(
+            threadId,
+            optimisticUpdateId,
+            commentId,
+            addedReaction,
+            createdAt
+          );
         },
         (err) => onMutationFailure(
           err,
@@ -2459,49 +3082,29 @@ function useAddReaction() {
 function useRemoveReaction() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     ({ threadId, commentId, emoji }) => {
       const userId = getCurrentUserId(room);
       const removedAt = /* @__PURE__ */ new Date();
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "remove-reaction",
         threadId,
         commentId,
         emoji,
         userId,
-        removedAt,
-        id: optimisticUpdateId
+        removedAt
       });
       room.removeReaction({ threadId, commentId, emoji }).then(
         () => {
-          store.set((state) => {
-            const existingThread = state.threads[threadId];
-            const updatedOptimisticUpdates = state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            );
-            if (existingThread === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            return {
-              ...state,
-              threads: {
-                ...state.threads,
-                [threadId]: _core.removeReaction.call(void 0, 
-                  existingThread,
-                  commentId,
-                  emoji,
-                  userId,
-                  removedAt
-                )
-              },
-              optimisticUpdates: updatedOptimisticUpdates
-            };
-          });
+          store.removeReaction(
+            threadId,
+            optimisticUpdateId,
+            commentId,
+            emoji,
+            userId,
+            removedAt
+          );
         },
         (err) => onMutationFailure(
           err,
@@ -2521,38 +3124,28 @@ function useRemoveReaction() {
 function useMarkThreadAsRead() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     (threadId) => {
       const { store, onMutationFailure } = getExtrasForClient2(client);
       const inboxNotification = Object.values(
-        store.get().inboxNotifications
+        store.getInboxNotifications().inboxNotificationsById
       ).find(
         (inboxNotification2) => inboxNotification2.kind === "thread" && inboxNotification2.threadId === threadId
       );
       if (!inboxNotification) return;
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const now = /* @__PURE__ */ new Date();
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "mark-inbox-notification-as-read",
-        id: optimisticUpdateId,
         inboxNotificationId: inboxNotification.id,
         readAt: now
       });
       room.markInboxNotificationAsRead(inboxNotification.id).then(
         () => {
-          store.set((state) => ({
-            ...state,
-            inboxNotifications: {
-              ...state.inboxNotifications,
-              [inboxNotification.id]: {
-                ...inboxNotification,
-                readAt: now
-              }
-            },
-            optimisticUpdates: state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            )
-          }));
+          store.updateInboxNotification(
+            inboxNotification.id,
+            optimisticUpdateId,
+            (inboxNotification2) => ({ ...inboxNotification2, readAt: now })
+          );
         },
         (err) => {
           onMutationFailure(
@@ -2572,54 +3165,23 @@ function useMarkThreadAsRead() {
 function useMarkThreadAsResolved() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     (threadId) => {
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const updatedAt = /* @__PURE__ */ new Date();
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "mark-thread-as-resolved",
-        id: optimisticUpdateId,
         threadId,
         updatedAt
       });
       room.markThreadAsResolved(threadId).then(
         () => {
-          store.set((state) => {
-            const existingThread = state.threads[threadId];
-            const updatedOptimisticUpdates = state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            );
-            if (existingThread === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            if (existingThread.deletedAt !== void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            if (existingThread.updatedAt && existingThread.updatedAt > updatedAt) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            return {
-              ...state,
-              threads: {
-                ...state.threads,
-                [threadId]: {
-                  ...existingThread,
-                  resolved: true
-                }
-              },
-              optimisticUpdates: updatedOptimisticUpdates
-            };
-          });
+          store.patchThread(
+            threadId,
+            optimisticUpdateId,
+            { resolved: true },
+            updatedAt
+          );
         },
         (err) => onMutationFailure(
           err,
@@ -2637,54 +3199,23 @@ function useMarkThreadAsResolved() {
 function useMarkThreadAsUnresolved() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     (threadId) => {
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const updatedAt = /* @__PURE__ */ new Date();
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      store.pushOptimisticUpdate({
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "mark-thread-as-unresolved",
-        id: optimisticUpdateId,
         threadId,
         updatedAt
       });
       room.markThreadAsUnresolved(threadId).then(
         () => {
-          store.set((state) => {
-            const existingThread = state.threads[threadId];
-            const updatedOptimisticUpdates = state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            );
-            if (existingThread === void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            if (existingThread.deletedAt !== void 0) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            if (existingThread.updatedAt && existingThread.updatedAt > updatedAt) {
-              return {
-                ...state,
-                optimisticUpdates: updatedOptimisticUpdates
-              };
-            }
-            return {
-              ...state,
-              threads: {
-                ...state.threads,
-                [threadId]: {
-                  ...existingThread,
-                  resolved: false
-                }
-              },
-              optimisticUpdates: updatedOptimisticUpdates
-            };
-          });
+          store.patchThread(
+            threadId,
+            optimisticUpdateId,
+            { resolved: false },
+            updatedAt
+          );
         },
         (err) => onMutationFailure(
           err,
@@ -2702,12 +3233,12 @@ function useMarkThreadAsUnresolved() {
 function useThreadSubscription(threadId) {
   const client = useClient();
   const { store } = getExtrasForClient2(client);
-  const selector = React4.useCallback(
+  const selector = React5.useCallback(
     (state) => {
-      const inboxNotification = selectedInboxNotifications(state).find(
+      const inboxNotification = state.inboxNotifications.find(
         (inboxNotification2) => inboxNotification2.kind === "thread" && inboxNotification2.threadId === threadId
       );
-      const thread = state.threads[threadId];
+      const thread = state.threadsById[threadId];
       if (inboxNotification === void 0 || thread === void 0) {
         return {
           status: "not-subscribed"
@@ -2721,9 +3252,9 @@ function useThreadSubscription(threadId) {
     [threadId]
   );
   return _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeThreads,
+    store.getThreads,
+    store.getThreads,
     selector
   );
 }
@@ -2731,13 +3262,13 @@ function useRoomNotificationSettings() {
   const client = useClient();
   const room = useRoom();
   const { store } = getExtrasForClient2(client);
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     const { getInboxNotificationSettings } = getExtrasForClient2(client);
     const queryKey = makeNotificationSettingsQueryKey(room.id);
     void getInboxNotificationSettings(room, queryKey);
   }, [client, room]);
   const updateRoomNotificationSettings = useUpdateRoomNotificationSettings();
-  const selector = React4.useCallback(
+  const selector = React5.useCallback(
     (state) => {
       const query = state.queries[makeNotificationSettingsQueryKey(room.id)];
       if (query === void 0 || query.isLoading) {
@@ -2754,21 +3285,21 @@ function useRoomNotificationSettings() {
     [room]
   );
   const settings = _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeNotificationSettings,
+    store.getThreads,
+    store.getThreads,
     selector
   );
-  return React4.useMemo(() => {
+  return React5.useMemo(() => {
     return [settings, updateRoomNotificationSettings];
   }, [settings, updateRoomNotificationSettings]);
 }
 function useHistoryVersionData(versionId) {
-  const [state, setState] = React4.useState({
+  const [state, setState] = React5.useState({
     isLoading: true
   });
   const room = useRoom();
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     setState({ isLoading: true });
     const load = async () => {
       try {
@@ -2797,10 +3328,10 @@ function useHistoryVersions() {
   const room = useRoom();
   const queryKey = getVersionsQueryKey(room.id);
   const { store, getRoomVersions } = getExtrasForClient2(client);
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     void getRoomVersions(room);
   }, [room]);
-  const selector = React4.useCallback(
+  const selector = React5.useCallback(
     (state2) => {
       const query = state2.queries[queryKey];
       if (query === void 0 || query.isLoading) {
@@ -2809,7 +3340,7 @@ function useHistoryVersions() {
         };
       }
       return {
-        versions: state2.versions[room.id],
+        versions: state2.versionsByRoomId[room.id],
         isLoading: false,
         error: query.error
       };
@@ -2818,9 +3349,9 @@ function useHistoryVersions() {
     // eslint-disable-line react-hooks/exhaustive-deps
   );
   const state = _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeVersions,
+    store.getVersions,
+    store.getVersions,
     selector
   );
   return state;
@@ -2828,27 +3359,21 @@ function useHistoryVersions() {
 function useUpdateRoomNotificationSettings() {
   const client = useClient();
   const room = useRoom();
-  return React4.useCallback(
+  return React5.useCallback(
     (settings) => {
-      const optimisticUpdateId = _core.nanoid.call(void 0, );
       const { store, onMutationFailure } = getExtrasForClient2(client);
-      store.pushOptimisticUpdate({
-        id: optimisticUpdateId,
+      const optimisticUpdateId = store.addOptimisticUpdate({
         type: "update-notification-settings",
         roomId: room.id,
         settings
       });
       room.updateNotificationSettings(settings).then(
         (settings2) => {
-          store.set((state) => ({
-            ...state,
-            notificationSettings: {
-              [room.id]: settings2
-            },
-            optimisticUpdates: state.optimisticUpdates.filter(
-              (update) => update.id !== optimisticUpdateId
-            )
-          }));
+          store.updateRoomInboxNotificationSettings2(
+            room.id,
+            optimisticUpdateId,
+            settings2
+          );
         },
         (err) => onMutationFailure(
           err,
@@ -2922,36 +3447,40 @@ function useThreadsSuspense(options = {
   const { scrollOnLoad = true } = options;
   const client = useClient();
   const room = useRoom();
-  const queryKey = React4.useMemo(
+  const queryKey = React5.useMemo(
     () => generateQueryKey(room.id, options.query),
     [room, options]
   );
   const { store, getThreadsAndInboxNotifications } = getExtrasForClient2(client);
-  const query = store.get().queries[queryKey];
+  const query = store.getThreads().queries[queryKey];
   if (query === void 0 || query.isLoading) {
     throw getThreadsAndInboxNotifications(room, queryKey, options);
   }
   if (query.error) {
     throw query.error;
   }
-  const selector = React4.useCallback(
+  const selector = React5.useCallback(
     (state2) => {
       return {
-        threads: selectedThreads(room.id, state2, options),
+        threads: selectThreads(state2, {
+          roomId: room.id,
+          query: options.query,
+          orderBy: "age"
+        }),
         isLoading: false
       };
     },
     [room, queryKey]
     // eslint-disable-line react-hooks/exhaustive-deps
   );
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     const { incrementQuerySubscribers } = getExtrasForClient2(client);
     return incrementQuerySubscribers(queryKey);
   }, [client, queryKey]);
   const state = _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeThreads,
+    store.getThreads,
+    store.getThreads,
     selector
   );
   useScrollToCommentOnLoadEffect(scrollOnLoad, state);
@@ -2962,17 +3491,17 @@ function useHistoryVersionsSuspense() {
   const room = useRoom();
   const queryKey = getVersionsQueryKey(room.id);
   const { store, getRoomVersions } = getExtrasForClient2(client);
-  const query = store.get().queries[queryKey];
+  const query = store.getVersions().queries[queryKey];
   if (query === void 0 || query.isLoading) {
     throw getRoomVersions(room);
   }
   if (query.error) {
     throw query.error;
   }
-  const selector = React4.useCallback(
+  const selector = React5.useCallback(
     (state2) => {
       return {
-        versions: state2.versions[room.id],
+        versions: state2.versionsByRoomId[room.id],
         isLoading: false
       };
     },
@@ -2980,9 +3509,9 @@ function useHistoryVersionsSuspense() {
     // eslint-disable-line react-hooks/exhaustive-deps
   );
   const state = _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeVersions,
+    store.getVersions,
+    store.getVersions,
     selector
   );
   return state;
@@ -2993,14 +3522,14 @@ function useRoomNotificationSettingsSuspense() {
   const room = useRoom();
   const queryKey = makeNotificationSettingsQueryKey(room.id);
   const { store, getInboxNotificationSettings } = getExtrasForClient2(client);
-  const query = store.get().queries[queryKey];
+  const query = store.getNotificationSettings().queries[queryKey];
   if (query === void 0 || query.isLoading) {
     throw getInboxNotificationSettings(room, queryKey);
   }
   if (query.error) {
     throw query.error;
   }
-  const selector = React4.useCallback(
+  const selector = React5.useCallback(
     (state) => {
       return {
         isLoading: false,
@@ -3010,18 +3539,15 @@ function useRoomNotificationSettingsSuspense() {
     [room]
   );
   const settings = _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, 
-    store.subscribe,
-    store.get,
-    store.get,
+    store.subscribeNotificationSettings,
+    store.getNotificationSettings,
+    store.getNotificationSettings,
     selector
   );
-  return React4.useMemo(() => {
+  return React5.useMemo(() => {
     return [settings, updateRoomNotificationSettings];
   }, [settings, updateRoomNotificationSettings]);
 }
-function useRoomOrNull() {
-  return React4.useContext(RoomContext);
-}
 function createRoomContext(client) {
   return getOrCreateRoomContextBundle(client);
 }
@@ -3149,5 +3675,6 @@ var _useUpdateMyPresence = useUpdateMyPresence;
 
 
 
-exports.PKG_NAME = PKG_NAME; exports.PKG_VERSION = PKG_VERSION; exports.PKG_FORMAT = PKG_FORMAT; exports.ClientSideSuspense = ClientSideSuspense; exports.selectedThreads = selectedThreads; exports.CreateThreadError = CreateThreadError; exports.RoomContext = RoomContext; exports.useStatus = useStatus; exports.useStorageStatus = useStorageStatus; exports.useBatch = useBatch; exports.useLostConnectionListener = useLostConnectionListener; exports.useErrorListener = useErrorListener; exports.useHistory = useHistory; exports.useUndo = useUndo; exports.useRedo = useRedo; exports.useCanUndo = useCanUndo; exports.useCanRedo = useCanRedo; exports.useOthersConnectionIds = useOthersConnectionIds; exports.useCommentsErrorListener = useCommentsErrorListener; exports.useCreateComment = useCreateComment; exports.useEditComment = useEditComment; exports.useDeleteComment = useDeleteComment; exports.useRemoveReaction = useRemoveReaction; exports.useMarkThreadAsRead = useMarkThreadAsRead; exports.useMarkThreadAsResolved = useMarkThreadAsResolved; exports.useMarkThreadAsUnresolved = useMarkThreadAsUnresolved; exports.useThreadSubscription = useThreadSubscription; exports.useRoomNotificationSettings = useRoomNotificationSettings; exports.useHistoryVersionData = useHistoryVersionData; exports.useUpdateRoomNotificationSettings = useUpdateRoomNotificationSettings; exports.useOthersConnectionIdsSuspense = useOthersConnectionIdsSuspense; exports.useStorageStatusSuspense = useStorageStatusSuspense; exports.createRoomContext = createRoomContext; exports._RoomProvider = _RoomProvider; exports._useBroadcastEvent = _useBroadcastEvent; exports._useOthersListener = _useOthersListener; exports._useRoom = _useRoom; exports._useIsInsideRoom = _useIsInsideRoom; exports._useAddReaction = _useAddReaction; exports._useMutation = _useMutation; exports._useCreateThread = _useCreateThread; exports._useDeleteThread = _useDeleteThread; exports._useEditThreadMetadata = _useEditThreadMetadata; exports._useEventListener = _useEventListener; exports._useMyPresence = _useMyPresence; exports._useOthersMapped = _useOthersMapped; exports._useOthersMappedSuspense = _useOthersMappedSuspense; exports._useThreads = _useThreads; exports._useThreadsSuspense = _useThreadsSuspense; exports._useHistoryVersions = _useHistoryVersions; exports._useHistoryVersionsSuspense = _useHistoryVersionsSuspense; exports._useOther = _useOther; exports._useOthers = _useOthers; exports._useOtherSuspense = _useOtherSuspense; exports._useOthersSuspense = _useOthersSuspense; exports._useStorage = _useStorage; exports._useStorageSuspense = _useStorageSuspense; exports._useSelf = _useSelf; exports._useSelfSuspense = _useSelfSuspense; exports._useStorageRoot = _useStorageRoot; exports._useUpdateMyPresence = _useUpdateMyPresence; exports.ClientContext = ClientContext; exports.useClient = useClient; exports.LiveblocksProvider = LiveblocksProvider; exports.createLiveblocksContext = createLiveblocksContext; exports.useInboxNotifications = useInboxNotifications; exports.useInboxNotificationsSuspense = useInboxNotificationsSuspense; exports.useMarkAllInboxNotificationsAsRead = useMarkAllInboxNotificationsAsRead; exports.useMarkInboxNotificationAsRead = useMarkInboxNotificationAsRead; exports.useDeleteAllInboxNotifications = useDeleteAllInboxNotifications; exports.useDeleteInboxNotification = useDeleteInboxNotification; exports.useUnreadInboxNotificationsCount = useUnreadInboxNotificationsCount; exports.useUnreadInboxNotificationsCountSuspense = useUnreadInboxNotificationsCountSuspense; exports.useRoomInfo = useRoomInfo; exports.useRoomInfoSuspense = useRoomInfoSuspense; exports._useInboxNotificationThread = _useInboxNotificationThread; exports._useUser = _useUser; exports._useUserSuspense = _useUserSuspense; exports._useUserThreads_experimental = _useUserThreads_experimental; exports._useUserThreadsSuspense_experimental = _useUserThreadsSuspense_experimental;
-//# sourceMappingURL=chunk-YGRZXVI6.js.map
+
+exports.PKG_NAME = PKG_NAME; exports.PKG_VERSION = PKG_VERSION; exports.PKG_FORMAT = PKG_FORMAT; exports.ClientSideSuspense = ClientSideSuspense; exports.RoomContext = RoomContext; exports.ClientContext = ClientContext; exports.selectThreads = selectThreads; exports.getUmbrellaStoreForClient = getUmbrellaStoreForClient; exports.useClient = useClient; exports.LiveblocksProvider = LiveblocksProvider; exports.createLiveblocksContext = createLiveblocksContext; exports.useInboxNotifications = useInboxNotifications; exports.useInboxNotificationsSuspense = useInboxNotificationsSuspense; exports.useMarkAllInboxNotificationsAsRead = useMarkAllInboxNotificationsAsRead; exports.useMarkInboxNotificationAsRead = useMarkInboxNotificationAsRead; exports.useDeleteAllInboxNotifications = useDeleteAllInboxNotifications; exports.useDeleteInboxNotification = useDeleteInboxNotification; exports.useUnreadInboxNotificationsCount = useUnreadInboxNotificationsCount; exports.useUnreadInboxNotificationsCountSuspense = useUnreadInboxNotificationsCountSuspense; exports.useRoomInfo = useRoomInfo; exports.useRoomInfoSuspense = useRoomInfoSuspense; exports._useInboxNotificationThread = _useInboxNotificationThread; exports._useUser = _useUser; exports._useUserSuspense = _useUserSuspense; exports._useUserThreads_experimental = _useUserThreads_experimental; exports._useUserThreadsSuspense_experimental = _useUserThreadsSuspense_experimental; exports.CreateThreadError = CreateThreadError; exports.useStatus = useStatus; exports.useStorageStatus = useStorageStatus; exports.useBatch = useBatch; exports.useLostConnectionListener = useLostConnectionListener; exports.useErrorListener = useErrorListener; exports.useHistory = useHistory; exports.useUndo = useUndo; exports.useRedo = useRedo; exports.useCanUndo = useCanUndo; exports.useCanRedo = useCanRedo; exports.useOthersConnectionIds = useOthersConnectionIds; exports.useCommentsErrorListener = useCommentsErrorListener; exports.useCreateComment = useCreateComment; exports.useEditComment = useEditComment; exports.useDeleteComment = useDeleteComment; exports.useRemoveReaction = useRemoveReaction; exports.useMarkThreadAsRead = useMarkThreadAsRead; exports.useMarkThreadAsResolved = useMarkThreadAsResolved; exports.useMarkThreadAsUnresolved = useMarkThreadAsUnresolved; exports.useThreadSubscription = useThreadSubscription; exports.useRoomNotificationSettings = useRoomNotificationSettings; exports.useHistoryVersionData = useHistoryVersionData; exports.useUpdateRoomNotificationSettings = useUpdateRoomNotificationSettings; exports.useOthersConnectionIdsSuspense = useOthersConnectionIdsSuspense; exports.useStorageStatusSuspense = useStorageStatusSuspense; exports.createRoomContext = createRoomContext; exports._RoomProvider = _RoomProvider; exports._useBroadcastEvent = _useBroadcastEvent; exports._useOthersListener = _useOthersListener; exports._useRoom = _useRoom; exports._useIsInsideRoom = _useIsInsideRoom; exports._useAddReaction = _useAddReaction; exports._useMutation = _useMutation; exports._useCreateThread = _useCreateThread; exports._useDeleteThread = _useDeleteThread; exports._useEditThreadMetadata = _useEditThreadMetadata; exports._useEventListener = _useEventListener; exports._useMyPresence = _useMyPresence; exports._useOthersMapped = _useOthersMapped; exports._useOthersMappedSuspense = _useOthersMappedSuspense; exports._useThreads = _useThreads; exports._useThreadsSuspense = _useThreadsSuspense; exports._useHistoryVersions = _useHistoryVersions; exports._useHistoryVersionsSuspense = _useHistoryVersionsSuspense; exports._useOther = _useOther; exports._useOthers = _useOthers; exports._useOtherSuspense = _useOtherSuspense; exports._useOthersSuspense = _useOthersSuspense; exports._useStorage = _useStorage; exports._useStorageSuspense = _useStorageSuspense; exports._useSelf = _useSelf; exports._useSelfSuspense = _useSelfSuspense; exports._useStorageRoot = _useStorageRoot; exports._useUpdateMyPresence = _useUpdateMyPresence;
+//# sourceMappingURL=chunk-TNEGW2UU.js.map