stream-chat-angular 4.0.0-theming-v2.11 → 4.0.0

package/assets/version.d.ts

@@ -1 +1 @@
-export declare const version = "4.0.0-theming-v2.11";
+export declare const version = "4.0.0";

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

@@ -355,7 +355,7 @@
         return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
     }
 
-    var version = '4.0.0-theming-v2.11';
+    var version = '4.0.0';
 
     /**
      * The `NotificationService` can be used to add or remove notifications. By default the [`NotificationList`](../components/NotificationListComponent.mdx) component displays the currently active notifications.
@@ -475,7 +475,7 @@
                             this.chatClient = streamChat.StreamChat.getInstance(apiKey);
                             this.chatClient.devToken;
                             return [4 /*yield*/, this.ngZone.runOutsideAngular(function () { return __awaiter(_this, void 0, void 0, function () {
-                                    var user, _d, error_1;
+                                    var user, _d, error_1, sdkPrefix;
                                     return __generator(this, function (_e) {
                                         switch (_e.label) {
                                             case 0:
@@ -501,8 +501,10 @@
                                                 throw error_1;
                                             case 7:
                                                 this.userSubject.next(this.chatClient.user);
-                                                this.chatClient.setUserAgent("stream-chat-angular-" + version + "-" + this.chatClient.getUserAgent());
-                                                this.userSubject.next(this.chatClient.user);
+                                                sdkPrefix = 'stream-chat-angular';
+                                                if (!this.chatClient.getUserAgent().includes(sdkPrefix)) {
+                                                    this.chatClient.setUserAgent(sdkPrefix + "-" + version + "-" + this.chatClient.getUserAgent());
+                                                }
                                                 return [2 /*return*/];
                                         }
                                     });
@@ -703,11 +705,8 @@
                 var currentChannels = _this.channelsSubject.getValue() || [];
                 var newChannels = channels.filter(function (c) { return !currentChannels.find(function (channel) { return channel.cid === c.cid; }); });
                 var deletedChannels = currentChannels.filter(function (c) { return !(channels === null || channels === void 0 ? void 0 : channels.find(function (channel) { return channel.cid === c.cid; })); });
-                _this.addChannelsFromNotification(newChannels);
+                void _this.addChannelsFromNotification(newChannels);
                 _this.removeChannelsFromChannelList(deletedChannels.map(function (c) { return c.cid; }));
-                if (!newChannels.length && !deletedChannels.length) {
-                    _this.channelsSubject.next(channels);
-                }
             };
             this.messageListSetter = function (messages) {
                 _this.activeChannelMessagesSubject.next(messages);
@@ -1354,24 +1353,41 @@
         };
         ChannelService.prototype.handleNewMessageNotification = function (clientEvent) {
             if (clientEvent.event.channel) {
-                this.addChannelsFromNotification([clientEvent.event.channel]);
+                void this.addChannelsFromNotification([clientEvent.event.channel]);
             }
         };
         ChannelService.prototype.handleAddedToChannelNotification = function (clientEvent) {
             if (clientEvent.event.channel) {
-                this.addChannelsFromNotification([clientEvent.event.channel]);
+                void this.addChannelsFromNotification([clientEvent.event.channel]);
             }
         };
         ChannelService.prototype.addChannelsFromNotification = function (channelResponses) {
-            var _this = this;
-            var newChannels = [];
-            channelResponses.forEach(function (channelResponse) {
-                var channel = _this.chatClientService.chatClient.channel(channelResponse.type, channelResponse.id);
-                void channel.watch();
-                _this.watchForChannelEvents(channel);
-                newChannels.push(channel);
+            return __awaiter(this, void 0, void 0, function () {
+                var newChannels, watchRequests, currentChannels;
+                var _this = this;
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
+                        case 0:
+                            newChannels = [];
+                            watchRequests = [];
+                            channelResponses.forEach(function (channelResponse) {
+                                var channel = _this.chatClientService.chatClient.channel(channelResponse.type, channelResponse.id);
+                                watchRequests.push(channel.watch());
+                                newChannels.push(channel);
+                            });
+                            return [4 /*yield*/, Promise.all(watchRequests)];
+                        case 1:
+                            _h.sent();
+                            currentChannels = this.channelsSubject.getValue() || [];
+                            newChannels = newChannels.filter(function (newChannel) { return !currentChannels.find(function (c) { return c.cid === newChannel.cid; }); });
+                            if (newChannels.length > 0) {
+                                newChannels.forEach(function (c) { return _this.watchForChannelEvents(c); });
+                                this.channelsSubject.next(__spreadArray(__spreadArray([], __read(newChannels)), __read(currentChannels)));
+                            }
+                            return [2 /*return*/];
+                    }
+                });
             });
-            this.channelsSubject.next(__spreadArray(__spreadArray([], __read(newChannels)), __read((this.channelsSubject.getValue() || []))));
         };
         ChannelService.prototype.removeChannelsFromChannelList = function (cids) {
             var _a;
@@ -4897,6 +4913,7 @@
                 this.userMentionConfig,
                 this.slashCommandConfig,
             ];
+            this.themeVersion = this.themeService.themeVersion;
         }
         AutocompleteTextareaComponent.prototype.ngOnChanges = function (changes) {
             if (changes.areMentionsEnabled) {
@@ -4959,7 +4976,7 @@
             this.send.next();
         };
         AutocompleteTextareaComponent.prototype.adjustTextareaHeight = function () {
-            if (this.themeService.themeVersion === '2') {
+            if (this.themeVersion === '2') {
                 this.messageInput.nativeElement.style.height = '';
                 this.messageInput.nativeElement.style.height = this.messageInput.nativeElement.scrollHeight + "px";
             }
@@ -5021,7 +5038,7 @@
         return AutocompleteTextareaComponent;
     }());
     AutocompleteTextareaComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0__namespace, type: AutocompleteTextareaComponent, deps: [{ token: ChannelService }, { token: ChatClientService }, { token: TransliterationService }, { token: EmojiInputService }, { token: CustomTemplatesService }, { token: ThemeService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    AutocompleteTextareaComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: AutocompleteTextareaComponent, selector: "stream-autocomplete-textarea", inputs: { value: "value", placeholder: "placeholder", areMentionsEnabled: "areMentionsEnabled", mentionScope: "mentionScope" }, outputs: { valueChange: "valueChange", send: "send", userMentions: "userMentions" }, host: { properties: { "class": "this.class" } }, viewQueries: [{ propertyName: "messageInput", first: true, predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<textarea\n  [value]=\"value || ''\"\n  autofocus\n  data-testid=\"textarea\"\n  #input\n  placeholder=\"{{ placeholder | translate }}\"\n  class=\"\n    rta__textarea\n    str-chat__textarea__textarea\n    str-chat__angular-textarea\n    str-chat__message-textarea\n  \"\n  rows=\"1\"\n  (input)=\"inputChanged()\"\n  (keydown.enter)=\"sent($event)\"\n  [mentionConfig]=\"autocompleteConfig\"\n  (searchTerm)=\"autcompleteSearchTermChanged($event)\"\n  [mentionListTemplate]=\"autocompleteItem\"\n  (blur)=\"inputLeft()\"\n></textarea>\n<ng-template #autocompleteItem let-item=\"item\">\n  <div class=\"rta rta__item str-chat__emojisearch__item\" [ngSwitch]=\"item.type\">\n    <div class=\"rta__entity\" *ngSwitchCase=\"'mention'\">\n      <ng-container\n        *ngTemplateOutlet=\"\n          mentionAutocompleteItemTemplate || defaultMentionTemplate;\n          context: { item: item }\n        \"\n      ></ng-container>\n    </div>\n    <div class=\"rta__entity\" *ngSwitchCase=\"'command'\">\n      <ng-container\n        *ngTemplateOutlet=\"\n          commandAutocompleteItemTemplate || defaultCommandTemplate;\n          context: { item: item }\n        \"\n      ></ng-container>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #defaultCommandTemplate let-item=\"item\">\n  <div class=\"str-chat__slash-command\">\n    <span class=\"str-chat__slash-command-header\">\n      <strong\n        class=\"str-chat__slash-command-name\"\n        data-testclass=\"command-name\"\n        >{{ item.name }}</strong\n      >\n      <span class=\"str-chat__slash-command-args\"\n        >/{{ item.name }} {{ item.args }}</span\n      >\n    </span>\n    <br />\n  </div>\n</ng-template>\n\n<ng-template #defaultMentionTemplate let-item=\"item\">\n  <div class=\"str-chat__user-item\">\n    <stream-avatar-placeholder\n      data-testclass=\"avatar\"\n      class=\"str-chat__avatar str-chat__avatar--circle\"\n      style=\"height: 56px\"\n      [size]=\"56\"\n      [imageUrl]=\"item.image || item.user?.image\"\n      [name]=\"item.autocompleteLabel\"\n      type=\"user\"\n      location=\"autocomplete-item\"\n      [user]=\"item.user || item\"\n    ></stream-avatar-placeholder>\n    <span data-testclass=\"username\" class=\"str-chat__user-item--name\">{{\n      item.autocompleteLabel\n    }}</span>\n    <div class=\"str-chat__user-item-at\">@</div>\n  </div>\n</ng-template>\n", components: [{ type: AvatarPlaceholderComponent, selector: "stream-avatar-placeholder", inputs: ["name", "imageUrl", "size", "location", "channel", "user", "type"] }], directives: [{ type: i8__namespace$1.MentionDirective, selector: "[mention], [mentionConfig]", inputs: ["mentionConfig", "mention", "mentionListTemplate"], outputs: ["searchTerm", "itemSelected", "opened", "closed"] }, { type: i7__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i7__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i7__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "translate": i8__namespace.TranslatePipe } });
+    AutocompleteTextareaComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: AutocompleteTextareaComponent, selector: "stream-autocomplete-textarea", inputs: { value: "value", placeholder: "placeholder", areMentionsEnabled: "areMentionsEnabled", mentionScope: "mentionScope" }, outputs: { valueChange: "valueChange", send: "send", userMentions: "userMentions" }, host: { properties: { "class": "this.class" } }, viewQueries: [{ propertyName: "messageInput", first: true, predicate: ["input"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<textarea\n  [value]=\"value || ''\"\n  autofocus\n  data-testid=\"textarea\"\n  #input\n  placeholder=\"{{ placeholder | translate }}\"\n  class=\"\n    rta__textarea\n    str-chat__textarea__textarea\n    str-chat__angular-textarea\n    str-chat__message-textarea\n  \"\n  rows=\"1\"\n  (input)=\"inputChanged()\"\n  (keydown.enter)=\"sent($event)\"\n  [mentionConfig]=\"autocompleteConfig\"\n  (searchTerm)=\"autcompleteSearchTermChanged($event)\"\n  [mentionListTemplate]=\"autocompleteItem\"\n  (blur)=\"inputLeft()\"\n></textarea>\n<ng-template #autocompleteItem let-item=\"item\">\n  <div class=\"rta rta__item str-chat__emojisearch__item\" [ngSwitch]=\"item.type\">\n    <div class=\"rta__entity\" *ngSwitchCase=\"'mention'\">\n      <ng-container\n        *ngTemplateOutlet=\"\n          mentionAutocompleteItemTemplate || defaultMentionTemplate;\n          context: { item: item }\n        \"\n      ></ng-container>\n    </div>\n    <div class=\"rta__entity\" *ngSwitchCase=\"'command'\">\n      <ng-container\n        *ngTemplateOutlet=\"\n          commandAutocompleteItemTemplate || defaultCommandTemplate;\n          context: { item: item }\n        \"\n      ></ng-container>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #defaultCommandTemplate let-item=\"item\">\n  <div class=\"str-chat__slash-command\">\n    <span class=\"str-chat__slash-command-header\">\n      <strong\n        class=\"str-chat__slash-command-name\"\n        data-testclass=\"command-name\"\n        >{{ item.name }}</strong\n      >\n      <span class=\"str-chat__slash-command-args\"\n        >/{{ item.name }} {{ item.args }}</span\n      >\n    </span>\n    <br />\n  </div>\n</ng-template>\n\n<ng-template #defaultMentionTemplate let-item=\"item\">\n  <div class=\"str-chat__user-item\">\n    <stream-avatar-placeholder\n      data-testclass=\"avatar\"\n      class=\"str-chat__avatar str-chat__avatar--circle\"\n      [style]=\"'height: ' + themeVersion === '2' ? 56 : 20 + 'px'\"\n      [size]=\"themeVersion === '2' ? 56 : 20\"\n      [imageUrl]=\"item.image || item.user?.image\"\n      [name]=\"item.autocompleteLabel\"\n      type=\"user\"\n      location=\"autocomplete-item\"\n      [user]=\"item.user || item\"\n    ></stream-avatar-placeholder>\n    <span data-testclass=\"username\" class=\"str-chat__user-item--name\">{{\n      item.autocompleteLabel\n    }}</span>\n    <div *ngIf=\"themeVersion === '2'\" class=\"str-chat__user-item-at\">@</div>\n  </div>\n</ng-template>\n", components: [{ type: AvatarPlaceholderComponent, selector: "stream-avatar-placeholder", inputs: ["name", "imageUrl", "size", "location", "channel", "user", "type"] }], directives: [{ type: i8__namespace$1.MentionDirective, selector: "[mention], [mentionConfig]", inputs: ["mentionConfig", "mention", "mentionListTemplate"], outputs: ["searchTerm", "itemSelected", "opened", "closed"] }, { type: i7__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i7__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i7__namespace.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i7__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i8__namespace.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0__namespace, type: AutocompleteTextareaComponent, decorators: [{
                 type: i0.Component,
                 args: [{