@liveblocks/react 2.17.0-rc1 → 2.17.0-usrnotsettings1

package/dist/{chunk-DR4OUZTF.js → chunk-DT3BO7N5.js}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/version.ts
 var PKG_NAME = "@liveblocks/react";
-var PKG_VERSION = "2.17.0-rc1";
+var PKG_VERSION = "2.17.0-usrnotsettings1";
 var PKG_FORMAT = "cjs";
 
 // src/ClientSideSuspense.tsx
@@ -20,4 +20,4 @@ function ClientSideSuspense(props) {
 
 
 exports.PKG_NAME = PKG_NAME; exports.PKG_VERSION = PKG_VERSION; exports.PKG_FORMAT = PKG_FORMAT; exports.ClientSideSuspense = ClientSideSuspense;
-//# sourceMappingURL=chunk-DR4OUZTF.js.map
+//# sourceMappingURL=chunk-DT3BO7N5.js.map

package/dist/chunk-DT3BO7N5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/liveblocks/liveblocks/packages/liveblocks-react/dist/chunk-DT3BO7N5.js","../src/version.ts","../src/ClientSideSuspense.tsx"],"names":[],"mappings":"AAAA;ACGO,IAAM,SAAA,EAAW,mBAAA;AACjB,IAAM,YAAA,EAAiD,wBAAA;AACvD,IAAM,WAAA,EAAgD,KAAA;ADD7D;AACA;AEJA,8BAA8C;AAkC1C,+CAAA;AAVG,SAAS,kBAAA,CAAmB,KAAA,EAAc;AAC/C,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,EAAA,EAAI,6BAAA,KAAc,CAAA;AAE5C,EAAA,8BAAA,CAAU,EAAA,GAAM;AAGd,IAAA,UAAA,CAAW,IAAI,CAAA;AAAA,EACjB,CAAA,EAAG,CAAC,CAAC,CAAA;AAEL,EAAA,uBACE,6BAAA,eAAC,EAAA,EAAS,QAAA,EAAU,KAAA,CAAM,QAAA,EACvB,QAAA,EAAA,QAAA,EACG,OAAO,KAAA,CAAM,SAAA,IAAa,WAAA,EACxB,KAAA,CAAM,QAAA,CAAS,EAAA,EACf,KAAA,CAAM,SAAA,EACR,KAAA,CAAM,SAAA,CACZ,CAAA;AAEJ;AF5BA;AACA;AACE;AACA;AACA;AACA;AACF,iJAAC","file":"/home/runner/work/liveblocks/liveblocks/packages/liveblocks-react/dist/chunk-DT3BO7N5.js","sourcesContent":[null,"declare const __VERSION__: string;\ndeclare const TSUP_FORMAT: string;\n\nexport const PKG_NAME = \"@liveblocks/react\";\nexport const PKG_VERSION = typeof __VERSION__ === \"string\" && __VERSION__;\nexport const PKG_FORMAT = typeof TSUP_FORMAT === \"string\" && TSUP_FORMAT;\n","import type { ReactNode } from \"react\";\nimport { Suspense, useEffect, useState } from \"react\";\n\ntype Props = {\n  fallback: ReactNode;\n  children: (() => ReactNode | undefined) | ReactNode | undefined;\n};\n\n/**\n * Almost like a normal <Suspense> component, except that for server-side\n * renders, the fallback will be used.\n *\n * The child props will have to be provided in a function, i.e. change:\n *\n *   <Suspense fallback={<Loading />}>\n *     <MyRealComponent a={1} />\n *   </Suspense>\n *\n * To:\n *\n *   <ClientSideSuspense fallback={<Loading />}>\n *     <MyRealComponent a={1} />\n *   </ClientSideSuspense>\n *\n */\nexport function ClientSideSuspense(props: Props) {\n  const [mounted, setMounted] = useState(false);\n\n  useEffect(() => {\n    // Effects are never executed on the server side. The point of this is to\n    // delay the flipping of this boolean until after hydration has happened.\n    setMounted(true);\n  }, []);\n\n  return (\n    <Suspense fallback={props.fallback}>\n      {mounted\n        ? typeof props.children === \"function\"\n          ? props.children()\n          : props.children\n        : props.fallback}\n    </Suspense>\n  );\n}\n"]}

package/dist/{chunk-XWYTEJGO.mjs → chunk-KAFU5ZQA.mjs}

