stream-chat-react 8.1.0 → 8.1.1

package/dist/index.cjs.js

@@ -3667,6 +3667,11 @@ var UnMemoizedMessageTimestamp = function (props) {
 };
 var MessageTimestamp = React__default['default'].memo(UnMemoizedMessageTimestamp);
 
+var CUSTOM_MESSAGE_TYPE = {
+    date: 'message.date',
+    intro: 'channel.intro',
+};
+
 var useCommandTrigger = function () {
     var channelConfig = useChannelStateContext('useCommandTrigger').channelConfig;
     var commands = channelConfig === null || channelConfig === void 0 ? void 0 : channelConfig.commands;
@@ -5561,7 +5566,7 @@ var MessageSimpleWithContext = function (props) {
     var messageClasses = isMyMessage()
         ? 'str-chat__message str-chat__message--me str-chat__message-simple str-chat__message-simple--me'
         : 'str-chat__message str-chat__message-simple';
-    if (message.customType === 'message.date') {
+    if (message.customType === CUSTOM_MESSAGE_TYPE.date) {
         return null;
     }
     if (message.deleted_at || message.type === 'deleted') {
@@ -5822,14 +5827,11 @@ var ChannelInner = function (props) {
     }, [channel.cid, doMarkReadRequest]);
     React.useEffect(function () {
         var _a;
-        if (state.thread && ((_a = state.messages) === null || _a === void 0 ? void 0 : _a.length)) {
-            for (var i = state.messages.length - 1; i >= 0; i -= 1) {
-                if (state.messages[i].id === state.thread.id) {
-                    dispatch({ message: state.messages[i], type: 'setThread' });
-                    break;
-                }
-            }
-        }
+        if (!state.thread)
+            return;
+        var message = (_a = state.messages) === null || _a === void 0 ? void 0 : _a.find(function (m) { var _a; return m.id === ((_a = state.thread) === null || _a === void 0 ? void 0 : _a.id); });
+        if (message)
+            dispatch({ message: message, type: 'setThread' });
     }, [state.messages, state.thread]);
     /** MESSAGE */
     // Adds a temporary notification to message list, will be removed after 5 seconds
@@ -7777,7 +7779,7 @@ var Streami18n = /** @class */ (function () {
     return Streami18n;
 }());
 
-var version = '8.1.0';
+var version = '8.1.1';
 
 var useChat = function (_a) {
     var _b, _c;
@@ -8230,7 +8232,7 @@ var MessageCommerceWithContext = function (props) {
     if (message.deleted_at) {
         return React__default['default'].createElement(MessageDeleted$1, { message: message });
     }
-    if (message.customType === 'message.date') {
+    if (message.customType === CUSTOM_MESSAGE_TYPE.date) {
         return null;
     }
     return (React__default['default'].createElement("div", { className: ("\n\t\t\t\t\t\t" + messageClasses + "\n\t\t\t\t\t\tstr-chat__message-commerce--" + message.type + "\n\t\t\t\t\t\t" + (message.text ? 'str-chat__message-commerce--has-text' : 'str-chat__message-commerce--has-no-text') + "\n\t\t\t\t\t\t" + (hasAttachment ? 'str-chat__message-commerce--has-attachment' : '') + "\n            " + (hasReactions && isReactionEnabled ? 'str-chat__message-commerce--with-reactions' : '') + "\n            " + ("str-chat__message-commerce--" + firstGroupStyle) + "\n            " + (message.pinned ? 'pinned-message' : '') + "\n\t\t\t\t\t").trim(), "data-testid": 'message-commerce-wrapper', key: message.id },
@@ -8271,7 +8273,7 @@ var MessageLivestreamWithContext = function (props) {
         messageTextToRender,
     ]);
     var firstGroupStyle = groupStyles ? groupStyles[0] : 'single';
-    if (message.customType === 'message.date') {
+    if (message.customType === CUSTOM_MESSAGE_TYPE.date) {
         return null;
     }
     if (message.deleted_at) {
@@ -8556,9 +8558,9 @@ var processMessages = function (params) {
             // do not show date separator for current user's messages
             if (enableDateSeparator && unread && ((_a = message.user) === null || _a === void 0 ? void 0 : _a.id) !== userId) {
                 newMessages.push({
-                    customType: 'message.date',
+                    customType: CUSTOM_MESSAGE_TYPE.date,
                     date: message.created_at,
-                    id: message.id,
+                    id: makeDateMessageId(message.created_at),
                     unread: unread,
                 });
             }
@@ -8570,13 +8572,13 @@ var processMessages = function (params) {
                 (hideDeletedMessages &&
                     (previousMessage === null || previousMessage === void 0 ? void 0 : previousMessage.type) === 'deleted' &&
                     lastDateSeparator !== messageDate)) &&
-            ((_b = newMessages === null || newMessages === void 0 ? void 0 : newMessages[newMessages.length - 1]) === null || _b === void 0 ? void 0 : _b.customType) !== 'message.date' // do not show two date separators in a row)
+            ((_b = newMessages === null || newMessages === void 0 ? void 0 : newMessages[newMessages.length - 1]) === null || _b === void 0 ? void 0 : _b.customType) !== CUSTOM_MESSAGE_TYPE.date // do not show two date separators in a row)
         ) {
             lastDateSeparator = messageDate;
             newMessages.push({
-                customType: 'message.date',
+                customType: CUSTOM_MESSAGE_TYPE.date,
                 date: message.created_at,
-                id: message.id,
+                id: makeDateMessageId(message.created_at),
             }, message);
         }
         else {
@@ -8589,6 +8591,16 @@ var processMessages = function (params) {
     }
     return newMessages;
 };
+var makeDateMessageId = function (date) {
+    var idSuffix;
+    try {
+        idSuffix = !date ? uuid.v4() : date instanceof Date ? date.toISOString() : date;
+    }
+    catch (e) {
+        idSuffix = uuid.v4();
+    }
+    return CUSTOM_MESSAGE_TYPE.date + "-" + idSuffix;
+};
 // fast since it usually iterates just the last few messages
 var getLastReceived = function (messages) {
     for (var i = messages.length - 1; i > 0; i -= 1) {
@@ -8631,7 +8643,9 @@ var getReadStates = function (messages, read, returnAllReadData) {
 };
 var insertIntro = function (messages, headerPosition) {
     var newMessages = messages;
-    var intro = { customType: 'channel.intro' };
+    var intro = {
+        customType: CUSTOM_MESSAGE_TYPE.intro,
+    };
     // if no headerPosition is set, HeaderComponent will go at the top
     if (!headerPosition) {
         newMessages.unshift(intro);
@@ -8654,7 +8668,7 @@ var insertIntro = function (messages, headerPosition) {
         if (messageTime && messageTime < headerPosition) {
             // if header position is also smaller than message time continue;
             if (nextMessageTime && nextMessageTime < headerPosition) {
-                if (messages[i + 1] && messages[i + 1].customType === 'message.date')
+                if (messages[i + 1] && messages[i + 1].customType === CUSTOM_MESSAGE_TYPE.date)
                     continue;
                 if (!nextMessageTime) {
                     newMessages.push(intro);
@@ -8671,24 +8685,24 @@ var insertIntro = function (messages, headerPosition) {
 };
 var getGroupStyles = function (message, previousMessage, nextMessage, noGroupByUser) {
     var _a, _b, _c, _d, _e, _f, _g;
-    if (message.customType === 'message.date')
+    if (message.customType === CUSTOM_MESSAGE_TYPE.date)
         return '';
-    if (message.customType === 'channel.intro')
+    if (message.customType === CUSTOM_MESSAGE_TYPE.intro)
         return '';
     if (noGroupByUser || ((_a = message.attachments) === null || _a === void 0 ? void 0 : _a.length) !== 0)
         return 'single';
     var isTopMessage = !previousMessage ||
-        previousMessage.customType === 'channel.intro' ||
-        previousMessage.customType === 'message.date' ||
+        previousMessage.customType === CUSTOM_MESSAGE_TYPE.intro ||
+        previousMessage.customType === CUSTOM_MESSAGE_TYPE.date ||
         previousMessage.type === 'system' ||
         ((_b = previousMessage.attachments) === null || _b === void 0 ? void 0 : _b.length) !== 0 ||
         ((_c = message.user) === null || _c === void 0 ? void 0 : _c.id) !== ((_d = previousMessage.user) === null || _d === void 0 ? void 0 : _d.id) ||
         previousMessage.type === 'error' ||
         previousMessage.deleted_at;
     var isBottomMessage = !nextMessage ||
-        nextMessage.customType === 'message.date' ||
+        nextMessage.customType === CUSTOM_MESSAGE_TYPE.date ||
         nextMessage.type === 'system' ||
-        nextMessage.customType === 'channel.intro' ||
+        nextMessage.customType === CUSTOM_MESSAGE_TYPE.intro ||
         ((_e = nextMessage.attachments) === null || _e === void 0 ? void 0 : _e.length) !== 0 ||
         ((_f = message.user) === null || _f === void 0 ? void 0 : _f.id) !== ((_g = nextMessage.user) === null || _g === void 0 ? void 0 : _g.id) ||
         nextMessage.type === 'error' ||
@@ -8764,11 +8778,13 @@ var useMessageListElements = function (props) {
     return React.useMemo(function () {
         return enrichedMessages.map(function (message) {
             var _a;
-            if (message.customType === 'message.date' && message.date && isDate(message.date)) {
+            if (message.customType === CUSTOM_MESSAGE_TYPE.date &&
+                message.date &&
+                isDate(message.date)) {
                 return (React__default['default'].createElement("li", { key: message.date.toISOString() + "-i" },
                     React__default['default'].createElement(DateSeparator$1, { date: message.date, formatDate: internalMessageProps.formatDate, unread: message.unread })));
             }
-            if (message.customType === 'channel.intro' && HeaderComponent) {
+            if (message.customType === CUSTOM_MESSAGE_TYPE.intro && HeaderComponent) {
                 return (React__default['default'].createElement("li", { key: 'intro' },
                     React__default['default'].createElement(HeaderComponent, null)));
             }
@@ -9379,7 +9395,7 @@ var VirtualizedMessageListWithContext = function (props) {
             return customMessageRenderer(messageList, streamMessageIndex);
         }
         var message = messageList[streamMessageIndex];
-        if (message.customType === 'message.date' && message.date && isDate(message.date)) {
+        if (message.customType === CUSTOM_MESSAGE_TYPE.date && message.date && isDate(message.date)) {
             return React__default['default'].createElement(DateSeparator$1, { date: message.date, unread: message.unread });
         }
         if (!message)
@@ -9692,6 +9708,7 @@ exports.itTranslations = itTranslations;
 exports.jaTranslations = jaTranslations;
 exports.koTranslations = koTranslations;
 exports.listener = Listeners;
+exports.makeDateMessageId = makeDateMessageId;
 exports.markDownRenderers = markDownRenderers;
 exports.matchMarkdownLinks = matchMarkdownLinks;
 exports.mentionsMarkdownPlugin = mentionsMarkdownPlugin;