@liveblocks/react 2.24.0-deque1 → 2.24.0

package/dist/{chunk-URVBSXYW.js → chunk-N6OQQVYV.js}

@@ -107,7 +107,7 @@ import {
   kInternal as kInternal2,
   makePoller,
   raise,
-  shallow as shallow4
+  shallow as shallow3
 } from "@liveblocks/core";
 import {
   createContext as createContext2,
@@ -132,8 +132,8 @@ var config = {
   USER_THREADS_MAX_STALE_TIME: 30 * SECONDS,
   HISTORY_VERSIONS_POLL_INTERVAL: 1 * MINUTES,
   HISTORY_VERSIONS_MAX_STALE_TIME: 5 * SECONDS,
-  NOTIFICATION_SETTINGS_POLL_INTERVAL: 1 * MINUTES,
-  NOTIFICATION_SETTINGS_MAX_STALE_TIME: 5 * SECONDS,
+  ROOM_SUBSCRIPTION_SETTINGS_POLL_INTERVAL: 1 * MINUTES,
+  ROOM_SUBSCRIPTION_SETTINGS_MAX_STALE_TIME: 5 * SECONDS,
   USER_NOTIFICATION_SETTINGS_INTERVAL: 5 * MINUTES,
   USER_NOTIFICATION_SETTINGS_MAX_STALE_TIME: 1 * MINUTES
 };
@@ -232,19 +232,23 @@ var use = (
 
 // src/umbrella-store.ts
 import {
+  assertNever,
   autoRetry,
   batch as batch2,
   compactObject,
   console as console2,
-  createUserNotificationSettings,
+  createNotificationSettings,
   DefaultMap,
   DerivedSignal,
+  getMentionedIdsFromCommentBody,
+  getSubscriptionKey,
   kInternal,
   MutableSignal as MutableSignal2,
   nanoid,
   nn,
-  patchUserNotificationSettings,
-  shallow as shallow3,
+  patchNotificationSettings,
+  shallow,
+  shallow2,
   Signal,
   stableStringify
 } from "@liveblocks/core";
@@ -266,21 +270,6 @@ function autobind(self) {
   } while ((obj = Reflect.getPrototypeOf(obj)) && obj !== Object.prototype);
 }
 
-// src/lib/shallow2.ts
-import { isPlainObject, shallow } from "@liveblocks/core";
-function shallow2(a, b) {
-  if (!isPlainObject(a) || !isPlainObject(b)) {
-    return shallow(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) && shallow(a[key], b[key])
-  );
-}
-
 // src/ThreadDB.ts
 import { batch, MutableSignal, SortedList } from "@liveblocks/core";
 
@@ -431,7 +420,9 @@ var ThreadDB = class _ThreadDB {
     if (roomId !== void 0) {
       crit.push((t) => t.roomId === roomId);
     }
-    crit.push(makeThreadsFilter(query));
+    if (query !== void 0) {
+      crit.push(makeThreadsFilter(query));
+    }
     return Array.from(index.filter((t) => crit.every((pred) => pred(t))));
   }
 };
@@ -667,7 +658,45 @@ function createStore_forNotifications() {
     upsert
   };
 }
