@sumaris-net/ngx-components 1.22.10 → 1.22.11-rc1

package/bundles/sumaris-net.ngx-components.umd.js

@@ -24829,7 +24829,7 @@
     MenuComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'app-menu',
-                    template: "<ion-split-pane #splitPane [contentId]=\"contentId\" (swiperight)=\"onSwipeRight($event)\">\n\n  <ion-menu [id]=\"id\" [menuId]=\"menuId\" [contentId]=\"contentId\">\n    <ion-header>\n\n      <ion-toolbar @fadeInAnimation *ngIf=\"isLogin; else notLogin\" class=\"ion-toolbar-top\">\n        <ion-grid>\n          <ion-row>\n            <ion-col size=\"4\">\n              <button type=\"button\" mat-flat-button\n                      class=\"user-avatar\" [class.primary]=\"!accountAvatar\"\n                      [style.background-image]=\"'url('+(accountAvatar||'./assets/img/person.png')+')'\"\n                      [routerLink]=\"['/account']\"\n                      routerDirection=\"root\"\n                      routerLinkActive=\"ion-color-primary\"\n                      (click)=\"close()\"\n                      [title]=\"'MENU.BTN_MY_ACCOUNT'|translate\">\n              </button>\n            </ion-col>\n            <ion-col size=\"8\" class=\"user-logo\">\n              <img *ngIf=\"logo\" src=\"{{logo}}\" [title]=\"'APP_NAME'|translate: {appName: appName}\" width=\"108px\"/>\n              <span *ngIf=\"!logo\" style=\"width: 108px;\">{{appName}}</span>\n            </ion-col>\n          </ion-row>\n          <ion-row class=\"ion-no-padding\">\n            <ion-col>\n              <button mat-button type=\"button\"\n                      [routerLink]=\"['/account']\"\n                      routerDirection=\"root\"\n                      routerLinkActive=\"ion-color-primary\"\n                      (click)=\"close()\"\n                      [title]=\"'MENU.BTN_MY_ACCOUNT'|translate\">\n                <ion-label color=\"primary\" class=\"ion-text-wrap ion-text-start\">\n                  <h3 class=\"no-margin username\">\n                    <b>{{accountName}}</b>\n                  </h3>\n                  <h4>{{accountEmail}}</h4>\n                </ion-label>\n              </button>\n            </ion-col>\n\n            <!-- Insertion headerBottomRight -->\n            <ion-col size=\"auto\">\n              <ng-container *ngTemplateOutlet=\"headerBottomRight\"></ng-container>\n            </ion-col>\n          </ion-row>\n        </ion-grid>\n\n      </ion-toolbar>\n\n      <!-- User not logged -->\n      <ng-template #notLogin>\n        <mat-toolbar class=\"ion-padding\" @fadeInAnimation\n                     style=\"height: unset; display: block; margin: auto; text-align: center;\">\n          <img *ngIf=\"logo\" src=\"{{logo}}\" [title]=\"'APP_NAME'|translate: {appName: appName}\" width=\"150px;\">\n          <span *ngIf=\"!logo\" style=\"width: 150px\">{{appName}}</span>\n        </mat-toolbar>\n      </ng-template>\n    </ion-header>\n\n    <ion-content [class.has-user-header]=\"isLogin\">\n\n      <ion-list lines=\"none\">\n        <ion-menu-toggle auto-hide=\"false\"\n                         [class.flex-spacer]=\"item.cssClass == 'flex-spacer'\"\n                         *ngFor=\"let item of $items | async\">\n\n          <!-- link -->\n          <ion-item *ngIf=\"!loading && item.path\"\n                    @fadeInAnimation\n                    class=\"{{item.cssClass}} {{item.color}} text-1x\"\n                    tappable\n                    [routerLink]=\"item.path\"\n                    routerDirection=\"root\"\n                    routerLinkActive=\"selected\"\n                    [routerLinkActiveOptions]=\"{exact: (item.path === '/')}\">\n            <ion-icon slot=\"start\" *ngIf=\"item.icon\" [name]=\"item.icon\"></ion-icon>\n            <mat-icon slot=\"start\" *ngIf=\"item.matIcon\">{{item.matIcon}}</mat-icon>\n            <ion-label translate>{{item.title}}</ion-label>\n          </ion-item>\n\n          <!-- action -->\n          <ion-item *ngIf=\"!loading && item.action\"\n                    @fadeInAnimation\n                    class=\"{{item.cssClass}} {{item.color}} text-1x\"\n                    tappable\n                    (click)=\"doAction(item.action, $event)\">\n            <ion-icon slot=\"start\" *ngIf=\"item.icon\" [name]=\"item.icon\"></ion-icon>\n            <mat-icon slot=\"start\" *ngIf=\"item.matIcon\">{{item.matIcon}}</mat-icon>\n            <ion-label translate>{{item.title}}</ion-label>\n          </ion-item>\n\n          <!-- divider -->\n          <ion-item-divider @fadeInAnimation\n                            class=\"{{item.cssClass}} {{item.color}}\"\n                            *ngIf=\"!loading && !item.path && !item.action\">\n            <ion-label translate>{{item.title}}</ion-label>\n          </ion-item-divider>\n\n        </ion-menu-toggle>\n      </ion-list>\n    </ion-content>\n\n    <ion-footer class=\"hidden-xs hidden-sm\">\n      <ion-toolbar>\n\n        <ion-buttons slot=\"start\">\n          <ion-button mat-icon-button color=\"accent\" (click)=\"openAboutModal($event)\">\n            <mat-icon slot=\"icon-only\">help_outline</mat-icon>\n          </ion-button>\n        </ion-buttons>\n\n        <ion-title (click)=\"openAboutModal($event)\" color=\"medium\">\n          {{'MENU.FOOTER_VERSION_ABOUT'| translate: {version: appVersion} }}\n        </ion-title>\n\n        <ion-buttons slot=\"end\">\n          <button mat-icon-button color=\"accent\" (click)=\"toggleSplitPaneShow($event)\"\n                  class=\"hidden-xs hidden-sm hidden-md\"\n                  [title]=\"(splitPane.when ? 'COMMON.BTN_HIDE_MENU' : 'COMMON.BTN_SHOW_MENU') |translate\">\n            <mat-icon><span>{{splitPane.when ? '&#xab;' : '&#xbb;'}}</span></mat-icon>\n          </button>\n        </ion-buttons>\n      </ion-toolbar>\n    </ion-footer>\n\n  </ion-menu>\n\n  <ng-content select=\"ion-router-outlet\"></ng-content>\n\n</ion-split-pane>\n\n<ng-template #headerBottomRight>\n  <ng-content select=\"[headerBottomRight]\"></ng-content>\n</ng-template>\n",
+                    template: "<ion-split-pane #splitPane [contentId]=\"contentId\" (swiperight)=\"onSwipeRight($event)\">\n\n  <ion-menu [id]=\"id\" [menuId]=\"menuId\" [contentId]=\"contentId\">\n    <ion-header>\n\n      <ion-toolbar @fadeInAnimation *ngIf=\"isLogin; else notLogin\" class=\"ion-toolbar-top\">\n        <ion-grid>\n          <ion-row>\n            <ion-col size=\"4\">\n              <button type=\"button\" mat-flat-button\n                      class=\"user-avatar\" [class.primary]=\"!accountAvatar\"\n                      [style.background-image]=\"'url('+(accountAvatar||'./assets/img/person.png')+')'\"\n                      [routerLink]=\"['/account']\"\n                      routerDirection=\"root\"\n                      routerLinkActive=\"ion-color-primary\"\n                      (click)=\"close()\"\n                      [title]=\"'MENU.BTN_MY_ACCOUNT'|translate\">\n              </button>\n            </ion-col>\n            <ion-col size=\"8\" class=\"user-logo\">\n              <img *ngIf=\"logo\" src=\"{{logo}}\" [title]=\"'APP_NAME'|translate: {appName: appName}\" width=\"108px\"/>\n              <span *ngIf=\"!logo\" style=\"width: 108px;\">{{appName}}</span>\n            </ion-col>\n          </ion-row>\n          <ion-row class=\"ion-no-padding\">\n            <ion-col>\n              <button mat-button type=\"button\"\n                      [routerLink]=\"['/account']\"\n                      routerDirection=\"root\"\n                      routerLinkActive=\"ion-color-primary\"\n                      (click)=\"close()\"\n                      [title]=\"'MENU.BTN_MY_ACCOUNT'|translate\">\n                <ion-label color=\"primary\" class=\"ion-text-wrap ion-text-start\">\n                  <h3 class=\"no-margin username\">\n                    <b>{{accountName}}</b>\n                  </h3>\n                  <h4>{{accountEmail}}</h4>\n                </ion-label>\n              </button>\n            </ion-col>\n\n            <!-- Insertion headerBottomRight -->\n            <ion-col size=\"auto\">\n              <ng-container *ngTemplateOutlet=\"headerBottomRight\"></ng-container>\n            </ion-col>\n          </ion-row>\n        </ion-grid>\n\n      </ion-toolbar>\n\n      <!-- User not logged -->\n      <ng-template #notLogin>\n        <mat-toolbar class=\"ion-padding\" @fadeInAnimation\n                     style=\"height: unset; display: block; margin: auto; text-align: center;\">\n          <img *ngIf=\"logo\" src=\"{{logo}}\" [title]=\"'APP_NAME'|translate: {appName: appName}\" width=\"150px;\">\n          <span *ngIf=\"!logo\" style=\"width: 150px\">{{appName}}</span>\n        </mat-toolbar>\n      </ng-template>\n    </ion-header>\n\n    <ion-content [class.has-user-header]=\"isLogin\">\n\n      <ion-list lines=\"none\">\n        <ion-menu-toggle auto-hide=\"false\"\n                         [class.flex-spacer]=\"item.cssClass == 'flex-spacer'\"\n                         *ngFor=\"let item of $items | async\">\n\n          <!-- link -->\n          <ion-item *ngIf=\"!loading && item.path\"\n                    @fadeInAnimation\n                    class=\"{{item.cssClass}} {{item.color}} text-1x\"\n                    tappable\n                    [routerLink]=\"item.path\"\n                    routerDirection=\"root\"\n                    routerLinkActive=\"selected\"\n                    [routerLinkActiveOptions]=\"{exact: (item.path === '/')}\">\n            <ion-icon slot=\"start\" *ngIf=\"item.icon\" [name]=\"item.icon\"></ion-icon>\n            <mat-icon slot=\"start\" *ngIf=\"item.matIcon\">{{item.matIcon}}</mat-icon>\n            <ion-label translate>{{item.title}}</ion-label>\n          </ion-item>\n\n          <!-- action -->\n          <ion-item *ngIf=\"!loading && item.action\"\n                    @fadeInAnimation\n                    class=\"{{item.cssClass}} {{item.color}} text-1x\"\n                    tappable\n                    (click)=\"doAction(item.action, $event)\">\n            <ion-icon slot=\"start\" *ngIf=\"item.icon\" [name]=\"item.icon\"></ion-icon>\n            <mat-icon slot=\"start\" *ngIf=\"item.matIcon\">{{item.matIcon}}</mat-icon>\n            <ion-label translate>{{item.title}}</ion-label>\n          </ion-item>\n\n          <!-- divider -->\n          <ion-item-divider @fadeInAnimation\n                            class=\"{{item.cssClass}} {{item.color}}\"\n                            *ngIf=\"!loading && !item.path && !item.action\">\n            <ion-label translate>{{item.title}}</ion-label>\n          </ion-item-divider>\n\n        </ion-menu-toggle>\n      </ion-list>\n    </ion-content>\n\n    <ion-footer class=\"hidden-xs hidden-sm\">\n      <ion-toolbar>\n\n        <ion-buttons slot=\"start\">\n          <ion-button mat-icon-button color=\"accent\" (click)=\"openAboutModal($event)\">\n            <mat-icon slot=\"icon-only\">help_outline</mat-icon>\n          </ion-button>\n        </ion-buttons>\n\n        <ion-title (click)=\"openAboutModal($event)\" color=\"medium\">\n          {{'MENU.FOOTER_VERSION_ABOUT'| translate: {version: appVersion} }}\n        </ion-title>\n\n        <ion-buttons slot=\"end\">\n          <button mat-icon-button color=\"accent\" (click)=\"toggleSplitPaneShow($event)\"\n                  class=\"hidden-xs hidden-sm hidden-md\"\n                  [title]=\"(splitPane.when ? 'COMMON.BTN_HIDE_MENU' : 'COMMON.BTN_SHOW_MENU') |translate\">\n            <mat-icon><span>{{splitPane.when ? '&#xab;' : '&#xbb;'}}</span></mat-icon>\n          </button>\n        </ion-buttons>\n      </ion-toolbar>\n    </ion-footer>\n\n  </ion-menu>\n\n  <ng-content></ng-content>\n\n</ion-split-pane>\n\n<ng-template #headerBottomRight>\n  <ng-content select=\"[headerBottomRight]\"></ng-content>\n</ng-template>\n",
                     animations: [fadeInAnimation],
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     styles: ["ion-menu{--ion-item-background:transparent;--ion-item-divider-background:transparent;--ion-item-icon-color:var(--ion-color-primary-tint);--ion-item-text-color:var(--ion-color-primary-tint);--ion-item-background-selected:var(--ion-color-secondary100);--ion-item-text-color-selected:var(--ion-color-primary);--ion-item-icon-color-selected:var(--ion-color-primary);--ion-item-text-color-disable:var(--ion-color-medium);--ion-item-icon-color-disable:var(--ion-color-medium)}ion-menu ion-header ion-text{color:var(--ion-color-primary)}ion-menu ion-header .user-avatar{background-size:cover;background-repeat:no-repeat;background-position:50%;background-color:var(--ion-color-secondary);border:1px solid var(--ion-color-primary);overflow:hidden!important;font-size:var(--avatar-size,60px)!important;line-height:var(--avatar-size,60px);height:var(--avatar-size,60px)!important;width:var(--avatar-size,60px)!important;border-radius:50%;display:inline-block}ion-menu ion-header .user-avatar:hover{background-color:var(--ion-color-secondary-shade);border:2px solid var(--ion-color-primary-shade)}ion-menu ion-header .user-logo{text-align:right}ion-menu ion-header .user-logo img{max-width:120px;max-height:var(--avatar-size,60px);width:auto}ion-menu ion-header .username{padding-top:0;margin-top:0;margin-bottom:0;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}ion-menu ion-header button[mat-button]{padding:0;text-align:start!important;width:100%}ion-menu .scroll-content{margin-top:79px!important}ion-menu .has-user-header .scroll-content{margin-top:188px!important}ion-menu ion-content.has-profile-header{--offset-top:188px}ion-menu ion-content.no-profile-header{--offset-top:79px}ion-menu ion-content ion-list{min-height:100%;display:flex;flex-direction:column;justify-content:flex-start}ion-menu ion-content ion-list ion-menu-toggle.flex-spacer{flex:1 1 auto;display:flex;flex-direction:column;justify-content:flex-end}ion-menu ion-content ion-list ion-item.primary{--ion-item-icon-color:var(--ion-color-primary-tint);--ion-item-text-color:var(--ion-color-primary-tint)}ion-menu ion-content ion-list ion-item.secondary{--ion-item-icon-color:var(--ion-color-secondary-tint);--ion-item-text-color:var(--ion-color-secondary-tint)}ion-menu ion-content ion-list ion-item.tertiary{--ion-item-icon-color:var(--ion-color-tertiary-tint);--ion-item-text-color:var(--ion-color-tertiary-tint)}ion-menu ion-content ion-list ion-item.danger{--ion-item-icon-color:var(--ion-color-danger-tint);--ion-item-text-color:var(--ion-color-danger-tint)}ion-menu ion-content ion-list ion-item.medium{--ion-item-icon-color:var(--ion-color-medium-shade);--ion-item-text-color:var(--ion-color-medium-shade)}ion-menu ion-content ion-list ion-item.dark{--ion-item-icon-color:var(--ion-color-dark-tint);--ion-item-text-color:var(--ion-color-dark-tint)}ion-menu ion-content ion-list ion-item ion-icon,ion-menu ion-content ion-list ion-item mat-icon{color:var(--ion-item-icon-color)!important;fill:currentColor;stroke:currentColor}ion-menu ion-content ion-list ion-item ion-label,ion-menu ion-content ion-list ion-item ion-text{color:var(--ion-item-text-color)!important}ion-menu ion-content ion-list ion-item.selected{background-color:var(--ion-item-background-selected)!important;--color-hover:var(--ion-item-background-selected)!important}ion-menu ion-content ion-list ion-item.selected ion-icon,ion-menu ion-content ion-list ion-item.selected mat-icon{color:var(--ion-item-icon-color-selected)!important;fill:currentColor;stroke:currentColor}ion-menu ion-content ion-list ion-item.selected ion-label,ion-menu ion-content ion-list ion-item.selected ion-text{color:var(--ion-item-text-color-selected)!important}ion-menu ion-content ion-list ion-item.selected:hover{--color-hover:var(--ion-item-background-selected)!important;--ion-item-icon-color-selected:var(--ion-item-icon-color)!important;--ion-item-text-color-selected:var(--ion-item-text-color)!important}ion-menu ion-footer{display:block!important}ion-menu ion-footer ion-toolbar ion-title{cursor:pointer;font-size:12pt;font-weight:400;text-align:center;padding:0 8px}ion-menu ion-footer ion-toolbar ion-button{--width:40px}@media screen and (max-width:767px){ion-menu ion-footer{display:none!important;visibility:hidden!important}}@media screen and (min-width:768px){ion-menu ion-scroll{overflow-y:auto!important}ion-menu .user-avatar{font-size:var(--avatar-size,80px)!important;line-height:var(--avatar-size,80px);height:var(--avatar-size,80px)!important;width:var(--avatar-size,80px)!important}ion-menu .user-logo img{max-height:var(--avatar-size,80px)}}"]
@@ -30245,7 +30245,7 @@
             _this.network = network;
             _this.translate = translate;
             _this.options = options;
