@c8y/ngx-components 1023.4.6 → 1023.6.3

package/fesm2022/c8y-ngx-components-messaging-management.mjs

@@ -108,10 +108,10 @@ class MessagingNamespacesService extends Service {
             return [];
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingNamespacesService, deps: [{ token: i1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingNamespacesService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingNamespacesService, deps: [{ token: i1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingNamespacesService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingNamespacesService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingNamespacesService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: i1.FetchClient }] });
@@ -147,10 +147,10 @@ class MessagingManagementGuard {
         this.cachedResult = hasRequiredRoles && featureEnabled && microserviceSubscribed;
         return this.cachedResult;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementGuard, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementGuard, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementGuard, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementGuard, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementGuard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementGuard, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -194,10 +194,10 @@ class MessagingNavigatorNodeFactory {
     get() {
         return this.navigatorNode$;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingNavigatorNodeFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingNavigatorNodeFactory, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingNavigatorNodeFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingNavigatorNodeFactory, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingNavigatorNodeFactory, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingNavigatorNodeFactory, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
@@ -221,10 +221,10 @@ class BacklogQuotaLimitPipe {
             return formatNumber(value, this.locale);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: BacklogQuotaLimitPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.3", ngImport: i0, type: BacklogQuotaLimitPipe, isStandalone: true, name: "backlogQuotaLimit" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: BacklogQuotaLimitPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: BacklogQuotaLimitPipe, isStandalone: true, name: "backlogQuotaLimit" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: BacklogQuotaLimitPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: BacklogQuotaLimitPipe, decorators: [{
             type: Pipe,
             args: [{ name: 'backlogQuotaLimit', standalone: true }]
         }] });
@@ -285,10 +285,10 @@ class UsageComponent {
             return 'success';
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: UsageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.3", type: UsageComponent, isStandalone: true, selector: "app-usage", inputs: { count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, limit: { classPropertyName: "limit", publicName: "limit", isSignal: true, isRequired: false, transformFunction: null }, percentage: { classPropertyName: "percentage", publicName: "percentage", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "d-contents" }, ngImport: i0, template: "<div\n  class=\"tag no-pointer\"\n  [ngClass]=\"statusMap[status()]\"\n  *ngIf=\"usage() !== null\"\n>\n  <i\n    class=\"text-danger m-r-4 text-12\"\n    c8yIcon=\"exclamation-circle\"\n    *ngIf=\"status() === 'danger'\"\n  ></i>\n  <span>\n    {{ usageToDisplay | translate: { percentageOfQuota: (usage() | percent: '1.0-2') } }}\n  </span>\n</div>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: PercentPipe, name: "percent" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: UsageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.15", type: UsageComponent, isStandalone: true, selector: "app-usage", inputs: { count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, limit: { classPropertyName: "limit", publicName: "limit", isSignal: true, isRequired: false, transformFunction: null }, percentage: { classPropertyName: "percentage", publicName: "percentage", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "d-contents" }, ngImport: i0, template: "<div\n  class=\"tag no-pointer\"\n  [ngClass]=\"statusMap[status()]\"\n  *ngIf=\"usage() !== null\"\n>\n  <i\n    class=\"text-danger m-r-4 text-12\"\n    c8yIcon=\"exclamation-circle\"\n    *ngIf=\"status() === 'danger'\"\n  ></i>\n  <span>\n    {{ usageToDisplay | translate: { percentageOfQuota: (usage() | percent: '1.0-2') } }}\n  </span>\n</div>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: PercentPipe, name: "percent" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: UsageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: UsageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-usage', standalone: true, imports: [IconDirective, NgIf, NgClass, IconDirective, C8yTranslatePipe, PercentPipe], host: { class: 'd-contents' }, template: "<div\n  class=\"tag no-pointer\"\n  [ngClass]=\"statusMap[status()]\"\n  *ngIf=\"usage() !== null\"\n>\n  <i\n    class=\"text-danger m-r-4 text-12\"\n    c8yIcon=\"exclamation-circle\"\n    *ngIf=\"status() === 'danger'\"\n  ></i>\n  <span>\n    {{ usageToDisplay | translate: { percentageOfQuota: (usage() | percent: '1.0-2') } }}\n  </span>\n</div>\n" }]
         }] });