-function createStore_forRoomNotificationSettings(updates) {
+function createStore_forSubscriptions(updates, threads) {
+  const baseSignal = new MutableSignal2(/* @__PURE__ */ new Map());
+  function applyDelta(newSubscriptions, deletedSubscriptions) {
+    baseSignal.mutate((lut) => {
+      let mutated = false;
+      for (const s of newSubscriptions) {
+        lut.set(getSubscriptionKey(s), s);
+        mutated = true;
+      }
+      for (const s of deletedSubscriptions) {
+        lut.delete(getSubscriptionKey(s));
+        mutated = true;
+      }
+      return mutated;
+    });
+  }
+  function create(subscription) {
+    baseSignal.mutate((lut) => {
+      lut.set(getSubscriptionKey(subscription), subscription);
+    });
+  }
+  function deleteOne(subscriptionKey) {
+    baseSignal.mutate((lut) => {
+      lut.delete(subscriptionKey);
+    });
+  }
+  return {
+    signal: DerivedSignal.from(
+      baseSignal,
+      updates,
+      (base, updates2) => applyOptimisticUpdates_forSubscriptions(base, threads, updates2)
+    ),
+    // Mutations
+    applyDelta,
+    create,
+    delete: deleteOne
+  };
+}
+function createStore_forRoomSubscriptionSettings(updates) {
   const baseSignal = new MutableSignal2(/* @__PURE__ */ new Map());
   function update(roomId, settings) {
     baseSignal.mutate((lut) => {
@@ -678,7 +707,7 @@ function createStore_forRoomNotificationSettings(updates) {
     signal: DerivedSignal.from(
       baseSignal,
       updates,
-      (base, updates2) => applyOptimisticUpdates_forSettings(base, updates2)
+      (base, updates2) => applyOptimisticUpdates_forRoomSubscriptionSettings(base, updates2)
     ),
     // Mutations
     update
@@ -730,9 +759,9 @@ function createStore_forPermissionHints() {
     update
   };
 }
-function createStore_forUserNotificationSettings(updates) {
+function createStore_forNotificationSettings(updates) {
   const signal = new Signal(
-    createUserNotificationSettings({})
+    createNotificationSettings({})
   );
   function update(settings) {
     signal.set(settings);
@@ -741,7 +770,7 @@ function createStore_forUserNotificationSettings(updates) {
     signal: DerivedSignal.from(
       signal,
       updates,
-      (base, updates2) => applyOptimisticUpdates_forUserNotificationSettings(base, updates2)
+      (base, updates2) => applyOptimisticUpdates_forNotificationSettings(base, updates2)
     ),
     // Mutations
     update
@@ -780,16 +809,18 @@ var UmbrellaStore = class {
   //
   //   Mutate inputs...                                             ...observe clean/consistent output!
   //
-  //            .-> Base ThreadDB ---------+                 +----> Clean threads by ID           (Part 1)
+  //            .-> Base ThreadDB ---------+                 +-------> Clean threads by ID         (Part 1)
   //           /                           |                 |
-  //   mutate ----> Base Notifications --+ |                 | +--> Clean notifications           (Part 1)
-  //          \                          | |                 | |    & notifications by ID
+  //   mutate ----> Base Notifications --+ |                 | +-----> Clean notifications         (Part 1)
+  //          \                          | |                 | |       & notifications by ID
   //         | \                         | |      Apply      | |
-  //         |   `-> OptimisticUpdates --+--+--> Optimistic --+-+--> Room Notification Settings   (Part 2)
-  //          \                          |        Updates    |  |
-  //           `------- etc etc ---------+                   |  +--> History Versions             (Part 3)
-  //                       ^                                 |
-  //                       |                                 +-----> User Notification Settings   (Part 4)
+  //         |   `-> OptimisticUpdates --+--+--> Optimistic -+-+-+-+-> Subscriptions               (Part 2)
+  //          \                          |        Updates    |   | |
+  //           `------- etc etc ---------+                   |   | +-> History Versions            (Part 3)
+  //                       ^                                 |   |
+  //                       |                                 |   +---> Room Subscription Settings  (Part 4)
+  //                       |                                 |
+  //                       |                                 +-------> Notification Settings       (Part 5)
   //                       |
   //                       |
   //                       |                        ^                  ^
@@ -807,11 +838,12 @@ var UmbrellaStore = class {
   threads;
   // Exposes its signal under `.signal` prop
   notifications;
-  roomNotificationSettings;
+  subscriptions;
+  roomSubscriptionSettings;
   // prettier-ignore
   historyVersions;
   permissionHints;
-  userNotificationSettings;
+  notificationSettings;
   optimisticUpdates;
   //
   // Output signals.
@@ -832,8 +864,8 @@ var UmbrellaStore = class {
   #userThreadsLastRequestedAt = null;
   // Room versions
   #roomVersionsLastRequestedAtByRoom = /* @__PURE__ */ new Map();
-  // User Notification Settings
-  #userNotificationSettings;
+  // Notification Settings
+  #notificationSettings;
   constructor(client) {
     this.#client = client[kInternal].as();
     this.optimisticUpdates = createStore_forOptimistic(this.#client);
@@ -841,7 +873,11 @@ var UmbrellaStore = class {
     this.#notificationsPaginationState = new PaginatedResource(
       async (cursor) => {
         const result = await this.#client.getInboxNotifications({ cursor });
-        this.updateThreadifications(result.threads, result.inboxNotifications);
+        this.updateThreadifications(
+          result.threads,
+          result.inboxNotifications,
+          result.subscriptions
+        );
         if (this.#notificationsLastRequestedAt === null) {
           this.#notificationsLastRequestedAt = result.requestedAt;
         }
@@ -849,19 +885,23 @@ var UmbrellaStore = class {
         return nextCursor;
       }
     );
-    const userNotificationSettingsFetcher = async () => {
+    const notificationSettingsFetcher = async () => {
       const result = await this.#client.getNotificationSettings();
-      this.userNotificationSettings.update(result);
+      this.notificationSettings.update(result);
     };
-    this.userNotificationSettings = createStore_forUserNotificationSettings(
+    this.notificationSettings = createStore_forNotificationSettings(
       this.optimisticUpdates.signal
     );
-    this.#userNotificationSettings = new SinglePageResource(
-      userNotificationSettingsFetcher
+    this.#notificationSettings = new SinglePageResource(
+      notificationSettingsFetcher
     );
     this.threads = new ThreadDB();
+    this.subscriptions = createStore_forSubscriptions(
+      this.optimisticUpdates.signal,
+      this.threads
+    );
     this.notifications = createStore_forNotifications();
-    this.roomNotificationSettings = createStore_forRoomNotificationSettings(
+    this.roomSubscriptionSettings = createStore_forRoomSubscriptionSettings(
       this.optimisticUpdates.signal
     );
     this.historyVersions = createStore_forHistoryVersions();
@@ -878,7 +918,15 @@ var UmbrellaStore = class {
         sortedNotifications: s.sortedNotifications,
         notificationsById: s.notificationsById
       }),
-      shallow3
+      shallow
+    );
+    const threadSubscriptions = DerivedSignal.from(
+      notifications,
+      this.subscriptions.signal,
+      (n, s) => ({
+        subscriptions: s,
+        notifications: n.sortedNotifications
+      })
     );
     const loadingUserThreads = new DefaultMap(
       (queryKey) => {
@@ -890,7 +938,8 @@ var UmbrellaStore = class {
           });
           this.updateThreadifications(
             result.threads,
-            result.inboxNotifications
+            result.inboxNotifications,
+            result.subscriptions
           );
           this.permissionHints.update(result.permissionHints);
           if (this.#userThreadsLastRequestedAt === null) {
@@ -933,7 +982,8 @@ var UmbrellaStore = class {
           });
           this.updateThreadifications(
             result.threads,
-            result.inboxNotifications
+            result.inboxNotifications,
+            result.subscriptions
           );
           this.permissionHints.update(result.permissionHints);
           const lastRequestedAt = this.#roomThreadsLastRequestedAtByRoom.get(roomId);
@@ -983,28 +1033,30 @@ var UmbrellaStore = class {
       }),
       waitUntilLoaded: this.#notificationsPaginationState.waitUntilLoaded
     };
-    const settingsByRoomId = new DefaultMap((roomId) => {
-      const resource = new SinglePageResource(async () => {
-        const room = this.#client.getRoom(roomId);
-        if (room === null) {
-          throw new Error(`Room '${roomId}' is not available on client`);
-        }
-        const result = await room.getNotificationSettings();
-        this.roomNotificationSettings.update(roomId, result);
-      });
-      const signal = DerivedSignal.from(() => {
-        const result = resource.get();
-        if (result.isLoading || result.error) {
-          return result;
-        } else {
-          return ASYNC_OK(
-            "settings",
-            nn(this.roomNotificationSettings.signal.get()[roomId])
-          );
-        }
-      }, shallow3);
-      return { signal, waitUntilLoaded: resource.waitUntilLoaded };
-    });
+    const roomSubscriptionSettingsByRoomId = new DefaultMap(
+      (roomId) => {
+        const resource = new SinglePageResource(async () => {
+          const room = this.#client.getRoom(roomId);
+          if (room === null) {
+            throw new Error(`Room '${roomId}' is not available on client`);
+          }
+          const result = await room.getSubscriptionSettings();
+          this.roomSubscriptionSettings.update(roomId, result);
+        });
+        const signal = DerivedSignal.from(() => {
+          const result = resource.get();
+          if (result.isLoading || result.error) {
+            return result;
+          } else {
+            return ASYNC_OK(
+              "settings",
+              nn(this.roomSubscriptionSettings.signal.get()[roomId])
+            );
+          }
+        }, shallow);
+        return { signal, waitUntilLoaded: resource.waitUntilLoaded };
+      }
+    );
     const versionsByRoomId = new DefaultMap(
       (roomId) => {
         const resource = new SinglePageResource(async () => {
@@ -1032,22 +1084,22 @@ var UmbrellaStore = class {
               Object.values(this.historyVersions.signal.get()[roomId] ?? {})
             );
           }
-        }, shallow3);
+        }, shallow);
         return { signal, waitUntilLoaded: resource.waitUntilLoaded };
       }
     );
-    const userNotificationSettings = {
+    const notificationSettings = {
       signal: DerivedSignal.from(() => {
-        const result = this.#userNotificationSettings.get();
+        const result = this.#notificationSettings.get();
         if (result.isLoading || result.error) {
           return result;
         }
         return ASYNC_OK(
           "settings",
-          nn(this.userNotificationSettings.signal.get())
+          nn(this.notificationSettings.signal.get())
         );
-      }, shallow3),
-      waitUntilLoaded: this.#userNotificationSettings.waitUntilLoaded
+      }, shallow),
+      waitUntilLoaded: this.#notificationSettings.waitUntilLoaded
     };
     this.outputs = {
       threadifications,
@@ -1056,9 +1108,10 @@ var UmbrellaStore = class {
       loadingUserThreads,
       notifications,
       loadingNotifications,
-      settingsByRoomId,
+      roomSubscriptionSettingsByRoomId,
       versionsByRoomId,
-      userNotificationSettings
+      notificationSettings,
+      threadSubscriptions
     };
     autobind(this);
   }
@@ -1100,6 +1153,26 @@ var UmbrellaStore = class {
       this.notifications.clear();
     });
   }
+  /**
+   * Creates an existing subscription, replacing the corresponding
+   * optimistic update.
+   */
+  createSubscription(subscription, optimisticId) {
+    batch2(() => {
+      this.optimisticUpdates.remove(optimisticId);
+      this.subscriptions.create(subscription);
+    });
+  }
+  /**
+   * Deletes an existing subscription, replacing the corresponding
+   * optimistic update.
+   */
+  deleteSubscription(subscriptionKey, optimisticId) {
+    batch2(() => {
+      this.optimisticUpdates.remove(optimisticId);
+      this.subscriptions.delete(subscriptionKey);
+    });
+  }
   /**
    * Creates an new thread, replacing the corresponding optimistic update.
    */
@@ -1201,20 +1274,21 @@ var UmbrellaStore = class {
       deletedAt
     );
   }
-  updateThreadifications(threads, notifications, deletedThreads = [], deletedNotifications = []) {
+  updateThreadifications(threads, notifications, subscriptions, deletedThreads = [], deletedNotifications = [], deletedSubscriptions = []) {
     batch2(() => {
       this.threads.applyDelta(threads, deletedThreads);
       this.notifications.applyDelta(notifications, deletedNotifications);
+      this.subscriptions.applyDelta(subscriptions, deletedSubscriptions);
     });
   }
   /**
-   * Updates existing notification setting for a room with a new value,
+   * Updates existing subscription settings for a room with a new value,
    * replacing the corresponding optimistic update.
    */
-  updateRoomNotificationSettings(roomId, optimisticId, settings) {
+  updateRoomSubscriptionSettings(roomId, optimisticId, settings) {
     batch2(() => {
       this.optimisticUpdates.remove(optimisticId);
-      this.roomNotificationSettings.update(roomId, settings);
+      this.roomSubscriptionSettings.update(roomId, settings);
     });
   }
   async fetchNotificationsDeltaUpdate(signal) {
@@ -1232,8 +1306,10 @@ var UmbrellaStore = class {
     this.updateThreadifications(
       result.threads.updated,
       result.inboxNotifications.updated,
+      result.subscriptions.updated,
       result.threads.deleted,
-      result.inboxNotifications.deleted
+      result.inboxNotifications.deleted,
+      result.subscriptions.deleted
     );
   }
   async fetchRoomThreadsDeltaUpdate(roomId, signal) {
@@ -1249,8 +1325,10 @@ var UmbrellaStore = class {
     this.updateThreadifications(
       updates.threads.updated,
       updates.inboxNotifications.updated,
+      updates.subscriptions.updated,
       updates.threads.deleted,
-      updates.inboxNotifications.deleted
+      updates.inboxNotifications.deleted,
+      updates.subscriptions.deleted
     );
     this.permissionHints.update(updates.permissionHints);
     if (lastRequestedAt < updates.requestedAt) {
@@ -1272,8 +1350,10 @@ var UmbrellaStore = class {
     this.updateThreadifications(
       result.threads.updated,
       result.inboxNotifications.updated,
+      result.subscriptions.updated,
       result.threads.deleted,
-      result.inboxNotifications.deleted
+      result.inboxNotifications.deleted,
+      result.subscriptions.deleted
     );
     this.permissionHints.update(result.permissionHints);
   }
@@ -1295,31 +1375,31 @@ var UmbrellaStore = class {
       this.#roomVersionsLastRequestedAtByRoom.set(roomId, updates.requestedAt);
     }
   }
-  async refreshRoomNotificationSettings(roomId, signal) {
+  async refreshRoomSubscriptionSettings(roomId, signal) {
     const room = nn(
       this.#client.getRoom(roomId),
       `Room with id ${roomId} is not available on client`
     );
-    const result = await room.getNotificationSettings({ signal });
-    this.roomNotificationSettings.update(roomId, result);
+    const result = await room.getSubscriptionSettings({ signal });
+    this.roomSubscriptionSettings.update(roomId, result);
   }
   /**
-   * Refresh User Notification Settings from poller
+   * Refresh notification settings from poller
    */
-  async refreshUserNotificationSettings(signal) {
+  async refreshNotificationSettings(signal) {
     const result = await this.#client.getNotificationSettings({
       signal
     });
-    this.userNotificationSettings.update(result);
+    this.notificationSettings.update(result);
   }
   /**
-   * Updates user notification settings with a new value, replacing the
+   * Updates notification settings with a new value, replacing the
    * corresponding optimistic update.
    */
-  updateUserNotificationSettings_confirmOptimisticUpdate(settings, optimisticUpdateId) {
+  updateNotificationSettings_confirmOptimisticUpdate(settings, optimisticUpdateId) {
     batch2(() => {
       this.optimisticUpdates.remove(optimisticUpdateId);
-      this.userNotificationSettings.update(settings);
+      this.notificationSettings.update(settings);
     });
   }
 };
@@ -1478,29 +1558,78 @@ function applyOptimisticUpdates_forThreadifications(baseThreadsDB, notifications
     threadsDB
   };
 }
-function applyOptimisticUpdates_forSettings(settingsLUT, optimisticUpdates) {
-  const settingsByRoomId = Object.fromEntries(settingsLUT);
+function applyOptimisticUpdates_forRoomSubscriptionSettings(settingsLUT, optimisticUpdates) {
+  const roomSubscriptionSettingsByRoomId = Object.fromEntries(settingsLUT);
   for (const optimisticUpdate of optimisticUpdates) {
     switch (optimisticUpdate.type) {
-      case "update-notification-settings": {
-        const settings = settingsByRoomId[optimisticUpdate.roomId];
+      case "update-room-subscription-settings": {
+        const settings = roomSubscriptionSettingsByRoomId[optimisticUpdate.roomId];
         if (settings === void 0) {
           break;
         }
-        settingsByRoomId[optimisticUpdate.roomId] = {
+        roomSubscriptionSettingsByRoomId[optimisticUpdate.roomId] = {
           ...settings,
           ...optimisticUpdate.settings
         };
       }
     }
   }
-  return settingsByRoomId;
+  return roomSubscriptionSettingsByRoomId;
 }
-function applyOptimisticUpdates_forUserNotificationSettings(settings, optimisticUpdates) {
+function applyOptimisticUpdates_forSubscriptions(subscriptionsLUT, threads, optimisticUpdates) {
+  const subscriptions = Object.fromEntries(subscriptionsLUT);
+  for (const update of optimisticUpdates) {
+    switch (update.type) {
+      case "update-room-subscription-settings": {
+        if (!update.settings.threads) {
+          continue;
+        }
+        const roomThreads = threads.findMany(update.roomId, void 0, "desc");
+        for (const thread of roomThreads) {
+          const subscriptionKey = getSubscriptionKey("thread", thread.id);
+          switch (update.settings.threads) {
+            // Create subscriptions for all existing threads in the room
+            case "all": {
+              subscriptions[subscriptionKey] = {
+                kind: "thread",
+                subjectId: thread.id,
+                createdAt: /* @__PURE__ */ new Date()
+              };
+              break;
+            }
+            // Delete subscriptions for all existing threads in the room
+            case "none": {
+              delete subscriptions[subscriptionKey];
+              break;
+            }
+            // Create subscriptions for every threads in the room which the user participates in but doesn't have a subscription for yet
+            case "replies_and_mentions": {
+              if (isThreadParticipant(thread, update.userId) && !subscriptions[subscriptionKey]) {
+                subscriptions[subscriptionKey] = {
+                  kind: "thread",
+                  subjectId: thread.id,
+                  createdAt: /* @__PURE__ */ new Date()
+                };
+              }
+              break;
+            }
+            default:
+              assertNever(
+                update.settings.threads,
+                "Unexpected thread subscription settings."
+              );
+          }
+        }
+      }
+    }
+  }
+  return subscriptions;
+}
+function applyOptimisticUpdates_forNotificationSettings(settings, optimisticUpdates) {
   let outcoming = settings;
   for (const update of optimisticUpdates) {
-    if (update.type === "update-user-notification-settings") {
-      outcoming = patchUserNotificationSettings(outcoming, update.settings);
+    if (update.type === "update-notification-settings") {
+      outcoming = patchNotificationSettings(outcoming, update.settings);
     }
   }
   return outcoming;
@@ -1682,6 +1811,24 @@ function upsertReaction(reactions, reaction) {
   }
   return reactions;
 }
+function isThreadParticipant(thread, userId) {
+  let isParticipant = false;
+  for (const comment of thread.comments) {
+    if (comment.deletedAt) {
+      continue;
+    }
+    if (comment.userId === userId) {
+      isParticipant = true;
+      break;
+    }
+    const mentionedIds = getMentionedIdsFromCommentBody(comment.body);
+    if (mentionedIds.includes(userId)) {
+      isParticipant = true;
+      break;
+    }
+  }
+  return isParticipant;
+}
 
 // src/liveblocks.tsx
 import { jsx } from "react/jsx-runtime";
@@ -1798,13 +1945,13 @@ function makeLiveblocksExtrasForClient(client) {
     config.USER_THREADS_POLL_INTERVAL,
     { maxStaleTimeMs: config.USER_THREADS_MAX_STALE_TIME }
   );
-  const userNotificationSettingsPoller = makePoller(
+  const notificationSettingsPoller = makePoller(
     async (signal) => {
       try {
-        return await store.refreshUserNotificationSettings(signal);
+        return await store.refreshNotificationSettings(signal);
       } catch (err) {
         console.warn(
-          `Polling new user notification settings failed: ${String(err)}`
+          `Polling new notification settings failed: ${String(err)}`
         );
         throw err;
       }
@@ -1816,7 +1963,7 @@ function makeLiveblocksExtrasForClient(client) {
     store,
     notificationsPoller,
     userThreadsPoller,
-    userNotificationSettingsPoller
+    notificationSettingsPoller
   };
 }
 function makeLiveblocksContextBundle(client) {
@@ -1833,7 +1980,7 @@ function makeLiveblocksContextBundle(client) {
   const shared = createSharedContext(client);
   const bundle = {
     LiveblocksProvider: LiveblocksProvider2,
-    useInboxNotifications: () => useInboxNotifications_withClient(client, identity2, shallow4),
+    useInboxNotifications: () => useInboxNotifications_withClient(client, identity2, shallow3),
     useUnreadInboxNotificationsCount: () => useUnreadInboxNotificationsCount_withClient(client),
     useMarkInboxNotificationAsRead: useMarkInboxNotificationAsRead2,
     useMarkAllInboxNotificationsAsRead: useMarkAllInboxNotificationsAsRead2,
@@ -1891,7 +2038,7 @@ function useInboxNotificationsSuspense_withClient(client) {
   ensureNotServerSide();
   const store = getLiveblocksExtrasForClient(client).store;
   use(store.outputs.loadingNotifications.waitUntilLoaded());
-  const result = useInboxNotifications_withClient(client, identity2, shallow4);
+  const result = useInboxNotifications_withClient(client, identity2, shallow3);
   assert(!result.error, "Did not expect error");
   assert(!result.isLoading, "Did not expect loading");
   return result;
@@ -1900,7 +2047,7 @@ function useUnreadInboxNotificationsCount_withClient(client) {
   return useInboxNotifications_withClient(
     client,
     selectorFor_useUnreadInboxNotificationsCount,
-    shallow4
+    shallow3
   );
 }
 function useUnreadInboxNotificationsCountSuspense_withClient(client) {
@@ -2044,12 +2191,12 @@ function useUpdateNotificationSettings_withClient(client) {
     (settings) => {
       const { store } = getLiveblocksExtrasForClient(client);
       const optimisticUpdateId = store.optimisticUpdates.add({
-        type: "update-user-notification-settings",
+        type: "update-notification-settings",
         settings
       });
       client.updateNotificationSettings(settings).then(
         (settings2) => {
-          store.updateUserNotificationSettings_confirmOptimisticUpdate(
+          store.updateNotificationSettings_confirmOptimisticUpdate(
             settings2,
             optimisticUpdateId
           );
@@ -2078,9 +2225,9 @@ function useUpdateNotificationSettings_withClient(client) {
 }
 function useNotificationSettings_withClient(client) {
   const updateNotificationSettings = useUpdateNotificationSettings_withClient(client);
-  const { store, userNotificationSettingsPoller: poller } = getLiveblocksExtrasForClient(client);
+  const { store, notificationSettingsPoller: poller } = getLiveblocksExtrasForClient(client);
   useEffect3(() => {
-    void store.outputs.userNotificationSettings.waitUntilLoaded();
+    void store.outputs.notificationSettings.waitUntilLoaded();
   });
   useEffect3(() => {
     poller.inc();
@@ -2089,7 +2236,7 @@ function useNotificationSettings_withClient(client) {
       poller.dec();
     };
   }, [poller]);
-  const result = useSignal(store.outputs.userNotificationSettings.signal);
+  const result = useSignal(store.outputs.notificationSettings.signal);
   return useMemo2(() => {
     return [result, updateNotificationSettings];
   }, [result, updateNotificationSettings]);
@@ -2097,7 +2244,7 @@ function useNotificationSettings_withClient(client) {
 function useNotificationSettingsSuspense_withClient(client) {
   ensureNotServerSide();
   const store = getLiveblocksExtrasForClient(client).store;
-  use(store.outputs.userNotificationSettings.waitUntilLoaded());
+  use(store.outputs.notificationSettings.waitUntilLoaded());
   const [result, updateNotificationSettings] = useNotificationSettings_withClient(client);
   assert(!result.error, "Did not expect error");
   assert(!result.isLoading, "Did not expect loading");
@@ -2120,7 +2267,7 @@ function useUser_withClient(client, userId) {
     getUserState,
     getUserState,
     selector,
-    shallow4
+    shallow3
   );
   useEffect3(
     () => void usersStore.enqueue(userId)
@@ -2181,7 +2328,7 @@ function useRoomInfo_withClient(client, roomId) {
     getRoomInfoState,
     getRoomInfoState,
     selector,
-    shallow4
+    shallow3
   );
   useEffect3(
     () => void roomsInfoStore.enqueue(roomId)
@@ -2341,7 +2488,7 @@ function useUserThreadsSuspense_experimental(options = {}) {
   return result;
 }
 function useInboxNotifications() {
-  return useInboxNotifications_withClient(useClient(), identity2, shallow4);
+  return useInboxNotifications_withClient(useClient(), identity2, shallow3);
 }
 function useInboxNotificationsSuspense() {
   return useInboxNotificationsSuspense_withClient(useClient());
@@ -2448,7 +2595,7 @@ function useErrorListener(callback) {
 }
 
 // src/room.tsx
-import { shallow as shallow5 } from "@liveblocks/client";
+import { shallow as shallow4 } from "@liveblocks/client";
 import {
   assert as assert2,
   console as console3,
@@ -2456,6 +2603,7 @@ import {
   createThreadId,
   DefaultMap as DefaultMap2,
   errorIf,
+  getSubscriptionKey as getSubscriptionKey2,
   HttpError as HttpError2,
   kInternal as kInternal3,
   makePoller as makePoller2,
@@ -2615,29 +2763,36 @@ function makeRoomExtrasForClient(client) {
       { maxStaleTimeMs: config.HISTORY_VERSIONS_MAX_STALE_TIME }
     )
   );
-  const roomNotificationSettingsPollersByRoomId = new DefaultMap2(
+  const roomSubscriptionSettingsPollersByRoomId = new DefaultMap2(
     (roomId) => makePoller2(
       async (signal) => {
         try {
-          return await store.refreshRoomNotificationSettings(roomId, signal);
+          return await store.refreshRoomSubscriptionSettings(roomId, signal);
         } catch (err) {
-          console3.warn(`Polling notification settings for '${roomId}' failed: ${String(err)}`);
+          console3.warn(`Polling subscription settings for '${roomId}' failed: ${String(err)}`);
           throw err;
         }
       },
-      config.NOTIFICATION_SETTINGS_POLL_INTERVAL,
-      { maxStaleTimeMs: config.NOTIFICATION_SETTINGS_MAX_STALE_TIME }
+      config.ROOM_SUBSCRIPTION_SETTINGS_POLL_INTERVAL,
+      { maxStaleTimeMs: config.ROOM_SUBSCRIPTION_SETTINGS_MAX_STALE_TIME }
     )
   );
   return {
     store,
     onMutationFailure,
+    pollThreadsForRoomId: (roomId) => {
+      const threadsPoller = threadsPollersByRoomId.getOrCreate(roomId);
+      if (threadsPoller) {
+        threadsPoller.markAsStale();
+        threadsPoller.pollNowIfStale();
+      }
+    },
     getOrCreateThreadsPollerForRoomId: threadsPollersByRoomId.getOrCreate.bind(
       threadsPollersByRoomId
     ),
     getOrCreateVersionsPollerForRoomId: versionsPollersByRoomId.getOrCreate.bind(versionsPollersByRoomId),
-    getOrCreateNotificationsSettingsPollerForRoomId: roomNotificationSettingsPollersByRoomId.getOrCreate.bind(
-      roomNotificationSettingsPollersByRoomId
+    getOrCreateSubscriptionSettingsPollerForRoomId: roomSubscriptionSettingsPollersByRoomId.getOrCreate.bind(
+      roomSubscriptionSettingsPollersByRoomId
     )
   };
 }
@@ -2678,6 +2833,8 @@ function makeRoomContextBundle(client) {
     useEditThreadMetadata,
     useMarkThreadAsResolved,
     useMarkThreadAsUnresolved,
+    useSubscribeToThread,
+    useUnsubscribeFromThread,
     useCreateComment,
     useEditComment,
     useDeleteComment,
@@ -2689,7 +2846,9 @@ function makeRoomContextBundle(client) {
     useHistoryVersions,
     useHistoryVersionData,
     useRoomNotificationSettings,
+    useRoomSubscriptionSettings,
     useUpdateRoomNotificationSettings,
+    useUpdateRoomSubscriptionSettings,
     ...shared.classic,
     suspense: {
       RoomContext,
@@ -2723,6 +2882,8 @@ function makeRoomContextBundle(client) {
       useEditThreadMetadata,
       useMarkThreadAsResolved,
       useMarkThreadAsUnresolved,
+      useSubscribeToThread,
+      useUnsubscribeFromThread,
       useCreateComment,
       useEditComment,
       useDeleteComment,
@@ -2734,7 +2895,9 @@ function makeRoomContextBundle(client) {
       // TODO: useHistoryVersionData: useHistoryVersionDataSuspense,
       useHistoryVersions: useHistoryVersionsSuspense,
       useRoomNotificationSettings: useRoomNotificationSettingsSuspense,
+      useRoomSubscriptionSettings: useRoomSubscriptionSettingsSuspense,
       useUpdateRoomNotificationSettings,
+      useUpdateRoomSubscriptionSettings,
       ...shared.suspense
     }
   };
@@ -2813,7 +2976,11 @@ function RoomProviderInner(props) {
         store.deleteThread(message.threadId, null);
         return;
       }
-      const { thread, inboxNotification: maybeNotification } = info;
+      const {
+        thread,
+        inboxNotification: maybeNotification,
+        subscription: maybeSubscription
+      } = info;
       const existingThread = store.outputs.threads.get().getEvenIfDeleted(message.threadId);
       switch (message.type) {
         case ServerMsgCode.COMMENT_EDITED:
@@ -2825,13 +2992,15 @@ function RoomProviderInner(props) {
           if (!existingThread) break;
           store.updateThreadifications(
             [thread],
-            maybeNotification ? [maybeNotification] : []
+            maybeNotification ? [maybeNotification] : [],
+            maybeSubscription ? [maybeSubscription] : []
           );
           break;
         case ServerMsgCode.COMMENT_CREATED:
           store.updateThreadifications(
             [thread],
-            maybeNotification ? [maybeNotification] : []
+            maybeNotification ? [maybeNotification] : [],
+            maybeSubscription ? [maybeSubscription] : []
           );
           break;
         default:
@@ -3088,7 +3257,7 @@ function useOthersMapped(itemSelector, itemIsEqual) {
   return useOthers(wrappedSelector, wrappedIsEqual);
 }
 function useOthersConnectionIds() {
-  return useOthers(selectorFor_useOthersConnectionIds, shallow5);
+  return useOthers(selectorFor_useOthersConnectionIds, shallow4);
 }
 var NOT_FOUND = Symbol();
 function useOther(connectionId, selector, isEqual) {
@@ -3680,36 +3849,114 @@ function useMarkRoomThreadAsUnresolved(roomId) {
     [client, roomId]
   );
 }
+function useSubscribeToThread() {
+  return useSubscribeToRoomThread(useRoom().id);
+}
+function useSubscribeToRoomThread(roomId) {
+  const client = useClient();
+  return useCallback3(
+    (threadId) => {
+      const subscribedAt = /* @__PURE__ */ new Date();
+      const { store, onMutationFailure } = getRoomExtrasForClient(client);
+      const optimisticId = store.optimisticUpdates.add({
+        type: "subscribe-to-thread",
+        threadId,
+        subscribedAt
+      });
+      client[kInternal3].httpClient.subscribeToThread({ roomId, threadId }).then(
+        (subscription) => {
+          store.createSubscription(subscription, optimisticId);
+        },
+        (err) => onMutationFailure(
+          optimisticId,
+          { type: "SUBSCRIBE_TO_THREAD_ERROR", roomId, threadId },
+          err
+        )
+      );
+    },
+    [client, roomId]
+  );
+}
+function useUnsubscribeFromThread() {
+  return useUnsubscribeFromRoomThread(useRoom().id);
+}
+function useUnsubscribeFromRoomThread(roomId) {
+  const client = useClient();
+  return useCallback3(
+    (threadId) => {
+      const unsubscribedAt = /* @__PURE__ */ new Date();
+      const { store, onMutationFailure } = getRoomExtrasForClient(client);
+      const optimisticId = store.optimisticUpdates.add({
+        type: "unsubscribe-from-thread",
+        threadId,
+        unsubscribedAt
+      });
+      client[kInternal3].httpClient.unsubscribeFromThread({ roomId, threadId }).then(
+        () => {
+          store.deleteSubscription(
+            getSubscriptionKey2("thread", threadId),
+            optimisticId
+          );
+        },
+        (err) => onMutationFailure(
+          optimisticId,
+          { type: "UNSUBSCRIBE_FROM_THREAD_ERROR", roomId, threadId },
+          err
+        )
+      );
+    },
+    [client, roomId]
+  );
+}
 function useThreadSubscription(threadId) {
+  return useRoomThreadSubscription(useRoom().id, threadId);
+}
+function useRoomThreadSubscription(roomId, threadId) {
   const client = useClient();
   const { store } = getRoomExtrasForClient(client);
-  const signal = store.outputs.threadifications;
+  const subscriptionKey = useMemo3(
+    () => getSubscriptionKey2("thread", threadId),
+    [threadId]
+  );
+  const subscribeToThread = useSubscribeToRoomThread(roomId);
+  const unsubscribeFromThread = useUnsubscribeFromRoomThread(roomId);
+  const subscribe = useCallback3(
+    () => subscribeToThread(threadId),
+    [subscribeToThread, threadId]
+  );
+  const unsubscribe = useCallback3(
+    () => unsubscribeFromThread(threadId),
+    [unsubscribeFromThread, threadId]
+  );
+  const signal = store.outputs.threadSubscriptions;
   const selector = useCallback3(
     (state) => {
-      const notification = state.sortedNotifications.find(
+      const subscription = state.subscriptions[subscriptionKey];
+      const notification = state.notifications.find(
         (inboxNotification) => inboxNotification.kind === "thread" && inboxNotification.threadId === threadId
       );
-      const thread = state.threadsDB.get(threadId);
-      if (notification === void 0 || thread === void 0) {
-        return { status: "not-subscribed" };
+      if (subscription === void 0) {
+        return { status: "not-subscribed", subscribe, unsubscribe };
       }
       return {
         status: "subscribed",
-        unreadSince: notification.readAt
+        unreadSince: notification?.readAt ?? null,
+        subscribe,
+        unsubscribe
       };
     },
-    [threadId]
+    [subscriptionKey, threadId, subscribe, unsubscribe]
   );
-  return useSignal(signal, selector, shallow5);
+  return useSignal(signal, selector, shallow4);
 }
 function useRoomNotificationSettings() {
   const updateRoomNotificationSettings = useUpdateRoomNotificationSettings();
   const client = useClient();
   const room = useRoom();
-  const { store, getOrCreateNotificationsSettingsPollerForRoomId } = getRoomExtrasForClient(client);
-  const poller = getOrCreateNotificationsSettingsPollerForRoomId(room.id);
+  const { store, getOrCreateSubscriptionSettingsPollerForRoomId } = getRoomExtrasForClient(client);
+  const poller = getOrCreateSubscriptionSettingsPollerForRoomId(room.id);
   useEffect5(
-    () => void store.outputs.settingsByRoomId.getOrCreate(room.id).waitUntilLoaded()
+    () => void store.outputs.roomSubscriptionSettingsByRoomId.getOrCreate(room.id).waitUntilLoaded()
     // NOTE: Deliberately *not* using a dependency array here!
     //
     // It is important to call waitUntil on *every* render.
@@ -3727,18 +3974,51 @@ function useRoomNotificationSettings() {
     };
   }, [poller]);
   const settings = useSignal(
-    store.outputs.settingsByRoomId.getOrCreate(room.id).signal
+    store.outputs.roomSubscriptionSettingsByRoomId.getOrCreate(room.id).signal
   );
   return useMemo3(() => {
     return [settings, updateRoomNotificationSettings];
   }, [settings, updateRoomNotificationSettings]);
 }
+function useRoomSubscriptionSettings() {
+  const updateRoomSubscriptionSettings = useUpdateRoomSubscriptionSettings();
+  const client = useClient();
+  const room = useRoom();
+  const { store, getOrCreateSubscriptionSettingsPollerForRoomId } = getRoomExtrasForClient(client);
+  const poller = getOrCreateSubscriptionSettingsPollerForRoomId(room.id);
+  useEffect5(
+    () => void store.outputs.roomSubscriptionSettingsByRoomId.getOrCreate(room.id).waitUntilLoaded()
+    // NOTE: Deliberately *not* using a dependency array here!
+    //
+    // It is important to call waitUntil on *every* render.
+    // This is harmless though, on most renders, except:
+    // 1. The very first render, in which case we'll want to trigger the initial page fetch.
+    // 2. All other subsequent renders now "just" return the same promise (a quick operation).
+    // 3. If ever the promise would fail, then after 5 seconds it would reset, and on the very
+    //    *next* render after that, a *new* fetch/promise will get created.
+  );
+  useEffect5(() => {
+    poller.inc();
+    poller.pollNowIfStale();
+    return () => {
+      poller.dec();
+    };
+  }, [poller]);
+  const settings = useSignal(
+    store.outputs.roomSubscriptionSettingsByRoomId.getOrCreate(room.id).signal
+  );
+  return useMemo3(() => {
+    return [settings, updateRoomSubscriptionSettings];
+  }, [settings, updateRoomSubscriptionSettings]);
+}
 function useRoomNotificationSettingsSuspense() {
   ensureNotServerSide();
   const client = useClient();
   const store = getRoomExtrasForClient(client).store;
   const room = useRoom();
-  use(store.outputs.settingsByRoomId.getOrCreate(room.id).waitUntilLoaded());
+  use(
+    store.outputs.roomSubscriptionSettingsByRoomId.getOrCreate(room.id).waitUntilLoaded()
+  );
   const [settings, updateRoomNotificationSettings] = useRoomNotificationSettings();
   assert2(!settings.error, "Did not expect error");
   assert2(!settings.isLoading, "Did not expect loading");
@@ -3746,6 +4026,21 @@ function useRoomNotificationSettingsSuspense() {
     return [settings, updateRoomNotificationSettings];
   }, [settings, updateRoomNotificationSettings]);
 }
+function useRoomSubscriptionSettingsSuspense() {
+  ensureNotServerSide();
+  const client = useClient();
+  const store = getRoomExtrasForClient(client).store;
+  const room = useRoom();
+  use(
+    store.outputs.roomSubscriptionSettingsByRoomId.getOrCreate(room.id).waitUntilLoaded()
+  );
+  const [settings, updateRoomSubscriptionSettings] = useRoomSubscriptionSettings();
+  assert2(!settings.error, "Did not expect error");
+  assert2(!settings.isLoading, "Did not expect loading");
+  return useMemo3(() => {
+    return [settings, updateRoomSubscriptionSettings];
+  }, [settings, updateRoomSubscriptionSettings]);
+}
 function useHistoryVersionData(versionId) {
   const [state, setState] = useState2({
     isLoading: true
@@ -3814,15 +4109,24 @@ function useUpdateRoomNotificationSettings() {
   const room = useRoom();
   return useCallback3(
     (settings) => {
-      const { store, onMutationFailure } = getRoomExtrasForClient(client);
+      const { store, onMutationFailure, pollThreadsForRoomId } = getRoomExtrasForClient(client);
+      const userId = getCurrentUserId(client);
       const optimisticId = store.optimisticUpdates.add({
-        type: "update-notification-settings",
+        type: "update-room-subscription-settings",
         roomId: room.id,
+        userId,
         settings
       });
-      room.updateNotificationSettings(settings).then(
-        (settings2) => {
-          store.updateRoomNotificationSettings(room.id, optimisticId, settings2);
+      room.updateSubscriptionSettings(settings).then(
+        (updatedSettings) => {
+          store.updateRoomSubscriptionSettings(
+            room.id,
+            optimisticId,
+            updatedSettings
+          );
+          if (settings.threads) {
+            pollThreadsForRoomId(room.id);
+          }
         },
         (err) => onMutationFailure(
           optimisticId,
@@ -3834,6 +4138,43 @@ function useUpdateRoomNotificationSettings() {
     [client, room]
   );
 }
+function useUpdateRoomSubscriptionSettings() {
+  const client = useClient();
+  const room = useRoom();
+  return useCallback3(
+    (settings) => {
+      const { store, onMutationFailure, pollThreadsForRoomId } = getRoomExtrasForClient(client);
+      const userId = getCurrentUserId(client);
+      const optimisticId = store.optimisticUpdates.add({
+        type: "update-room-subscription-settings",
+        roomId: room.id,
+        userId,
+        settings
+      });
+      room.updateSubscriptionSettings(settings).then(
+        (udpatedSettings) => {
+          store.updateRoomSubscriptionSettings(
+            room.id,
+            optimisticId,
+            udpatedSettings
+          );
+          if (settings.threads) {
+            pollThreadsForRoomId(room.id);
+          }
+        },
+        (err) => onMutationFailure(
+          optimisticId,
+          {
+            type: "UPDATE_ROOM_SUBSCRIPTION_SETTINGS_ERROR",
+            roomId: room.id
+          },
+          err
+        )
+      );
+    },
+    [client, room]
+  );
+}
 function useSuspendUntilPresenceReady() {
   ensureNotServerSide();
   const room = useRoom();
@@ -3925,7 +4266,7 @@ function useRoomAttachmentUrl(attachmentId, roomId) {
     getAttachmentUrlState,
     getAttachmentUrlState,
     selectorFor_useAttachmentUrl,
-    shallow5
+    shallow4
   );
 }
 function useAttachmentUrlSuspense(attachmentId) {
@@ -3985,7 +4326,9 @@ var _useOthersMappedSuspense = useOthersMappedSuspense;
 var _useThreads = useThreads;
 var _useThreadsSuspense = useThreadsSuspense;
 var _useRoomNotificationSettings = useRoomNotificationSettings;
+var _useRoomSubscriptionSettings = useRoomSubscriptionSettings;
 var _useRoomNotificationSettingsSuspense = useRoomNotificationSettingsSuspense;
+var _useRoomSubscriptionSettingsSuspense = useRoomSubscriptionSettingsSuspense;
 var _useHistoryVersions = useHistoryVersions;
 var _useHistoryVersionsSuspense = useHistoryVersionsSuspense;
 var _useOther = useOther;
@@ -4071,9 +4414,13 @@ export {
   useMarkRoomThreadAsResolved,
   useMarkThreadAsUnresolved,
   useMarkRoomThreadAsUnresolved,
+  useSubscribeToThread,
+  useUnsubscribeFromThread,
   useThreadSubscription,
+  useRoomThreadSubscription,
   useHistoryVersionData,
   useUpdateRoomNotificationSettings,
+  useUpdateRoomSubscriptionSettings,
   useOthersConnectionIdsSuspense,
   useStorageStatusSuspense,
   useAttachmentUrl,
@@ -4098,7 +4445,9 @@ export {
   _useThreads,
   _useThreadsSuspense,
   _useRoomNotificationSettings,
+  _useRoomSubscriptionSettings,
   _useRoomNotificationSettingsSuspense,
+  _useRoomSubscriptionSettingsSuspense,
   _useHistoryVersions,
   _useHistoryVersionsSuspense,
   _useOther,
@@ -4112,4 +4461,4 @@ export {
   _useStorageRoot,
   _useUpdateMyPresence
 };
-//# sourceMappingURL=chunk-URVBSXYW.js.map
+//# sourceMappingURL=chunk-N6OQQVYV.js.map