-            _this.count$ = new rxjs.BehaviorSubject(0);
+            _this._countSubject = new rxjs.BehaviorSubject(0);
             _this.listeners = [];
             _this._subscriptions = new rxjs.Subscription();
             _this.queries = options.queries;
@@ -30254,9 +30254,9 @@
             _this._logPrefix = '[user-event-service] ';
             return _this;
         }
-        Object.defineProperty(AbstractUserEventService.prototype, "userEventCount", {
+        Object.defineProperty(AbstractUserEventService.prototype, "countSubject", {
             get: function () {
-                return this.count$.asObservable();
+                return this._countSubject;
             },
             enumerable: false,
             configurable: true
@@ -30345,7 +30345,7 @@
                 data: entity
             });
             // Update count
-            this.count$.next(this.count$.value + 1);
+            this._countSubject.next(this._countSubject.value + 1);
         };
         AbstractUserEventService.prototype.count = function (filter, options) {
             var _a;
@@ -30407,7 +30407,7 @@
                 if (total && _this._debug)
                     console.debug(_this._logPrefix + "Received new user events count:", total);
                 // update count
-                _this.count$.next(total);
+                _this._countSubject.next(total);
                 return total;
             }));
         };
@@ -30654,7 +30654,7 @@
             this.listeners.push(listener);
         };
         AbstractUserEventService.prototype.resetCount = function () {
-            this.count$.next(undefined);
+            this._countSubject.next(undefined);
             this.resetCountDate = moment$6();
             // restart listening count changes
             this.startListenCountChanges();
@@ -30671,7 +30671,7 @@
                             if (this._debug)
                                 console.debug(this._logPrefix + "Receiving user events count", count);
                             // Update count
-                            this.count$.next(count);
+                            this._countSubject.next(count);
                             // Then listen changes
                             this.startListenCountChanges();
                             return [2 /*return*/];
@@ -30816,20 +30816,22 @@
         UserEventNotificationList.prototype.ngOnInit = function () {
             var _this = this;
             // Watch all user events
-            this.subscriptions.add(this.userEventService
-                .watchAll(0, 10, 'creationDate', "desc", undefined)
-                .subscribe(function (result) {
-                if (_this.debug)
-                    console.debug("[user-event-notification-list] receiving " + result.total + " user events", result.data);
-                _this.userEvents.next(result.data);
-                _this.markForCheck();
-            }));
-            // Listen changes
-            this.subscriptions.add(this.userEventService.listenChanges(undefined)
-                .subscribe(function (data) {
-                if (_this.debug)
-                    console.debug("[user-event-notification-list] receiving " + data.length + " new user events", data);
-            }));
+            if (this.userEventService) {
+                this.subscriptions.add(this.userEventService
+                    .watchAll(0, 10, 'creationDate', 'desc', undefined)
+                    .subscribe(function (result) {
+                    if (_this.debug)
+                        console.debug("[user-event-notification-list] receiving " + result.total + " user events", result.data);
+                    _this.userEvents.next(result.data);
+                    _this.markForCheck();
+                }));
+                // Listen changes
+                this.subscriptions.add(this.userEventService.listenChanges(undefined)
+                    .subscribe(function (data) {
+                    if (_this.debug)
+                        console.debug("[user-event-notification-list] receiving " + data.length + " new user events", data);
+                }));
+            }
         };
         UserEventNotificationList.prototype.ngOnDestroy = function () {
             this.subscriptions.unsubscribe();
@@ -30880,31 +30882,35 @@
         readEvents: [{ type: i0.Output }]
     };
 
-    var UserEventNotificationComponent = /** @class */ (function () {
-        function UserEventNotificationComponent(userEventService, accountService, popoverController) {
+    var AppUserEventNotificationIcon = /** @class */ (function () {
+        function AppUserEventNotificationIcon(userEventService, accountService, popoverController) {
             this.userEventService = userEventService;
             this.accountService = accountService;
             this.popoverController = popoverController;
             this.debug = false;
             this.titleI18n = 'SOCIAL.USER_EVENT.NOTIFICATION.TITLE';
             this.disabled = false;
+            this.filter = null;
             this._logPrefix = '[user-event-notification] ';
             this._readEvent = new i0.EventEmitter();
             this._readEvents = new i0.EventEmitter();
         }
-        Object.defineProperty(UserEventNotificationComponent.prototype, "count", {
+        Object.defineProperty(AppUserEventNotificationIcon.prototype, "countChanges", {
             get: function () {
-                var _a;
-                return (_a = this.userEventService) === null || _a === void 0 ? void 0 : _a.userEventCount.pipe(operators.map(function (value) { return value === 0 ? undefined : value; }));
+                if (!this.userEventService)
+                    return rxjs.of();
+                return this.userEventService
+                    .countSubject
+                    .pipe(operators.map(function (value) { return value === 0 ? undefined : value; }));
             },
             enumerable: false,
             configurable: true
         });
-        UserEventNotificationComponent.prototype.ngOnInit = function () {
+        AppUserEventNotificationIcon.prototype.ngOnInit = function () {
             return __awaiter(this, void 0, void 0, function () {
                 var _this = this;
-                return __generator(this, function (_b) {
-                    switch (_b.label) {
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
                         case 0:
                             if (isNil(this.userEventService)) {
                                 console.warn(this._logPrefix + "No service injected");
@@ -30915,7 +30921,7 @@
                             return [4 /*yield*/, this.userEventService.ready()];
                         case 1:
                             // Wait service
-                            _b.sent();
+                            _a.sent();
                             // Subscribe to read event
                             this._readEvent.subscribe(function (value) {
                                 // default: mark event as read
@@ -30929,11 +30935,11 @@
                 });
             });
         };
-        UserEventNotificationComponent.prototype.showList = function (event) {
+        AppUserEventNotificationIcon.prototype.showList = function (event) {
             return __awaiter(this, void 0, void 0, function () {
                 var popover;
-                return __generator(this, function (_b) {
-                    switch (_b.label) {
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
                         case 0:
                             // Reset count
                             this.userEventService.resetCount();
@@ -30952,39 +30958,39 @@
                                     cssClass: 'popover-large'
                                 })];
                         case 1:
-                            popover = _b.sent();
+                            popover = _a.sent();
                             return [4 /*yield*/, popover.present()];
                         case 2:
-                            _b.sent();
+                            _a.sent();
                             return [2 /*return*/];
                     }
                 });
             });
         };
-        UserEventNotificationComponent.prototype.ngOnDestroy = function () {
+        AppUserEventNotificationIcon.prototype.ngOnDestroy = function () {
             if (this.debug) {
                 console.debug(this._logPrefix + "Destroying");
             }
         };
-        return UserEventNotificationComponent;
+        return AppUserEventNotificationIcon;
     }());
-    UserEventNotificationComponent.decorators = [
+    AppUserEventNotificationIcon.decorators = [
         { type: i0.Component, args: [{
-                    selector: 'app-user-event-notification-component',
-                    template: "<button\n  #button\n  mat-icon-button\n  [title]=\"titleI18n | translate\"\n  [disabled]=\"disabled\"\n  (click)=\"showList($event)\"\n>\n  <mat-icon\n    [matBadge]=\"count | async\"\n    matBadgeColor=\"accent\"\n    matBadgeSize=\"small\"\n    matBadgePosition=\"above after\"\n  >notifications\n  </mat-icon>\n</button>\n\n",
-                    changeDetection: i0.ChangeDetectionStrategy.OnPush,
-                    styles: [""]
+                    selector: 'app-user-event-notification-icon',
+                    template: "<button\n  #button\n  mat-icon-button\n  [title]=\"titleI18n | translate\"\n  [disabled]=\"disabled\"\n  (click)=\"showList($event)\"\n>\n  <mat-icon\n    [matBadge]=\"countChanges | async\"\n    matBadgeColor=\"accent\"\n    matBadgeSize=\"small\"\n    matBadgePosition=\"above after\"\n  >notifications\n  </mat-icon>\n</button>\n\n",
+                    changeDetection: i0.ChangeDetectionStrategy.OnPush
                 },] }
     ];
-    UserEventNotificationComponent.ctorParameters = function () { return [
+    AppUserEventNotificationIcon.ctorParameters = function () { return [
         { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [USER_EVENT_SERVICE,] }] },
         { type: AccountService },
         { type: i1$5.PopoverController }
     ]; };
-    UserEventNotificationComponent.propDecorators = {
+    AppUserEventNotificationIcon.propDecorators = {
         debug: [{ type: i0.Input }],
         titleI18n: [{ type: i0.Input }],
-        disabled: [{ type: i0.Input }]
+        disabled: [{ type: i0.Input }],
+        filter: [{ type: i0.Input }]
     };
 
     var UserEventModule = /** @class */ (function () {
@@ -31000,11 +31006,11 @@
                         AppIconModule
                     ],
                     declarations: [
-                        UserEventNotificationComponent,
+                        AppUserEventNotificationIcon,
                         UserEventNotificationList
                     ],
                     exports: [
-                        UserEventNotificationComponent
+                        AppUserEventNotificationIcon
                     ]
                 },] }
     ];
@@ -31603,6 +31609,11 @@
                         JobModule,
                         MessageModule
                     ],
+                    exports: [
+                        UserEventModule,
+                        JobModule,
+                        MessageModule
+                    ]
                 },] }
     ];
 
@@ -33897,6 +33908,7 @@
     exports.AppTable = AppTable;
     exports.AppTableDataSourceOptions = AppTableDataSourceOptions;
     exports.AppTableUtils = AppTableUtils;
+    exports.AppUserEventNotificationIcon = AppUserEventNotificationIcon;
     exports.AppValidatorService = AppValidatorService;
     exports.AppendToInputDirective = AppendToInputDirective;
     exports.ArrayFilterPipe = ArrayFilterPipe;
@@ -34133,7 +34145,6 @@
     exports.UriUtils = UriUtils;
     exports.UserEventFragments = UserEventFragments;
     exports.UserEventModule = UserEventModule;
-    exports.UserEventNotificationComponent = UserEventNotificationComponent;
     exports.UserEventTypes = UserEventTypes;
     exports.UsersPage = UsersPage;
     exports.accountToString = accountToString;