stream-chat-react 12.15.8 → 12.16.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -20469,7 +20469,6 @@ __export(src_exports, {
20469
20469
  LoadingIndicator: () => LoadingIndicator,
20470
20470
  LoadingIndicatorIcon: () => LoadingIndicatorIcon,
20471
20471
  MAX_MESSAGE_REACTIONS_TO_FETCH: () => MAX_MESSAGE_REACTIONS_TO_FETCH,
20472
- MAX_QUERY_CHANNELS_LIMIT: () => MAX_QUERY_CHANNELS_LIMIT,
20473
20472
  MESSAGE_ACTIONS: () => MESSAGE_ACTIONS,
20474
20473
  MML: () => MML,
20475
20474
  MediaContainer: () => MediaContainer,
@@ -21603,10 +21602,9 @@ var DownloadButton = ({ assetUrl }) => /* @__PURE__ */ import_react22.default.cr
21603
21602
  var import_react23 = __toESM(require("react"));
21604
21603
 
21605
21604
  // src/constants/limits.ts
21606
- var DEFAULT_INITIAL_CHANNEL_PAGE_SIZE = 25;
21607
- var DEFAULT_NEXT_CHANNEL_PAGE_SIZE = 100;
21608
- var DEFAULT_JUMP_TO_PAGE_SIZE = 100;
21609
- var DEFAULT_THREAD_PAGE_SIZE = 50;
21605
+ var DEFAULT_NEXT_CHANNEL_PAGE_SIZE = 25;
21606
+ var DEFAULT_JUMP_TO_PAGE_SIZE = 25;
21607
+ var DEFAULT_THREAD_PAGE_SIZE = 25;
21610
21608
  var DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD = 250;
21611
21609
  var DEFAULT_UPLOAD_SIZE_LIMIT_BYTES = 100 * 1024 * 1024;
21612
21610
  var DEFAULT_HIGHLIGHT_DURATION = 500;
@@ -23565,19 +23563,16 @@ var ModalGallery = (props) => {
23565
23563
  }),
23566
23564
  [images, t2]
23567
23565
  );
23568
- return (
23569
- // @ts-expect-error ignore the TS error as react-image-gallery was on @types/react@18 while stream-chat-react being upgraded to React 19 (https://github.com/xiaolin/react-image-gallery/issues/809)
23570
- /* @__PURE__ */ import_react39.default.createElement(
23571
- import_react_image_gallery.default,
23572
- {
23573
- items: formattedArray,
23574
- renderItem,
23575
- showIndex: true,
23576
- showPlayButton: false,
23577
- showThumbnails: false,
23578
- startIndex: index3
23579
- }
23580
- )
23566
+ return /* @__PURE__ */ import_react39.default.createElement(
23567
+ import_react_image_gallery.default,
23568
+ {
23569
+ items: formattedArray,
23570
+ renderItem,
23571
+ showIndex: true,
23572
+ showPlayButton: false,
23573
+ showThumbnails: false,
23574
+ startIndex: index3
23575
+ }
23581
23576
  );
23582
23577
  };
23583
23578
 
