stream-chat-react 13.13.5 → 13.14.0

package/dist/i18n/utils.js

@@ -1,4 +1,4 @@
-import Dayjs, { isDayjs } from 'dayjs';
+import Dayjs from 'dayjs';
 export const notValidDateWarning = 'MessageTimestamp was called without a message, or message has invalid created_at date.';
 export const noParsingFunctionWarning = 'MessageTimestamp was called but there is no datetime parsing function available';
 export const isNumberOrString = (output) => typeof output === 'string' || typeof output === 'number';
@@ -55,7 +55,9 @@ export function getDateString({ calendar, calendarFormats, format, formatDate, m
 }
 export const predefinedFormatters = {
     durationFormatter: (streamI18n) => (value, _, { format, withSuffix }) => {
-        if (format && isDayjs(streamI18n.DateTimeParser)) {
+        // NOTE: isDayjs is not exported in "dayjs" package for ESM, hence we access
+        // `isDayjs` from Dayjs instance
+        if (format && Dayjs.isDayjs(streamI18n.DateTimeParser)) {
             return streamI18n.DateTimeParser.duration(value).format(format);
         }
         return streamI18n.DateTimeParser.duration(value).humanize(!!withSuffix);

package/dist/index.browser.cjs

@@ -389,7 +389,6 @@ __export(src_exports, {
   LoadingIndicator: () => LoadingIndicator,
   LoadingIndicatorIcon: () => LoadingIndicatorIcon,
   MAX_MESSAGE_REACTIONS_TO_FETCH: () => MAX_MESSAGE_REACTIONS_TO_FETCH,
-  MAX_QUERY_CHANNELS_LIMIT: () => MAX_QUERY_CHANNELS_LIMIT,
   MESSAGE_ACTIONS: () => MESSAGE_ACTIONS,
   MediaContainer: () => MediaContainer,
   MediaRecordingState: () => MediaRecordingState,
@@ -1466,7 +1465,7 @@ function getDateString({
 }
 var predefinedFormatters = {
   durationFormatter: (streamI18n) => (value, _, { format, withSuffix }) => {
-    if (format && (0, import_dayjs.isDayjs)(streamI18n.DateTimeParser)) {
+    if (format && import_dayjs.default.isDayjs(streamI18n.DateTimeParser)) {
       return streamI18n.DateTimeParser.duration(value).format(
         format
       );
@@ -4340,16 +4339,96 @@ var useMobileNavigation = (channelListRef, navOpen, closeMobileNav) => {
 
 // src/components/ChannelList/hooks/usePaginatedChannels.ts
 var import_react46 = require("react");
-var import_lodash4 = __toESM(require("lodash.uniqby"));
+var import_lodash3 = __toESM(require("lodash.uniqby"));
+var RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 5e3;
+var MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 2e3;
+var usePaginatedChannels = (client, filters, sort, options, activeChannelHandler, recoveryThrottleIntervalMs = RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS, customQueryChannels) => {
+  const {
+    channelsQueryState: { error, setError, setQueryInProgress }
+  } = useChatContext("usePaginatedChannels");
+  const [channels, setChannels] = (0, import_react46.useState)([]);
+  const [hasNextPage, setHasNextPage] = (0, import_react46.useState)(true);
+  const lastRecoveryTimestamp = (0, import_react46.useRef)(void 0);
+  const recoveryThrottleInterval = recoveryThrottleIntervalMs < MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS ? MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS : recoveryThrottleIntervalMs ?? RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS;
+  const filterString = (0, import_react46.useMemo)(() => JSON.stringify(filters), [filters]);
+  const sortString = (0, import_react46.useMemo)(() => JSON.stringify(sort), [sort]);
+  const queryChannels = async (queryType = "load-more") => {
+    setError(null);
+    if (queryType === "reload") {
+      setChannels([]);
+    }
+    setQueryInProgress(queryType);
+    try {
+      if (customQueryChannels) {
+        await customQueryChannels({
+          currentChannels: channels,
+          queryType,
+          setChannels,
+          setHasNextPage
+        });
+      } else {
+        const offset = queryType === "reload" ? 0 : channels.length;
+        const newOptions = {
+          offset,
+          ...options
+        };
+        const channelQueryResponse = await client.queryChannels(
+          filters,
+          sort || {},
+          newOptions
+        );
+        const newChannels = queryType === "reload" ? channelQueryResponse : (0, import_lodash3.default)([...channels, ...channelQueryResponse], "cid");
+        setChannels(newChannels);
+        setHasNextPage(channelQueryResponse.length >= (newOptions.limit ?? 1));
+        if (!offset && activeChannelHandler) {
+          activeChannelHandler(newChannels, setChannels);
+        }
+      }
+    } catch (error2) {
+      console.warn(error2);
+      setError(error2);
+    }
+    setQueryInProgress(null);
+  };
+  const throttleRecover = (0, import_react46.useCallback)(() => {
+    const now = Date.now();
+    const isFirstRecovery = !lastRecoveryTimestamp.current;
+    const timeElapsedSinceLastRecoveryMs = lastRecoveryTimestamp.current ? now - lastRecoveryTimestamp.current : 0;
+    if (!isFirstRecovery && timeElapsedSinceLastRecoveryMs < recoveryThrottleInterval && !error) {
+      return;
+    }
+    lastRecoveryTimestamp.current = now;
+    queryChannels("reload");
+  }, [error, queryChannels, recoveryThrottleInterval]);
+  const loadNextPage = () => queryChannels();
+  (0, import_react46.useEffect)(() => {
+    if (client.recoverStateOnReconnect) return;
+    const { unsubscribe } = client.on("connection.recovered", throttleRecover);
+    return () => {
+      unsubscribe();
+    };
+  }, [client, throttleRecover]);
+  (0, import_react46.useEffect)(() => {
+    queryChannels("reload");
+  }, [filterString, sortString]);
+  return {
+    channels,
+    hasNextPage,
+    loadNextPage,
+    setChannels
+  };
+};
+
+// src/components/ChannelList/hooks/useChannelListShape.ts
+var import_react47 = require("react");
 
 // src/components/ChannelList/utils.ts
-var import_lodash3 = __toESM(require("lodash.uniqby"));
-var MAX_QUERY_CHANNELS_LIMIT = 30;
+var import_lodash4 = __toESM(require("lodash.uniqby"));
 var moveChannelUp = ({ activeChannel, channels, cid }) => {
   const channelIndex = channels.findIndex((channel2) => channel2.cid === cid);
   if (!activeChannel && channelIndex <= 0) return channels;
   const channel = activeChannel || channels[channelIndex];
-  return (0, import_lodash3.default)([channel, ...channels], "cid");
+  return (0, import_lodash4.default)([channel, ...channels], "cid");
 };
 function findLastPinnedChannelIndex({ channels }) {
   let lastPinnedChannelIndex = null;
@@ -4437,99 +4516,7 @@ var isChannelArchived = (channel) => {
   return typeof membership.archived_at === "string";
 };
 
-// src/constants/limits.ts
-var DEFAULT_INITIAL_CHANNEL_PAGE_SIZE = 25;
-var DEFAULT_NEXT_CHANNEL_PAGE_SIZE = 100;
-var DEFAULT_JUMP_TO_PAGE_SIZE = 100;
-var DEFAULT_THREAD_PAGE_SIZE = 50;
-var DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD = 250;
-var DEFAULT_UPLOAD_SIZE_LIMIT_BYTES = 100 * 1024 * 1024;
-var DEFAULT_HIGHLIGHT_DURATION = 500;
-
-// src/components/ChannelList/hooks/usePaginatedChannels.ts
-var RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 5e3;
-var MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 2e3;
-var usePaginatedChannels = (client, filters, sort, options, activeChannelHandler, recoveryThrottleIntervalMs = RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS, customQueryChannels) => {
-  const {
-    channelsQueryState: { error, setError, setQueryInProgress }
-  } = useChatContext("usePaginatedChannels");
-  const [channels, setChannels] = (0, import_react46.useState)([]);
-  const [hasNextPage, setHasNextPage] = (0, import_react46.useState)(true);
-  const lastRecoveryTimestamp = (0, import_react46.useRef)(void 0);
-  const recoveryThrottleInterval = recoveryThrottleIntervalMs < MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS ? MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS : recoveryThrottleIntervalMs ?? RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS;
-  const filterString = (0, import_react46.useMemo)(() => JSON.stringify(filters), [filters]);
-  const sortString = (0, import_react46.useMemo)(() => JSON.stringify(sort), [sort]);
-  const queryChannels = async (queryType = "load-more") => {
-    setError(null);
-    if (queryType === "reload") {
-      setChannels([]);
-    }
-    setQueryInProgress(queryType);
-    try {
-      if (customQueryChannels) {
-        await customQueryChannels({
-          currentChannels: channels,
-          queryType,
-          setChannels,
-          setHasNextPage
-        });
-      } else {
-        const offset = queryType === "reload" ? 0 : channels.length;
-        const newOptions = {
-          limit: options?.limit ?? MAX_QUERY_CHANNELS_LIMIT,
-          message_limit: options?.message_limit ?? DEFAULT_INITIAL_CHANNEL_PAGE_SIZE,
-          offset,
-          ...options
-        };
-        const channelQueryResponse = await client.queryChannels(
-          filters,
-          sort || {},
-          newOptions
-        );
-        const newChannels = queryType === "reload" ? channelQueryResponse : (0, import_lodash4.default)([...channels, ...channelQueryResponse], "cid");
-        setChannels(newChannels);
-        setHasNextPage(channelQueryResponse.length >= newOptions.limit);
-        if (!offset && activeChannelHandler) {
-          activeChannelHandler(newChannels, setChannels);
-        }
-      }
-    } catch (error2) {
-      console.warn(error2);
-      setError(error2);
-    }
-    setQueryInProgress(null);
-  };
-  const throttleRecover = (0, import_react46.useCallback)(() => {
-    const now = Date.now();
-    const isFirstRecovery = !lastRecoveryTimestamp.current;
-    const timeElapsedSinceLastRecoveryMs = lastRecoveryTimestamp.current ? now - lastRecoveryTimestamp.current : 0;
-    if (!isFirstRecovery && timeElapsedSinceLastRecoveryMs < recoveryThrottleInterval && !error) {
-      return;
-    }
-    lastRecoveryTimestamp.current = now;
-    queryChannels("reload");
-  }, [error, queryChannels, recoveryThrottleInterval]);
-  const loadNextPage = () => queryChannels();
-  (0, import_react46.useEffect)(() => {
-    if (client.recoverStateOnReconnect) return;
-    const { unsubscribe } = client.on("connection.recovered", throttleRecover);
-    return () => {
-      unsubscribe();
-    };
-  }, [client, throttleRecover]);
-  (0, import_react46.useEffect)(() => {
-    queryChannels("reload");
-  }, [filterString, sortString]);
-  return {
-    channels,
-    hasNextPage,
-    loadNextPage,
-    setChannels
-  };
-};
-
 // src/components/ChannelList/hooks/useChannelListShape.ts
-var import_react47 = require("react");
 var shared = ({
   customHandler,
   event,
@@ -5973,7 +5960,7 @@ var UnMemoizedChannelList = (props) => {
     searchControllerStateSelector
   );
   const activeChannelHandler = async (channels2, setChannels2) => {
-    if (!channels2.length || channels2.length > (options?.limit || MAX_QUERY_CHANNELS_LIMIT)) {
+    if (!channels2.length) {
       return;
     }
     if (customActiveChannel) {
@@ -22985,6 +22972,15 @@ var usePollOptionVotesPagination = ({
 var import_clsx30 = __toESM(require("clsx"));
 var import_lodash13 = __toESM(require("lodash.debounce"));
 var import_react137 = __toESM(require("react"));
+
+// src/constants/limits.ts
+var DEFAULT_NEXT_CHANNEL_PAGE_SIZE = 25;
+var DEFAULT_JUMP_TO_PAGE_SIZE = 25;
+var DEFAULT_THREAD_PAGE_SIZE = 25;
+var DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD = 250;
+var DEFAULT_HIGHLIGHT_DURATION = 500;
+
+// src/components/InfiniteScrollPaginator/InfiniteScrollPaginator.tsx
 var mousewheelListener = (event) => {
   if (event instanceof WheelEvent && event.deltaY === 1) {
     event.preventDefault();
@@ -35904,8 +35900,7 @@ var useLiveLocationSharingManager = ({
 var import_react286 = __toESM(require("react"));
 var import_clsx70 = __toESM(require("clsx"));
 var import_lodash19 = __toESM(require("lodash.debounce"));
-var import_lodash20 = __toESM(require("lodash.defaultsdeep"));
-var import_lodash21 = __toESM(require("lodash.throttle"));
+var import_lodash20 = __toESM(require("lodash.throttle"));
 var import_stream_chat18 = require("stream-chat");
 
 // src/components/Channel/channelState.ts
@@ -36488,7 +36483,7 @@ var ChannelInner = (props) => {
     activeUnreadHandler,
     allowConcurrentAudioPlayback,
     channel,
-    channelQueryOptions: propChannelQueryOptions,
+    channelQueryOptions,
     children,
     doDeleteMessageRequest,
     doMarkReadRequest,
@@ -36502,12 +36497,6 @@ var ChannelInner = (props) => {
     onMentionsHover,
     skipMessageDataMemoization
   } = props;
-  const channelQueryOptions = (0, import_react286.useMemo)(
-    () => (0, import_lodash20.default)(propChannelQueryOptions, {
-      messages: { limit: DEFAULT_INITIAL_CHANNEL_PAGE_SIZE }
-    }),
-    [propChannelQueryOptions]
-  );
   const { client, customClasses, latestMessageDatesByChannels, mutes, searchController } = useChatContext("Channel");
   const { t } = useTranslationContext("Channel");
   const chatContainerClass = getChatContainerClass(customClasses?.chatContainer);
@@ -36538,7 +36527,7 @@ var ChannelInner = (props) => {
     null
   );
   const channelCapabilitiesArray = channel.data?.own_capabilities;
-  const throttledCopyStateFromChannel = (0, import_lodash21.default)(
+  const throttledCopyStateFromChannel = (0, import_lodash20.default)(
     () => dispatch({ channel, type: "copyStateFromChannelOnEvent" }),
     500,
     {
@@ -36547,14 +36536,14 @@ var ChannelInner = (props) => {
     }
   );
   const setChannelUnreadUiState = (0, import_react286.useMemo)(
-    () => (0, import_lodash21.default)(_setChannelUnreadUiState, 200, {
+    () => (0, import_lodash20.default)(_setChannelUnreadUiState, 200, {
       leading: true,
       trailing: false
     }),
     []
   );
   const markRead = (0, import_react286.useMemo)(
-    () => (0, import_lodash21.default)(
+    () => (0, import_lodash20.default)(
       async (options) => {
         const { updateChannelUiUnreadState = true } = options ?? {};
         if (channel.disconnected || !channelConfig?.read_events) {
@@ -37419,7 +37408,7 @@ var useChat = ({
   };
   (0, import_react289.useEffect)(() => {
     if (!client) return;
-    const version = "13.13.5";
+    const version = "13.14.0";
     const userAgent = client.getUserAgent();
     if (!userAgent.includes("stream-chat-react")) {
       client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);