stream-chat-angular 2.15.0 → 2.17.0

package/bundles/stream-chat-angular.umd.js

@@ -354,7 +354,7 @@
         return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
     }
 
-    var version = '2.15.0';
+    var version = '2.17.0';
 
     /**
      * The `NotificationService` can be used to add or remove notifications. By default the [`NotificationList`](../components/NotificationListComponent.mdx) component displays the currently active notifications.
@@ -635,6 +635,7 @@
             this.activeChannelSubscriptions = [];
             this.activeParentMessageIdSubject = new rxjs.BehaviorSubject(undefined);
             this.activeThreadMessagesSubject = new rxjs.BehaviorSubject([]);
+            this.latestMessageDateByUserByChannelsSubject = new rxjs.BehaviorSubject({});
             this.messagePageSize = 25;
             this.messageToQuoteSubject = new rxjs.BehaviorSubject(undefined);
             this.usersTypingInChannelSubject = new rxjs.BehaviorSubject([]);
@@ -667,8 +668,8 @@
             this.activeParentMessage$ = rxjs.combineLatest([
                 this.activeChannelMessages$,
                 this.activeParentMessageId$,
-            ]).pipe(operators.map(function (_f) {
-                var _g = __read(_f, 2), messages = _g[0], parentMessageId = _g[1];
+            ]).pipe(operators.map(function (_h) {
+                var _j = __read(_h, 2), messages = _j[0], parentMessageId = _j[1];
                 if (!parentMessageId) {
                     return undefined;
                 }
@@ -685,6 +686,8 @@
             this.usersTypingInChannel$ =
                 this.usersTypingInChannelSubject.asObservable();
             this.usersTypingInThread$ = this.usersTypingInThreadSubject.asObservable();
+            this.latestMessageDateByUserByChannels$ =
+                this.latestMessageDateByUserByChannelsSubject.asObservable();
         }
         /**
          * Sets the given `channel` as active.
@@ -714,8 +717,8 @@
             var _a;
             return __awaiter(this, void 0, void 0, function () {
                 var messageToQuote, activeChannel, result;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             messageToQuote = this.messageToQuoteSubject.getValue();
                             if (messageToQuote && !!messageToQuote.parent_id) {
@@ -732,9 +735,9 @@
                                     limit: (_a = this.options) === null || _a === void 0 ? void 0 : _a.message_limit,
                                 }))];
                         case 2:
-                            result = _f.sent();
+                            result = _h.sent();
                             this.activeThreadMessagesSubject.next((result === null || result === void 0 ? void 0 : result.messages) || []);
-                            _f.label = 3;
+                            _h.label = 3;
                         case 3: return [2 /*return*/];
                     }
                 });
@@ -747,8 +750,8 @@
             var _a, _b, _c, _d, _e;
             return __awaiter(this, void 0, void 0, function () {
                 var activeChnannel, lastMessageId;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             activeChnannel = this.activeChannelSubject.getValue();
                             lastMessageId = (_a = this.activeChannelMessagesSubject.getValue()[0]) === null || _a === void 0 ? void 0 : _a.id;
@@ -758,7 +761,7 @@
                                     watchers: { limit: 0 },
                                 }))];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             if (((_c = activeChnannel === null || activeChnannel === void 0 ? void 0 : activeChnannel.data) === null || _c === void 0 ? void 0 : _c.id) ===
                                 ((_e = (_d = this.activeChannelSubject.getValue()) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.id)) {
                                 this.activeChannelMessagesSubject.next(__spreadArray([], __read(activeChnannel.state.messages)));
@@ -775,8 +778,8 @@
             var _a, _b;
             return __awaiter(this, void 0, void 0, function () {
                 var activeChnannel, parentMessageId, lastMessageId;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             activeChnannel = this.activeChannelSubject.getValue();
                             parentMessageId = this.activeParentMessageIdSubject.getValue();
@@ -789,7 +792,7 @@
                                     id_lt: lastMessageId,
                                 }))];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             this.activeThreadMessagesSubject.next((activeChnannel === null || activeChnannel === void 0 ? void 0 : activeChnannel.state.threads[parentMessageId]) || []);
                             return [2 /*return*/];
                     }
