stream-chat-react 13.13.6 → 13.14.1
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.
- package/dist/components/Channel/Channel.js +2 -6
- package/dist/components/ChannelList/ChannelList.js +2 -3
- package/dist/components/ChannelList/hooks/usePaginatedChannels.js +1 -5
- package/dist/components/ChannelList/utils.d.ts +0 -1
- package/dist/components/ChannelList/utils.js +0 -1
- package/dist/components/Chat/hooks/useChat.js +1 -1
- package/dist/components/MessageInput/SendButton.d.ts +1 -2
- package/dist/components/MessageInput/hooks/useMessageInputControls.d.ts +1 -2
- package/dist/constants/limits.d.ts +3 -5
- package/dist/constants/limits.js +3 -5
- package/dist/experimental/index.browser.cjs +6 -5
- package/dist/experimental/index.browser.cjs.map +3 -3
- package/dist/experimental/index.node.cjs +6 -5
- package/dist/experimental/index.node.cjs.map +3 -3
- package/dist/index.browser.cjs +100 -111
- package/dist/index.browser.cjs.map +4 -4
- package/dist/index.node.cjs +100 -112
- package/dist/index.node.cjs.map +4 -4
- package/package.json +1 -2
package/dist/index.browser.cjs
CHANGED
|
@@ -389,7 +389,6 @@ __export(src_exports, {
|
|
|
389
389
|
LoadingIndicator: () => LoadingIndicator,
|
|
390
390
|
LoadingIndicatorIcon: () => LoadingIndicatorIcon,
|
|
391
391
|
MAX_MESSAGE_REACTIONS_TO_FETCH: () => MAX_MESSAGE_REACTIONS_TO_FETCH,
|
|
392
|
-
MAX_QUERY_CHANNELS_LIMIT: () => MAX_QUERY_CHANNELS_LIMIT,
|
|
393
392
|
MESSAGE_ACTIONS: () => MESSAGE_ACTIONS,
|
|
394
393
|
MediaContainer: () => MediaContainer,
|
|
395
394
|
MediaRecordingState: () => MediaRecordingState,
|
|
@@ -4340,16 +4339,96 @@ var useMobileNavigation = (channelListRef, navOpen, closeMobileNav) => {
|
|
|
4340
4339
|
|
|
4341
4340
|
// src/components/ChannelList/hooks/usePaginatedChannels.ts
|
|
4342
4341
|
var import_react46 = require("react");
|
|
4343
|
-
var
|
|
4342
|
+
var import_lodash3 = __toESM(require("lodash.uniqby"));
|
|
4343
|
+
var RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 5e3;
|
|
4344
|
+
var MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 2e3;
|
|
4345
|
+
var usePaginatedChannels = (client, filters, sort, options, activeChannelHandler, recoveryThrottleIntervalMs = RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS, customQueryChannels) => {
|
|
4346
|
+
const {
|
|
4347
|
+
channelsQueryState: { error, setError, setQueryInProgress }
|
|
4348
|
+
} = useChatContext("usePaginatedChannels");
|
|
4349
|
+
const [channels, setChannels] = (0, import_react46.useState)([]);
|
|
4350
|
+
const [hasNextPage, setHasNextPage] = (0, import_react46.useState)(true);
|
|
4351
|
+
const lastRecoveryTimestamp = (0, import_react46.useRef)(void 0);
|
|
4352
|
+
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;
|
|
4353
|
+
const filterString = (0, import_react46.useMemo)(() => JSON.stringify(filters), [filters]);
|
|
4354
|
+
const sortString = (0, import_react46.useMemo)(() => JSON.stringify(sort), [sort]);
|
|
4355
|
+
const queryChannels = async (queryType = "load-more") => {
|
|
4356
|
+
setError(null);
|
|
4357
|
+
if (queryType === "reload") {
|
|
4358
|
+
setChannels([]);
|
|
4359
|
+
}
|
|
4360
|
+
setQueryInProgress(queryType);
|
|
4361
|
+
try {
|
|
4362
|
+
if (customQueryChannels) {
|
|
4363
|
+
await customQueryChannels({
|
|
4364
|
+
currentChannels: channels,
|
|
4365
|
+
queryType,
|
|
4366
|
+
setChannels,
|
|
4367
|
+
setHasNextPage
|
|
4368
|
+
});
|
|
4369
|
+
} else {
|
|
4370
|
+
const offset = queryType === "reload" ? 0 : channels.length;
|
|
4371
|
+
const newOptions = {
|
|
4372
|
+
offset,
|
|
4373
|
+
...options
|
|
4374
|
+
};
|
|
4375
|
+
const channelQueryResponse = await client.queryChannels(
|
|
4376
|
+
filters,
|
|
4377
|
+
sort || {},
|
|
4378
|
+
newOptions
|
|
4379
|
+
);
|
|
4380
|
+
const newChannels = queryType === "reload" ? channelQueryResponse : (0, import_lodash3.default)([...channels, ...channelQueryResponse], "cid");
|
|
4381
|
+
setChannels(newChannels);
|
|
4382
|
+
setHasNextPage(channelQueryResponse.length >= (newOptions.limit ?? 1));
|
|
4383
|
+
if (!offset && activeChannelHandler) {
|
|
4384
|
+
activeChannelHandler(newChannels, setChannels);
|
|
4385
|
+
}
|
|
4386
|
+
}
|
|
4387
|
+
} catch (error2) {
|
|
4388
|
+
console.warn(error2);
|
|
4389
|
+
setError(error2);
|
|
4390
|
+
}
|
|
4391
|
+
setQueryInProgress(null);
|
|
4392
|
+
};
|
|
4393
|
+
const throttleRecover = (0, import_react46.useCallback)(() => {
|
|
4394
|
+
const now = Date.now();
|
|
4395
|
+
const isFirstRecovery = !lastRecoveryTimestamp.current;
|
|
4396
|
+
const timeElapsedSinceLastRecoveryMs = lastRecoveryTimestamp.current ? now - lastRecoveryTimestamp.current : 0;
|
|
4397
|
+
if (!isFirstRecovery && timeElapsedSinceLastRecoveryMs < recoveryThrottleInterval && !error) {
|
|
4398
|
+
return;
|
|
4399
|
+
}
|
|
4400
|
+
lastRecoveryTimestamp.current = now;
|
|
4401
|
+
queryChannels("reload");
|
|
4402
|
+
}, [error, queryChannels, recoveryThrottleInterval]);
|
|
4403
|
+
const loadNextPage = () => queryChannels();
|
|
4404
|
+
(0, import_react46.useEffect)(() => {
|
|
4405
|
+
if (client.recoverStateOnReconnect) return;
|
|
4406
|
+
const { unsubscribe } = client.on("connection.recovered", throttleRecover);
|
|
4407
|
+
return () => {
|
|
4408
|
+
unsubscribe();
|
|
4409
|
+
};
|
|
4410
|
+
}, [client, throttleRecover]);
|
|
4411
|
+
(0, import_react46.useEffect)(() => {
|
|
4412
|
+
queryChannels("reload");
|
|
4413
|
+
}, [filterString, sortString]);
|
|
4414
|
+
return {
|
|
4415
|
+
channels,
|
|
4416
|
+
hasNextPage,
|
|
4417
|
+
loadNextPage,
|
|
4418
|
+
setChannels
|
|
4419
|
+
};
|
|
4420
|
+
};
|
|
4421
|
+
|
|
4422
|
+
// src/components/ChannelList/hooks/useChannelListShape.ts
|
|
4423
|
+
var import_react47 = require("react");
|
|
4344
4424
|
|
|
4345
4425
|
// src/components/ChannelList/utils.ts
|
|
4346
|
-
var
|
|
4347
|
-
var MAX_QUERY_CHANNELS_LIMIT = 30;
|
|
4426
|
+
var import_lodash4 = __toESM(require("lodash.uniqby"));
|
|
4348
4427
|
var moveChannelUp = ({ activeChannel, channels, cid }) => {
|
|
4349
4428
|
const channelIndex = channels.findIndex((channel2) => channel2.cid === cid);
|
|
4350
4429
|
if (!activeChannel && channelIndex <= 0) return channels;
|
|
4351
4430
|
const channel = activeChannel || channels[channelIndex];
|
|
4352
|
-
return (0,
|
|
4431
|
+
return (0, import_lodash4.default)([channel, ...channels], "cid");
|
|
4353
4432
|
};
|
|
4354
4433
|
function findLastPinnedChannelIndex({ channels }) {
|
|
4355
4434
|
let lastPinnedChannelIndex = null;
|
|
@@ -4437,99 +4516,7 @@ var isChannelArchived = (channel) => {
|
|
|
4437
4516
|
return typeof membership.archived_at === "string";
|
|
4438
4517
|
};
|
|
4439
4518
|
|
|
4440
|
-
// src/constants/limits.ts
|
|
4441
|
-
var DEFAULT_INITIAL_CHANNEL_PAGE_SIZE = 25;
|
|
4442
|
-
var DEFAULT_NEXT_CHANNEL_PAGE_SIZE = 100;
|
|
4443
|
-
var DEFAULT_JUMP_TO_PAGE_SIZE = 100;
|
|
4444
|
-
var DEFAULT_THREAD_PAGE_SIZE = 50;
|
|
4445
|
-
var DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD = 250;
|
|
4446
|
-
var DEFAULT_UPLOAD_SIZE_LIMIT_BYTES = 100 * 1024 * 1024;
|
|
4447
|
-
var DEFAULT_HIGHLIGHT_DURATION = 500;
|
|
4448
|
-
|
|
4449
|
-
// src/components/ChannelList/hooks/usePaginatedChannels.ts
|
|
4450
|
-
var RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 5e3;
|
|
4451
|
-
var MIN_RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS = 2e3;
|
|
4452
|
-
var usePaginatedChannels = (client, filters, sort, options, activeChannelHandler, recoveryThrottleIntervalMs = RECOVER_LOADED_CHANNELS_THROTTLE_INTERVAL_IN_MS, customQueryChannels) => {
|
|
4453
|
-
const {
|
|
4454
|
-
channelsQueryState: { error, setError, setQueryInProgress }
|
|
4455
|
-
} = useChatContext("usePaginatedChannels");
|
|
4456
|
-
const [channels, setChannels] = (0, import_react46.useState)([]);
|
|
4457
|
-
const [hasNextPage, setHasNextPage] = (0, import_react46.useState)(true);
|
|
4458
|
-
const lastRecoveryTimestamp = (0, import_react46.useRef)(void 0);
|
|
4459
|
-
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;
|
|
4460
|
-
const filterString = (0, import_react46.useMemo)(() => JSON.stringify(filters), [filters]);
|
|
4461
|
-
const sortString = (0, import_react46.useMemo)(() => JSON.stringify(sort), [sort]);
|
|
4462
|
-
const queryChannels = async (queryType = "load-more") => {
|
|
4463
|
-
setError(null);
|
|
4464
|
-
if (queryType === "reload") {
|
|
4465
|
-
setChannels([]);
|
|
4466
|
-
}
|
|
4467
|
-
setQueryInProgress(queryType);
|
|
4468
|
-
try {
|
|
4469
|
-
if (customQueryChannels) {
|
|
4470
|
-
await customQueryChannels({
|
|
4471
|
-
currentChannels: channels,
|
|
4472
|
-
queryType,
|
|
4473
|
-
setChannels,
|
|
4474
|
-
setHasNextPage
|
|
4475
|
-
});
|
|
4476
|
-
} else {
|
|
4477
|
-
const offset = queryType === "reload" ? 0 : channels.length;
|
|
4478
|
-
const newOptions = {
|
|
4479
|
-
limit: options?.limit ?? MAX_QUERY_CHANNELS_LIMIT,
|
|
4480
|
-
message_limit: options?.message_limit ?? DEFAULT_INITIAL_CHANNEL_PAGE_SIZE,
|
|
4481
|
-
offset,
|
|
4482
|
-
...options
|
|
4483
|
-
};
|
|
4484
|
-
const channelQueryResponse = await client.queryChannels(
|
|
4485
|
-
filters,
|
|
4486
|
-
sort || {},
|
|
4487
|
-
newOptions
|
|
4488
|
-
);
|
|
4489
|
-
const newChannels = queryType === "reload" ? channelQueryResponse : (0, import_lodash4.default)([...channels, ...channelQueryResponse], "cid");
|
|
4490
|
-
setChannels(newChannels);
|
|
4491
|
-
setHasNextPage(channelQueryResponse.length >= newOptions.limit);
|
|
4492
|
-
if (!offset && activeChannelHandler) {
|
|
4493
|
-
activeChannelHandler(newChannels, setChannels);
|
|
4494
|
-
}
|
|
4495
|
-
}
|
|
4496
|
-
} catch (error2) {
|
|
4497
|
-
console.warn(error2);
|
|
4498
|
-
setError(error2);
|
|
4499
|
-
}
|
|
4500
|
-
setQueryInProgress(null);
|
|
4501
|
-
};
|
|
4502
|
-
const throttleRecover = (0, import_react46.useCallback)(() => {
|
|
4503
|
-
const now = Date.now();
|
|
4504
|
-
const isFirstRecovery = !lastRecoveryTimestamp.current;
|
|
4505
|
-
const timeElapsedSinceLastRecoveryMs = lastRecoveryTimestamp.current ? now - lastRecoveryTimestamp.current : 0;
|
|
4506
|
-
if (!isFirstRecovery && timeElapsedSinceLastRecoveryMs < recoveryThrottleInterval && !error) {
|
|
4507
|
-
return;
|
|
4508
|
-
}
|
|
4509
|
-
lastRecoveryTimestamp.current = now;
|
|
4510
|
-
queryChannels("reload");
|
|
4511
|
-
}, [error, queryChannels, recoveryThrottleInterval]);
|
|
4512
|
-
const loadNextPage = () => queryChannels();
|
|
4513
|
-
(0, import_react46.useEffect)(() => {
|
|
4514
|
-
if (client.recoverStateOnReconnect) return;
|
|
4515
|
-
const { unsubscribe } = client.on("connection.recovered", throttleRecover);
|
|
4516
|
-
return () => {
|
|
4517
|
-
unsubscribe();
|
|
4518
|
-
};
|
|
4519
|
-
}, [client, throttleRecover]);
|
|
4520
|
-
(0, import_react46.useEffect)(() => {
|
|
4521
|
-
queryChannels("reload");
|
|
4522
|
-
}, [filterString, sortString]);
|
|
4523
|
-
return {
|
|
4524
|
-
channels,
|
|
4525
|
-
hasNextPage,
|
|
4526
|
-
loadNextPage,
|
|
4527
|
-
setChannels
|
|
4528
|
-
};
|
|
4529
|
-
};
|
|
4530
|
-
|
|
4531
4519
|
// src/components/ChannelList/hooks/useChannelListShape.ts
|
|
4532
|
-
var import_react47 = require("react");
|
|
4533
4520
|
var shared = ({
|
|
4534
4521
|
customHandler,
|
|
4535
4522
|
event,
|
|
@@ -5973,7 +5960,7 @@ var UnMemoizedChannelList = (props) => {
|
|
|
5973
5960
|
searchControllerStateSelector
|
|
5974
5961
|
);
|
|
5975
5962
|
const activeChannelHandler = async (channels2, setChannels2) => {
|
|
5976
|
-
if (!channels2.length
|
|
5963
|
+
if (!channels2.length) {
|
|
5977
5964
|
return;
|
|
5978
5965
|
}
|
|
5979
5966
|
if (customActiveChannel) {
|
|
@@ -22985,6 +22972,15 @@ var usePollOptionVotesPagination = ({
|
|
|
22985
22972
|
var import_clsx30 = __toESM(require("clsx"));
|
|
22986
22973
|
var import_lodash13 = __toESM(require("lodash.debounce"));
|
|
22987
22974
|
var import_react137 = __toESM(require("react"));
|
|
22975
|
+
|
|
22976
|
+
// src/constants/limits.ts
|
|
22977
|
+
var DEFAULT_NEXT_CHANNEL_PAGE_SIZE = 25;
|
|
22978
|
+
var DEFAULT_JUMP_TO_PAGE_SIZE = 25;
|
|
22979
|
+
var DEFAULT_THREAD_PAGE_SIZE = 25;
|
|
22980
|
+
var DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD = 250;
|
|
22981
|
+
var DEFAULT_HIGHLIGHT_DURATION = 500;
|
|
22982
|
+
|
|
22983
|
+
// src/components/InfiniteScrollPaginator/InfiniteScrollPaginator.tsx
|
|
22988
22984
|
var mousewheelListener = (event) => {
|
|
22989
22985
|
if (event instanceof WheelEvent && event.deltaY === 1) {
|
|
22990
22986
|
event.preventDefault();
|
|
@@ -35904,8 +35900,7 @@ var useLiveLocationSharingManager = ({
|
|
|
35904
35900
|
var import_react286 = __toESM(require("react"));
|
|
35905
35901
|
var import_clsx70 = __toESM(require("clsx"));
|
|
35906
35902
|
var import_lodash19 = __toESM(require("lodash.debounce"));
|
|
35907
|
-
var import_lodash20 = __toESM(require("lodash.
|
|
35908
|
-
var import_lodash21 = __toESM(require("lodash.throttle"));
|
|
35903
|
+
var import_lodash20 = __toESM(require("lodash.throttle"));
|
|
35909
35904
|
var import_stream_chat18 = require("stream-chat");
|
|
35910
35905
|
|
|
35911
35906
|
// src/components/Channel/channelState.ts
|
|
@@ -36488,7 +36483,7 @@ var ChannelInner = (props) => {
|
|
|
36488
36483
|
activeUnreadHandler,
|
|
36489
36484
|
allowConcurrentAudioPlayback,
|
|
36490
36485
|
channel,
|
|
36491
|
-
channelQueryOptions
|
|
36486
|
+
channelQueryOptions,
|
|
36492
36487
|
children,
|
|
36493
36488
|
doDeleteMessageRequest,
|
|
36494
36489
|
doMarkReadRequest,
|
|
@@ -36502,12 +36497,6 @@ var ChannelInner = (props) => {
|
|
|
36502
36497
|
onMentionsHover,
|
|
36503
36498
|
skipMessageDataMemoization
|
|
36504
36499
|
} = props;
|
|
36505
|
-
const channelQueryOptions = (0, import_react286.useMemo)(
|
|
36506
|
-
() => (0, import_lodash20.default)(propChannelQueryOptions, {
|
|
36507
|
-
messages: { limit: DEFAULT_INITIAL_CHANNEL_PAGE_SIZE }
|
|
36508
|
-
}),
|
|
36509
|
-
[propChannelQueryOptions]
|
|
36510
|
-
);
|
|
36511
36500
|
const { client, customClasses, latestMessageDatesByChannels, mutes, searchController } = useChatContext("Channel");
|
|
36512
36501
|
const { t } = useTranslationContext("Channel");
|
|
36513
36502
|
const chatContainerClass = getChatContainerClass(customClasses?.chatContainer);
|
|
@@ -36538,7 +36527,7 @@ var ChannelInner = (props) => {
|
|
|
36538
36527
|
null
|
|
36539
36528
|
);
|
|
36540
36529
|
const channelCapabilitiesArray = channel.data?.own_capabilities;
|
|
36541
|
-
const throttledCopyStateFromChannel = (0,
|
|
36530
|
+
const throttledCopyStateFromChannel = (0, import_lodash20.default)(
|
|
36542
36531
|
() => dispatch({ channel, type: "copyStateFromChannelOnEvent" }),
|
|
36543
36532
|
500,
|
|
36544
36533
|
{
|
|
@@ -36547,14 +36536,14 @@ var ChannelInner = (props) => {
|
|
|
36547
36536
|
}
|
|
36548
36537
|
);
|
|
36549
36538
|
const setChannelUnreadUiState = (0, import_react286.useMemo)(
|
|
36550
|
-
() => (0,
|
|
36539
|
+
() => (0, import_lodash20.default)(_setChannelUnreadUiState, 200, {
|
|
36551
36540
|
leading: true,
|
|
36552
36541
|
trailing: false
|
|
36553
36542
|
}),
|
|
36554
36543
|
[]
|
|
36555
36544
|
);
|
|
36556
36545
|
const markRead = (0, import_react286.useMemo)(
|
|
36557
|
-
() => (0,
|
|
36546
|
+
() => (0, import_lodash20.default)(
|
|
36558
36547
|
async (options) => {
|
|
36559
36548
|
const { updateChannelUiUnreadState = true } = options ?? {};
|
|
36560
36549
|
if (channel.disconnected || !channelConfig?.read_events) {
|
|
@@ -37419,7 +37408,7 @@ var useChat = ({
|
|
|
37419
37408
|
};
|
|
37420
37409
|
(0, import_react289.useEffect)(() => {
|
|
37421
37410
|
if (!client) return;
|
|
37422
|
-
const version = "13.
|
|
37411
|
+
const version = "13.14.1";
|
|
37423
37412
|
const userAgent = client.getUserAgent();
|
|
37424
37413
|
if (!userAgent.includes("stream-chat-react")) {
|
|
37425
37414
|
client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);
|