@@ -40282,8 +40277,7 @@ ReactTextareaAutocomplete.propTypes = {
40282
40277
  // src/components/Channel/Channel.tsx
40283
40278
  var import_react259 = __toESM(require("react"));
40284
40279
  var import_lodash22 = __toESM(require("lodash.debounce"));
40285
- var import_lodash23 = __toESM(require("lodash.defaultsdeep"));
40286
- var import_lodash24 = __toESM(require("lodash.throttle"));
40280
+ var import_lodash23 = __toESM(require("lodash.throttle"));
40287
40281
  var import_nanoid12 = require("nanoid");
40288
40282
  var import_clsx65 = __toESM(require("clsx"));
40289
40283
 
@@ -46241,11 +46235,93 @@ var useMobileNavigation = (channelListRef, navOpen, closeMobileNav) => {
46241
46235
 
46242
46236
  // src/components/ChannelList/hooks/usePaginatedChannels.ts
46243
46237
  var import_react88 = require("react");
46244
- var import_lodash8 = __toESM(require("lodash.uniqby"));
46238
+ var import_lodash7 = __toESM(require("lodash.uniqby"));
46239
+ var RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 5e3;
46240
+ var MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 2e3;
46241
+ var usePaginatedChannels = (client, filters, sort, options, activeChannelHandler, recoveryThrottleIntervalMs = RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS, customQueryChannels) => {
46242
+ const {
46243
+ channelsQueryState: { error, setError, setQueryInProgress }
46244
+ } = useChatContext("usePaginatedChannels");
46245
+ const [channels, setChannels] = (0, import_react88.useState)([]);
46246
+ const [hasNextPage, setHasNextPage] = (0, import_react88.useState)(true);
46247
+ const lastRecoveryTimestamp = (0, import_react88.useRef)(void 0);
46248
+ 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;
46249
+ const filterString = (0, import_react88.useMemo)(() => JSON.stringify(filters), [filters]);
46250
+ const sortString = (0, import_react88.useMemo)(() => JSON.stringify(sort), [sort]);
46251
+ const queryChannels = async (queryType = "load-more") => {
46252
+ setError(null);
46253
+ if (queryType === "reload") {
46254
+ setChannels([]);
46255
+ }
46256
+ setQueryInProgress(queryType);
46257
+ try {
46258
+ if (customQueryChannels) {
46259
+ await customQueryChannels({
46260
+ currentChannels: channels,
46261
+ queryType,
46262
+ setChannels,
46263
+ setHasNextPage
46264
+ });
46265
+ } else {
46266
+ const offset = queryType === "reload" ? 0 : channels.length;
46267
+ const newOptions = {
46268
+ offset,
46269
+ ...options
46270
+ };
46271
+ const channelQueryResponse = await client.queryChannels(
46272
+ filters,
46273
+ sort || {},
46274
+ newOptions
46275
+ );
46276
+ const newChannels = queryType === "reload" ? channelQueryResponse : (0, import_lodash7.default)([...channels, ...channelQueryResponse], "cid");
46277
+ setChannels(newChannels);
46278
+ setHasNextPage(channelQueryResponse.length >= (newOptions.limit ?? 1));
46279
+ if (!offset && activeChannelHandler) {
46280
+ activeChannelHandler(newChannels, setChannels);
46281
+ }
46282
+ }
46283
+ } catch (err) {
46284
+ console.warn(err);
46285
+ setError(err);
46286
+ }
46287
+ setQueryInProgress(null);
46288
+ };
46289
+ const throttleRecover = (0, import_react88.useCallback)(() => {
46290
+ const now = Date.now();
46291
+ const isFirstRecovery = !lastRecoveryTimestamp.current;
46292
+ const timeElapsedSinceLastRecoveryMs = lastRecoveryTimestamp.current ? now - lastRecoveryTimestamp.current : 0;
46293
+ if (!isFirstRecovery && timeElapsedSinceLastRecoveryMs < recoveryThrottleInterval && !error) {
46294
+ return;
46295
+ }
46296
+ lastRecoveryTimestamp.current = now;
46297
+ queryChannels("reload");
46298
+ }, [error, queryChannels, recoveryThrottleInterval]);
46299
+ const loadNextPage = () => {
46300
+ queryChannels();
46301
+ };
46302
+ (0, import_react88.useEffect)(() => {
46303
+ if (client.recoverStateOnReconnect) return;
46304
+ const { unsubscribe } = client.on("connection.recovered", throttleRecover);
46305
+ return () => {
46306
+ unsubscribe();
46307
+ };
46308
+ }, [client, throttleRecover]);
46309
+ (0, import_react88.useEffect)(() => {
46310
+ queryChannels("reload");
46311
+ }, [filterString, sortString]);
46312
+ return {
46313
+ channels,
46314
+ hasNextPage,
46315
+ loadNextPage,
46316
+ setChannels
46317
+ };
46318
+ };
46319
+
46320
+ // src/components/ChannelList/hooks/useChannelListShape.ts
46321
+ var import_react89 = require("react");
46245
46322
 
46246
46323
  // src/components/ChannelList/utils.ts
46247
- var import_lodash7 = __toESM(require("lodash.uniqby"));
46248
- var MAX_QUERY_CHANNELS_LIMIT = 30;
46324
+ var import_lodash8 = __toESM(require("lodash.uniqby"));
46249
46325
  var moveChannelUp = ({
46250
46326
  activeChannel,
46251
46327
  channels,
@@ -46254,7 +46330,7 @@ var moveChannelUp = ({
46254
46330
  const channelIndex = channels.findIndex((channel2) => channel2.cid === cid);
46255
46331
  if (!activeChannel && channelIndex <= 0) return channels;
46256
46332
  const channel = activeChannel || channels[channelIndex];
46257
- return (0, import_lodash7.default)([channel, ...channels], "cid");
46333
+ return (0, import_lodash8.default)([channel, ...channels], "cid");
46258
46334
  };
46259
46335
  function findLastPinnedChannelIndex({
46260
46336
  channels
@@ -46344,92 +46420,7 @@ var isChannelArchived = (channel) => {
46344
46420
  return typeof membership.archived_at === "string";
46345
46421
  };
46346
46422
 
46347
- // src/components/ChannelList/hooks/usePaginatedChannels.ts
46348
- var RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 5e3;
46349
- var MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 2e3;
46350
- var usePaginatedChannels = (client, filters, sort, options, activeChannelHandler, recoveryThrottleIntervalMs = RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS, customQueryChannels) => {
46351
- const {
46352
- channelsQueryState: { error, setError, setQueryInProgress }
46353
- } = useChatContext("usePaginatedChannels");
46354
- const [channels, setChannels] = (0, import_react88.useState)([]);
46355
- const [hasNextPage, setHasNextPage] = (0, import_react88.useState)(true);
46356
- const lastRecoveryTimestamp = (0, import_react88.useRef)(void 0);
46357
- 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;
46358
- const filterString = (0, import_react88.useMemo)(() => JSON.stringify(filters), [filters]);
46359
- const sortString = (0, import_react88.useMemo)(() => JSON.stringify(sort), [sort]);
46360
- const queryChannels = async (queryType = "load-more") => {
46361
- setError(null);
46362
- if (queryType === "reload") {
46363
- setChannels([]);
46364
- }
46365
- setQueryInProgress(queryType);
46366
- try {
46367
- if (customQueryChannels) {
46368
- await customQueryChannels({
46369
- currentChannels: channels,
46370
- queryType,
46371
- setChannels,
46372
- setHasNextPage
46373
- });
46374
- } else {
46375
- const offset = queryType === "reload" ? 0 : channels.length;
46376
- const newOptions = {
46377
- limit: options?.limit ?? MAX_QUERY_CHANNELS_LIMIT,
46378
- message_limit: options?.message_limit ?? DEFAULT_INITIAL_CHANNEL_PAGE_SIZE,
46379
- offset,
46380
- ...options
46381
- };
46382
- const channelQueryResponse = await client.queryChannels(
46383
- filters,
46384
- sort || {},
46385
- newOptions
46386
- );
46387
- const newChannels = queryType === "reload" ? channelQueryResponse : (0, import_lodash8.default)([...channels, ...channelQueryResponse], "cid");
46388
- setChannels(newChannels);
46389
- setHasNextPage(channelQueryResponse.length >= newOptions.limit);
46390
- if (!offset && activeChannelHandler) {
46391
- activeChannelHandler(newChannels, setChannels);
46392
- }
46393
- }
46394
- } catch (err) {
46395
- console.warn(err);
46396
- setError(err);
46397
- }
46398
- setQueryInProgress(null);
46399
- };
46400
- const throttleRecover = (0, import_react88.useCallback)(() => {
46401
- const now = Date.now();
46402
- const isFirstRecovery = !lastRecoveryTimestamp.current;
46403
- const timeElapsedSinceLastRecoveryMs = lastRecoveryTimestamp.current ? now - lastRecoveryTimestamp.current : 0;
46404
- if (!isFirstRecovery && timeElapsedSinceLastRecoveryMs < recoveryThrottleInterval && !error) {
46405
- return;
46406
- }
46407
- lastRecoveryTimestamp.current = now;
46408
- queryChannels("reload");
46409
- }, [error, queryChannels, recoveryThrottleInterval]);
46410
- const loadNextPage = () => {
46411
- queryChannels();
46412
- };
46413
- (0, import_react88.useEffect)(() => {
46414
- if (client.recoverStateOnReconnect) return;
46415
- const { unsubscribe } = client.on("connection.recovered", throttleRecover);
46416
- return () => {
46417
- unsubscribe();
46418
- };
46419
- }, [client, throttleRecover]);
46420
- (0, import_react88.useEffect)(() => {
46421
- queryChannels("reload");
46422
- }, [filterString, sortString]);
46423
- return {
46424
- channels,
46425
- hasNextPage,
46426
- loadNextPage,
46427
- setChannels
46428
- };
46429
- };
46430
-
46431
46423
  // src/components/ChannelList/hooks/useChannelListShape.ts
46432
- var import_react89 = require("react");
46433
46424
  var shared = ({
46434
46425
  customHandler,
46435
46426
  event,
@@ -47756,7 +47747,7 @@ var UnMemoizedChannelList = (props) => {
47756
47747
  searchControllerStateSelector
47757
47748
  );
47758
47749
  const activeChannelHandler = async (channels2, setChannels2) => {
47759
- if (!channels2.length || channels2.length > (options?.limit || MAX_QUERY_CHANNELS_LIMIT)) {
47750
+ if (!channels2.length) {
47760
47751
  return;
47761
47752
  }
47762
47753
  if (customActiveChannel) {
@@ -56846,7 +56837,7 @@ var ChannelInner = (props) => {
56846
56837
  acceptedFiles,
56847
56838
  activeUnreadHandler,
56848
56839
  channel,
56849
- channelQueryOptions: propChannelQueryOptions,
56840
+ channelQueryOptions,
56850
56841
  children,
56851
56842
  doDeleteMessageRequest,
56852
56843
  doMarkReadRequest,
@@ -56865,12 +56856,6 @@ var ChannelInner = (props) => {
56865
56856
  optionalMessageInputProps = {},
56866
56857
  skipMessageDataMemoization
56867
56858
  } = props;
56868
- const channelQueryOptions = (0, import_react259.useMemo)(
56869
- () => (0, import_lodash23.default)(propChannelQueryOptions, {
56870
- messages: { limit: DEFAULT_INITIAL_CHANNEL_PAGE_SIZE }
56871
- }),
56872
- [propChannelQueryOptions]
56873
- );
56874
56859
  const { client, customClasses, latestMessageDatesByChannels, mutes, searchController } = useChatContext("Channel");
56875
56860
  const { t: t2 } = useTranslationContext("Channel");
56876
56861
  const chatContainerClass = getChatContainerClass(customClasses?.chatContainer);
@@ -56902,7 +56887,7 @@ var ChannelInner = (props) => {
56902
56887
  null
56903
56888
  );
56904
56889
  const channelCapabilitiesArray = channel.data?.own_capabilities;
56905
- const throttledCopyStateFromChannel = (0, import_lodash24.default)(
56890
+ const throttledCopyStateFromChannel = (0, import_lodash23.default)(
56906
56891
  () => dispatch({ channel, type: "copyStateFromChannelOnEvent" }),
56907
56892
  500,
56908
56893
  {
@@ -56911,14 +56896,14 @@ var ChannelInner = (props) => {
56911
56896
  }
56912
56897
  );
56913
56898
  const setChannelUnreadUiState = (0, import_react259.useMemo)(
56914
- () => (0, import_lodash24.default)(_setChannelUnreadUiState, 200, {
56899
+ () => (0, import_lodash23.default)(_setChannelUnreadUiState, 200, {
56915
56900
  leading: true,
56916
56901
  trailing: false
56917
56902
  }),
56918
56903
  []
56919
56904
  );
56920
56905
  const markRead = (0, import_react259.useMemo)(
56921
- () => (0, import_lodash24.default)(
56906
+ () => (0, import_lodash23.default)(
56922
56907
  async (options) => {
56923
56908
  const { updateChannelUiUnreadState = true } = options ?? {};
56924
56909
  if (channel.disconnected || !channelConfig?.read_events) {
@@ -57822,7 +57807,7 @@ var useChat = ({
57822
57807
  };
57823
57808
  (0, import_react262.useEffect)(() => {
57824
57809
  if (!client) return;
57825
- const version = "12.15.8";
57810
+ const version = "12.16.0";
57826
57811
  const userAgent = client.getUserAgent();
57827
57812
  if (!userAgent.includes("stream-chat-react")) {
57828
57813
  client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);
@@ -58341,7 +58326,6 @@ var Window = import_react272.default.memo(UnMemoizedWindow);
58341
58326
  LoadingIndicator,
58342
58327
  LoadingIndicatorIcon,
58343
58328
  MAX_MESSAGE_REACTIONS_TO_FETCH,
58344
- MAX_QUERY_CHANNELS_LIMIT,
58345
58329
  MESSAGE_ACTIONS,
58346
58330
  MML,
58347
58331
  MediaContainer,