stream-chat-react 12.8.1 → 12.8.2

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.
Files changed (11) hide show
  1. package/dist/components/Chat/hooks/useChat.js +1 -1
  2. package/dist/components/MessageList/VirtualizedMessageListComponents.js +12 -19
  3. package/dist/components/MessageList/hooks/useMarkRead.js +3 -6
  4. package/dist/components/MessageList/renderMessages.js +14 -21
  5. package/dist/components/MessageList/utils.d.ts +9 -0
  6. package/dist/components/MessageList/utils.js +8 -0
  7. package/dist/index.browser.cjs +44 -25
  8. package/dist/index.browser.cjs.map +2 -2
  9. package/dist/index.node.cjs +45 -25
  10. package/dist/index.node.cjs.map +2 -2
  11. package/package.json +1 -1
package/dist/components/Chat/hooks/useChat.js CHANGED
@@ -28,7 +28,7 @@ export const useChat = ({ client, defaultLanguage = 'en', i18nInstance, initialN
28
28
  if (!userAgent.includes('stream-chat-react')) {
29
29
  // result looks like: 'stream-chat-react-2.3.2-stream-chat-javascript-client-browser-2.2.2'
30
30
  // the upper-case text between double underscores is replaced with the actual semantic version of the library
31
- client.setUserAgent(`stream-chat-react-12.8.1-${userAgent}`);
31
+ client.setUserAgent(`stream-chat-react-12.8.2-${userAgent}`);
32
32
  }
33
33
  client.threads.registerSubscriptions();
34
34
  client.polls.registerSubscriptions();
package/dist/components/MessageList/VirtualizedMessageListComponents.js CHANGED
@@ -5,7 +5,7 @@ import { EmptyStateIndicator as DefaultEmptyStateIndicator } from '../EmptyState
5
5
  import { LoadingIndicator as DefaultLoadingIndicator } from '../Loading';
6
6
  import { isMessageEdited, Message } from '../Message';
7
7
  import { useComponentContext } from '../../context';
8
- import { isDateSeparatorMessage } from './utils';
8
+ import { getIsFirstUnreadMessage, isDateSeparatorMessage } from './utils';
9
9
  const PREPEND_OFFSET = 10 ** 7;
10
10
  export function calculateItemIndex(virtuosoIndex, numItemsPrepended) {
11
11
  return virtuosoIndex + numItemsPrepended - PREPEND_OFFSET;
@@ -72,24 +72,17 @@ export const messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
72
72
  (maybePrevMessage && isMessageEdited(maybePrevMessage)));
73
73
  const endOfGroup = shouldGroupByUser &&
74
74
  (message.user?.id !== maybeNextMessage?.user?.id || isMessageEdited(message));
75
- const createdAtTimestamp = message.created_at && new Date(message.created_at).getTime();
76
- const lastReadTimestamp = lastReadDate?.getTime();
77
- const isFirstMessage = streamMessageIndex === 0;
78
- const isNewestMessage = lastReadMessageId === lastReceivedMessageId;
79
- const isLastReadMessage = message.id === lastReadMessageId ||
80
- (!unreadMessageCount && createdAtTimestamp === lastReadTimestamp);
81
- const isFirstUnreadMessage = firstUnreadMessageId === message.id ||
82
- (!!unreadMessageCount &&
83
- createdAtTimestamp &&
84
- lastReadTimestamp &&
85
- createdAtTimestamp > lastReadTimestamp &&
86
- isFirstMessage);
87
- const showUnreadSeparatorAbove = !lastReadMessageId && isFirstUnreadMessage;
88
- const showUnreadSeparatorBelow = isLastReadMessage && !isNewestMessage && (firstUnreadMessageId || !!unreadMessageCount);
75
+ const isFirstUnreadMessage = getIsFirstUnreadMessage({
76
+ firstUnreadMessageId,
77
+ isFirstMessage: streamMessageIndex === 0,
78
+ lastReadDate,
79
+ lastReadMessageId,
80
+ message,
81
+ previousMessage: streamMessageIndex ? messageList[streamMessageIndex - 1] : undefined,
82
+ unreadMessageCount,
83
+ });
89
84
  return (React.createElement(React.Fragment, null,
90
- showUnreadSeparatorAbove && (React.createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
85
+ isFirstUnreadMessage && (React.createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
91
86
  React.createElement(UnreadMessagesSeparator, { unreadCount: unreadMessageCount }))),
92
- React.createElement(Message, { additionalMessageInputProps: additionalMessageInputProps, autoscrollToBottom: virtuosoRef.current?.autoscrollToBottom, closeReactionSelectorOnClick: closeReactionSelectorOnClick, customMessageActions: customMessageActions, endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, formatDate: formatDate, groupedByUser: groupedByUser, groupStyles: [messageGroupStyles[message.id] ?? ''], lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, openThread: openThread, reactionDetailsSort: reactionDetailsSort, readBy: ownMessagesReadByOthers[message.id] || [], sortReactionDetails: sortReactionDetails, sortReactions: sortReactions, threadList: threadList }),
93
- showUnreadSeparatorBelow && (React.createElement("div", { className: 'str-chat__unread-messages-separator-wrapper' },
94
- React.createElement(UnreadMessagesSeparator, { unreadCount: unreadMessageCount })))));
87
+ React.createElement(Message, { additionalMessageInputProps: additionalMessageInputProps, autoscrollToBottom: virtuosoRef.current?.autoscrollToBottom, closeReactionSelectorOnClick: closeReactionSelectorOnClick, customMessageActions: customMessageActions, endOfGroup: endOfGroup, firstOfGroup: firstOfGroup, formatDate: formatDate, groupedByUser: groupedByUser, groupStyles: [messageGroupStyles[message.id] ?? ''], lastReceivedId: lastReceivedMessageId, message: message, Message: MessageUIComponent, messageActions: messageActions, openThread: openThread, reactionDetailsSort: reactionDetailsSort, readBy: ownMessagesReadByOthers[message.id] || [], sortReactionDetails: sortReactionDetails, sortReactions: sortReactions, threadList: threadList })));
95
88
  };