@@ -1,6 +1,6 @@
 // src/version.ts
 var PKG_NAME = "@liveblocks/react";
-var PKG_VERSION = "2.17.0-rc1";
+var PKG_VERSION = "2.17.0-usrnotsettings1";
 var PKG_FORMAT = "esm";
 
 // src/ClientSideSuspense.tsx
@@ -20,4 +20,4 @@ export {
   PKG_FORMAT,
   ClientSideSuspense
 };
-//# sourceMappingURL=chunk-XWYTEJGO.mjs.map
+//# sourceMappingURL=chunk-KAFU5ZQA.mjs.map

package/dist/{chunk-4KNGHD4I.mjs → chunk-LOPNJCSB.mjs}

@@ -130,7 +130,9 @@ var config = {
   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
+  NOTIFICATION_SETTINGS_MAX_STALE_TIME: 5 * SECONDS,
+  USER_NOTIFICATION_SETTINGS_INTERVAL: 5 * MINUTES,
+  USER_NOTIFICATION_SETTINGS_MAX_STALE_TIME: 1 * MINUTES
 };
 
 // src/lib/AsyncResult.ts
@@ -159,15 +161,6 @@ function count(it, predicate) {
   return total;
 }
 
-// src/lib/ssr.ts
-function ensureNotServerSide() {
-  if (typeof window === "undefined") {
-    throw new Error(
-      "You cannot use the Suspense version of Liveblocks hooks server side. Make sure to only call them client side by using a ClientSideSuspense wrapper.\nFor tips, see https://liveblocks.io/docs/api-reference/liveblocks-react#ClientSideSuspense"
-    );
-  }
-}
-
 // src/lib/use-initial.ts
 import { useCallback, useReducer } from "react";
 
@@ -233,6 +226,8 @@ import {
   console as console2,
   DefaultMap,
   DerivedSignal,
+  entries,
+  keys,
   kInternal,
   MutableSignal as MutableSignal2,
   nanoid,
@@ -723,6 +718,26 @@ function createStore_forPermissionHints() {
     update
   };
 }