@@ -312,10 +312,10 @@ class NamespaceItemCardComponent {
          */
         this.serviceLabel = '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: NamespaceItemCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: NamespaceItemCardComponent, isStandalone: true, selector: "app-namespace-item-card", inputs: { serviceLabel: "serviceLabel", limit: "limit", dataType: "dataType", value: "value" }, host: { classAttribute: "card m-b-0 fit-w" }, ngImport: i0, template: "<div class=\"card-block text-default visible-xs text-center p-b-0\">\n  <span class=\"text-12 text-uppercase text-muted\">\n    {{ serviceLabel | translate }}\n  </span>\n</div>\n<div\n  class=\"card-block text-default p-t-sm-48\"\n  [ngClass]=\"{\n    'p-b-sm-48': limit === 0\n  }\"\n>\n  <div class=\"d-flex fit-w a-i-center gap-8 j-c-center\">\n    <i\n      class=\"icon-32 c8y-icon-duocolor\"\n      [c8yIcon]=\"ITEM_DETAILS[dataType].icon\"\n    ></i>\n    <span\n      class=\"h1\"\n      data-cy=\"namespace-item-card--value\"\n    >\n      {{ value | number }}\n    </span>\n    <span\n      class=\"a-s-baseline text-14 text-medium text-truncate\"\n      title=\"{{ ITEM_DETAILS[dataType].title | translate }}\"\n      data-cy=\"namespace-item-card--label\"\n    >\n      {{ ITEM_DETAILS[dataType].title | translate }}\n    </span>\n  </div>\n</div>\n@if (dataType === DATA_TYPE.topics && limit !== 0) {\n  <div class=\"card-footer d-flex gap-16 j-c-center a-i-center\">\n    <span\n      class=\"tag tag--default no-pointer\"\n      data-cy=\"namespace-item-card--limit\"\n    >\n      {{ topicsLimitLabel | translate: { backlogQuotaLimit: limit | backlogQuotaLimit } }}\n    </span>\n    <app-usage\n      data-cy=\"namespace-item-card--usage\"\n      [count]=\"value\"\n      [limit]=\"limit\"\n    ></app-usage>\n  </div>\n}\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: C8yTranslateModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: UsageComponent, selector: "app-usage", inputs: ["count", "limit", "percentage"] }, { kind: "pipe", type: i1$2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: BacklogQuotaLimitPipe, name: "backlogQuotaLimit" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NamespaceItemCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: NamespaceItemCardComponent, isStandalone: true, selector: "app-namespace-item-card", inputs: { serviceLabel: "serviceLabel", limit: "limit", dataType: "dataType", value: "value" }, host: { classAttribute: "card m-b-0 fit-w" }, ngImport: i0, template: "<div class=\"card-block text-default visible-xs text-center p-b-0\">\n  <span class=\"text-12 text-uppercase text-muted\">\n    {{ serviceLabel | translate }}\n  </span>\n</div>\n<div\n  class=\"card-block text-default p-t-sm-48\"\n  [ngClass]=\"{\n    'p-b-sm-48': limit === 0\n  }\"\n>\n  <div class=\"d-flex fit-w a-i-center gap-8 j-c-center\">\n    <i\n      class=\"icon-32 c8y-icon-duocolor\"\n      [c8yIcon]=\"ITEM_DETAILS[dataType].icon\"\n    ></i>\n    <span\n      class=\"h1\"\n      data-cy=\"namespace-item-card--value\"\n    >\n      {{ value | number }}\n    </span>\n    <span\n      class=\"a-s-baseline text-14 text-medium text-truncate\"\n      title=\"{{ ITEM_DETAILS[dataType].title | translate }}\"\n      data-cy=\"namespace-item-card--label\"\n    >\n      {{ ITEM_DETAILS[dataType].title | translate }}\n    </span>\n  </div>\n</div>\n@if (dataType === DATA_TYPE.topics && limit !== 0) {\n  <div class=\"card-footer d-flex gap-16 j-c-center a-i-center\">\n    <span\n      class=\"tag tag--default no-pointer\"\n      data-cy=\"namespace-item-card--limit\"\n    >\n      {{ topicsLimitLabel | translate: { backlogQuotaLimit: limit | backlogQuotaLimit } }}\n    </span>\n    <app-usage\n      data-cy=\"namespace-item-card--usage\"\n      [count]=\"value\"\n      [limit]=\"limit\"\n    ></app-usage>\n  </div>\n}\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: C8yTranslateModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: UsageComponent, selector: "app-usage", inputs: ["count", "limit", "percentage"] }, { kind: "pipe", type: i1$2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: BacklogQuotaLimitPipe, name: "backlogQuotaLimit" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: NamespaceItemCardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NamespaceItemCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-namespace-item-card', standalone: true, imports: [IconDirective, C8yTranslateModule, CommonModule, BacklogQuotaLimitPipe, UsageComponent], host: { class: 'card m-b-0 fit-w' }, template: "<div class=\"card-block text-default visible-xs text-center p-b-0\">\n  <span class=\"text-12 text-uppercase text-muted\">\n    {{ serviceLabel | translate }}\n  </span>\n</div>\n<div\n  class=\"card-block text-default p-t-sm-48\"\n  [ngClass]=\"{\n    'p-b-sm-48': limit === 0\n  }\"\n>\n  <div class=\"d-flex fit-w a-i-center gap-8 j-c-center\">\n    <i\n      class=\"icon-32 c8y-icon-duocolor\"\n      [c8yIcon]=\"ITEM_DETAILS[dataType].icon\"\n    ></i>\n    <span\n      class=\"h1\"\n      data-cy=\"namespace-item-card--value\"\n    >\n      {{ value | number }}\n    </span>\n    <span\n      class=\"a-s-baseline text-14 text-medium text-truncate\"\n      title=\"{{ ITEM_DETAILS[dataType].title | translate }}\"\n      data-cy=\"namespace-item-card--label\"\n    >\n      {{ ITEM_DETAILS[dataType].title | translate }}\n    </span>\n  </div>\n</div>\n@if (dataType === DATA_TYPE.topics && limit !== 0) {\n  <div class=\"card-footer d-flex gap-16 j-c-center a-i-center\">\n    <span\n      class=\"tag tag--default no-pointer\"\n      data-cy=\"namespace-item-card--limit\"\n    >\n      {{ topicsLimitLabel | translate: { backlogQuotaLimit: limit | backlogQuotaLimit } }}\n    </span>\n    <app-usage\n      data-cy=\"namespace-item-card--usage\"\n      [count]=\"value\"\n      [limit]=\"limit\"\n    ></app-usage>\n  </div>\n}\n" }]
         }], propDecorators: { serviceLabel: [{
@@ -342,10 +342,10 @@ class NamespaceItemComponent {
         this.icon = NAMESPACE_PROPS[name]?.icon;
         this.namespaceLabel = this.translateService.instant(NAMESPACE_PROPS[name]?.label) || name;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: NamespaceItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.3", type: NamespaceItemComponent, isStandalone: true, selector: "app-namespace-item", inputs: { _namespaceName: ["namespaceName", "_namespaceName"], namespace: "namespace", policies: "policies" }, ngImport: i0, template: "<div class=\"d-flex-sm d-col-xs p-t-24 p-l-16 p-r-16 m-0 bg-level-1\">\n  <div\n    class=\"col-sm-3 m-b-24 col-xs-12 d-flex gap-16 text-default a-i-center j-c-center a-s-stretch\"\n  >\n    <div class=\"text-center d-col\">\n      <i\n        class=\"m-b-8 icon-40 c8y-icon-duocolor\"\n        [c8yIcon]=\"icon\"\n      ></i>\n      <span class=\"tag tag--info\">{{ 'Service' | translate }}</span>\n    </div>\n    <span\n      class=\"h4\"\n      data-cy=\"namespace-item--namespace-label\"\n    >\n      {{ namespaceLabel }}\n    </span>\n  </div>\n  <div class=\"col-sm-3 m-b-24 col-xs-12 a-i-stretch d-flex\">\n    <app-namespace-item-card\n      [serviceLabel]=\"namespaceLabel\"\n      [dataType]=\"'topics'\"\n      [limit]=\"namespace?.topics?.limit\"\n      [value]=\"namespace?.topics?.count\"\n    ></app-namespace-item-card>\n  </div>\n  <div class=\"col-sm-3 m-b-24 col-xs-12 a-i-stretch d-flex\">\n    <app-namespace-item-card\n      [serviceLabel]=\"namespaceLabel\"\n      [dataType]=\"'publishers'\"\n      [value]=\"namespace?.publishers?.count\"\n    ></app-namespace-item-card>\n  </div>\n  <div class=\"col-sm-3 m-b-24 col-xs-12 a-i-stretch d-flex\">\n    <app-namespace-item-card\n      [serviceLabel]=\"namespaceLabel\"\n      [dataType]=\"'subscribers'\"\n      [value]=\"namespace?.subscribers?.count\"\n    ></app-namespace-item-card>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: NamespaceItemCardComponent, selector: "app-namespace-item-card", inputs: ["serviceLabel", "limit", "dataType", "value"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NamespaceItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: NamespaceItemComponent, isStandalone: true, selector: "app-namespace-item", inputs: { _namespaceName: ["namespaceName", "_namespaceName"], namespace: "namespace", policies: "policies" }, ngImport: i0, template: "<div class=\"d-flex-sm d-col-xs p-t-24 p-l-16 p-r-16 m-0 bg-level-1\">\n  <div\n    class=\"col-sm-3 m-b-24 col-xs-12 d-flex gap-16 text-default a-i-center j-c-center a-s-stretch\"\n  >\n    <div class=\"text-center d-col\">\n      <i\n        class=\"m-b-8 icon-40 c8y-icon-duocolor\"\n        [c8yIcon]=\"icon\"\n      ></i>\n      <span class=\"tag tag--info\">{{ 'Service' | translate }}</span>\n    </div>\n    <span\n      class=\"h4\"\n      data-cy=\"namespace-item--namespace-label\"\n    >\n      {{ namespaceLabel }}\n    </span>\n  </div>\n  <div class=\"col-sm-3 m-b-24 col-xs-12 a-i-stretch d-flex\">\n    <app-namespace-item-card\n      [serviceLabel]=\"namespaceLabel\"\n      [dataType]=\"'topics'\"\n      [limit]=\"namespace?.topics?.limit\"\n      [value]=\"namespace?.topics?.count\"\n    ></app-namespace-item-card>\n  </div>\n  <div class=\"col-sm-3 m-b-24 col-xs-12 a-i-stretch d-flex\">\n    <app-namespace-item-card\n      [serviceLabel]=\"namespaceLabel\"\n      [dataType]=\"'publishers'\"\n      [value]=\"namespace?.publishers?.count\"\n    ></app-namespace-item-card>\n  </div>\n  <div class=\"col-sm-3 m-b-24 col-xs-12 a-i-stretch d-flex\">\n    <app-namespace-item-card\n      [serviceLabel]=\"namespaceLabel\"\n      [dataType]=\"'subscribers'\"\n      [value]=\"namespace?.subscribers?.count\"\n    ></app-namespace-item-card>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: NamespaceItemCardComponent, selector: "app-namespace-item-card", inputs: ["serviceLabel", "limit", "dataType", "value"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: NamespaceItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NamespaceItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-namespace-item', standalone: true, imports: [CommonModule, IconDirective, NamespaceItemCardComponent, C8yTranslatePipe], template: "<div class=\"d-flex-sm d-col-xs p-t-24 p-l-16 p-r-16 m-0 bg-level-1\">\n  <div\n    class=\"col-sm-3 m-b-24 col-xs-12 d-flex gap-16 text-default a-i-center j-c-center a-s-stretch\"\n  >\n    <div class=\"text-center d-col\">\n      <i\n        class=\"m-b-8 icon-40 c8y-icon-duocolor\"\n        [c8yIcon]=\"icon\"\n      ></i>\n      <span class=\"tag tag--info\">{{ 'Service' | translate }}</span>\n    </div>\n    <span\n      class=\"h4\"\n      data-cy=\"namespace-item--namespace-label\"\n    >\n      {{ namespaceLabel }}\n    </span>\n  </div>\n  <div class=\"col-sm-3 m-b-24 col-xs-12 a-i-stretch d-flex\">\n    <app-namespace-item-card\n      [serviceLabel]=\"namespaceLabel\"\n      [dataType]=\"'topics'\"\n      [limit]=\"namespace?.topics?.limit\"\n      [value]=\"namespace?.topics?.count\"\n    ></app-namespace-item-card>\n  </div>\n  <div class=\"col-sm-3 m-b-24 col-xs-12 a-i-stretch d-flex\">\n    <app-namespace-item-card\n      [serviceLabel]=\"namespaceLabel\"\n      [dataType]=\"'publishers'\"\n      [value]=\"namespace?.publishers?.count\"\n    ></app-namespace-item-card>\n  </div>\n  <div class=\"col-sm-3 m-b-24 col-xs-12 a-i-stretch d-flex\">\n    <app-namespace-item-card\n      [serviceLabel]=\"namespaceLabel\"\n      [dataType]=\"'subscribers'\"\n      [value]=\"namespace?.subscribers?.count\"\n    ></app-namespace-item-card>\n  </div>\n</div>\n" }]
         }], propDecorators: { _namespaceName: [{
@@ -380,10 +380,10 @@ class NamespaceListComponent {
             this.loading = false;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: NamespaceListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.3", type: NamespaceListComponent, isStandalone: true, selector: "app-namespace-list", ngImport: i0, template: "<c8y-title>{{ 'Messaging service' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'monitoring'\"\n    [label]=\"'Monitoring' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Messaging service' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <li>\n    <a\n      class=\"btn btn-link\"\n      title=\"{{ 'Reload' | translate }}\"\n      (click)=\"reload()\"\n    >\n      <i\n        c8yIcon=\"refresh\"\n        [ngClass]=\"{ 'icon-spin': loading }\"\n      ></i>\n      {{ 'Reload' | translate }}\n    </a>\n  </li>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/monitoring/#messaging-service\"></c8y-help>\n\n<div\n  class=\"interact-grid\"\n  *ngIf=\"!loading; else loadingTemplate\"\n>\n  <a\n    class=\"card\"\n    *ngFor=\"let namespace of namespacesDetails\"\n    [routerLink]=\"['namespace', namespace.id]\"\n  >\n    <app-namespace-item\n      [namespaceName]=\"namespace.id\"\n      [namespace]=\"namespace.namespace\"\n    ></app-namespace-item>\n  </a>\n</div>\n\n<ng-template #loadingTemplate>\n  <c8y-loading></c8y-loading>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: HeaderModule }, { kind: "component", type: i1$2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "ngmodule", type: HelpModule }, { kind: "component", type: i1$2.HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "ngmodule", type: C8yTranslateModule }, { kind: "component", type: NamespaceItemComponent, selector: "app-namespace-item", inputs: ["namespaceName", "namespace", "policies"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: BreadcrumbModule }, { kind: "component", type: i1$2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i1$2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: i1$2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NamespaceListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: NamespaceListComponent, isStandalone: true, selector: "app-namespace-list", ngImport: i0, template: "<c8y-title>{{ 'Messaging service' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'monitoring'\"\n    [label]=\"'Monitoring' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Messaging service' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <li>\n    <a\n      class=\"btn btn-link\"\n      title=\"{{ 'Reload' | translate }}\"\n      (click)=\"reload()\"\n    >\n      <i\n        c8yIcon=\"refresh\"\n        [ngClass]=\"{ 'icon-spin': loading }\"\n      ></i>\n      {{ 'Reload' | translate }}\n    </a>\n  </li>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/monitoring/#messaging-service\"></c8y-help>\n\n<div\n  class=\"interact-grid\"\n  *ngIf=\"!loading; else loadingTemplate\"\n>\n  <a\n    class=\"card\"\n    *ngFor=\"let namespace of namespacesDetails\"\n    [routerLink]=\"['namespace', namespace.id]\"\n  >\n    <app-namespace-item\n      [namespaceName]=\"namespace.id\"\n      [namespace]=\"namespace.namespace\"\n    ></app-namespace-item>\n  </a>\n</div>\n\n<ng-template #loadingTemplate>\n  <c8y-loading></c8y-loading>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: HeaderModule }, { kind: "component", type: i1$2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "ngmodule", type: HelpModule }, { kind: "component", type: i1$2.HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "ngmodule", type: C8yTranslateModule }, { kind: "component", type: NamespaceItemComponent, selector: "app-namespace-item", inputs: ["namespaceName", "namespace", "policies"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: BreadcrumbModule }, { kind: "component", type: i1$2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i1$2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: i1$2.C8yTranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: NamespaceListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NamespaceListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-namespace-list', imports: [
                         CommonModule,
@@ -505,10 +505,10 @@ class TimeToLivePipe {
             return this.translateService.instant(gettext('{{seconds}} seconds'), { seconds });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TimeToLivePipe, deps: [{ token: i1$3.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.3", ngImport: i0, type: TimeToLivePipe, isStandalone: true, name: "timeToLive" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TimeToLivePipe, deps: [{ token: i1$3.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: TimeToLivePipe, isStandalone: true, name: "timeToLive" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TimeToLivePipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TimeToLivePipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'timeToLive',
@@ -552,10 +552,10 @@ class MessagingTopicsService extends Service {
         }
         return null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingTopicsService, deps: [{ token: i1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingTopicsService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingTopicsService, deps: [{ token: i1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingTopicsService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingTopicsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingTopicsService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: i1.FetchClient }] });
@@ -661,10 +661,10 @@ class TopicsDataGridService {
             return topicFilters;
         }, topicFilters);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicsDataGridService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicsDataGridService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicsDataGridService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicsDataGridService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicsDataGridService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicsDataGridService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -706,10 +706,10 @@ class TopicListViewComponent {
             .pipe(takeUntilDestroyed(this.destroyRef))
             .subscribe(() => this.refresh.emit());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicListViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: TopicListViewComponent, isStandalone: true, selector: "app-topic-list-view", ngImport: i0, template: "<c8y-title>{{ namespaceLabel$ | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'monitoring'\"\n    [label]=\"'Monitoring' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [label]=\"'Messaging service' | translate\"\n    [path]=\"'/monitoring/messaging-service'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"namespaceLabel$ | async\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <a\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"refresh.emit()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': loading$ | async }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </a>\n</c8y-action-bar-item>\n\n<div class=\"card content-fullpage d-flex d-col\">\n  <div class=\"bg-level-1 separator-bottom flex-no-shrink\">\n    <div\n      class=\"card-block\"\n      style=\"min-height: 172px\"\n    >\n      <div\n        class=\"col-md-4 m-b-24 col-xs-12 d-flex p-t-24 gap-16 text-default a-i-center a-s-stretch\"\n      >\n        <div class=\"text-center d-col\">\n          <i\n            class=\"m-b-8 icon-40 c8y-icon-duocolor\"\n            [c8yIcon]=\"icon$ | async\"\n          ></i>\n          <span class=\"tag tag--info\">{{ 'Service' | translate }}</span>\n        </div>\n        <span class=\"h4 text-break-all\">{{ namespaceLabel$ | async }}</span>\n      </div>\n      <div class=\"col-md-4\">\n        <fieldset class=\"c8y-fieldset c8y-fieldset--lg\">\n          <legend>\n            {{ 'Service usage/limits' | translate }}\n          </legend>\n\n          @if (loading$ | async) {\n            <c8y-loading></c8y-loading>\n          } @else {\n            @let namespace = (namespaceDetails$ | async)?.namespace;\n            @if (namespace) {\n              <ul class=\"list-unstyled small animated fadeIn\">\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-list-view--topics\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Topics' | translate }}</label>\n                  @if (namespace?.topics?.limit !== 0) {\n                    <app-usage\n                      [count]=\"namespace?.topics?.count\"\n                      [limit]=\"namespace?.topics?.limit\"\n                    ></app-usage>\n                    <span class=\"m-l-16\">\n                      {{ namespace?.topics?.count | number }} /\n                      {{ namespace?.topics?.limit | backlogQuotaLimit }}\n                    </span>\n                  } @else {\n                    <span class=\"m-l-16\">{{ namespace?.topics?.count | number }}</span>\n                  }\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-list-view--subscribers\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Subscribers' | translate }}</label>\n                  <span class=\"m-l-16\">\n                    {{ namespace?.subscribers?.count | number }}\n                  </span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n                  data-cy=\"topic-list-view--publishers\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Publishers' | translate }}</label>\n                  <span class=\"m-l-16\">\n                    {{ namespace?.publishers?.count | number }}\n                  </span>\n                </li>\n              </ul>\n            }\n          }\n        </fieldset>\n      </div>\n      <div class=\"col-md-4\">\n        <fieldset class=\"c8y-fieldset c8y-fieldset--lg\">\n          <legend>{{ 'Service message backlog limits' | translate }}</legend>\n\n          @if (loading$ | async) {\n            <c8y-loading></c8y-loading>\n          } @else {\n            @let policies = (namespaceDetails$ | async)?.policies;\n            @if (policies) {\n              <ul class=\"list-unstyled small animated fadeIn\">\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-list-view--backlog-quota\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Backlog quota (per topic)' | translate }}\n                  </label>\n                  <span\n                    title=\"{{\n                      policies?.backlogQuota?.limit > 0\n                        ? (policies.backlogQuota.limit | bytes: 0 : true)\n                        : '-'\n                    }}\"\n                  >\n                    {{\n                      policies?.backlogQuota?.limit > 0\n                        ? (policies.backlogQuota.limit | bytes: 0)\n                        : '-'\n                    }}\n                  </span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n                  data-cy=\"topic-list-view--backlog-ttl\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Backlog time to live (TTL)' | translate }}\n                  </label>\n                  <span>{{ policies?.messageTTL | timeToLive }}</span>\n                </li>\n              </ul>\n            }\n          }\n        </fieldset>\n      </div>\n    </div>\n  </div>\n\n  <c8y-data-grid\n    class=\"d-contents\"\n    [title]=\"tableTitle | translate\"\n    [loadingItemsLabel]=\"loadingItemsLabel | translate\"\n    [loadMoreItemsLabel]=\"loadMoreItemsLabel | translate\"\n    [columns]=\"columns\"\n    [pagination]=\"pagination\"\n    [serverSideDataCallback]=\"serverSideDataCallback\"\n    [refresh]=\"refresh\"\n    [hideReload]=\"true\"\n  >\n    <c8y-ui-empty-state\n      [icon]=\"stats?.size > 0 ? 'search' : 'day-view'\"\n      [title]=\"stats?.size > 0 ? (noResultsMessage | translate) : (noDataMessage | translate)\"\n      [subtitle]=\"stats?.size > 0 ? (noResultsSubtitle | translate) : (noDataSubtitle | translate)\"\n      *emptyStateContext=\"let stats\"\n      [horizontal]=\"stats?.size > 0\"\n    ></c8y-ui-empty-state>\n\n    <c8y-column name=\"name\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <a\n          title=\"{{ context.value }}\"\n          [routerLink]=\"['topic', context.item.id]\"\n        >\n          {{ context.value }}\n        </a>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"msgRateIn\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"msgRateOut\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"subscribers\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <a\n          title=\"{{ context.value | number }}\"\n          [routerLink]=\"['topic', context.item.id, 'subscribers']\"\n        >\n          {{ context.value | number }}\n        </a>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"backlogSize\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | bytes: 2 : true }}\">\n          {{ context.value | bytes: 2 }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"backlogUsagePercentage\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value / 100 | percent: '1.0-2' }}\">\n          {{ context.value / 100 | percent: '1.0-2' }}\n        </span>\n      </ng-container>\n    </c8y-column>\n  </c8y-data-grid>\n</div>\n", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: HeaderModule }, { kind: "component", type: i1$2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "ngmodule", type: DataGridModule }, { kind: "directive", type: i1$2.CellRendererDefDirective, selector: "[c8yCellRendererDef]" }, { kind: "directive", type: i1$2.ColumnDirective, selector: "c8y-column", inputs: ["name"] }, { kind: "component", type: i1$2.DataGridComponent, selector: "c8y-data-grid", inputs: ["title", "loadMoreItemsLabel", "loadingItemsLabel", "showSearch", "refresh", "columns", "rows", "pagination", "childNodePagination", "infiniteScroll", "serverSideDataCallback", "selectable", "singleSelection", "selectionPrimaryKey", "displayOptions", "actionControls", "bulkActionControls", "headerActionControls", "searchText", "configureColumnsEnabled", "showCounterWarning", "activeClassName", "expandableRows", "treeGrid", "hideReload", "childNodesProperty", "parentNodeLabelProperty"], outputs: ["rowMouseOver", "rowMouseLeave", "rowClick", "onConfigChange", "onBeforeFilter", "onBeforeSearch", "onFilter", "itemsSelect", "onReload", "onAddCustomColumn", "onRemoveCustomColumn", "onColumnFilterReset", "onSort", "onPageSizeChange", "onColumnReordered", "onColumnVisibilityChange"] }, { kind: "component", type: UsageComponent, selector: "app-usage", inputs: ["count", "limit", "percentage"] }, { kind: "ngmodule", type: BreadcrumbModule }, { kind: "component", type: i1$2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i1$2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: EmptyStateContextDirective, selector: "[emptyStateContext]" }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: BacklogQuotaLimitPipe, name: "backlogQuotaLimit" }, { kind: "pipe", type: BytesPipe, name: "bytes" }, { kind: "pipe", type: TimeToLivePipe, name: "timeToLive" }, { kind: "pipe", type: PercentPipe, name: "percent" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicListViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: TopicListViewComponent, isStandalone: true, selector: "app-topic-list-view", ngImport: i0, template: "<c8y-title>{{ namespaceLabel$ | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'monitoring'\"\n    [label]=\"'Monitoring' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [label]=\"'Messaging service' | translate\"\n    [path]=\"'/monitoring/messaging-service'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"namespaceLabel$ | async\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <a\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"refresh.emit()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': loading$ | async }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </a>\n</c8y-action-bar-item>\n\n<div class=\"card content-fullpage d-flex d-col\">\n  <div class=\"bg-level-1 separator-bottom flex-no-shrink\">\n    <div\n      class=\"card-block\"\n      style=\"min-height: 172px\"\n    >\n      <div\n        class=\"col-md-4 m-b-24 col-xs-12 d-flex p-t-24 gap-16 text-default a-i-center a-s-stretch\"\n      >\n        <div class=\"text-center d-col\">\n          <i\n            class=\"m-b-8 icon-40 c8y-icon-duocolor\"\n            [c8yIcon]=\"icon$ | async\"\n          ></i>\n          <span class=\"tag tag--info\">{{ 'Service' | translate }}</span>\n        </div>\n        <span class=\"h4 text-break-all\">{{ namespaceLabel$ | async }}</span>\n      </div>\n      <div class=\"col-md-4\">\n        <fieldset class=\"c8y-fieldset c8y-fieldset--lg\">\n          <legend>\n            {{ 'Service usage/limits' | translate }}\n          </legend>\n\n          @if (loading$ | async) {\n            <c8y-loading></c8y-loading>\n          } @else {\n            @let namespace = (namespaceDetails$ | async)?.namespace;\n            @if (namespace) {\n              <ul class=\"list-unstyled small animated fadeIn\">\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-list-view--topics\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Topics' | translate }}</label>\n                  @if (namespace?.topics?.limit !== 0) {\n                    <app-usage\n                      [count]=\"namespace?.topics?.count\"\n                      [limit]=\"namespace?.topics?.limit\"\n                    ></app-usage>\n                    <span class=\"m-l-16\">\n                      {{ namespace?.topics?.count | number }} /\n                      {{ namespace?.topics?.limit | backlogQuotaLimit }}\n                    </span>\n                  } @else {\n                    <span class=\"m-l-16\">{{ namespace?.topics?.count | number }}</span>\n                  }\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-list-view--subscribers\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Subscribers' | translate }}</label>\n                  <span class=\"m-l-16\">\n                    {{ namespace?.subscribers?.count | number }}\n                  </span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n                  data-cy=\"topic-list-view--publishers\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Publishers' | translate }}</label>\n                  <span class=\"m-l-16\">\n                    {{ namespace?.publishers?.count | number }}\n                  </span>\n                </li>\n              </ul>\n            }\n          }\n        </fieldset>\n      </div>\n      <div class=\"col-md-4\">\n        <fieldset class=\"c8y-fieldset c8y-fieldset--lg\">\n          <legend>{{ 'Service message backlog limits' | translate }}</legend>\n\n          @if (loading$ | async) {\n            <c8y-loading></c8y-loading>\n          } @else {\n            @let policies = (namespaceDetails$ | async)?.policies;\n            @if (policies) {\n              <ul class=\"list-unstyled small animated fadeIn\">\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-list-view--backlog-quota\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Backlog quota (per topic)' | translate }}\n                  </label>\n                  <span\n                    title=\"{{\n                      policies?.backlogQuota?.limit > 0\n                        ? (policies.backlogQuota.limit | bytes: 0 : true)\n                        : '-'\n                    }}\"\n                  >\n                    {{\n                      policies?.backlogQuota?.limit > 0\n                        ? (policies.backlogQuota.limit | bytes: 0)\n                        : '-'\n                    }}\n                  </span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n                  data-cy=\"topic-list-view--backlog-ttl\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Backlog time to live (TTL)' | translate }}\n                  </label>\n                  <span>{{ policies?.messageTTL | timeToLive }}</span>\n                </li>\n              </ul>\n            }\n          }\n        </fieldset>\n      </div>\n    </div>\n  </div>\n\n  <c8y-data-grid\n    class=\"d-contents\"\n    [title]=\"tableTitle | translate\"\n    [loadingItemsLabel]=\"loadingItemsLabel | translate\"\n    [loadMoreItemsLabel]=\"loadMoreItemsLabel | translate\"\n    [columns]=\"columns\"\n    [pagination]=\"pagination\"\n    [serverSideDataCallback]=\"serverSideDataCallback\"\n    [refresh]=\"refresh\"\n    [hideReload]=\"true\"\n  >\n    <c8y-ui-empty-state\n      [icon]=\"stats?.size > 0 ? 'search' : 'day-view'\"\n      [title]=\"stats?.size > 0 ? (noResultsMessage | translate) : (noDataMessage | translate)\"\n      [subtitle]=\"stats?.size > 0 ? (noResultsSubtitle | translate) : (noDataSubtitle | translate)\"\n      *emptyStateContext=\"let stats\"\n      [horizontal]=\"stats?.size > 0\"\n    ></c8y-ui-empty-state>\n\n    <c8y-column name=\"name\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <a\n          title=\"{{ context.value }}\"\n          [routerLink]=\"['topic', context.item.id]\"\n        >\n          {{ context.value }}\n        </a>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"msgRateIn\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"msgRateOut\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"subscribers\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <a\n          title=\"{{ context.value | number }}\"\n          [routerLink]=\"['topic', context.item.id, 'subscribers']\"\n        >\n          {{ context.value | number }}\n        </a>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"backlogSize\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | bytes: 2 : true }}\">\n          {{ context.value | bytes: 2 }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"backlogUsagePercentage\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value / 100 | percent: '1.0-2' }}\">\n          {{ context.value / 100 | percent: '1.0-2' }}\n        </span>\n      </ng-container>\n    </c8y-column>\n  </c8y-data-grid>\n</div>\n", dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: HeaderModule }, { kind: "component", type: i1$2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "ngmodule", type: DataGridModule }, { kind: "directive", type: i1$2.CellRendererDefDirective, selector: "[c8yCellRendererDef]" }, { kind: "directive", type: i1$2.ColumnDirective, selector: "c8y-column", inputs: ["name"] }, { kind: "component", type: i1$2.DataGridComponent, selector: "c8y-data-grid", inputs: ["title", "loadMoreItemsLabel", "loadingItemsLabel", "showSearch", "refresh", "columns", "rows", "pagination", "childNodePagination", "infiniteScroll", "serverSideDataCallback", "selectable", "singleSelection", "selectionPrimaryKey", "displayOptions", "actionControls", "bulkActionControls", "headerActionControls", "searchText", "configureColumnsEnabled", "showCounterWarning", "activeClassName", "expandableRows", "treeGrid", "hideReload", "childNodesProperty", "parentNodeLabelProperty"], outputs: ["rowMouseOver", "rowMouseLeave", "rowClick", "onConfigChange", "onBeforeFilter", "onBeforeSearch", "onFilter", "itemsSelect", "onReload", "onAddCustomColumn", "onRemoveCustomColumn", "onColumnFilterReset", "onSort", "onPageSizeChange", "onColumnReordered", "onColumnVisibilityChange"] }, { kind: "component", type: UsageComponent, selector: "app-usage", inputs: ["count", "limit", "percentage"] }, { kind: "ngmodule", type: BreadcrumbModule }, { kind: "component", type: i1$2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i1$2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: EmptyStateContextDirective, selector: "[emptyStateContext]" }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: BacklogQuotaLimitPipe, name: "backlogQuotaLimit" }, { kind: "pipe", type: BytesPipe, name: "bytes" }, { kind: "pipe", type: TimeToLivePipe, name: "timeToLive" }, { kind: "pipe", type: PercentPipe, name: "percent" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicListViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicListViewComponent, decorators: [{
             type: Component,
             args: [{ imports: [
                         RouterLink,
@@ -785,10 +785,10 @@ class MessagingSubscribersService extends Service {
     getBaseUrl({ tenant, namespace, topic, type }) {
         return `/${this.listUrl}/${tenant}/namespaces/${namespace}/topics/${topic}/types/${type}/subscribers`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingSubscribersService, deps: [{ token: i1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingSubscribersService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingSubscribersService, deps: [{ token: i1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingSubscribersService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingSubscribersService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingSubscribersService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: i1.FetchClient }] });
@@ -1000,10 +1000,10 @@ class TopicSubscribersDataGridService {
         const lastAcknowledgeDate = new Date(subscriber.lastAcknowledgeTimestamp);
         return lastAcknowledgeDate.getTime() > 0 ? lastAcknowledgeDate : null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicSubscribersDataGridService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicSubscribersDataGridService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicSubscribersDataGridService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicSubscribersDataGridService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicSubscribersDataGridService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicSubscribersDataGridService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -1102,10 +1102,10 @@ class TopicSubscribersViewComponent {
         });
         this.topicSubscribersDataGridService.bulkUnsubscribeSubscribers(subscribers, () => this.refresh.emit());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicSubscribersViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.3", type: TopicSubscribersViewComponent, isStandalone: true, selector: "app-topic-subscribers-view", viewQueries: [{ propertyName: "dataGrid", first: true, predicate: DataGridComponent, descendants: true, static: true }], ngImport: i0, template: "<c8y-title>{{ topicName$ | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'monitoring'\"\n    [label]=\"'Monitoring' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [label]=\"'Messaging service' | translate\"\n    [path]=\"'/monitoring/messaging-service'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [label]=\"namespaceLabel$ | async\"\n    [path]=\"'/monitoring/messaging-service/namespace/' + (namespaceId$ | async)\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"topicName$ | async\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <a\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"refresh.emit()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': loading$ | async }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </a>\n</c8y-action-bar-item>\n\n<div class=\"card content-fullpage d-flex d-col\">\n  <div class=\"bg-level-1 separator-bottom flex-no-shrink\">\n    <div class=\"card-block\">\n      <div\n        class=\"col-md-4 m-b-24 col-xs-12 d-flex p-t-24 gap-16 text-default a-i-center a-s-stretch\"\n      >\n        <div class=\"text-center d-col\">\n          <i\n            class=\"m-b-8 icon-40 c8y-icon-duocolor\"\n            [c8yIcon]=\"'day-view'\"\n          ></i>\n          <span class=\"tag tag--default\">{{ 'Topic' | translate }}</span>\n        </div>\n        <span class=\"h4\">{{ topicName$ | async }}</span>\n      </div>\n      <div class=\"col-md-4\">\n        <fieldset class=\"c8y-fieldset c8y-fieldset--lg\">\n          <legend translate>Topic usage</legend>\n\n          @if (loading$ | async) {\n            <c8y-loading></c8y-loading>\n          } @else {\n            @let overview = overview$ | async;\n            @if (overview) {\n              <ul class=\"list-unstyled small animated fadeIn\">\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--active-subscribers\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Active subscribers' | translate }}</label>\n                  <span class=\"m-l-16\">{{ overview.topic.activeSubscribers | number }}</span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--total-subscribers\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Total subscribers' | translate }}</label>\n                  <span class=\"m-l-16\">{{ overview.topic.subscribers | number }}</span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--total-unacknowledged-messages\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Total unacknowledged messages' | translate }}\n                  </label>\n                  <span class=\"m-l-16\">{{ overview.topic.unackMsgBacklog | number }}</span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--message-rate-in\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Message rate in' | translate }}\n                  </label>\n                  <span\n                    class=\"m-l-16\"\n                    ngNonBindable\n                    translate\n                    [translateParams]=\"{\n                      messagesPerSecond: overview.topic.msgRateIn | number\n                    }\"\n                  >\n                    {{ messagesPerSecond }} msg/s\n                  </span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n                  data-cy=\"topic-subscribers-view--message-rate-out\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Message rate out' | translate }}\n                  </label>\n                  <span\n                    class=\"m-l-16\"\n                    ngNonBindable\n                    translate\n                    [translateParams]=\"{\n                      messagesPerSecond: overview.topic.msgRateOut | number\n                    }\"\n                  >\n                    {{ messagesPerSecond }} msg/s\n                  </span>\n                </li>\n              </ul>\n            }\n          }\n        </fieldset>\n      </div>\n\n      <div class=\"col-md-4\">\n        <fieldset class=\"c8y-fieldset c8y-fieldset--lg\">\n          <legend translate>Topic message backlog</legend>\n\n          @if (loading$ | async) {\n            <c8y-loading></c8y-loading>\n          } @else {\n            @let overview = overview$ | async;\n            @if (overview) {\n              <ul class=\"list-unstyled small animated fadeIn\">\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--backlog-usage\"\n                >\n                  <label\n                    class=\"small m-b-0 m-r-auto\"\n                    translate\n                  >\n                    Backlog usage\n                  </label>\n                  <app-usage [percentage]=\"overview.topic.backlogUsagePercentage\"></app-usage>\n                  <span class=\"m-l-16\">{{ overview.topic.backlogSize | bytes }}</span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n                  data-cy=\"topic-subscribers-view--backlog-quota\"\n                >\n                  <label\n                    class=\"small m-b-0 m-r-auto\"\n                    translate\n                  >\n                    Backlog quota\n                  </label>\n                  <span class=\"m-l-16\">\n                    {{\n                      overview.policies.backlogQuota?.limit > 0\n                        ? (overview.policies.backlogQuota?.limit | bytes)\n                        : '-'\n                    }}\n                  </span>\n                </li>\n              </ul>\n            }\n          }\n        </fieldset>\n      </div>\n    </div>\n  </div>\n  <c8y-data-grid\n    class=\"content-fullpage d-flex d-col border-top border-bottom\"\n    [title]=\"tableTitle | translate\"\n    [loadingItemsLabel]=\"loadingItemsLabel | translate\"\n    [loadMoreItemsLabel]=\"loadMoreItemsLabel | translate\"\n    [columns]=\"columns\"\n    [pagination]=\"pagination\"\n    [serverSideDataCallback]=\"serverSideDataCallback\"\n    [refresh]=\"refresh\"\n    [hideReload]=\"true\"\n    [selectable]=\"selectable\"\n    [actionControls]=\"actionControls\"\n    [bulkActionControls]=\"bulkActionControls\"\n  >\n    <c8y-ui-empty-state\n      [icon]=\"stats?.size > 0 ? 'search' : 'input'\"\n      [title]=\"stats?.size > 0 ? (noResultsMessage | translate) : (noDataMessage | translate)\"\n      [subtitle]=\"stats?.size > 0 ? (noResultsSubtitle | translate) : (noDataSubtitle | translate)\"\n      *emptyStateContext=\"let stats\"\n      [horizontal]=\"stats?.size > 0\"\n    ></c8y-ui-empty-state>\n\n    <c8y-column name=\"name\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value }}\">\n          {{ context.value }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"activeClients\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"messageAckRate\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"lastAcknowledgeDate\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        @if (context.value) {\n          <span title=\"{{ context.value }}\">\n            {{ context.value | relativeTime }}\n          </span>\n        } @else {\n          &ndash;\n        }\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"unackMsgBacklog\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"backlogUsagePercentage\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value / 100 | percent: '1.0-2' }}\">\n          {{ context.value / 100 | percent: '1.0-2' }}\n        </span>\n      </ng-container>\n    </c8y-column>\n  </c8y-data-grid>\n</div>\n", dependencies: [{ kind: "ngmodule", type: DataGridModule }, { kind: "directive", type: i1$2.CellRendererDefDirective, selector: "[c8yCellRendererDef]" }, { kind: "directive", type: i1$2.ColumnDirective, selector: "c8y-column", inputs: ["name"] }, { kind: "component", type: i1$2.DataGridComponent, selector: "c8y-data-grid", inputs: ["title", "loadMoreItemsLabel", "loadingItemsLabel", "showSearch", "refresh", "columns", "rows", "pagination", "childNodePagination", "infiniteScroll", "serverSideDataCallback", "selectable", "singleSelection", "selectionPrimaryKey", "displayOptions", "actionControls", "bulkActionControls", "headerActionControls", "searchText", "configureColumnsEnabled", "showCounterWarning", "activeClassName", "expandableRows", "treeGrid", "hideReload", "childNodesProperty", "parentNodeLabelProperty"], outputs: ["rowMouseOver", "rowMouseLeave", "rowClick", "onConfigChange", "onBeforeFilter", "onBeforeSearch", "onFilter", "itemsSelect", "onReload", "onAddCustomColumn", "onRemoveCustomColumn", "onColumnFilterReset", "onSort", "onPageSizeChange", "onColumnReordered", "onColumnVisibilityChange"] }, { kind: "ngmodule", type: HeaderModule }, { kind: "component", type: i1$2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: BreadcrumbModule }, { kind: "component", type: i1$2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i1$2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: UsageComponent, selector: "app-usage", inputs: ["count", "limit", "percentage"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: EmptyStateContextDirective, selector: "[emptyStateContext]" }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: RelativeTimePipe, name: "relativeTime" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.PercentPipe, name: "percent" }, { kind: "pipe", type: BytesPipe, name: "bytes" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicSubscribersViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: TopicSubscribersViewComponent, isStandalone: true, selector: "app-topic-subscribers-view", viewQueries: [{ propertyName: "dataGrid", first: true, predicate: DataGridComponent, descendants: true, static: true }], ngImport: i0, template: "<c8y-title>{{ topicName$ | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'monitoring'\"\n    [label]=\"'Monitoring' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [label]=\"'Messaging service' | translate\"\n    [path]=\"'/monitoring/messaging-service'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [label]=\"namespaceLabel$ | async\"\n    [path]=\"'/monitoring/messaging-service/namespace/' + (namespaceId$ | async)\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"topicName$ | async\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <a\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"refresh.emit()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': loading$ | async }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </a>\n</c8y-action-bar-item>\n\n<div class=\"card content-fullpage d-flex d-col\">\n  <div class=\"bg-level-1 separator-bottom flex-no-shrink\">\n    <div class=\"card-block\">\n      <div\n        class=\"col-md-4 m-b-24 col-xs-12 d-flex p-t-24 gap-16 text-default a-i-center a-s-stretch\"\n      >\n        <div class=\"text-center d-col\">\n          <i\n            class=\"m-b-8 icon-40 c8y-icon-duocolor\"\n            [c8yIcon]=\"'day-view'\"\n          ></i>\n          <span class=\"tag tag--default\">{{ 'Topic' | translate }}</span>\n        </div>\n        <span class=\"h4\">{{ topicName$ | async }}</span>\n      </div>\n      <div class=\"col-md-4\">\n        <fieldset class=\"c8y-fieldset c8y-fieldset--lg\">\n          <legend translate>Topic usage</legend>\n\n          @if (loading$ | async) {\n            <c8y-loading></c8y-loading>\n          } @else {\n            @let overview = overview$ | async;\n            @if (overview) {\n              <ul class=\"list-unstyled small animated fadeIn\">\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--active-subscribers\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Active subscribers' | translate }}</label>\n                  <span class=\"m-l-16\">{{ overview.topic.activeSubscribers | number }}</span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--total-subscribers\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">{{ 'Total subscribers' | translate }}</label>\n                  <span class=\"m-l-16\">{{ overview.topic.subscribers | number }}</span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--total-unacknowledged-messages\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Total unacknowledged messages' | translate }}\n                  </label>\n                  <span class=\"m-l-16\">{{ overview.topic.unackMsgBacklog | number }}</span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--message-rate-in\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Message rate in' | translate }}\n                  </label>\n                  <span\n                    class=\"m-l-16\"\n                    ngNonBindable\n                    translate\n                    [translateParams]=\"{\n                      messagesPerSecond: overview.topic.msgRateIn | number\n                    }\"\n                  >\n                    {{ messagesPerSecond }} msg/s\n                  </span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n                  data-cy=\"topic-subscribers-view--message-rate-out\"\n                >\n                  <label class=\"small m-b-0 m-r-auto\">\n                    {{ 'Message rate out' | translate }}\n                  </label>\n                  <span\n                    class=\"m-l-16\"\n                    ngNonBindable\n                    translate\n                    [translateParams]=\"{\n                      messagesPerSecond: overview.topic.msgRateOut | number\n                    }\"\n                  >\n                    {{ messagesPerSecond }} msg/s\n                  </span>\n                </li>\n              </ul>\n            }\n          }\n        </fieldset>\n      </div>\n\n      <div class=\"col-md-4\">\n        <fieldset class=\"c8y-fieldset c8y-fieldset--lg\">\n          <legend translate>Topic message backlog</legend>\n\n          @if (loading$ | async) {\n            <c8y-loading></c8y-loading>\n          } @else {\n            @let overview = overview$ | async;\n            @if (overview) {\n              <ul class=\"list-unstyled small animated fadeIn\">\n                <li\n                  class=\"p-t-4 p-b-4 d-flex separator-bottom text-nowrap\"\n                  data-cy=\"topic-subscribers-view--backlog-usage\"\n                >\n                  <label\n                    class=\"small m-b-0 m-r-auto\"\n                    translate\n                  >\n                    Backlog usage\n                  </label>\n                  <app-usage [percentage]=\"overview.topic.backlogUsagePercentage\"></app-usage>\n                  <span class=\"m-l-16\">{{ overview.topic.backlogSize | bytes }}</span>\n                </li>\n\n                <li\n                  class=\"p-t-4 p-b-4 d-flex text-nowrap\"\n                  data-cy=\"topic-subscribers-view--backlog-quota\"\n                >\n                  <label\n                    class=\"small m-b-0 m-r-auto\"\n                    translate\n                  >\n                    Backlog quota\n                  </label>\n                  <span class=\"m-l-16\">\n                    {{\n                      overview.policies.backlogQuota?.limit > 0\n                        ? (overview.policies.backlogQuota?.limit | bytes)\n                        : '-'\n                    }}\n                  </span>\n                </li>\n              </ul>\n            }\n          }\n        </fieldset>\n      </div>\n    </div>\n  </div>\n  <c8y-data-grid\n    class=\"content-fullpage d-flex d-col border-top border-bottom\"\n    [title]=\"tableTitle | translate\"\n    [loadingItemsLabel]=\"loadingItemsLabel | translate\"\n    [loadMoreItemsLabel]=\"loadMoreItemsLabel | translate\"\n    [columns]=\"columns\"\n    [pagination]=\"pagination\"\n    [serverSideDataCallback]=\"serverSideDataCallback\"\n    [refresh]=\"refresh\"\n    [hideReload]=\"true\"\n    [selectable]=\"selectable\"\n    [actionControls]=\"actionControls\"\n    [bulkActionControls]=\"bulkActionControls\"\n  >\n    <c8y-ui-empty-state\n      [icon]=\"stats?.size > 0 ? 'search' : 'input'\"\n      [title]=\"stats?.size > 0 ? (noResultsMessage | translate) : (noDataMessage | translate)\"\n      [subtitle]=\"stats?.size > 0 ? (noResultsSubtitle | translate) : (noDataSubtitle | translate)\"\n      *emptyStateContext=\"let stats\"\n      [horizontal]=\"stats?.size > 0\"\n    ></c8y-ui-empty-state>\n\n    <c8y-column name=\"name\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value }}\">\n          {{ context.value }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"activeClients\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"messageAckRate\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"lastAcknowledgeDate\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        @if (context.value) {\n          <span title=\"{{ context.value }}\">\n            {{ context.value | relativeTime }}\n          </span>\n        } @else {\n          &ndash;\n        }\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"unackMsgBacklog\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value | number }}\">\n          {{ context.value | number }}\n        </span>\n      </ng-container>\n    </c8y-column>\n\n    <c8y-column name=\"backlogUsagePercentage\">\n      <ng-container *c8yCellRendererDef=\"let context\">\n        <span title=\"{{ context.value / 100 | percent: '1.0-2' }}\">\n          {{ context.value / 100 | percent: '1.0-2' }}\n        </span>\n      </ng-container>\n    </c8y-column>\n  </c8y-data-grid>\n</div>\n", dependencies: [{ kind: "ngmodule", type: DataGridModule }, { kind: "directive", type: i1$2.CellRendererDefDirective, selector: "[c8yCellRendererDef]" }, { kind: "directive", type: i1$2.ColumnDirective, selector: "c8y-column", inputs: ["name"] }, { kind: "component", type: i1$2.DataGridComponent, selector: "c8y-data-grid", inputs: ["title", "loadMoreItemsLabel", "loadingItemsLabel", "showSearch", "refresh", "columns", "rows", "pagination", "childNodePagination", "infiniteScroll", "serverSideDataCallback", "selectable", "singleSelection", "selectionPrimaryKey", "displayOptions", "actionControls", "bulkActionControls", "headerActionControls", "searchText", "configureColumnsEnabled", "showCounterWarning", "activeClassName", "expandableRows", "treeGrid", "hideReload", "childNodesProperty", "parentNodeLabelProperty"], outputs: ["rowMouseOver", "rowMouseLeave", "rowClick", "onConfigChange", "onBeforeFilter", "onBeforeSearch", "onFilter", "itemsSelect", "onReload", "onAddCustomColumn", "onRemoveCustomColumn", "onColumnFilterReset", "onSort", "onPageSizeChange", "onColumnReordered", "onColumnVisibilityChange"] }, { kind: "ngmodule", type: HeaderModule }, { kind: "component", type: i1$2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: BreadcrumbModule }, { kind: "component", type: i1$2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i1$2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: UsageComponent, selector: "app-usage", inputs: ["count", "limit", "percentage"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: EmptyStateContextDirective, selector: "[emptyStateContext]" }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: RelativeTimePipe, name: "relativeTime" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.PercentPipe, name: "percent" }, { kind: "pipe", type: BytesPipe, name: "bytes" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicSubscribersViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicSubscribersViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-topic-subscribers-view', standalone: true, imports: [
                         DataGridModule,
@@ -1149,10 +1149,10 @@ class TopicDetailsTabFactory {
         }
         return [];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicDetailsTabFactory, deps: [{ token: i1$4.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicDetailsTabFactory }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicDetailsTabFactory, deps: [{ token: i1$4.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicDetailsTabFactory }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: TopicDetailsTabFactory, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: TopicDetailsTabFactory, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i1$4.Router }] });
 
@@ -1177,18 +1177,18 @@ class MessagingManagementPreviewFactory {
             }
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementPreviewFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementPreviewFactory, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementPreviewFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementPreviewFactory, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementPreviewFactory, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementPreviewFactory, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
 
 class MessagingManagementModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementModule }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementModule, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementModule, providers: [
             hookRoute([
                 {
                     path: basePath,
@@ -1216,7 +1216,7 @@ class MessagingManagementModule {
             hookPreview(MessagingManagementPreviewFactory)
         ] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.3", ngImport: i0, type: MessagingManagementModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MessagingManagementModule, decorators: [{
             type: NgModule,
             args: [{
                     providers: [