package/dist/components/MessageList/hooks/useMarkRead.js CHANGED
@@ -26,7 +26,6 @@ export const useMarkRead = ({ isMessageListScrolledToBottom, messageListIsThread
26
26
  markRead();
27
27
  };
28
28
  const handleMessageNew = (event) => {
29
- const newMessageToCurrentChannel = event.cid === channel.cid;
30
29
  const isOwnMessage = event.user?.id && event.user.id === client.user?.id;
31
30
  const mainChannelUpdated = !event.message?.parent_id || event.message?.show_in_channel;
32
31
  if (isOwnMessage)
@@ -45,13 +44,11 @@ export const useMarkRead = ({ isMessageListScrolledToBottom, messageListIsThread
45
44
  };
46
45
  });
47
46
  }
48
- else if (newMessageToCurrentChannel &&
49
- mainChannelUpdated &&
50
- shouldMarkRead(channel.countUnread())) {
47
+ else if (mainChannelUpdated && shouldMarkRead(channel.countUnread())) {
51
48
  markRead();
52
49
  }
53
50
  };
54
- client.on('message.new', handleMessageNew);
51
+ channel.on('message.new', handleMessageNew);
55
52
  document.addEventListener('visibilitychange', onVisibilityChange);
56
53
  const hasScrolledToBottom = previousRenderMessageListScrolledToBottom.current !== isMessageListScrolledToBottom &&
57
54
  isMessageListScrolledToBottom;