@@ -805,8 +808,8 @@
         ChannelService.prototype.init = function (filters, sort, options) {
             return __awaiter(this, void 0, void 0, function () {
                 var _this = this;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             this.filters = filters;
                             this.options = options || {
@@ -820,7 +823,7 @@
                             this.sort = sort || { last_message_at: -1, updated_at: -1 };
                             return [4 /*yield*/, this.queryChannels()];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             this.chatClientService.notification$.subscribe(function (notification) { return void _this.handleNotification(notification); });
                             return [2 /*return*/];
                     }
@@ -836,6 +839,7 @@
             this.activeParentMessageIdSubject.next(undefined);
             this.activeThreadMessagesSubject.next([]);
             this.channelsSubject.next(undefined);
+            this.latestMessageDateByUserByChannelsSubject.next({});
             this.selectMessageToQuote(undefined);
         };
         /**
@@ -843,13 +847,13 @@
          */
         ChannelService.prototype.loadMoreChannels = function () {
             return __awaiter(this, void 0, void 0, function () {
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             this.options.offset = this.channels.length;
                             return [4 /*yield*/, this.queryChannels()];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -863,13 +867,13 @@
         ChannelService.prototype.addReaction = function (messageId, reactionType) {
             var _a;
             return __awaiter(this, void 0, void 0, function () {
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0: return [4 /*yield*/, ((_a = this.activeChannelSubject.getValue()) === null || _a === void 0 ? void 0 : _a.sendReaction(messageId, {
                                 type: reactionType,
                             }))];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -883,12 +887,12 @@
         ChannelService.prototype.removeReaction = function (messageId, reactionType) {
             var _a;
             return __awaiter(this, void 0, void 0, function () {
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0: return [4 /*yield*/, ((_a = this.activeChannelSubject
                                 .getValue()) === null || _a === void 0 ? void 0 : _a.deleteReaction(messageId, reactionType))];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -909,8 +913,8 @@
             if (quotedMessageId === void 0) { quotedMessageId = undefined; }
             return __awaiter(this, void 0, void 0, function () {
                 var preview, channel;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             preview = createMessagePreview(this.chatClientService.chatClient.user, text, attachments, mentionedUsers, parentId, quotedMessageId);
                             channel = this.activeChannelSubject.getValue();
@@ -918,7 +922,7 @@
                             channel.state.addMessageSorted(preview, true);
                             return [4 /*yield*/, this.sendMessageRequest(preview)];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -931,14 +935,14 @@
         ChannelService.prototype.resendMessage = function (message) {
             return __awaiter(this, void 0, void 0, function () {
                 var channel;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             channel = this.activeChannelSubject.getValue();
                             channel.state.addMessageSorted(Object.assign(Object.assign({}, message), { errorStatusCode: undefined, status: 'sending' }), true);
                             return [4 /*yield*/, this.sendMessageRequest(message)];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -950,11 +954,11 @@
          */
         ChannelService.prototype.updateMessage = function (message) {
             return __awaiter(this, void 0, void 0, function () {
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0: return [4 /*yield*/, this.chatClientService.chatClient.updateMessage(message)];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -966,11 +970,11 @@
          */
         ChannelService.prototype.deleteMessage = function (message) {
             return __awaiter(this, void 0, void 0, function () {
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0: return [4 /*yield*/, this.chatClientService.chatClient.deleteMessage(message.id)];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -984,8 +988,8 @@
         ChannelService.prototype.uploadAttachments = function (uploads) {
             return __awaiter(this, void 0, void 0, function () {
                 var result, channel, uploadResults;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             result = [];
                             channel = this.activeChannelSubject.getValue();
@@ -993,7 +997,7 @@
                                     ? channel.sendImage(upload.file)
                                     : channel.sendFile(upload.file); }))];
                         case 1:
-                            uploadResults = _f.sent();
+                            uploadResults = _h.sent();
                             uploadResults.forEach(function (uploadResult, i) {
                                 var file = uploads[i].file;
                                 var type = uploads[i].type;
@@ -1021,15 +1025,15 @@
         ChannelService.prototype.deleteAttachment = function (attachmentUpload) {
             return __awaiter(this, void 0, void 0, function () {
                 var channel;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             channel = this.activeChannelSubject.getValue();
                             return [4 /*yield*/, (attachmentUpload.type === 'image'
                                     ? channel.deleteImage(attachmentUpload.url)
                                     : channel.deleteFile(attachmentUpload.url))];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -1044,8 +1048,8 @@
             return __awaiter(this, void 0, void 0, function () {
                 var activeChannel, result;
                 var _this = this;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             activeChannel = this.activeChannelSubject.getValue();
                             if (!activeChannel) {
@@ -1062,7 +1066,7 @@
                                     id: { $ne: this.chatClientService.chatClient.userID },
                                 })];
                         case 2:
-                            result = _f.sent();
+                            result = _h.sent();
                             return [2 /*return*/, Object.values(result.members)];
                     }
                 });
@@ -1076,13 +1080,13 @@
         ChannelService.prototype.sendAction = function (messageId, formData) {
             return __awaiter(this, void 0, void 0, function () {
                 var channel, response, isThreadReply;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             channel = this.activeChannelSubject.getValue();
                             return [4 /*yield*/, channel.sendAction(messageId, formData)];
                         case 1:
-                            response = _f.sent();
+                            response = _h.sent();
                             if (response === null || response === void 0 ? void 0 : response.message) {
                                 channel.state.addMessageSorted(Object.assign(Object.assign({}, response.message), { status: 'received' }));
                                 isThreadReply = !!response.message.parent_id;
@@ -1119,17 +1123,17 @@
             var _a;
             return __awaiter(this, void 0, void 0, function () {
                 var channel, isThreadReply, response, error_1, stringError, parsedError;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             channel = this.activeChannelSubject.getValue();
                             isThreadReply = !!preview.parent_id;
                             isThreadReply
                                 ? this.activeThreadMessagesSubject.next(__spreadArray([], __read(channel.state.threads[preview.parent_id])))
                                 : this.activeChannelMessagesSubject.next(__spreadArray([], __read(channel.state.messages)));
-                            _f.label = 1;
+                            _h.label = 1;
                         case 1:
-                            _f.trys.push([1, 3, , 4]);
+                            _h.trys.push([1, 3, , 4]);
                             return [4 /*yield*/, channel.sendMessage({
                                     text: preview.text,
                                     attachments: preview.attachments,
@@ -1139,7 +1143,7 @@
                                     quoted_message_id: preview.quoted_message_id,
                                 })];
                         case 2:
-                            response = _f.sent();
+                            response = _h.sent();
                             if (response === null || response === void 0 ? void 0 : response.message) {
                                 channel.state.addMessageSorted(Object.assign(Object.assign({}, response.message), { status: 'received' }), true);
                                 isThreadReply
@@ -1148,7 +1152,7 @@
                             }
                             return [3 /*break*/, 4];
                         case 3:
-                            error_1 = _f.sent();
+                            error_1 = _h.sent();
                             stringError = JSON.stringify(error_1);
                             parsedError = stringError
                                 ? JSON.parse(stringError)
@@ -1165,53 +1169,53 @@
         };
         ChannelService.prototype.handleNotification = function (notification) {
             return __awaiter(this, void 0, void 0, function () {
-                var _f;
+                var _h;
                 var _this = this;
-                return __generator(this, function (_g) {
-                    switch (_g.label) {
+                return __generator(this, function (_j) {
+                    switch (_j.label) {
                         case 0:
-                            _f = notification.eventType;
-                            switch (_f) {
+                            _h = notification.eventType;
+                            switch (_h) {
                                 case 'notification.message_new': return [3 /*break*/, 1];
                                 case 'notification.added_to_channel': return [3 /*break*/, 3];
                                 case 'notification.removed_from_channel': return [3 /*break*/, 5];
                             }
                             return [3 /*break*/, 6];
                         case 1: return [4 /*yield*/, this.ngZone.run(function () { return __awaiter(_this, void 0, void 0, function () {
-                                return __generator(this, function (_f) {
-                                    switch (_f.label) {
+                                return __generator(this, function (_h) {
+                                    switch (_h.label) {
                                         case 0:
                                             if (!this.customNewMessageNotificationHandler) return [3 /*break*/, 1];
                                             this.customNewMessageNotificationHandler(notification, this.channelListSetter);
                                             return [3 /*break*/, 3];
                                         case 1: return [4 /*yield*/, this.handleNewMessageNotification(notification)];
                                         case 2:
-                                            _f.sent();
-                                            _f.label = 3;
+                                            _h.sent();
+                                            _h.label = 3;
                                         case 3: return [2 /*return*/];
                                     }
                                 });
                             }); })];
                         case 2:
-                            _g.sent();
+                            _j.sent();
                             return [3 /*break*/, 6];
                         case 3: return [4 /*yield*/, this.ngZone.run(function () { return __awaiter(_this, void 0, void 0, function () {
-                                return __generator(this, function (_f) {
-                                    switch (_f.label) {
+                                return __generator(this, function (_h) {
+                                    switch (_h.label) {
                                         case 0:
                                             if (!this.customAddedToChannelNotificationHandler) return [3 /*break*/, 1];
                                             this.customAddedToChannelNotificationHandler(notification, this.channelListSetter);
                                             return [3 /*break*/, 3];
                                         case 1: return [4 /*yield*/, this.handleAddedToChannelNotification(notification)];
                                         case 2:
-                                            _f.sent();
-                                            _f.label = 3;
+                                            _h.sent();
+                                            _h.label = 3;
                                         case 3: return [2 /*return*/];
                                     }
                                 });
                             }); })];
                         case 4:
-                            _g.sent();
+                            _j.sent();
                             return [3 /*break*/, 6];
                         case 5:
                             {
@@ -1224,7 +1228,7 @@
                                     }
                                 });
                             }
-                            _g.label = 6;
+                            _j.label = 6;
                         case 6: return [2 /*return*/];
                     }
                 });
@@ -1236,11 +1240,11 @@
         };
         ChannelService.prototype.handleNewMessageNotification = function (notification) {
             return __awaiter(this, void 0, void 0, function () {
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0: return [4 /*yield*/, this.addChannelFromNotification(notification)];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -1248,11 +1252,11 @@
         };
         ChannelService.prototype.handleAddedToChannelNotification = function (notification) {
             return __awaiter(this, void 0, void 0, function () {
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0: return [4 /*yield*/, this.addChannelFromNotification(notification)];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -1262,13 +1266,13 @@
             var _a, _b;
             return __awaiter(this, void 0, void 0, function () {
                 var channel;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             channel = this.chatClientService.chatClient.channel((_a = notification.event.channel) === null || _a === void 0 ? void 0 : _a.type, (_b = notification.event.channel) === null || _b === void 0 ? void 0 : _b.id);
                             return [4 /*yield*/, channel.watch()];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             this.watchForChannelEvents(channel);
                             this.channelsSubject.next(__spreadArray([
                                 channel
@@ -1299,6 +1303,7 @@
                             void (c === null || c === void 0 ? void 0 : c.markRead());
                         }
                     });
+                    _this.updateLatestMessages(event);
                 });
             }));
             this.activeChannelSubscriptions.push(channel.on('message.updated', function (event) { return _this.messageUpdated(event); }));
@@ -1329,13 +1334,13 @@
         ChannelService.prototype.typingStarted = function (parentId) {
             return __awaiter(this, void 0, void 0, function () {
                 var activeChannel;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             activeChannel = this.activeChannelSubject.getValue();
                             return [4 /*yield*/, (activeChannel === null || activeChannel === void 0 ? void 0 : activeChannel.keystroke(parentId))];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -1348,13 +1353,13 @@
         ChannelService.prototype.typingStopped = function (parentId) {
             return __awaiter(this, void 0, void 0, function () {
                 var activeChannel;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
                             activeChannel = this.activeChannelSubject.getValue();
                             return [4 /*yield*/, (activeChannel === null || activeChannel === void 0 ? void 0 : activeChannel.stopTyping(parentId))];
                         case 1:
-                            _f.sent();
+                            _h.sent();
                             return [2 /*return*/];
                     }
                 });
@@ -1427,13 +1432,13 @@
             return __awaiter(this, void 0, void 0, function () {
                 var channels, prevChannels, error_2;
                 var _this = this;
-                return __generator(this, function (_f) {
-                    switch (_f.label) {
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
                         case 0:
-                            _f.trys.push([0, 2, , 3]);
+                            _h.trys.push([0, 2, , 3]);
                             return [4 /*yield*/, this.chatClientService.chatClient.queryChannels(this.filters, this.sort, this.options)];
                         case 1:
-                            channels = _f.sent();
+                            channels = _h.sent();
                             channels.forEach(function (c) { return _this.watchForChannelEvents(c); });
                             prevChannels = this.channelsSubject.getValue() || [];
                             this.channelsSubject.next(__spreadArray(__spreadArray([], __read(prevChannels)), __read(channels)));
@@ -1443,7 +1448,7 @@
                             this.hasMoreChannelsSubject.next(channels.length >= this.options.limit);
                             return [3 /*break*/, 3];
                         case 2:
-                            error_2 = _f.sent();
+                            error_2 = _h.sent();
                             this.channelsSubject.error(error_2);
                             return [3 /*break*/, 3];
                         case 3: return [2 /*return*/];
@@ -1554,7 +1559,6 @@
                 }
             }
         };
-        // truncate active thread as well
         ChannelService.prototype.handleChannelTruncate = function (event) {
             var _a, _b;
             var channelIndex = this.channels.findIndex(function (c) { return c.cid === event.channel.cid; });
@@ -1640,6 +1644,26 @@
                 return;
             }
         };
+        ChannelService.prototype.updateLatestMessages = function (event) {
+            var _a, _b, _c, _d, _e, _f, _g;
+            if (((_b = (_a = event.message) === null || _a === void 0 ? void 0 : _a.user) === null || _b === void 0 ? void 0 : _b.id) !== ((_d = (_c = this.chatClientService) === null || _c === void 0 ? void 0 : _c.chatClient.user) === null || _d === void 0 ? void 0 : _d.id)) {
+                return;
+            }
+            var latestMessages = this.latestMessageDateByUserByChannelsSubject.getValue();
+            if (!((_e = event.message) === null || _e === void 0 ? void 0 : _e.created_at)) {
+                return;
+            }
+            var channelId = (_f = event === null || event === void 0 ? void 0 : event.message) === null || _f === void 0 ? void 0 : _f.cid;
+            if (!channelId) {
+                return;
+            }
+            var messageDate = new Date(event.message.created_at);
+            if (!latestMessages[channelId] ||
+                ((_g = latestMessages[channelId]) === null || _g === void 0 ? void 0 : _g.getTime()) < messageDate.getTime()) {
+                latestMessages[channelId] = messageDate;
+                this.latestMessageDateByUserByChannelsSubject.next(Object.assign({}, latestMessages));
+            }
+        };
         return ChannelService;
     }());
     ChannelService.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0__namespace, type: ChannelService, deps: [{ token: ChatClientService }, { token: i0__namespace.NgZone }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
@@ -2440,7 +2464,7 @@
             return (attachment.file_size && Number.isFinite(Number(attachment.file_size)));
         };
         AttachmentListComponent.prototype.getFileSize = function (attachment) {
-            return prettybytes__default['default'](attachment.file_size);
+            return prettybytes__default['default'](Number(attachment.file_size));
         };
         AttachmentListComponent.prototype.trimUrl = function (url) {
             if (url !== undefined && url !== null) {
@@ -2551,6 +2575,7 @@
             this.textareaValue = '';
             this.mentionedUsers = [];
             this.typingStart$ = new rxjs.Subject();
+            this.isCooldownInProgress = false;
             this.subscriptions = [];
             this.isViewInited = false;
             this.subscriptions.push(this.attachmentService.attachmentUploadInProgressCounter$.subscribe(function (counter) {
@@ -2594,6 +2619,30 @@
                 this.configService.commandAutocompleteItemTemplate;
             this.emojiPickerTemplate = this.configService.emojiPickerTemplate;
             this.subscriptions.push(this.typingStart$.subscribe(function () { return void _this.channelService.typingStarted(_this.parentMessageId); }));
+            this.subscriptions.push(rxjs.combineLatest([
+                this.channelService.latestMessageDateByUserByChannels$,
+                this.channelService.activeChannel$,
+            ])
+                .pipe(operators.map(function (_12) {
+                var _13 = __read(_12, 2), latestMessages = _13[0], channel = _13[1];
+                return [latestMessages[(channel === null || channel === void 0 ? void 0 : channel.cid) || ''], channel];
+            }))
+                .subscribe(function (_12) {
+                var _13 = __read(_12, 2), latestMessageDate = _13[0], channel = _13[1];
+                var _a, _b, _c;
+                var cooldown = ((_a = channel === null || channel === void 0 ? void 0 : channel.data) === null || _a === void 0 ? void 0 : _a.cooldown) &&
+                    latestMessageDate &&
+                    Math.round(((_b = channel === null || channel === void 0 ? void 0 : channel.data) === null || _b === void 0 ? void 0 : _b.cooldown) -
+                        (new Date().getTime() - latestMessageDate.getTime()) / 1000);
+                if (cooldown &&
+                    cooldown > 0 &&
+                    ((_c = channel === null || channel === void 0 ? void 0 : channel.data) === null || _c === void 0 ? void 0 : _c.own_capabilities).includes('slow-mode')) {
+                    _this.startCooldown(cooldown);
+                }
+                else if (_this.isCooldownInProgress) {
+                    _this.stopCooldown();
+                }
+            }));
         }
         MessageInputComponent.prototype.ngAfterViewInit = function () {
             this.isViewInited = true;
@@ -2725,6 +2774,21 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(MessageInputComponent.prototype, "disabledTextareaText", {
+            get: function () {
+                if (!this.canSendMessages) {
+                    return this.mode === 'thread'
+                        ? "streamChat.You can't send thread replies in this channel"
+                        : "streamChat.You can't send messages in this channel";
+                }
+                else if (this.cooldown$) {
+                    return 'streamChat.Slow Mode ON';
+                }
+                return '';
+            },
+            enumerable: false,
+            configurable: true
+        });
         MessageInputComponent.prototype.filesSelected = function (fileList) {
             return __awaiter(this, void 0, void 0, function () {
                 return __generator(this, function (_12) {
@@ -2853,10 +2917,28 @@
             enumerable: false,
             configurable: true
         });
+        MessageInputComponent.prototype.startCooldown = function (cooldown) {
+            var _this = this;
+            this.isCooldownInProgress = true;
+            this.cooldown$ = rxjs.timer(0, 1000).pipe(operators.take(cooldown + 1), operators.map(function (v) { return cooldown - v; }), operators.tap(function (v) {
+                if (v === 0) {
+                    _this.stopCooldown();
+                }
+            }));
+        };
+        MessageInputComponent.prototype.stopCooldown = function () {
+            var _this = this;
+            this.cooldown$ = undefined;
+            this.isCooldownInProgress = false;
+            // the anchor directive will be recreated because of *ngIf, so we will have to reinit the textarea as well
+            this.textareaRef = undefined;
+            // we can only create the textarea after the anchor was recreated, so we will have to wait a change detection cycle with setTimeout
+            setTimeout(function () { return _this.initTextarea(); });
+        };
         return MessageInputComponent;
     }());
     MessageInputComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0__namespace, type: MessageInputComponent, deps: [{ token: ChannelService }, { token: NotificationService }, { token: AttachmentService }, { token: MessageInputConfigService }, { token: textareaInjectionToken }, { token: i0__namespace.ComponentFactoryResolver }, { token: i0__namespace.ChangeDetectorRef }, { token: ChatClientService }, { token: EmojiInputService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    MessageInputComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: MessageInputComponent, selector: "stream-message-input", inputs: { isFileUploadEnabled: "isFileUploadEnabled", areMentionsEnabled: "areMentionsEnabled", mentionScope: "mentionScope", mentionAutocompleteItemTemplate: "mentionAutocompleteItemTemplate", commandAutocompleteItemTemplate: "commandAutocompleteItemTemplate", emojiPickerTemplate: "emojiPickerTemplate", mode: "mode", acceptedFileTypes: "acceptedFileTypes", isMultipleFileUploadEnabled: "isMultipleFileUploadEnabled", message: "message" }, outputs: { messageUpdate: "messageUpdate" }, providers: [AttachmentService, EmojiInputService], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "textareaAnchor", first: true, predicate: TextareaDirective, descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div\n  class=\"{{\n    mode === 'main' ? 'str-chat__input-flat' : 'str-chat__small-message-input'\n  }}\"\n  [class.str-chat__input-flat-has-attachments]=\"\n    (attachmentUploads$ | async)!.length > 0\n  \"\n  [class.str-chat__input-flat-quoted]=\"!!quotedMessage\"\n>\n  <div\n    data-testid=\"quoted-message-container\"\n    class=\"quoted-message-preview\"\n    *ngIf=\"quotedMessage\"\n  >\n    <div class=\"quoted-message-preview-header\">\n      <div>{{ \"streamChat.Reply to Message\" | translate }}</div>\n      <button\n        class=\"str-chat__square-button\"\n        data-testid=\"remove-quote\"\n        (click)=\"deselectMessageToQuote()\"\n        (keyup.enter)=\"deselectMessageToQuote()\"\n      >\n        <stream-icon\n          icon=\"close-no-outline\"\n          style=\"font-size: 10px; line-height: 10px\"\n        ></stream-icon>\n      </button>\n    </div>\n    <div class=\"quoted-message-preview-content\">\n      <stream-avatar\n        data-testid=\"qouted-message-avatar\"\n        class=\"str-chat-angular__avatar-host\"\n        [imageUrl]=\"quotedMessage?.user?.image\"\n        [name]=\"quotedMessage?.user?.name || quotedMessage?.user?.id\"\n        [size]=\"20\"\n      ></stream-avatar>\n      <div class=\"quoted-message-preview-content-inner\">\n        <stream-attachment-list\n          *ngIf=\"\n            quotedMessage?.attachments && quotedMessage?.attachments?.length\n          \"\n          [attachments]=\"quotedMessageAttachments\"\n          [messageId]=\"quotedMessage?.id\"\n        ></stream-attachment-list>\n        <div\n          data-testid=\"quoted-message-text\"\n          [innerHTML]=\"quotedMessage?.html || quotedMessage?.text\"\n        ></div>\n      </div>\n    </div>\n  </div>\n  <div class=\"str-chat__input-flat-wrapper\" style=\"width: 100%\">\n    <div\n      class=\"{{\n        mode === 'main'\n          ? 'str-chat__input-flat--textarea-wrapper'\n          : 'str-chat__small-message-input--textarea-wrapper'\n      }}\"\n    >\n      <stream-attachment-preview-list\n        class=\"rfu-image-previewer-angular-host\"\n      ></stream-attachment-preview-list>\n      <div class=\"rta str-chat__textarea str-chat-angular__textarea\">\n        <ng-container *ngIf=\"emojiPickerTemplate\">\n          <div\n            class=\"\n              str-chat__input-flat-emojiselect\n              str-chat-angular__emojiselect\n            \"\n          >\n            <ng-container\n              *ngTemplateOutlet=\"\n                emojiPickerTemplate;\n                context: { emojiInput$: emojiInputService.emojiInput$ }\n              \"\n            ></ng-container>\n          </div>\n        </ng-container>\n        <ng-template\n          *ngIf=\"canSendMessages; else notAllowed\"\n          streamTextarea\n          [(value)]=\"textareaValue\"\n          (valueChange)=\"typingStart$.next()\"\n          (send)=\"messageSent()\"\n          [componentRef]=\"textareaRef\"\n          (userMentions)=\"mentionedUsers = $event\"\n          [areMentionsEnabled]=\"areMentionsEnabled\"\n          [mentionAutocompleteItemTemplate]=\"mentionAutocompleteItemTemplate\"\n          [commandAutocompleteItemTemplate]=\"commandAutocompleteItemTemplate\"\n          [mentionScope]=\"mentionScope\"\n        ></ng-template>\n        <ng-template #notAllowed>\n          <textarea\n            disabled\n            rows=\"1\"\n            [value]=\"\n              (mode === 'thread'\n                ? 'You can\\'t send thread replies in this channel'\n                : 'streamChat.You can\\'t send messages in this channel'\n              ) | translate\n            \"\n            class=\"rta__textarea str-chat__textarea__textarea\"\n          ></textarea>\n        </ng-template>\n      </div>\n      <div\n        *ngIf=\"isFileUploadEnabled && isFileUploadAuthorized && canSendMessages\"\n        class=\"str-chat__fileupload-wrapper\"\n        data-testid=\"file-upload-button\"\n      >\n        <div class=\"str-chat__tooltip\">\n          {{ \"streamChat.Attach files\" | translate }}\n        </div>\n        <div class=\"rfu-file-upload-button\">\n          <label>\n            <input\n              #fileInput\n              type=\"file\"\n              class=\"rfu-file-input\"\n              data-testid=\"file-input\"\n              [accept]=\"accept\"\n              [multiple]=\"isMultipleFileUploadEnabled\"\n              (change)=\"filesSelected(fileInput.files)\"\n            />\n            <span class=\"str-chat__input-flat-fileupload\">\n              <stream-icon icon=\"file-upload\"></stream-icon>\n            </span>\n          </label>\n        </div>\n      </div>\n    </div>\n    <button\n      *ngIf=\"canSendMessages\"\n      data-testid=\"send-button\"\n      class=\"str-chat__send-button\"\n      (click)=\"messageSent()\"\n      (keyup.enter)=\"messageSent()\"\n    >\n      <stream-icon icon=\"send\"></stream-icon>\n    </button>\n  </div>\n</div>\n", components: [{ type: IconComponent, selector: "stream-icon", inputs: ["icon", "size"] }, { type: AvatarComponent, selector: "stream-avatar", inputs: ["name", "imageUrl", "size"] }, { type: AttachmentListComponent, selector: "stream-attachment-list", inputs: ["messageId", "attachments"] }, { type: AttachmentPreviewListComponent, selector: "stream-attachment-preview-list" }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: TextareaDirective, selector: "[streamTextarea]", inputs: ["componentRef", "areMentionsEnabled", "mentionAutocompleteItemTemplate", "mentionScope", "commandAutocompleteItemTemplate", "value"], outputs: ["valueChange", "send", "userMentions"] }], pipes: { "async": i6__namespace.AsyncPipe, "translate": i2__namespace.TranslatePipe } });
+    MessageInputComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: MessageInputComponent, selector: "stream-message-input", inputs: { isFileUploadEnabled: "isFileUploadEnabled", areMentionsEnabled: "areMentionsEnabled", mentionScope: "mentionScope", mentionAutocompleteItemTemplate: "mentionAutocompleteItemTemplate", commandAutocompleteItemTemplate: "commandAutocompleteItemTemplate", emojiPickerTemplate: "emojiPickerTemplate", mode: "mode", acceptedFileTypes: "acceptedFileTypes", isMultipleFileUploadEnabled: "isMultipleFileUploadEnabled", message: "message" }, outputs: { messageUpdate: "messageUpdate" }, providers: [AttachmentService, EmojiInputService], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "textareaAnchor", first: true, predicate: TextareaDirective, descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div\n  class=\"{{\n    mode === 'main' ? 'str-chat__input-flat' : 'str-chat__small-message-input'\n  }}\"\n  [class.str-chat__input-flat-has-attachments]=\"\n    (attachmentUploads$ | async)!.length > 0\n  \"\n  [class.str-chat__input-flat-quoted]=\"!!quotedMessage\"\n>\n  <div\n    data-testid=\"quoted-message-container\"\n    class=\"quoted-message-preview\"\n    *ngIf=\"quotedMessage\"\n  >\n    <div class=\"quoted-message-preview-header\">\n      <div>{{ \"streamChat.Reply to Message\" | translate }}</div>\n      <button\n        class=\"str-chat__square-button\"\n        data-testid=\"remove-quote\"\n        (click)=\"deselectMessageToQuote()\"\n        (keyup.enter)=\"deselectMessageToQuote()\"\n      >\n        <stream-icon\n          icon=\"close-no-outline\"\n          style=\"font-size: 10px; line-height: 10px\"\n        ></stream-icon>\n      </button>\n    </div>\n    <div class=\"quoted-message-preview-content\">\n      <stream-avatar\n        data-testid=\"qouted-message-avatar\"\n        class=\"str-chat-angular__avatar-host\"\n        [imageUrl]=\"quotedMessage?.user?.image\"\n        [name]=\"quotedMessage?.user?.name || quotedMessage?.user?.id\"\n        [size]=\"20\"\n      ></stream-avatar>\n      <div class=\"quoted-message-preview-content-inner\">\n        <stream-attachment-list\n          *ngIf=\"\n            quotedMessage?.attachments && quotedMessage?.attachments?.length\n          \"\n          [attachments]=\"quotedMessageAttachments\"\n          [messageId]=\"quotedMessage?.id\"\n        ></stream-attachment-list>\n        <div\n          data-testid=\"quoted-message-text\"\n          [innerHTML]=\"quotedMessage?.html || quotedMessage?.text\"\n        ></div>\n      </div>\n    </div>\n  </div>\n  <div class=\"str-chat__input-flat-wrapper\" style=\"width: 100%\">\n    <div\n      class=\"{{\n        mode === 'main'\n          ? 'str-chat__input-flat--textarea-wrapper'\n          : 'str-chat__small-message-input--textarea-wrapper'\n      }}\"\n    >\n      <stream-attachment-preview-list\n        class=\"rfu-image-previewer-angular-host\"\n      ></stream-attachment-preview-list>\n      <div class=\"rta str-chat__textarea str-chat-angular__textarea\">\n        <ng-container\n          *ngIf=\"emojiPickerTemplate && !isCooldownInProgress\"\n          data-testid=\"emoji-picker\"\n        >\n          <div\n            class=\"\n              str-chat__input-flat-emojiselect\n              str-chat-angular__emojiselect\n            \"\n          >\n            <ng-container\n              *ngTemplateOutlet=\"\n                emojiPickerTemplate;\n                context: { emojiInput$: emojiInputService.emojiInput$ }\n              \"\n            ></ng-container>\n          </div>\n        </ng-container>\n        <div\n          class=\"str-chat__input-flat-cooldown str-chat-angular__cooldown\"\n          *ngIf=\"isCooldownInProgress\"\n          data-testid=\"cooldown-timer\"\n        >\n          {{ cooldown$ | async }}\n        </div>\n        <ng-template\n          *ngIf=\"canSendMessages && !isCooldownInProgress; else notAllowed\"\n          streamTextarea\n          [(value)]=\"textareaValue\"\n          (valueChange)=\"typingStart$.next()\"\n          (send)=\"messageSent()\"\n          [componentRef]=\"textareaRef\"\n          (userMentions)=\"mentionedUsers = $event\"\n          [areMentionsEnabled]=\"areMentionsEnabled\"\n          [mentionAutocompleteItemTemplate]=\"mentionAutocompleteItemTemplate\"\n          [commandAutocompleteItemTemplate]=\"commandAutocompleteItemTemplate\"\n          [mentionScope]=\"mentionScope\"\n        ></ng-template>\n        <ng-template #notAllowed>\n          <textarea\n            disabled\n            rows=\"1\"\n            [value]=\"disabledTextareaText | translate\"\n            class=\"rta__textarea str-chat__textarea__textarea\"\n            data-testid=\"disabled-textarea\"\n          ></textarea>\n        </ng-template>\n      </div>\n      <div\n        *ngIf=\"\n          isFileUploadEnabled &&\n          isFileUploadAuthorized &&\n          canSendMessages &&\n          !isCooldownInProgress\n        \"\n        class=\"str-chat__fileupload-wrapper\"\n        data-testid=\"file-upload-button\"\n      >\n        <div class=\"str-chat__tooltip\">\n          {{ \"streamChat.Attach files\" | translate }}\n        </div>\n        <div class=\"rfu-file-upload-button\">\n          <label>\n            <input\n              #fileInput\n              type=\"file\"\n              class=\"rfu-file-input\"\n              data-testid=\"file-input\"\n              [accept]=\"accept\"\n              [multiple]=\"isMultipleFileUploadEnabled\"\n              (change)=\"filesSelected(fileInput.files)\"\n            />\n            <span class=\"str-chat__input-flat-fileupload\">\n              <stream-icon icon=\"file-upload\"></stream-icon>\n            </span>\n          </label>\n        </div>\n      </div>\n    </div>\n    <button\n      *ngIf=\"canSendMessages\"\n      data-testid=\"send-button\"\n      class=\"str-chat__send-button\"\n      (click)=\"messageSent()\"\n      (keyup.enter)=\"messageSent()\"\n    >\n      <stream-icon icon=\"send\"></stream-icon>\n    </button>\n  </div>\n</div>\n", components: [{ type: IconComponent, selector: "stream-icon", inputs: ["icon", "size"] }, { type: AvatarComponent, selector: "stream-avatar", inputs: ["name", "imageUrl", "size"] }, { type: AttachmentListComponent, selector: "stream-attachment-list", inputs: ["messageId", "attachments"] }, { type: AttachmentPreviewListComponent, selector: "stream-attachment-preview-list" }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: TextareaDirective, selector: "[streamTextarea]", inputs: ["componentRef", "areMentionsEnabled", "mentionAutocompleteItemTemplate", "mentionScope", "commandAutocompleteItemTemplate", "value"], outputs: ["valueChange", "send", "userMentions"] }], pipes: { "async": i6__namespace.AsyncPipe, "translate": i2__namespace.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0__namespace, type: MessageInputComponent, decorators: [{
                 type: i0.Component,
                 args: [{