+function createStore_forUserNotificationSettings(updates) {
+  const signal = new Signal({});
+  function update(settings) {
+    signal.set((prevSettings) => {
+      return {
+        ...prevSettings,
+        ...settings
+      };
+    });
+  }
+  return {
+    signal: DerivedSignal.from(
+      signal,
+      updates,
+      (base, updates2) => applyOptimisticUpdates_forUserNotificationSettings(base, updates2)
+    ),
+    // Mutations
+    update
+  };
+}
 function createStore_forOptimistic(client) {
   const signal = new Signal([]);
   const syncSource = client[kInternal].createSyncSource();
@@ -762,9 +777,11 @@ var UmbrellaStore = class {
   //          \                          | |                 | |    & notifications by ID
   //         | \                         | |      Apply      | |
   //         |   `-> OptimisticUpdates --+--+--> Optimistic --+-+--> Notification Settings    (Part 2)
-  //          \                          |        Updates       |
-  //           `------- etc etc ---------+                      +--> History Versions         (Part 3)
-  //                       ^
+  //          \                          |        Updates    |  |
+  //           `------- etc etc ---------+                   |  +--> History Versions         (Part 3)
+  //                       ^                                 |
+  //                       |                                 +-----> Channels Notification Settings (Part 4)
+  //                       |
   //                       |
   //                       |                        ^                  ^
   //                    Signal                      |                  |
@@ -785,6 +802,7 @@ var UmbrellaStore = class {
   // prettier-ignore
   historyVersions;
   permissionHints;
+  userNotificationSettings;
   optimisticUpdates;
   //
   // Output signals.
@@ -805,6 +823,8 @@ var UmbrellaStore = class {
   #userThreadsLastRequestedAt = null;
   // Room versions
   #roomVersionsLastRequestedAtByRoom = /* @__PURE__ */ new Map();
+  // User Notification Settings
+  #userNotificationSettings;
   constructor(client) {
     this.#client = client[kInternal].as();
     this.optimisticUpdates = createStore_forOptimistic(this.#client);
@@ -820,6 +840,16 @@ var UmbrellaStore = class {
         return nextCursor;
       }
     );
+    const channelsNotificationSettingsFetcher = async () => {
+      const result = await this.#client.getNotificationSettings();
+      this.userNotificationSettings.update(result);
+    };
+    this.userNotificationSettings = createStore_forUserNotificationSettings(
+      this.optimisticUpdates.signal
+    );
+    this.#userNotificationSettings = new SinglePageResource(
+      channelsNotificationSettingsFetcher
+    );
     this.threads = new ThreadDB();
     this.notifications = createStore_forNotifications();
     this.roomNotificationSettings = createStore_forRoomNotificationSettings(
@@ -997,6 +1027,19 @@ var UmbrellaStore = class {
         return { signal, waitUntilLoaded: resource.waitUntilLoaded };
       }
     );
+    const userNotificationSettings = {
+      signal: DerivedSignal.from(() => {
+        const result = this.#userNotificationSettings.get();
+        if (result.isLoading || result.error) {
+          return result;
+        }
+        return ASYNC_OK(
+          "settings",
+          nn(this.userNotificationSettings.signal.get())
+        );
+      }, shallow3),
+      waitUntilLoaded: this.#userNotificationSettings.waitUntilLoaded
+    };
     this.outputs = {
       threadifications,
       threads,
@@ -1005,7 +1048,8 @@ var UmbrellaStore = class {
       notifications,
       loadingNotifications,
       settingsByRoomId,
-      versionsByRoomId
+      versionsByRoomId,
+      userNotificationSettings
     };
     autobind(this);
   }
@@ -1250,6 +1294,25 @@ var UmbrellaStore = class {
     const result = await room.getNotificationSettings({ signal });
     this.roomNotificationSettings.update(roomId, result);
   }
+  /**
+   * Refresh User Notification Settings from poller
+   */
+  async refreshUserNotificationSettings(signal) {
+    const result = await this.#client.getNotificationSettings({
+      signal
+    });
+    this.userNotificationSettings.update(result);
+  }
+  /**
+   * Updates user notification settings with a new value, replacing the
+   * corresponding optimistic update.
+   */
+  updateUserNotificationSettings_confirmOptimisticUpdate(settings, optimisticUpdateId) {
+    batch2(() => {
+      this.optimisticUpdates.remove(optimisticUpdateId);
+      this.userNotificationSettings.update(settings);
+    });
+  }
 };
 function applyOptimisticUpdates_forThreadifications(baseThreadsDB, notificationsLUT, optimisticUpdates) {
   const threadsDB = baseThreadsDB.clone();
@@ -1424,6 +1487,33 @@ function applyOptimisticUpdates_forSettings(settingsLUT, optimisticUpdates) {
   }
   return settingsByRoomId;
 }
+function applyOptimisticUpdates_forUserNotificationSettings(baseSettings, optimisticUpdates) {
+  const outcomingSettings = { ...baseSettings };
+  for (const optimisticUpdate of optimisticUpdates) {
+    switch (optimisticUpdate.type) {
+      case "update-user-notification-settings": {
+        const incomingSettings = optimisticUpdate.settings;
+        for (const channelKey of keys(incomingSettings)) {
+          const key = channelKey;
+          const channelUpdates = incomingSettings[key];
+          if (channelUpdates) {
+            const realChannelUpdates = Object.fromEntries(
+              entries(channelUpdates).filter(
+                ([_, value]) => value !== void 0
+              )
+            );
+            outcomingSettings[key] = {
+              ...outcomingSettings[key],
+              ...realChannelUpdates
+            };
+          }
+        }
+        break;
+      }
+    }
+  }
+  return outcomingSettings;
+}
 function compareInboxNotifications(inboxNotificationA, inboxNotificationB) {
   if (inboxNotificationA.notifiedAt > inboxNotificationB.notifiedAt) {
     return 1;
@@ -1717,10 +1807,25 @@ function makeLiveblocksExtrasForClient(client) {
     config.USER_THREADS_POLL_INTERVAL,
     { maxStaleTimeMs: config.USER_THREADS_MAX_STALE_TIME }
   );
+  const userNotificationSettingsPoller = makePoller(
+    async (signal) => {
+      try {
+        return await store.refreshUserNotificationSettings(signal);
+      } catch (err) {
+        console.warn(
+          `Polling new user notification settings failed: ${String(err)}`
+        );
+        throw err;
+      }
+    },
+    config.USER_NOTIFICATION_SETTINGS_INTERVAL,
+    { maxStaleTimeMs: config.USER_NOTIFICATION_SETTINGS_MAX_STALE_TIME }
+  );
   return {
     store,
     notificationsPoller,
-    userThreadsPoller
+    userThreadsPoller,
+    userNotificationSettingsPoller
   };
 }
 function makeLiveblocksContextBundle(client) {
@@ -1729,6 +1834,7 @@ function makeLiveblocksContextBundle(client) {
   const useMarkAllInboxNotificationsAsRead2 = () => useMarkAllInboxNotificationsAsRead_withClient(client);
   const useDeleteInboxNotification2 = () => useDeleteInboxNotification_withClient(client);
   const useDeleteAllInboxNotifications2 = () => useDeleteAllInboxNotifications_withClient(client);
+  const useUpdateNotificationSettings2 = () => useUpdateNotificationSettings_withClient(client);
   function LiveblocksProvider2(props) {
     useEnsureNoLiveblocksProvider();
     return /* @__PURE__ */ jsx(ClientContext.Provider, { value: client, children: props.children });
@@ -1742,6 +1848,8 @@ function makeLiveblocksContextBundle(client) {
     useMarkAllInboxNotificationsAsRead: useMarkAllInboxNotificationsAsRead2,
     useDeleteInboxNotification: useDeleteInboxNotification2,
     useDeleteAllInboxNotifications: useDeleteAllInboxNotifications2,
+    useNotificationSettings: () => useNotificationSettings_withClient(client),
+    useUpdateNotificationSettings: useUpdateNotificationSettings2,
     useInboxNotificationThread: useInboxNotificationThread2,
     useUserThreads_experimental,
     ...shared.classic,
@@ -1754,6 +1862,8 @@ function makeLiveblocksContextBundle(client) {
       useDeleteInboxNotification: useDeleteInboxNotification2,
       useDeleteAllInboxNotifications: useDeleteAllInboxNotifications2,
       useInboxNotificationThread: useInboxNotificationThread2,
+      useNotificationSettings: () => useNotificationSettingsSuspense_withClient(client),
+      useUpdateNotificationSettings: useUpdateNotificationSettings2,
       useUserThreads_experimental: useUserThreadsSuspense_experimental,
       ...shared.suspense
     }
@@ -1787,7 +1897,6 @@ function useInboxNotifications_withClient(client, selector, isEqual) {
   );
 }
 function useInboxNotificationsSuspense_withClient(client) {
-  ensureNotServerSide();
   const store = getLiveblocksExtrasForClient(client).store;
   use(store.outputs.loadingNotifications.waitUntilLoaded());
   const result = useInboxNotifications_withClient(client, identity2, shallow4);
@@ -1803,7 +1912,6 @@ function useUnreadInboxNotificationsCount_withClient(client) {
   );
 }
 function useUnreadInboxNotificationsCountSuspense_withClient(client) {
-  ensureNotServerSide();
   const store = getLiveblocksExtrasForClient(client).store;
   use(store.outputs.loadingNotifications.waitUntilLoaded());
   const result = useUnreadInboxNotificationsCount_withClient(client);
@@ -1938,6 +2046,57 @@ function useInboxNotificationThread_withClient(client, inboxNotificationId) {
     )
   );
 }
+function useUpdateNotificationSettings_withClient(client) {
+  return useCallback2(
+    (settings) => {
+      const { store } = getLiveblocksExtrasForClient(client);
+      const optimisticUpdateId = store.optimisticUpdates.add({
+        type: "update-user-notification-settings",
+        settings
+      });
+      client.updateNotificationSettings(settings).then(
+        (settings2) => {
+          store.updateUserNotificationSettings_confirmOptimisticUpdate(
+            settings2,
+            optimisticUpdateId
+          );
+        },
+        () => {
+          store.optimisticUpdates.remove(optimisticUpdateId);
+        }
+      );
+    },
+    [client]
+  );
+}
+function useNotificationSettings_withClient(client) {
+  const updateNotificationSettings = useUpdateNotificationSettings_withClient(client);
+  const { store, userNotificationSettingsPoller: poller } = getLiveblocksExtrasForClient(client);
+  useEffect3(() => {
+    void store.outputs.userNotificationSettings.waitUntilLoaded();
+  });
+  useEffect3(() => {
+    poller.inc();
+    poller.pollNowIfStale();
+    return () => {
+      poller.dec();
+    };
+  }, [poller]);
+  const settings = useSignal(store.outputs.userNotificationSettings.signal);
+  return useMemo2(() => {
+    return [settings, updateNotificationSettings];
+  }, [settings, updateNotificationSettings]);
+}
+function useNotificationSettingsSuspense_withClient(client) {
+  const store = getLiveblocksExtrasForClient(client).store;
+  use(store.outputs.userNotificationSettings.waitUntilLoaded());
+  const [settings, updateNotificationSettings] = useNotificationSettings_withClient(client);
+  assert(!settings.error, "Did not expect error");
+  assert(!settings.isLoading, "Did not expect loading");
+  return useMemo2(() => {
+    return [settings, updateNotificationSettings];
+  }, [settings, updateNotificationSettings]);
+}
 function useUser_withClient(client, userId) {
   const usersStore = client[kInternal2].usersStore;
   const getUserState = useCallback2(
@@ -2111,7 +2270,6 @@ function LiveblocksProvider(props) {
     lostConnectionTimeout: useInitial(o.lostConnectionTimeout),
     backgroundKeepAliveTimeout: useInitial(o.backgroundKeepAliveTimeout),
     polyfills: useInitial(o.polyfills),
-    largeMessageStrategy: useInitial(o.largeMessageStrategy),
     unstable_fallbackToHTTP: useInitial(o.unstable_fallbackToHTTP),
     unstable_streamData: useInitial(o.unstable_streamData),
     preventUnsavedChanges: useInitial(o.preventUnsavedChanges),
@@ -2163,7 +2321,6 @@ function useUserThreads_experimental(options = {}) {
   );
 }
 function useUserThreadsSuspense_experimental(options = {}) {
-  ensureNotServerSide();
   const client = useClient();
   const { store } = getLiveblocksExtrasForClient(client);
   const queryKey = makeUserThreadsQueryKey(options.query);
@@ -2203,6 +2360,15 @@ function useUnreadInboxNotificationsCount() {
 function useUnreadInboxNotificationsCountSuspense() {
   return useUnreadInboxNotificationsCountSuspense_withClient(useClient());
 }
+function useNotificationSettings() {
+  return useNotificationSettings_withClient(useClient());
+}
+function useNotificationSettingsSuspense() {
+  return useNotificationSettingsSuspense_withClient(useClient());
+}
+function useUpdateNotificationSettings() {
+  return useUpdateNotificationSettings_withClient(useClient());
+}
 function useUser(userId) {
   const client = useClient();
   return useUser_withClient(client, userId);
@@ -3558,7 +3724,6 @@ function useRoomNotificationSettings() {
   }, [settings, updateRoomNotificationSettings]);
 }
 function useRoomNotificationSettingsSuspense() {
-  ensureNotServerSide();
   const client = useClient();
   const store = getRoomExtrasForClient(client).store;
   const room = useRoom();
@@ -3623,7 +3788,6 @@ function useHistoryVersions() {
   return useSignal(store.outputs.versionsByRoomId.getOrCreate(room.id).signal);
 }
 function useHistoryVersionsSuspense() {
-  ensureNotServerSide();
   const client = useClient();
   const room = useRoom();
   const store = getRoomExtrasForClient(client).store;
@@ -3658,6 +3822,13 @@ function useUpdateRoomNotificationSettings() {
     [client, room]
   );
 }
+function ensureNotServerSide() {
+  if (typeof window === "undefined") {
+    throw new Error(
+      "You cannot use the Suspense version of this hook on the server side. Make sure to only call them on the client side.\nFor tips, see https://liveblocks.io/docs/api-reference/liveblocks-react#suspense-avoid-ssr"
+    );
+  }
+}
 function useSuspendUntilPresenceReady() {
   ensureNotServerSide();
   const room = useRoom();
@@ -3706,7 +3877,6 @@ function useStorageStatusSuspense(options) {
   return useStorageStatus(options);
 }
 function useThreadsSuspense(options = {}) {
-  ensureNotServerSide();
   const client = useClient();
   const room = useRoom();
   const { store } = getRoomExtrasForClient(client);
@@ -3850,6 +4020,9 @@ export {
   useDeleteInboxNotification,
   useUnreadInboxNotificationsCount,
   useUnreadInboxNotificationsCountSuspense,
+  useNotificationSettings,
+  useNotificationSettingsSuspense,
+  useUpdateNotificationSettings,
   useRoomInfo,
   useRoomInfoSuspense,
   _useInboxNotificationThread,
@@ -3934,4 +4107,4 @@ export {
   _useStorageRoot,
   _useUpdateMyPresence
 };
-//# sourceMappingURL=chunk-4KNGHD4I.mjs.map
+//# sourceMappingURL=chunk-LOPNJCSB.mjs.map