@@ -59,7 +56,7 @@ export const useMarkRead = ({ isMessageListScrolledToBottom, messageListIsThread
59
56
  markRead();
60
57
  previousRenderMessageListScrolledToBottom.current = isMessageListScrolledToBottom;
61
58
  return () => {
62
- client.off('message.new', handleMessageNew);
59
+ channel.off('message.new', handleMessageNew);
63
60
  document.removeEventListener('visibilitychange', onVisibilityChange);
64
61
  };
65
62
  }, [
package/dist/components/MessageList/renderMessages.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React, { Fragment } from 'react';
2
- import { isDateSeparatorMessage } from './utils';
2
+ import { getIsFirstUnreadMessage, isDateSeparatorMessage } from './utils';
3
3
  import { Message } from '../Message';
4
4
  import { DateSeparator as DefaultDateSeparator } from '../DateSeparator';
5
5
  import { EventComponent as DefaultMessageSystem } from '../EventComponent';
@@ -9,6 +9,7 @@ export function defaultRenderMessages({ channelUnreadUiState, components, custom
9
9
  const { DateSeparator = DefaultDateSeparator, HeaderComponent, MessageSystem = DefaultMessageSystem, UnreadMessagesSeparator = DefaultUnreadMessagesSeparator, } = components;
10
10
  const renderedMessages = [];
11
11
  let firstMessage;
12
+ let previousMessage = undefined;
12
13
  for (let index = 0; index < messages.length; index++) {
13
14
  const message = messages[index];
14
15
  if (isDateSeparatorMessage(message)) {
@@ -29,29 +30,21 @@ export function defaultRenderMessages({ channelUnreadUiState, components, custom
29
30
  }
30
31
  const groupStyles = messageGroupStyles[message.id] || '';
31
32
  const messageClass = customClasses?.message || `str-chat__li str-chat__li--${groupStyles}`;
32
- const createdAtTimestamp = message.created_at && new Date(message.created_at).getTime();
33
- const lastReadTimestamp = channelUnreadUiState?.last_read.getTime();
34
- const isFirstMessage = firstMessage?.id && firstMessage.id === message.id;
35
- const isNewestMessage = index === messages.length - 1;
36
- const isLastReadMessage = channelUnreadUiState?.last_read_message_id === message.id ||
37
- (!channelUnreadUiState?.unread_messages && createdAtTimestamp === lastReadTimestamp);
38
- const isFirstUnreadMessage = channelUnreadUiState?.first_unread_message_id === message.id ||
39
- (!!channelUnreadUiState?.unread_messages &&
40
- !!createdAtTimestamp &&
41
- !!lastReadTimestamp &&
42
- createdAtTimestamp > lastReadTimestamp &&
43
- isFirstMessage);
44
- const showUnreadSeparatorAbove = !channelUnreadUiState?.last_read_message_id && isFirstUnreadMessage;
45
- const showUnreadSeparatorBelow = isLastReadMessage &&
46
- !isNewestMessage &&
47
- (channelUnreadUiState?.first_unread_message_id || !!channelUnreadUiState?.unread_messages); // this part has to be here as we do not mark channel read when sending a message
33
+ const isFirstUnreadMessage = getIsFirstUnreadMessage({
34
+ firstUnreadMessageId: channelUnreadUiState?.first_unread_message_id,
35
+ isFirstMessage: !!firstMessage?.id && firstMessage.id === message.id,
36
+ lastReadDate: channelUnreadUiState?.last_read,
37
+ lastReadMessageId: channelUnreadUiState?.last_read_message_id,
38
+ message,
39
+ previousMessage,
40
+ unreadMessageCount: channelUnreadUiState?.unread_messages,
41
+ });
48
42
  renderedMessages.push(React.createElement(Fragment, { key: message.id || message.created_at },
49
- showUnreadSeparatorAbove && UnreadMessagesSeparator && (React.createElement("li", { className: 'str-chat__li str-chat__unread-messages-separator-wrapper' },
43
+ isFirstUnreadMessage && UnreadMessagesSeparator && (React.createElement("li", { className: 'str-chat__li str-chat__unread-messages-separator-wrapper' },
50
44
  React.createElement(UnreadMessagesSeparator, { unreadCount: channelUnreadUiState?.unread_messages }))),
51
45
  React.createElement("li", { className: messageClass, "data-message-id": message.id, "data-testid": messageClass },
52
- React.createElement(Message, { groupStyles: [groupStyles], lastReceivedId: lastReceivedId, message: message, readBy: readData[message.id] || [], ...messageProps })),
53
- showUnreadSeparatorBelow && UnreadMessagesSeparator && (React.createElement("li", { className: 'str-chat__li str-chat__unread-messages-separator-wrapper' },
54
- React.createElement(UnreadMessagesSeparator, { unreadCount: channelUnreadUiState?.unread_messages })))));
46
+ React.createElement(Message, { groupStyles: [groupStyles], lastReceivedId: lastReceivedId, message: message, readBy: readData[message.id] || [], ...messageProps }))));
47
+ previousMessage = message;
55
48
  }
56
49
  }
57
50
  return renderedMessages;
package/dist/components/MessageList/utils.d.ts CHANGED
@@ -68,4 +68,13 @@ type DateSeparatorMessage = {
68
68
  unread: boolean;
69
69
  };
70
70
  export declare function isDateSeparatorMessage<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(message: StreamMessage<StreamChatGenerics>): message is DateSeparatorMessage;
71
+ export declare const getIsFirstUnreadMessage: ({ firstUnreadMessageId, isFirstMessage, lastReadDate, lastReadMessageId, message, previousMessage, unreadMessageCount, }: {
72
+ isFirstMessage: boolean;
73
+ message: StreamMessage;
74
+ firstUnreadMessageId?: string;
75
+ lastReadDate?: Date;
76
+ lastReadMessageId?: string;
77
+ previousMessage?: StreamMessage;
78
+ unreadMessageCount?: number;
79
+ }) => boolean;
71
80
  export {};
package/dist/components/MessageList/utils.js CHANGED
@@ -241,3 +241,11 @@ export const hasNotMoreMessages = (returnedCountMessages, limit) => returnedCoun
241
241
  export function isDateSeparatorMessage(message) {
242
242
  return message.customType === CUSTOM_MESSAGE_TYPE.date && !!message.date && isDate(message.date);
243
243
  }
244
+ export const getIsFirstUnreadMessage = ({ firstUnreadMessageId, isFirstMessage, lastReadDate, lastReadMessageId, message, previousMessage, unreadMessageCount = 0, }) => {
245
+ const createdAtTimestamp = message.created_at && new Date(message.created_at).getTime();
246
+ const lastReadTimestamp = lastReadDate?.getTime();
247
+ const messageIsUnread = !!createdAtTimestamp && !!lastReadTimestamp && createdAtTimestamp > lastReadTimestamp;
248
+ const previousMessageIsLastRead = !!lastReadMessageId && lastReadMessageId === previousMessage?.id;
249
+ return (firstUnreadMessageId === message.id ||
250
+ (!!unreadMessageCount && messageIsUnread && (isFirstMessage || previousMessageIsLastRead)));
251
+ };
package/dist/index.browser.cjs CHANGED
@@ -17630,6 +17630,7 @@ __export(src_exports, {
17630
17630
  getGroupChannelDisplayInfo: () => getGroupChannelDisplayInfo,
17631
17631
  getGroupStyles: () => getGroupStyles,
17632
17632
  getImages: () => getImages,
17633
+ getIsFirstUnreadMessage: () => getIsFirstUnreadMessage,
17633
17634
  getLastReceived: () => getLastReceived,
17634
17635
  getLatestMessagePreview: () => getLatestMessagePreview,
17635
17636
  getMessageActions: () => getMessageActions,
@@ -47819,6 +47820,21 @@ var hasNotMoreMessages = (returnedCountMessages, limit) => returnedCountMessages
47819
47820
  function isDateSeparatorMessage(message) {
47820
47821
  return message.customType === CUSTOM_MESSAGE_TYPE.date && !!message.date && isDate(message.date);
47821
47822
  }
47823
+ var getIsFirstUnreadMessage = ({
47824
+ firstUnreadMessageId,
47825
+ isFirstMessage,
47826
+ lastReadDate,
47827
+ lastReadMessageId,
47828
+ message,
47829
+ previousMessage,
47830
+ unreadMessageCount = 0
47831
+ }) => {
47832
+ const createdAtTimestamp = message.created_at && new Date(message.created_at).getTime();
47833
+ const lastReadTimestamp = lastReadDate?.getTime();
47834
+ const messageIsUnread = !!createdAtTimestamp && !!lastReadTimestamp && createdAtTimestamp > lastReadTimestamp;
47835
+ const previousMessageIsLastRead = !!lastReadMessageId && lastReadMessageId === previousMessage?.id;
47836
+ return firstUnreadMessageId === message.id || !!unreadMessageCount && messageIsUnread && (isFirstMessage || previousMessageIsLastRead);
47837
+ };
47822
47838
 
47823
47839
  // src/components/MessageList/hooks/MessageList/useEnrichedMessages.ts
47824
47840
  var useEnrichedMessages = (args) => {
@@ -48175,7 +48191,6 @@ var useMarkRead = ({
48175
48191
  if (shouldMarkRead(channel.countUnread())) markRead();
48176
48192
  };
48177
48193
  const handleMessageNew = (event) => {
48178
- const newMessageToCurrentChannel = event.cid === channel.cid;
48179
48194
  const isOwnMessage = event.user?.id && event.user.id === client.user?.id;
48180
48195
  const mainChannelUpdated = !event.message?.parent_id || event.message?.show_in_channel;
48181
48196
  if (isOwnMessage) return;
@@ -48193,17 +48208,17 @@ var useMarkRead = ({
48193
48208
  unread_messages: previousUnreadCount + 1
48194
48209
  };
48195
48210
  });
48196
- } else if (newMessageToCurrentChannel && mainChannelUpdated && shouldMarkRead(channel.countUnread())) {
48211
+ } else if (mainChannelUpdated && shouldMarkRead(channel.countUnread())) {
48197
48212
  markRead();
48198
48213
  }
48199
48214
  };
48200
- client.on("message.new", handleMessageNew);
48215
+ channel.on("message.new", handleMessageNew);
48201
48216
  document.addEventListener("visibilitychange", onVisibilityChange);
48202
48217
  const hasScrolledToBottom = previousRenderMessageListScrolledToBottom.current !== isMessageListScrolledToBottom && isMessageListScrolledToBottom;
48203
48218
  if (hasScrolledToBottom && shouldMarkRead(channel.countUnread())) markRead();
48204
48219
  previousRenderMessageListScrolledToBottom.current = isMessageListScrolledToBottom;
48205
48220
  return () => {
48206
- client.off("message.new", handleMessageNew);
48221
+ channel.off("message.new", handleMessageNew);
48207
48222
  document.removeEventListener("visibilitychange", onVisibilityChange);
48208
48223
  };
48209
48224
  }, [
@@ -48638,6 +48653,7 @@ function defaultRenderMessages({
48638
48653
  } = components;
48639
48654
  const renderedMessages = [];
48640
48655
  let firstMessage;
48656
+ let previousMessage = void 0;
48641
48657
  for (let index3 = 0; index3 < messages.length; index3++) {
48642
48658
  const message = messages[index3];
48643
48659
  if (isDateSeparatorMessage(message)) {
@@ -48665,16 +48681,17 @@ function defaultRenderMessages({
48665
48681
  }
48666
48682
  const groupStyles = messageGroupStyles[message.id] || "";
48667
48683
  const messageClass = customClasses?.message || `str-chat__li str-chat__li--${groupStyles}`;
48668
- const createdAtTimestamp = message.created_at && new Date(message.created_at).getTime();
48669
- const lastReadTimestamp = channelUnreadUiState?.last_read.getTime();
48670
- const isFirstMessage = firstMessage?.id && firstMessage.id === message.id;
48671
- const isNewestMessage = index3 === messages.length - 1;
48672
- const isLastReadMessage = channelUnreadUiState?.last_read_message_id === message.id || !channelUnreadUiState?.unread_messages && createdAtTimestamp === lastReadTimestamp;
48673
- const isFirstUnreadMessage = channelUnreadUiState?.first_unread_message_id === message.id || !!channelUnreadUiState?.unread_messages && !!createdAtTimestamp && !!lastReadTimestamp && createdAtTimestamp > lastReadTimestamp && isFirstMessage;
48674
- const showUnreadSeparatorAbove = !channelUnreadUiState?.last_read_message_id && isFirstUnreadMessage;
48675
- const showUnreadSeparatorBelow = isLastReadMessage && !isNewestMessage && (channelUnreadUiState?.first_unread_message_id || !!channelUnreadUiState?.unread_messages);
48684
+ const isFirstUnreadMessage = getIsFirstUnreadMessage({
48685
+ firstUnreadMessageId: channelUnreadUiState?.first_unread_message_id,
48686
+ isFirstMessage: !!firstMessage?.id && firstMessage.id === message.id,
48687
+ lastReadDate: channelUnreadUiState?.last_read,
48688
+ lastReadMessageId: channelUnreadUiState?.last_read_message_id,
48689
+ message,
48690
+ previousMessage,
48691
+ unreadMessageCount: channelUnreadUiState?.unread_messages
48692
+ });
48676
48693
  renderedMessages.push(
48677
- /* @__PURE__ */ import_react246.default.createElement(import_react246.Fragment, { key: message.id || message.created_at }, showUnreadSeparatorAbove && UnreadMessagesSeparator2 && /* @__PURE__ */ import_react246.default.createElement("li", { className: "str-chat__li str-chat__unread-messages-separator-wrapper" }, /* @__PURE__ */ import_react246.default.createElement(UnreadMessagesSeparator2, { unreadCount: channelUnreadUiState?.unread_messages })), /* @__PURE__ */ import_react246.default.createElement("li", { className: messageClass, "data-message-id": message.id, "data-testid": messageClass }, /* @__PURE__ */ import_react246.default.createElement(
48694
+ /* @__PURE__ */ import_react246.default.createElement(import_react246.Fragment, { key: message.id || message.created_at }, isFirstUnreadMessage && UnreadMessagesSeparator2 && /* @__PURE__ */ import_react246.default.createElement("li", { className: "str-chat__li str-chat__unread-messages-separator-wrapper" }, /* @__PURE__ */ import_react246.default.createElement(UnreadMessagesSeparator2, { unreadCount: channelUnreadUiState?.unread_messages })), /* @__PURE__ */ import_react246.default.createElement("li", { className: messageClass, "data-message-id": message.id, "data-testid": messageClass }, /* @__PURE__ */ import_react246.default.createElement(
48678
48695
  Message,
48679
48696
  {
48680
48697
  groupStyles: [groupStyles],
@@ -48683,8 +48700,9 @@ function defaultRenderMessages({
48683
48700
  readBy: readData[message.id] || [],
48684
48701
  ...messageProps
48685
48702
  }
48686
- )), showUnreadSeparatorBelow && UnreadMessagesSeparator2 && /* @__PURE__ */ import_react246.default.createElement("li", { className: "str-chat__li str-chat__unread-messages-separator-wrapper" }, /* @__PURE__ */ import_react246.default.createElement(UnreadMessagesSeparator2, { unreadCount: channelUnreadUiState?.unread_messages })))
48703
+ )))
48687
48704
  );
48705
+ previousMessage = message;
48688
48706
  }
48689
48707
  }
48690
48708
  return renderedMessages;
@@ -49284,15 +49302,16 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
49284
49302
  const maybeNextMessage = messageList[streamMessageIndex + 1];
49285
49303
  const firstOfGroup = shouldGroupByUser && (message.user?.id !== maybePrevMessage?.user?.id || maybePrevMessage && isMessageEdited(maybePrevMessage));
49286
49304
  const endOfGroup = shouldGroupByUser && (message.user?.id !== maybeNextMessage?.user?.id || isMessageEdited(message));
49287
- const createdAtTimestamp = message.created_at && new Date(message.created_at).getTime();
49288
- const lastReadTimestamp = lastReadDate?.getTime();
49289
- const isFirstMessage = streamMessageIndex === 0;
49290
- const isNewestMessage = lastReadMessageId === lastReceivedMessageId;
49291
- const isLastReadMessage = message.id === lastReadMessageId || !unreadMessageCount && createdAtTimestamp === lastReadTimestamp;
49292
- const isFirstUnreadMessage = firstUnreadMessageId === message.id || !!unreadMessageCount && createdAtTimestamp && lastReadTimestamp && createdAtTimestamp > lastReadTimestamp && isFirstMessage;
49293
- const showUnreadSeparatorAbove = !lastReadMessageId && isFirstUnreadMessage;
49294
- const showUnreadSeparatorBelow = isLastReadMessage && !isNewestMessage && (firstUnreadMessageId || !!unreadMessageCount);
49295
- return /* @__PURE__ */ import_react256.default.createElement(import_react256.default.Fragment, null, showUnreadSeparatorAbove && /* @__PURE__ */ import_react256.default.createElement("div", { className: "str-chat__unread-messages-separator-wrapper" }, /* @__PURE__ */ import_react256.default.createElement(UnreadMessagesSeparator2, { unreadCount: unreadMessageCount })), /* @__PURE__ */ import_react256.default.createElement(
49305
+ const isFirstUnreadMessage = getIsFirstUnreadMessage({
49306
+ firstUnreadMessageId,
49307
+ isFirstMessage: streamMessageIndex === 0,
49308
+ lastReadDate,
49309
+ lastReadMessageId,
49310
+ message,
49311
+ previousMessage: streamMessageIndex ? messageList[streamMessageIndex - 1] : void 0,
49312
+ unreadMessageCount
49313
+ });
49314
+ return /* @__PURE__ */ import_react256.default.createElement(import_react256.default.Fragment, null, isFirstUnreadMessage && /* @__PURE__ */ import_react256.default.createElement("div", { className: "str-chat__unread-messages-separator-wrapper" }, /* @__PURE__ */ import_react256.default.createElement(UnreadMessagesSeparator2, { unreadCount: unreadMessageCount })), /* @__PURE__ */ import_react256.default.createElement(
49296
49315
  Message,
49297
49316
  {
49298
49317
  additionalMessageInputProps,
@@ -49315,7 +49334,7 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
49315
49334
  sortReactions,
49316
49335
  threadList
49317
49336
  }
49318
- ), showUnreadSeparatorBelow && /* @__PURE__ */ import_react256.default.createElement("div", { className: "str-chat__unread-messages-separator-wrapper" }, /* @__PURE__ */ import_react256.default.createElement(UnreadMessagesSeparator2, { unreadCount: unreadMessageCount })));
49337
+ ));
49319
49338
  };
49320
49339
 
49321
49340
  // src/components/MessageList/VirtualizedMessageList.tsx
@@ -50792,7 +50811,7 @@ var useChat = ({
50792
50811
  if (!client) return;
50793
50812
  const userAgent = client.getUserAgent();
50794
50813
  if (!userAgent.includes("stream-chat-react")) {
50795
- client.setUserAgent(`stream-chat-react-12.8.1-${userAgent}`);
50814
+ client.setUserAgent(`stream-chat-react-12.8.2-${userAgent}`);
50796
50815
  }
50797
50816
  client.threads.registerSubscriptions();
50798
50817
  client.polls.registerSubscriptions();