@sumaris-net/ngx-components 1.21.0-beta3 → 1.21.0-beta30

package/fesm2015/sumaris-net.ngx-components.js

@@ -1959,17 +1959,21 @@ class DateDiffDurationPipe {
             return '';
         const startDate = this.dateAdapter.parse(value.startValue, DATE_ISO_PATTERN);
         const endDate = this.dateAdapter.parse(value.endValue, DATE_ISO_PATTERN);
-        return this.format(startDate, endDate);
+        return this.format(startDate, endDate, args);
     }
-    format(startDate, endDate) {
+    format(startDate, endDate, args) {
         const duration = moment.duration(endDate.diff(startDate));
         if (duration.asMinutes() < 0)
             return '';
+        const withSeconds = args === null || args === void 0 ? void 0 : args.seconds;
         const timeDuration = moment(0)
             .hour(duration.hours())
             .minute(duration.minutes());
+        if (withSeconds) {
+            timeDuration.second(duration.seconds());
+        }
         const days = Math.floor(duration.asDays());
-        return (days > 0 ? days.toString() + (this.dayUnit + ' ') : '') + timeDuration.format('HH:mm');
+        return (days > 0 ? days.toString() + (this.dayUnit + ' ') : '') + timeDuration.format(withSeconds ? 'HH:mm:ss' : 'HH:mm');
     }
 }
 DateDiffDurationPipe.ɵprov = ɵɵdefineInjectable({ factory: function DateDiffDurationPipe_Factory() { return new DateDiffDurationPipe(ɵɵinject(DateAdapter), ɵɵinject(TranslateService)); }, token: DateDiffDurationPipe, providedIn: "root" });
@@ -21431,7 +21435,7 @@ class MenuComponent {
 MenuComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-menu',
-                template: "<ion-split-pane #splitPane [contentId]=\"contentId\" (swiperight)=\"onSwipeRight($event)\">\n\n  <ion-menu [id]=\"id\" [menuId]=\"menuId\" contentId=\"menu-content\">\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              </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\" width=\"108px;\">{{appName}}</span>\n            </ion-col>\n          </ion-row>\n          <ion-row class=\"ion-no-padding\">\n\n            <button mat-button type=\"button\"\n                    [routerLink]=\"['/account']\"\n                    routerDirection=\"root\"\n                    routerLinkActive=\"ion-color-primary\"\n                    (click)=\"close()\">\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\n<!--            todo ajouter ici les 2 composants du module social -->\n\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",
+                template: "<ion-split-pane #splitPane [contentId]=\"contentId\" (swiperight)=\"onSwipeRight($event)\">\n\n  <ion-menu [id]=\"id\" [menuId]=\"menuId\" contentId=\"menu-content\">\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              </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\" width=\"108px;\">{{appName}}</span>\n            </ion-col>\n          </ion-row>\n          <ion-row class=\"ion-no-padding\">\n\n            <button mat-button type=\"button\"\n                    [routerLink]=\"['/account']\"\n                    routerDirection=\"root\"\n                    routerLinkActive=\"ion-color-primary\"\n                    (click)=\"close()\">\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\n<!--            todo ajouter ici les 2 composants du module social ??? -->\n\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",
                 animations: [fadeInAnimation],
                 changeDetection: 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-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)}}"]
@@ -25952,34 +25956,47 @@ const UserEventFragments = {
 const moment$6 = momentImported;
 const UserEventServiceToken = new InjectionToken('UserEventService');
 class AbstractUserEventService extends BaseGraphqlService {
-    constructor(graphql, accountService, network, translate, toastController, queries, mutations, subscriptions, environment) {
+    constructor(graphql, accountService, network, translate, queries, mutations, subscriptions, environment) {
         super(graphql, environment);
         this.graphql = graphql;
         this.accountService = accountService;
         this.network = network;
         this.translate = translate;
-        this.toastController = toastController;
         this.queries = queries;
         this.mutations = mutations;
         this.subscriptions = subscriptions;
         this.environment = environment;
-        this._count$ = new BehaviorSubject(0);
-        this._subscriptions = new Subscription();
+        this.count$ = new BehaviorSubject(0);
         this.listeners = [];
+        this._subscriptions = new Subscription();
         this._logPrefix = '[user-event-service] ';
         // For DEV only
         this._debug = !(environment === null || environment === void 0 ? void 0 : environment.production);
-        // listen login/logout
-        this._subscriptions.add(accountService.onLogin.subscribe(() => __awaiter(this, void 0, void 0, function* () {
-            const count = yield this.count(this.defaultFilter());
-            if (count && this._debug) {
-                console.debug(`${this._logPrefix}Received ${count} unread notifications`);
-            }
-            this._count$.next(count);
-        })));
     }
     get userEventCount() {
-        return this._count$.asObservable();
+        return this.count$.asObservable();
+    }
+    ngOnStart() {
+        return __awaiter(this, void 0, void 0, function* () {
+            // Update component when refresh is need (=login events)
+            this._subscriptions.add(merge(this.accountService.onLogin, this.accountService.onLogout)
+                .pipe(
+            // Wait account service ready (can be restarted)
+            mergeMap(() => this.accountService.ready()), map(() => this.accountService.isLogin()), distinctUntilChanged())
+                .subscribe(login => {
+                if (login) {
+                    this.onLogin();
+                }
+                else {
+                    this.onLogout();
+                }
+            }));
+            // First attempt if account is ready
+            yield this.accountService.ready();
+            if (this.accountService.isLogin()) {
+                setTimeout(() => this.onLogin());
+            }
+        });
     }
     ngOnDestroy() {
         this._subscriptions.unsubscribe();
@@ -25990,13 +26007,15 @@ class AbstractUserEventService extends BaseGraphqlService {
     watchPage(page, filter, options) {
         var _a;
         let now = this._debug && Date.now();
-        //if (this._debug)
+        if (!filter) {
+            filter = this.defaultFilter();
+        }
         console.debug(`${this._logPrefix}Loading user events...`, filter);
         filter = this.asFilter(filter);
         // Force recipient to current issuer, if not admin and not specified
-        if (isEmptyArray(filter.recipients) || !this.accountService.isAdmin()) {
+        if (isEmptyArray(filter === null || filter === void 0 ? void 0 : filter.recipients) || !this.accountService.isAdmin()) {
             const recipient = this.defaultRecipient();
-            if (!((_a = filter.recipients) === null || _a === void 0 ? void 0 : _a.includes(recipient))) {
+            if (!((_a = filter === null || filter === void 0 ? void 0 : filter.recipients) === null || _a === void 0 ? void 0 : _a.includes(recipient))) {
                 console.warn('[user-events-service] Force user event filter.recipient=' + recipient);
                 filter.recipients = [recipient];
             }
@@ -26006,23 +26025,26 @@ class AbstractUserEventService extends BaseGraphqlService {
             queryName: withContent ? 'LoadAllWithContent' : 'LoadAll',
             query: withContent ? this.queries.loadAllWithContent : this.queries.loadAll,
             variables: {
-                page: Object.assign({ sortBy: 'updateDate', sortDirection: 'desc' }, page),
+                page: Object.assign(Object.assign({ sortBy: 'creationDate' }, page), { 
+                    // @ts-ignore
+                    sortDirection: (page.sortDirection || 'desc').toUpperCase() }),
                 filter: filter && filter.asPodObject()
             },
             arrayFieldName: 'data',
             error: { code: SocialErrorCodes.LOAD_USER_EVENTS_ERROR, message: 'SOCIAL.ERROR.LOAD_USER_EVENTS_ERROR' },
-            fetchPolicy: (options === null || options === void 0 ? void 0 : options.fetchPolicy) || "cache-first"
+            fetchPolicy: (options === null || options === void 0 ? void 0 : options.fetchPolicy) || 'cache-first'
         })
             .pipe(map(res => {
-            const data = ((res === null || res === void 0 ? void 0 : res.data) || []).map(this.processUserEvent);
+            let data = ((res === null || res === void 0 ? void 0 : res.data) || []).map(value => this.processUserEvent(value, this));
             if (now) {
                 console.debug(`${this._logPrefix}${data.length} user events loaded in ${Date.now() - now}ms`);
                 now = null;
             }
-            const unreadCount = this.unreadEvents(data);
+            // Must re-order because of listenChanges result will add new event at the end
+            data = EntityUtils.sort(data, page.sortBy, page.sortDirection);
             return {
                 data,
-                total: toNumber(res === null || res === void 0 ? void 0 : res.total, unreadCount)
+                total: toNumber(res === null || res === void 0 ? void 0 : res.total, data.length)
             };
         }));
     }
@@ -26036,7 +26058,7 @@ class AbstractUserEventService extends BaseGraphqlService {
             data: entity
         });
         // Update count
-        this._count$.next(this._count$.value + 1);
+        this.count$.next(this.count$.value + 1);
     }
     count(filter, options) {
         var _a;
@@ -26046,7 +26068,9 @@ class AbstractUserEventService extends BaseGraphqlService {
                 return undefined;
             }
             if (!filter)
-                throw new Error(`Missing argument 'filter'`);
+                filter = this.defaultFilter();
+            // Apply last reset date as start date
+            filter.startDate = this.resetCountDate;
             filter = this.asFilter(filter);
             if (this._debug)
                 console.debug(`${this._logPrefix}Counting user events with filter:`, filter);
@@ -26061,6 +26085,35 @@ class AbstractUserEventService extends BaseGraphqlService {
             return res.total;
         });
     }
+    listenCountChanges(filter, options) {
+        var _a;
+        if (!((_a = this.subscriptions) === null || _a === void 0 ? void 0 : _a.listenCountChanges)) {
+            console.warn(`${this._logPrefix}Subscription query 'listenCountChanges' not provided, skip.`);
+            return of();
+        }
+        if (!filter)
+            filter = this.defaultFilter();
+        // Apply last reset date as start date
+        filter.startDate = this.resetCountDate;
+        filter = this.asFilter(filter);
+        if (this._debug)
+            console.debug(`${this._logPrefix}[WS] Listening count changes for user events with filter:`, filter);
+        return this.graphql.subscribe({
+            query: this.subscriptions.listenCountChanges,
+            fetchPolicy: options === null || options === void 0 ? void 0 : options.fetchPolicy,
+            variables: { filter: filter.asPodObject(), interval: toNumber(options === null || options === void 0 ? void 0 : options.interval, 10) },
+            error: {
+                code: SocialErrorCodes.SUBSCRIBE_USER_EVENTS_ERROR,
+                message: 'SOCIAL.ERROR.SUBSCRIBE_USER_EVENTS_ERROR'
+            }
+        }).pipe(map(({ total }) => {
+            if (total && this._debug)
+                console.debug(`${this._logPrefix}Received new user events count:`, total);
+            // update count
+            this.count$.next(total);
+            return total;
+        }));
+    }
     listenChanges(filter, options) {
         var _a;
         if (!((_a = this.subscriptions) === null || _a === void 0 ? void 0 : _a.listenChanges)) {
@@ -26068,7 +26121,7 @@ class AbstractUserEventService extends BaseGraphqlService {
             return of();
         }
         if (!filter)
-            throw new Error(`Missing argument 'filter'`);
+            filter = this.defaultFilter();
         filter = this.asFilter(filter);
         const withContent = (options === null || options === void 0 ? void 0 : options.withContent) === true;
         if (this._debug)
@@ -26084,14 +26137,12 @@ class AbstractUserEventService extends BaseGraphqlService {
         }).pipe(map(({ data }) => {
             if (data && this._debug)
                 console.debug(`${this._logPrefix}Received new user events:`, data);
-            const updatedData = data === null || data === void 0 ? void 0 : data.map(this.processUserEvent);
+            const updatedData = data === null || data === void 0 ? void 0 : data.map(value => this.processUserEvent(value, this));
             // Update cache
             this.insertIntoMutableCachedQueries(this.graphql.cache, {
                 query: withContent ? this.queries.loadAllWithContent : this.queries.loadAll,
                 data: updatedData
             });
-            // update count
-            this._count$.next(this.unreadEvents(updatedData));
             return updatedData;
         }));
     }
@@ -26136,7 +26187,7 @@ class AbstractUserEventService extends BaseGraphqlService {
         return __awaiter(this, void 0, void 0, function* () {
             this.fillDefaultProperties(entity);
             // Transform into json
-            const isNew = isNil(entity.id);
+            const withContent = !!entity.content;
             const json = entity.asObject();
             const now = Date.now();
             if (this._debug)
@@ -26155,39 +26206,48 @@ class AbstractUserEventService extends BaseGraphqlService {
                             console.debug(`${this._logPrefix}User event saved in ${Date.now() - now}ms`, entity);
                         this.copyIdAndUpdateDate(savedEntity, entity);
                         // Add to cache
-                        if (isNew) {
-                            this.insertIntoMutableCachedQueries(proxy, {
-                                query: this.queries.loadAll,
-                                data: Object.assign(Object.assign({}, savedEntity), { content: null })
-                            });
+                        if (withContent) {
                             this.insertIntoMutableCachedQueries(proxy, {
                                 query: this.queries.loadAllWithContent,
                                 data: savedEntity
                             });
                         }
+                        else {
+                            this.insertIntoMutableCachedQueries(proxy, {
+                                query: this.queries.loadAll,
+                                data: Object.assign(Object.assign({}, savedEntity), { content: null })
+                            });
+                        }
                     }
                 }
             });
             return entity;
         });
     }
-    saveAll(data, opts) {
-        return Promise.all(data
-            .map(entity => this.save(entity, opts)));
+    saveAll(entities, opts) {
+        return __awaiter(this, void 0, void 0, function* () {
+            return Promise.all(entities
+                .map(entity => this.save(entity, opts)));
+        });
     }
-    markAsRead(entity) {
+    markAsRead(entities) {
         return __awaiter(this, void 0, void 0, function* () {
-            // Get onRead listeners
-            const onReadListeners = (this.listeners || []).filter(listener => !!listener.onRead).filter(listener => listener.accept(entity));
-            if (onReadListeners.length) {
-                for (const listener of onReadListeners) {
-                    yield listener.onRead(entity);
+            const userEventWithoutReadListeners = [];
+            for (const entity of (entities || [])) {
+                // Get onRead listeners
+                const onReadListeners = (this.listeners || []).filter(listener => !!listener.onRead).filter(listener => listener.accept(entity));
+                if (onReadListeners.length) {
+                    for (const listener of onReadListeners) {
+                        yield listener.onRead(entity);
+                    }
+                }
+                else {
+                    // Add to this list for default operation
+                    userEventWithoutReadListeners.push(entity);
                 }
             }
-            else {
-                // Use default
-                yield this.defaultMarkAsRead(entity);
-            }
+            // Use default
+            yield this.defaultMarkAsRead(userEventWithoutReadListeners);
         });
     }
     registerListener(listener) {
@@ -26195,37 +26255,93 @@ class AbstractUserEventService extends BaseGraphqlService {
             this.listeners = [];
         this.listeners.push(listener);
     }
+    resetCount() {
+        this.count$.next(undefined);
+        this.resetCountDate = moment$6();
+        // restart listening count changes
+        this.startListenCountChanges();
+    }
     /* -- protected methods -- */
-    processUserEvent(source) {
+    onLogin() {
+        return __awaiter(this, void 0, void 0, function* () {
+            // Get first count
+            const count = yield this.count(undefined);
+            if (this._debug)
+                console.debug(`${this._logPrefix}Receiving user events count`, count);
+            // Update count
+            this.count$.next(count);
+            // Then listen changes
+            this.startListenCountChanges();
+        });
+    }
+    onLogout() {
+        this.stopListenCountChanges();
+    }
+    startListenCountChanges() {
+        this.stopListenCountChanges();
+        this._listenSubscription = this.listenCountChanges(undefined).subscribe();
+    }
+    stopListenCountChanges() {
+        var _a;
+        (_a = this._listenSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
+        this._listenSubscription = undefined;
+    }
+    processUserEvent(source, that) {
+        that = that || this;
         // Convert json source to IUserEvent
-        let target = this.fromObject(source);
+        let target = that.fromObject(source);
         // Get listeners
-        const listeners = (this.listeners || []).filter(listener => listener.onReceived).filter(listener => listener.accept(target));
+        const listeners = (that.listeners || []).filter(listener => listener.onReceived).filter(listener => listener.accept(target));
         for (const listener of listeners) {
             if (target) {
                 target = listener.onReceived(target);
             }
             else {
-                if (this._debug)
-                    console.debug(`${this._logPrefix}Event has been rejected by a listener`, source);
+                if (that._debug)
+                    console.debug(`${that._logPrefix}Event has been rejected by a listener`, source);
                 break;
             }
         }
         return target;
     }
-    defaultMarkAsRead(userEvent) {
+    defaultMarkAsRead(userEvents) {
+        var _a;
         return __awaiter(this, void 0, void 0, function* () {
-            if (!userEvent)
+            if (!userEvents)
                 throw new Error(`${this._logPrefix}Invalid event to save`);
+            if (!userEvents.length)
+                return;
             // set read date
-            userEvent.readDate = moment$6();
-            if (!userEvent.id || userEvent.id < 0) {
+            userEvents.forEach(userEvent => userEvent.readDate = moment$6());
+            // split local/remote entities
+            const localEntities = userEvents.filter(userEvent => !userEvent.id || userEvent.id < 0);
+            const remoteEntities = userEvents.filter(userEvent => userEvent.id > 0);
+            // save local entities
+            if (localEntities.length) {
                 if (this._debug)
                     console.debug(`${this._logPrefix}Save local user event`);
                 // TODO !!!!!!!!!!!!!
             }
-            else {
-                yield this.save(userEvent);
+            // mark remote entities as read
+            if (remoteEntities.length) {
+                if (!((_a = this.mutations) === null || _a === void 0 ? void 0 : _a.markAsRead)) {
+                    console.warn(`${this._logPrefix}Mutation query 'markAsRead' not provided, skip.`);
+                    return;
+                }
+                // Collect ids
+                const ids = remoteEntities.map(value => value.id);
+                const now = Date.now();
+                if (this._debug)
+                    console.debug(`${this._logPrefix}Mark user events as read...`, ids);
+                yield this.graphql.mutate({
+                    mutation: this.mutations.markAsRead,
+                    variables: {
+                        ids
+                    },
+                    error: { code: SocialErrorCodes.SAVE_USER_EVENT_ERROR, message: 'SOCIAL.ERROR.SAVE_USER_EVENT_ERROR' },
+                });
+                if (this._debug)
+                    console.debug(`${this._logPrefix}User events marked as read in ${Date.now() - now}ms`, ids);
             }
         });
     }
@@ -26262,7 +26378,6 @@ AbstractUserEventService.ctorParameters = () => [
     { type: AccountService },
     { type: NetworkService },
     { type: TranslateService },
-    { type: ToastController },
     { type: undefined },
     { type: undefined },
     { type: undefined },
@@ -26303,7 +26418,7 @@ const userEventMutations = {
 };
 class UserEventService extends AbstractUserEventService {
     constructor(graphql, accountService, network, translate, toastController, environment) {
-        super(graphql, accountService, network, translate, toastController, userEventQueries, userEventMutations, undefined, environment);
+        super(graphql, accountService, network, translate, userEventQueries, userEventMutations, undefined, environment);
         this.graphql = graphql;
         this.accountService = accountService;
         this.network = network;
@@ -26548,7 +26663,7 @@ class UserEventsTable extends AppTable {
 UserEventsTable.decorators = [
     { type: Component, args: [{
                 selector: 'app-user-events-table',
-                template: "\n<!-- Type = options menu -->\n<mat-menu #optionsMenu=\"matMenu\" xPosition=\"after\">\n\n  <!-- display columns -->\n  <button mat-menu-item\n          (click)=\"openSelectColumnsModal($event)\">\n    <mat-icon>view_column</mat-icon>\n    <ion-label translate>COMMON.DISPLAYED_COLUMNS_DOTS</ion-label>\n  </button>\n\n</mat-menu>\n\n<!-- top header -->\n<mat-toolbar>\n\n  <ng-container *ngIf=\"!selection.hasValue(); else hasSelection\">\n\n    <button mat-icon-button [title]=\"'COMMON.BTN_REFRESH'|translate\" (click)=\"onRefresh.emit()\">\n      <mat-icon>refresh</mat-icon>\n    </button>\n\n  </ng-container>\n\n  <!-- if row selection -->\n  <ng-template #hasSelection>\n\n    <!-- delete -->\n    <button mat-icon-button class=\"hidden-xs hidden-sm\" *ngIf=\"canDelete\"\n            [title]=\"'COMMON.BTN_DELETE'|translate\" (click)=\"deleteSelection($event)\">\n      <mat-icon>delete</mat-icon>\n    </button>\n  </ng-template>\n\n  <!-- error -->\n  <ion-item *ngIf=\"error\" hidden-xs hidden-sm hidden-mobile lines=\"none\">\n    <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n    <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error|translate\"></ion-label>\n  </ion-item>\n\n  <div class=\"toolbar-spacer\"></div>\n\n  <button mat-icon-button\n          [title]=\"'COMMON.BTN_OPTIONS'|translate\"\n          [matMenuTriggerFor]=\"optionsMenu\">\n    <mat-icon>more_vert</mat-icon>\n  </button>\n</mat-toolbar>\n\n\n<mat-table [dataSource]=\"dataSource\" matSort\n           [matSortActive]=\"defaultSortBy\"\n           [matSortDirection]=\"defaultSortDirection\"\n           matSortDisableClear [trackBy]=\"trackByFn\">\n\n  <!-- select -->\n  <ng-container matColumnDef=\"select\">\n    <mat-header-cell *matHeaderCellDef [class.cdk-visually-hidden]=\"!canEdit\">\n      <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\n                    [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\n      </mat-checkbox>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!canEdit\">\n      <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\" [checked]=\"selection.isSelected(row)\">\n      </mat-checkbox>\n    </mat-cell>\n  </ng-container>\n\n  <!-- id -->\n  <ng-container matColumnDef=\"id\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header [class.cdk-visually-hidden]=\"!isAdmin\">\n      <app-loading-spinner [loading]=\"loadingSubject|async\"><ion-label>#</ion-label></app-loading-spinner>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!isAdmin\">{{ row.currentData.id | mathAbs }}</mat-cell>\n  </ng-container>\n\n  <!-- creationDate -->\n  <ng-container matColumnDef=\"creationDate\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header>\n      <ion-label translate>SOCIAL.USER_EVENT.CREATION_DATE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\">\n      <ion-text>\n        {{row.currentData.creationDate | dateFromNow }}<br/>\n        <ion-text color=\"medium\"><small>{{row.currentData.creationDate | dateFormat: {time: true} }}</small></ion-text>\n      </ion-text>\n    </mat-cell>\n  </ng-container>\n\n  <!-- icon -->\n  <ng-container matColumnDef=\"icon\">\n    <mat-header-cell *matHeaderCellDef>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <ng-container *ngIf=\"getIcon(row.currentData); let details\">\n        <ion-icon slot=\"start\" *ngIf=\"details.icon\" [name]=\"details.icon\"></ion-icon>\n        <mat-icon slot=\"start\" *ngIf=\"details.matIcon\">{{details.matIcon}}</mat-icon>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <!-- event type -->\n  <ng-container matColumnDef=\"eventType\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header>\n      <ion-label translate>SOCIAL.USER_EVENT.EVENT_TYPE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <span>{{'SOCIAL.USER_EVENT.TYPE_ENUM.' + row.currentData.eventType | translate}}</span>\n    </mat-cell>\n  </ng-container>\n\n  <!-- message -->\n  <ng-container matColumnDef=\"message\">\n    <mat-header-cell *matHeaderCellDef>\n      <ion-label translate>SOCIAL.USER_EVENT.MESSAGE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <ng-container *ngIf=\"getDetail(row.currentData); let details\">\n        <ion-text [innerHTML]=\"details.title|translate\">\n        </ion-text>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <!-- Actions buttons column -->\n  <ng-container matColumnDef=\"actions\">\n    <mat-header-cell *matHeaderCellDef>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\">\n      <ng-container *ngIf=\"getDetail(row.currentData); let details\">\n        <button mat-icon-button color=\"light\"\n                *ngFor=\"let action of details.actions\"\n                [title]=\"action.title |translate\"\n                [color]=\"action.color\"\n                (click)=\"doAction(action, row)\">\n          <ion-icon slot=\"start\" *ngIf=\"action.icon\" [name]=\"action.icon\"></ion-icon>\n          <mat-icon slot=\"start\" *ngIf=\"action.matIcon\">{{action.matIcon}}</mat-icon>\n        </button>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n  <mat-row *matRowDef=\"let row; columns: displayedColumns;\"\n           class=\"mat-row-disabled\"\n           (click)=\"clickRow($event, row)\"></mat-row>\n\n</mat-table>\n\n<ion-row class=\"ion-no-padding\">\n  <ion-col></ion-col>\n  <ion-col class=\"ion-no-padding\" size=\"auto\">\n    <mat-paginator [length]=\"totalRowCount\" [pageSize]=\"defaultPageSize\" [pageSizeOptions]=\"defaultPageSizeOptions\" showFirstLastButtons>\n    </mat-paginator>\n  </ion-col>\n</ion-row>\n",
+                template: "\n<!-- Type = options menu -->\n<mat-menu #optionsMenu=\"matMenu\" xPosition=\"after\">\n\n  <!-- display columns -->\n  <button mat-menu-item\n          (click)=\"openSelectColumnsModal($event)\">\n    <mat-icon>view_column</mat-icon>\n    <ion-label translate>COMMON.DISPLAYED_COLUMNS_DOTS</ion-label>\n  </button>\n\n</mat-menu>\n\n<!-- top header -->\n<mat-toolbar>\n\n  <ng-container *ngIf=\"!selection.hasValue(); else hasSelection\">\n\n    <button mat-icon-button [title]=\"'COMMON.BTN_REFRESH'|translate\" (click)=\"onRefresh.emit()\">\n      <mat-icon>refresh</mat-icon>\n    </button>\n\n  </ng-container>\n\n  <!-- if row selection -->\n  <ng-template #hasSelection>\n\n    <!-- delete -->\n    <button mat-icon-button class=\"hidden-xs hidden-sm\" *ngIf=\"canDelete\"\n            [title]=\"'COMMON.BTN_DELETE'|translate\" (click)=\"deleteSelection($event)\">\n      <mat-icon>delete</mat-icon>\n    </button>\n  </ng-template>\n\n  <!-- error -->\n  <ion-item *ngIf=\"error\" hidden-xs hidden-sm hidden-mobile lines=\"none\">\n    <ion-icon color=\"danger\" slot=\"start\" name=\"alert-circle\"></ion-icon>\n    <ion-label color=\"danger\" class=\"error\" [innerHTML]=\"error|translate\"></ion-label>\n  </ion-item>\n\n  <div class=\"toolbar-spacer\"></div>\n\n  <button mat-icon-button\n          [title]=\"'COMMON.BTN_OPTIONS'|translate\"\n          [matMenuTriggerFor]=\"optionsMenu\">\n    <mat-icon>more_vert</mat-icon>\n  </button>\n</mat-toolbar>\n\n\n<mat-table [dataSource]=\"dataSource\" matSort\n           [matSortActive]=\"defaultSortBy\"\n           [matSortDirection]=\"defaultSortDirection\"\n           matSortDisableClear [trackBy]=\"trackByFn\">\n\n  <!-- select -->\n  <ng-container matColumnDef=\"select\">\n    <mat-header-cell *matHeaderCellDef [class.cdk-visually-hidden]=\"!canEdit\">\n      <mat-checkbox (change)=\"$event ? masterToggle() : null\" [checked]=\"selection.hasValue() && isAllSelected()\"\n                    [indeterminate]=\"selection.hasValue() && !isAllSelected()\">\n      </mat-checkbox>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!canEdit\">\n      <mat-checkbox (click)=\"$event.stopPropagation()\" (change)=\"$event ? selection.toggle(row) : null\" [checked]=\"selection.isSelected(row)\">\n      </mat-checkbox>\n    </mat-cell>\n  </ng-container>\n\n  <!-- id -->\n  <ng-container matColumnDef=\"id\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header [class.cdk-visually-hidden]=\"!isAdmin\">\n      <app-loading-spinner [loading]=\"loadingSubject|async\"><ion-label>#</ion-label></app-loading-spinner>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\" [class.cdk-visually-hidden]=\"!isAdmin\">{{ row.currentData.id | mathAbs }}</mat-cell>\n  </ng-container>\n\n  <!-- creationDate -->\n  <ng-container matColumnDef=\"creationDate\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header>\n      <ion-label translate>SOCIAL.USER_EVENT.CREATION_DATE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\">\n      <ion-text>\n        {{row.currentData.creationDate | dateFromNow }}<br/>\n        <ion-text color=\"medium\"><small>{{row.currentData.creationDate | dateFormat: {time: true} }}</small></ion-text>\n      </ion-text>\n    </mat-cell>\n  </ng-container>\n\n  <!-- icon -->\n  <ng-container matColumnDef=\"icon\">\n    <mat-header-cell *matHeaderCellDef>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <ng-container *ngIf=\"getIcon(row.currentData); let details\">\n        <ion-icon slot=\"start\" *ngIf=\"details.icon\" [name]=\"details.icon\"></ion-icon>\n        <mat-icon slot=\"start\" *ngIf=\"details.matIcon\">{{details.matIcon}}</mat-icon>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <!-- event type -->\n  <ng-container matColumnDef=\"eventType\">\n    <mat-header-cell *matHeaderCellDef mat-sort-header>\n      <ion-label translate>SOCIAL.USER_EVENT.EVENT_TYPE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <span>{{'SOCIAL.USER_EVENT.TYPE_ENUM.' + row.currentData.eventType | translate}}</span>\n    </mat-cell>\n  </ng-container>\n\n  <!-- message -->\n  <ng-container matColumnDef=\"message\">\n    <mat-header-cell *matHeaderCellDef>\n      <ion-label translate>SOCIAL.USER_EVENT.MESSAGE</ion-label>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row;\">\n      <ng-container *ngIf=\"getDetail(row.currentData); let details\">\n        <ion-text [innerHTML]=\"details.title|translate\">\n        </ion-text>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <!-- Actions buttons column -->\n  <ng-container matColumnDef=\"actions\">\n    <mat-header-cell *matHeaderCellDef>\n    </mat-header-cell>\n    <mat-cell *matCellDef=\"let row\">\n      <ng-container *ngIf=\"getDetail(row.currentData); let details\">\n        <button mat-icon-button color=\"light\"\n                *ngFor=\"let action of details.actions\"\n                [title]=\"action.title |translate\"\n                [color]=\"action.color\"\n                (click)=\"doAction(action, row)\">\n          <app-icon slot=\"start\" *ngIf=\"action.iconRef\" [ref]=\"action.iconRef\"></app-icon>\n        </button>\n      </ng-container>\n    </mat-cell>\n  </ng-container>\n\n  <mat-header-row *matHeaderRowDef=\"displayedColumns\"></mat-header-row>\n  <mat-row *matRowDef=\"let row; columns: displayedColumns;\"\n           class=\"mat-row-disabled\"\n           (click)=\"clickRow($event, row)\"></mat-row>\n\n</mat-table>\n\n<ion-row class=\"ion-no-padding\">\n  <ion-col></ion-col>\n  <ion-col class=\"ion-no-padding\" size=\"auto\">\n    <mat-paginator [length]=\"totalRowCount\" [pageSize]=\"defaultPageSize\" [pageSizeOptions]=\"defaultPageSizeOptions\" showFirstLastButtons>\n    </mat-paginator>\n  </ion-col>\n</ion-row>\n",
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 providers: [
                     {
@@ -26574,17 +26689,47 @@ UserEventsTable.propDecorators = {
 };
 
 class UserEventNotificationList {
-    constructor(popoverController) {
+    constructor(cd, popoverController, userEventService) {
+        this.cd = cd;
         this.popoverController = popoverController;
+        this.userEventService = userEventService;
+        this.debug = false;
+        this.userEvents = new BehaviorSubject(undefined);
+        this.subscriptions = new Subscription();
     }
     ngOnInit() {
+        // Watch all user events
+        this.subscriptions.add(this.userEventService
+            .watchAll(0, 10, 'creationDate', "desc", undefined)
+            .subscribe(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(data => {
+            if (this.debug)
+                console.debug(`[user-event-notification-list] receiving ${data.length} new user events`, data);
+        }));
+    }
+    ngOnDestroy() {
+        this.subscriptions.unsubscribe();
     }
-    read($event, userEvent) {
+    read(event, userEvent) {
         var _a;
         if (userEvent === null || userEvent === void 0 ? void 0 : userEvent.readDate)
             return;
         (_a = this.readEvent) === null || _a === void 0 ? void 0 : _a.emit(userEvent);
     }
+    readAll(event) {
+        var _a;
+        const unreadUserEvents = (this.userEvents.value || []).filter(value => !value.readDate);
+        if (!unreadUserEvents.length)
+            return;
+        (_a = this.readEvents) === null || _a === void 0 ? void 0 : _a.emit(unreadUserEvents);
+    }
     executeAction(action, userEvent) {
         // Execute then close popover
         action.executeAction(userEvent);
@@ -26593,69 +26738,74 @@ class UserEventNotificationList {
     dismiss() {
         this.popoverController.dismiss();
     }
+    markForCheck() {
+        this.cd.markForCheck();
+    }
 }
 UserEventNotificationList.decorators = [
     { type: Component, args: [{
                 selector: 'app-user-event-notification-list',
-                template: "\n<ion-list class=\"ion-list-popover\">\n\n  <ion-row class=\"ion-list-header column\">\n    <ion-col>\n      <ion-label>{{titleI18n | translate}}</ion-label>\n    </ion-col>\n  </ion-row>\n\n  <ion-item *ngIf=\"!(userEvents | async)?.length\">\n    {{'SOCIAL.USER_EVENT.NOTIFICATION.EMPTY' | translate}}\n  </ion-item>\n  <ion-item\n    *ngFor=\"let userEvent of userEvents | async\"\n    (click)=\"read($event, userEvent)\"\n  >\n\n    <ion-avatar slot=\"start\">\n\n      <img *ngIf=\"userEvent.avatar; else avatarIcon\" src=\"{{ userEvent.avatar }}\">\n\n      <ng-template #avatarIcon>\n        <app-icon\n          *ngIf=\"userEvent.avatarIcon\"\n          [ref]=\"userEvent.avatarIcon\"\n          height=\"40\"\n          width=\"40\"\n        ></app-icon>\n      </ng-template>\n\n    </ion-avatar>\n\n    <ion-grid class=\"ion-no-margin ion-no-padding\">\n      <ion-row>\n        <ion-col>\n          <p [class.unread]=\"!userEvent.readDate\">\n            {{userEvent.message}}\n          </p>\n        </ion-col>\n      </ion-row>\n      <ion-row *ngIf=\"userEvent.actions?.length\">\n        <ion-col>\n          <p>\n            <span *ngFor=\"let action of userEvent.actions\">\n              <a\n                [style.margin-right.px]=\"8\"\n                [style.cursor]=\"'pointer'\"\n                (click)=\"executeAction(action, userEvent)\"\n              >\n                {{ '&#10142;&nbsp;' + action.name}}\n              </a>\n            </span>\n          </p>\n        </ion-col>\n      </ion-row>\n      <ion-row>\n        <ion-col>\n          <app-icon\n            *ngIf=\"userEvent.icon\"\n            [ref]=\"userEvent.icon\"\n            height=\"16\"\n            width=\"16\"\n            [style.vertical-align]=\"'sub'\"\n          ></app-icon>\n          <small>\n            <span>{{userEvent.creationDate|dateFromNow}}</span>\n            <span [style.color]=\"'gray'\">{{ ' | ' + (userEvent.creationDate|dateFormat:{time:true}) }}</span>\n          </small>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  </ion-item>\n\n</ion-list>\n",
-                styles: [":host(.popover-viewport){overflow-y:auto;-webkit-user-select:none;-moz-user-select:none;user-select:none}.unread{font-weight:700}"]
+                template: "\n<ion-list class=\"ion-list-popover\">\n\n  <ion-row class=\"ion-list-header column\">\n    <ion-col>\n      <ion-label>{{titleI18n | translate}}</ion-label>\n    </ion-col>\n    <ion-col class=\"top-action\">\n      <a (click)=\"readAll($event)\">{{'SOCIAL.USER_EVENT.NOTIFICATION.READ_ALL' | translate}}</a>\n    </ion-col>\n  </ion-row>\n\n  <ion-item *ngIf=\"!(userEvents | async)?.length\">\n    {{'SOCIAL.USER_EVENT.NOTIFICATION.EMPTY' | translate}}\n  </ion-item>\n  <ion-item\n    *ngFor=\"let userEvent of userEvents | async\"\n    (click)=\"read($event, userEvent)\"\n  >\n\n    <ion-avatar slot=\"start\">\n\n      <img *ngIf=\"userEvent.avatar; else avatarIcon\" src=\"{{ userEvent.avatar }}\">\n\n      <ng-template #avatarIcon>\n        <app-icon\n          *ngIf=\"userEvent.avatarIcon\"\n          [ref]=\"userEvent.avatarIcon\"\n          height=\"40\"\n          width=\"40\"\n        ></app-icon>\n      </ng-template>\n\n    </ion-avatar>\n\n    <ion-grid class=\"ion-no-margin ion-no-padding message\">\n      <ion-row>\n        <ion-col>\n          <p [class.unread]=\"!userEvent.readDate\" [innerHTML]=\"userEvent.message\"></p>\n        </ion-col>\n      </ion-row>\n      <ion-row *ngIf=\"userEvent.actions?.length\">\n        <ion-col>\n          <span *ngFor=\"let action of userEvent.actions\" class=\"action\">\n            <a (click)=\"executeAction(action, userEvent)\">\n              <app-icon *ngIf=\"action.iconRef\" slot=\"start\" height=\"20\" width=\"20\" [ref]=\"action.iconRef\"></app-icon>\n              {{ action.name }}\n            </a>\n          </span>\n        </ion-col>\n      </ion-row>\n      <ion-row>\n        <ion-col>\n          <app-icon\n            *ngIf=\"userEvent.icon\"\n            [ref]=\"userEvent.icon\"\n            height=\"16\"\n            width=\"16\"\n            style=\"vertical-align: sub; margin-right: 3px\"\n          ></app-icon>\n          <small>\n            <span>{{userEvent.creationDate|dateFromNow}}</span>\n            <span style=\"color: gray\">{{ ' | ' + (userEvent.creationDate|dateFormat:{time:true}) }}</span>\n          </small>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  </ion-item>\n\n  <ion-row class=\"ion-list-footer column\">\n  </ion-row>\n\n</ion-list>\n",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                styles: [":host(.popover-viewport){overflow-y:auto;-webkit-user-select:none;-moz-user-select:none;user-select:none}.unread{font-weight:700}.message{font-size:.9em}.message p{margin-top:5px;margin-bottom:5px}.top-action{text-align:end;margin-right:8px}.top-action a{cursor:pointer;color:#f5f5f5;font-style:italic}.action a{margin-right:10px;cursor:pointer}.action app-icon{vertical-align:middle}"]
             },] }
 ];
 UserEventNotificationList.ctorParameters = () => [
-    { type: PopoverController }
+    { type: ChangeDetectorRef },
+    { type: PopoverController },
+    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [UserEventServiceToken,] }] }
 ];
 UserEventNotificationList.propDecorators = {
+    debug: [{ type: Input }],
     titleI18n: [{ type: Input }],
-    userEvents: [{ type: Input }],
-    readEvent: [{ type: Output }]
+    readEvent: [{ type: Output }],
+    readEvents: [{ type: Output }]
 };
 
 class UserEventNotificationComponent {
-    constructor(userEventService, accountService, popoverController, cd) {
+    constructor(userEventService, accountService, popoverController) {
         this.userEventService = userEventService;
         this.accountService = accountService;
         this.popoverController = popoverController;
-        this.cd = cd;
         this.debug = false;
         this.titleI18n = 'SOCIAL.USER_EVENT.NOTIFICATION.TITLE';
         this.disabled = false;
-        this.userEventsSubject = new BehaviorSubject(undefined);
-        this._subscriptions = new Subscription();
         this._logPrefix = '[user-event-notification] ';
         this._readEvent = new EventEmitter();
+        this._readEvents = new EventEmitter();
     }
     get count() {
         var _a;
         return (_a = this.userEventService) === null || _a === void 0 ? void 0 : _a.userEventCount.pipe(map(value => value === 0 ? undefined : value));
     }
     ngOnInit() {
-        var _a;
-        if (isNil(this.userEventService)) {
-            console.warn(`${this._logPrefix}No service injected`);
-            this.disabled = true;
-            return;
-        }
-        this._subscriptions.add(this.userEventService.watchAll(0, 10, 'creationDate', "desc", {
-            recipients: [(_a = this.accountService.person) === null || _a === void 0 ? void 0 : _a.pubkey]
-        }).subscribe(value => {
-            const data = value.data;
-            if (this.debug) {
-                console.debug(`${this._logPrefix}Receiving user events`, data);
+        return __awaiter(this, void 0, void 0, function* () {
+            if (isNil(this.userEventService)) {
+                console.warn(`${this._logPrefix}No service injected`);
+                this.disabled = true;
+                return;
             }
-            this.userEventsSubject.next(data);
-        }));
-        this._readEvent.subscribe(value => {
-            this.userEventService.markAsRead(value);
+            // Subscribe to read event
+            this._readEvent.subscribe(value => {
+                // default: mark event as read
+                this.userEventService.markAsRead([value]);
+            });
+            this._readEvents.subscribe(value => {
+                this.userEventService.markAsRead(value);
+            });
         });
     }
     showList(event) {
         return __awaiter(this, void 0, void 0, function* () {
+            // Reset count
+            this.userEventService.resetCount();
             const popover = yield this.popoverController.create({
                 component: UserEventNotificationList,
                 componentProps: {
+                    debug: this.debug,
                     titleI18n: this.titleI18n,
-                    userEvents: this.userEventsSubject,
-                    readEvent: this._readEvent
+                    readEvent: this._readEvent,
+                    readEvents: this._readEvents
                 },
                 backdropDismiss: true,
                 keyboardClose: true,
@@ -26666,14 +26816,10 @@ class UserEventNotificationComponent {
             yield popover.present();
         });
     }
-    markForCheck() {
-        this.cd.markForCheck();
-    }
     ngOnDestroy() {
         if (this.debug) {
             console.debug(`${this._logPrefix}Destroying`);
         }
-        this._subscriptions.unsubscribe();
     }
 }
 UserEventNotificationComponent.decorators = [
@@ -26687,8 +26833,7 @@ UserEventNotificationComponent.decorators = [
 UserEventNotificationComponent.ctorParameters = () => [
     { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [UserEventServiceToken,] }] },
     { type: AccountService },
-    { type: PopoverController },
-    { type: ChangeDetectorRef }
+    { type: PopoverController }
 ];
 UserEventNotificationComponent.propDecorators = {
     debug: [{ type: Input }],
@@ -26696,6 +26841,69 @@ UserEventNotificationComponent.propDecorators = {
     disabled: [{ type: Input }]
 };
 
+class UserEventTestService extends AbstractUserEventService {
+    constructor(graphql, accountService, network, translate, environment) {
+        super(graphql, accountService, network, translate, undefined, undefined, undefined, environment);
+        this.graphql = graphql;
+        this.accountService = accountService;
+        this.network = network;
+        this.translate = translate;
+        this.environment = environment;
+        this.userEvents = [];
+    }
+    fromObject(source) {
+        return UserEvent.fromObject(source);
+    }
+    add(entity) {
+        entity = this.processUserEvent(entity);
+        entity.id = this.userEvents.length + 1;
+        this.userEvents.push(entity);
+        this.count$.next(this.userEvents.length);
+    }
+    asFilter(filter) {
+        return filter;
+    }
+    count(filter, options) {
+        return Promise.resolve(this.userEvents.length);
+    }
+    delete(entity) {
+        return Promise.resolve(undefined);
+    }
+    deleteAll(data, opts) {
+        return Promise.resolve(undefined);
+    }
+    listenChanges(filter, options) {
+        return of();
+    }
+    save(entity, options) {
+        var _a;
+        const toSave = (_a = this.userEvents) === null || _a === void 0 ? void 0 : _a.find(value => value.id == (entity === null || entity === void 0 ? void 0 : entity.id));
+        Object.assign(toSave, entity);
+        return entity;
+    }
+    saveAll(data, opts) {
+        return __awaiter(this, void 0, void 0, function* () {
+            for (const entity of (data || [])) {
+                yield this.save(entity);
+            }
+            return Promise.resolve(this.userEvents);
+        });
+    }
+    watchAll(offset, size, sortBy, sortDirection, filter, options) {
+        return of({ data: this.userEvents });
+    }
+}
+UserEventTestService.decorators = [
+    { type: Injectable }
+];
+UserEventTestService.ctorParameters = () => [
+    { type: GraphqlService },
+    { type: AccountService },
+    { type: NetworkService },
+    { type: TranslateService },
+    { type: Environment, decorators: [{ type: Optional }, { type: Inject, args: [ENVIRONMENT,] }] }
+];
+
 class UserEventModule {
 }
 UserEventModule.decorators = [
@@ -26713,6 +26921,9 @@ UserEventModule.decorators = [
                 exports: [
                     UserEventsTable,
                     UserEventNotificationComponent
+                ],
+                providers: [
+                    { provide: UserEventServiceToken, useClass: UserEventTestService }
                 ]
             },] }
 ];
@@ -26953,11 +27164,13 @@ class Job {
 }
 // @dynamic
 let JobProgression = JobProgression_1 = class JobProgression extends Entity {
-    constructor() {
+    constructor(id) {
         super(JobProgression_1.TYPENAME);
+        this.id = id;
     }
     fromObject(source) {
         super.fromObject(source);
+        this.name = source.name;
         this.message = source.message;
         this.current = source.current;
         this.total = source.total;
@@ -26971,10 +27184,10 @@ const JobProgressionServiceToken = new InjectionToken('JobProgressionService');
 const jobProgressionSubscription = gql `subscription UpdateJobProgression($id: Int!, $interval: Int){
   data: updateJobProgression(id: $id, interval: $interval) {
     id
+    name
     message
     current
     total
-    updateDate
   }
 }`;
 class JobProgressionService extends BaseGraphqlService {
@@ -27021,8 +27234,8 @@ class JobProgressionList {
 JobProgressionList.decorators = [
     { type: Component, args: [{
                 selector: 'app-job-progression-list',
-                template: "<ion-list class=\"ion-list-popover\">\n\n  <ion-row class=\"ion-list-header column\">\n    <ion-col>\n      <ion-label>{{titleI18n | translate}}</ion-label>\n    </ion-col>\n  </ion-row>\n\n  <ion-item *ngIf=\"!jobProgressions?.length\">\n    {{'SOCIAL.JOB.PROGRESSION.EMPTY' | translate}}\n  </ion-item>\n  <ion-item *ngFor=\"let jobProgression of jobProgressions\">\n    <ion-grid class=\"ion-no-margin\">\n      <ion-row>\n        <ion-col>\n          {{jobProgression.message}}\n        </ion-col>\n      </ion-row>\n      <ion-row>\n        <ion-col>\n          <ion-progress-bar\n            [value]=\"jobProgression.total > 0 ? jobProgression.current / jobProgression.total : undefined\"\n            [type]=\"jobProgression.total > 0 ? 'determinate' : 'indeterminate'\">\n          </ion-progress-bar>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  </ion-item>\n\n</ion-list>\n",
-                styles: [":host(.popover-viewport){overflow-y:auto;-webkit-user-select:none;-moz-user-select:none;user-select:none}"]
+                template: "<ion-list class=\"ion-list-popover\">\n\n  <ion-row class=\"ion-list-header column\">\n    <ion-col>\n      <ion-label>{{titleI18n | translate}}</ion-label>\n    </ion-col>\n  </ion-row>\n\n  <ion-item *ngIf=\"!jobProgressions?.length\">\n    {{'SOCIAL.JOB.PROGRESSION.EMPTY' | translate}}\n  </ion-item>\n  <ion-item *ngFor=\"let jobProgression of jobProgressions\" class=\"ion-item-job-progression\">\n    <ion-grid class=\"ion-no-margin\">\n      <ion-row class=\"name\">\n        <ion-col>\n          {{jobProgression.name}}\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"message\">\n        <ion-col>\n          {{jobProgression.message}}\n        </ion-col>\n      </ion-row>\n      <ion-row class=\"progress-bar\">\n        <ion-col>\n          <ion-progress-bar\n            [value]=\"jobProgression.total > 0 ? jobProgression.current / jobProgression.total : undefined\"\n            [type]=\"jobProgression.total > 0 ? 'determinate' : 'indeterminate'\">\n          </ion-progress-bar>\n        </ion-col>\n      </ion-row>\n    </ion-grid>\n  </ion-item>\n\n</ion-list>\n",
+                styles: [":host(.popover-viewport){overflow-y:auto;-webkit-user-select:none;-moz-user-select:none;user-select:none}.ion-item-job-progression{font-size:.9em}.ion-item-job-progression .message{font-style:italic}.ion-item-job-progression .progress-bar{margin-top:5px;margin-bottom:5px}"]
             },] }
 ];
 JobProgressionList.ctorParameters = () => [];
@@ -27065,13 +27278,16 @@ class JobProgressionComponent {
             console.warn(`${this._logPrefix}No service injected. Can't add a job`);
             return;
         }
-        if (this.debug) {
-            console.debug(`${this._logPrefix}Add job id=${id}`);
-        }
         if (!!this.getProgression(id)) {
             console.warn(`${this._logPrefix}Job (id=${id}) already present`);
             return;
         }
+        if (this.debug) {
+            console.debug(`${this._logPrefix}Add job id=${id}`);
+        }
+        // Adding empty job progression
+        const progression = new JobProgression(id);
+        this.jobProgressions.push(progression);
         this.disabled = false;
         const sub = this.jobProgressionService.listenChanges(id)
             .pipe(filter(progression => {
@@ -27086,7 +27302,7 @@ class JobProgressionComponent {
             // Get current progression object
             const currentProgression = this.getProgression(id);
             if (!currentProgression) {
-                // add it
+                // add it if absent
                 this.jobProgressions.push(progression);
                 if (this.debug) {
                     console.debug(`${this._logPrefix}Progression added id=${id}`, progression);
@@ -29179,5 +29395,5 @@ CoreTestingModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { APP_ABOUT_DEVELOPERS, APP_ABOUT_PARTNERS, APP_CONFIG_OPTIONS, APP_FORM_ERROR_I18N_KEYS, APP_GRAPHQL_TYPE_POLICIES, APP_HOME_BUTTONS, APP_LOCALES, APP_LOCAL_SETTINGS, APP_LOCAL_SETTINGS_OPTIONS, APP_LOCAL_STORAGE_TYPE_POLICIES, APP_MENU_ITEMS, APP_TESTING_PAGES, AboutModal, AbstractUserEventService, Account, AccountPage, AccountService, AccountToStringPipe, ActionsColumnComponent, AdminModule, AdminRoutingModule, Alerts, AndroidOsEnvironment, AnimationState, AppEditor, AppEditorOptions, AppEntityEditor, AppEntityEditorModal, AppEntityEditorModalOptions, AppForm, AppFormField, AppFormProvider, AppFormUtils, AppGestureConfig, AppGraphQLModule, AppHelpModal, AppInMemoryTable, AppInstallUpgradeCard, AppListForm, AppLoadingSpinner, AppMenuModule, AppNullForm, AppPropertiesForm, AppTabEditor, AppTabEditorOptions, AppTable, AppTableDataSourceOptions, AppTableUtils, AppValidatorService, AppendToInputDirective, ArrayFilterPipe, ArrayFirstPipe, ArrayIncludesPipe, ArrayLengthPipe, ArrayPluckPipe, AudioProvider, AuthForm, AuthGuardService, AuthModal, AutoTitleDirective, AutocompleteTestPage, AutofocusDirective, Base58, BaseEntityService, BaseGraphqlService, BaseGraphqlServiceOptions, BaseReferential, Beans, CORE_CONFIG_OPTIONS, CORE_TESTING_PAGES, CellValueChangeListener, ChipsTestPage, Color, ColorScale, ComponentDirtyGuard, ConfigService, Configuration, CoreModule, CoreTestingModule, CryptoService, CsvUtils, DATE_ISO_PATTERN, DATE_UNIX_MS_TIMESTAMP, DATE_UNIX_TIMESTAMP, DEFAULT_MENU_SHOW_WHEN, DEFAULT_PAGE_SIZE, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PLACEHOLDER_CHAR, DEFAULT_REQUIRED_COLUMNS, DateDiffDurationPipe, DateFormatPipe, DateFromNowPipe, DateTimeTestPage, DateUtils, Department, DepartmentToStringPipe, DragAndDropDirective, DurationPipe, ENTITIES_STORAGE_KEY_PREFIX, ENVIRONMENT, EmptyArrayPipe, EntitiesService, EntitiesStorage, EntitiesTableDataSource, Entity, EntityClass, EntityClasses, EntityFilter, EntityFilterUtils, EntityMetadataComponent, EntityStore, EntityUtils, Environment, ErrorCodes, EvenPipe, FileResponse, FileService, FileSizePipe, FilesUtils, FormArrayHelper, FormButtonsBarComponent, FormButtonsBarToken, FormErrorTranslatePipe, FormErrorTranslator, FormFieldValuesHolder, FormGetArrayPipe, FormGetControlPipe, FormGetGroupPipe, FormGetPipe, FormGetValuePipe, Fragments$1 as Fragments, GraphqlService, HAMMER_PRESS_TIME, HAMMER_TAP_TIME, HighlightPipe, HomePage, Hotkeys, HotkeysDialogComponent, InMemoryEntitiesService, IsLoginAccountPipe, IsNilOrBlankPipe, IsNotNilOrBlankPipe, IsNotOnFieldModePipe, IsOnFieldModePipe, Job, JobModule, JobProgression, JobProgressionComponent, JobProgressionService, JobProgressionServiceToken, JobUtils, KEYBOARD_HIDE_DELAY_MS, LAT_LONG_DEFAULT_MAX_DECIMALS, LAT_LONG_PATTERNS, LatLongFormatPipe, LatLongTestPage, LatitudeFormatPipe, LocalSettingsService, LongitudeFormatPipe, MINIFY_ENTITY_FOR_LOCAL_STORAGE, MINIFY_ENTITY_FOR_POD, MapGetPipe, MapKeysPipe, MapValuesPipe, MatAutocompleteConfigHolder, MatAutocompleteField, MatBadgeIconDirective, MatBooleanField, MatChipsField, MatDate, MatDateShort, MatDateTime, MatDuration, MatLatLongField, MatNumpadComponent, MatNumpadContainerComponent, MatNumpadContent, MatPaginatorI18n, MatStepperI18n, MatSwipeField, MaterialTestingModule, MathAbsPipe, MenuComponent, MenuItems, MenuService, Message, MessageFilter, MessageForm, MessageModal, MessageModule, MessageService, MessageTypeList, MessageTypes, MimeTypes, ModalToolbarComponent, NetworkService, NgInitDirective, NgVarDirective, NotEmptyArrayPipe, NumberFormatPipe, NumpadDirective, OddPipe, PRIORITIZED_AUTHORITIES, PUBKEY_REGEXP, Peer, Person, PersonFilter, PersonFragments, PersonService, PersonToStringPipe, PersonUtils, PersonValidatorService, PlatformService, ProgressBarService, ProgressInterceptor, PropertyFormatPipe, PropertyGetPipe, RESERVED_END_COLUMNS, RESERVED_START_COLUMNS, Referential, ReferentialFilter, ReferentialRef, ReferentialUtils, ReferentialValidatorService, RegisterConfirmPage, ResizableComponent, ResizableDirective, ResizableModule, SETTINGS_DISPLAY_COLUMNS, SETTINGS_FILTER, SETTINGS_PAGE_SIZE, SETTINGS_SORTED_COLUMN, SETTINGS_STORAGE_KEY, SETTINGS_TRANSIENT_PROPERTIES, SHARED_MATERIAL_TESTING_PAGES, SHARED_TESTING_PAGES, SPACE_PLACEHOLDER_CHAR, SelectPeerModal, ServerErrorCodes, SettingsPage, SharedAsyncValidators, SharedDirectivesModule, SharedFormArrayValidators, SharedFormGroupValidators, SharedHotkeysModule, SharedMatAutocompleteModule, SharedMatBadgeIconModule, SharedMatBooleanModule, SharedMatChipsModule, SharedMatDateTimeModule, SharedMatDurationModule, SharedMatLatLongModule, SharedMatNumpadModule, SharedMatSwipeModule, SharedMaterialModule, SharedModule, SharedPipesModule, SharedRoutingModule, SharedTestingModule, SharedTestsPage, SharedValidators, SocialErrorCodes, SocialModule, SocialModuleOptionsToken, Software, StartableService, StatusById, StatusIds, StatusList, StrIncludesPipe, StrLengthPipe, SwipeTestPage, TableSelectColumnsComponent, TableTestPage, TableTestingModule, TextForm, TextPopover, TextPopoverTestingModule, TextPopoverTestingPage, ToStringPipe, Toasts, ToolbarComponent, ToolbarToken, TranslatablePipe, TranslateContextPipe, TranslateContextService, UploadFile, UploadFileComponent, UploadFilePopover, UploadFileTestingModule, UploadFileTestingPage, UriUtils, UserEvent, UserEventFilter, UserEventFragments, UserEventModule, UserEventNotificationComponent, UserEventService, UserEventServiceToken, UserEventTypes, UserEventsTable, UserSettings, UsersPage, accountToString, adaptValueToControl, addValueInArray, arrayDistinct, arrayGroupBy, arraySize, asInputElement, canHaveFocus, capitalizeFirstLetter, chainPromises, changeCaseToUnderscore, clearValueInArray, copyEntity2Form, createPromiseEvent, createPromiseEventEmitter, departmentToString, departmentsToString, disableControls, emitPromiseEvent, entityToString, equals, equalsOrNil, escapeRegExp, fadeInAnimation, fadeInOutAnimation, filterFalse, filterNotNil, filterNumberInput, filterTrue, firstArrayValue, firstFalse, firstFalsePromise, firstNotNil, firstNotNilPromise, firstTrue, firstTruePromise, focusInput, focusNextInput, focusPreviousInput, formatLatitude, formatLongitude, fromDateISOString, fromScrollEndEvent, fromUnixMsTimestamp, fromUnixTimestamp, getCaretPosition, getColorContrast, getColorShade, getColorTint, getConnectionType, getControlFromPath, getFocusableInputElements, getFormErrors, getFormValueFromEntity, getProperty, getPropertyByPath, getPropertyByPathAsString, getRandomImage, hexToRgb, hexToRgbArray, isAndroid, isBlankString, isControlHasInput, isCordova, isEmptyArray, isIOS, isInputElement, isInstanceOf, isInt, isMobile, isNil, isNilOrBlank, isNilOrNaN, isNotEmptyArray, isNotNil, isNotNilBoolean, isNotNilOrBlank, isNotNilOrNaN, isNotNilString, isNumber, isNumberRange, isProgressEvent, isResponseEvent, isTouchUi, isWindows, joinProperties, joinPropertiesPath, logFormErrors, markAllAsTouched, markAsUntouched, markControlAsTouched, markFormGroupAsTouched, matchMedia, matchUpperCase, mergeLoadResult, mixHex, moment$5 as moment, moveInputCaretToSeparator, noTrailingSlash, notNilOrDefault, nullIfUndefined, parseLatitudeOrLongitude, propertiesPathComparator, propertyComparator, propertyPathComparator, referentialToString, referentialsToString, remove, removeAll, removeDiacritics, removeDuplicatesFromArray, removeEnd, removeValueInArray, replaceAll, resetCalculatedValue, resizeArray, rgbArrayToHex, rgbToHex, round, scrollFactory, selectInputContent, selectInputRange, setCalculatedValue, setTabIndex, sleep, slideInOutAnimation, slideUpDownAnimation, sort, splitById, splitByProperty, startsWithUpperCase, suggestFromArray, suggestFromStringArray, tabindexComparator, testUserAgent, toBoolean, toDateISOString, toDuration, toFloat, toInt, toNotNil, toNumber, trimEmptyToNull, tz, uncapitalizeFirstLetter, updateValueAndValidity, waitFor, waitForTrue, waitIdle, waitWhilePending, ɵ0, CustomReuseStrategy as ɵa, MatNumpadDomService as ɵb, isFocusableElement as ɵc, RegisterForm as ɵd, AccountValidatorService as ɵe, RegisterModal as ɵf, UserSettingsValidatorService as ɵg, LocalSettingsValidatorService as ɵh, AppUpdateOfflineModeCard as ɵi, AppIconComponent as ɵj, UserEventNotificationList as ɵk, JobProgressionList as ɵl, DateTestPage as ɵm, NumpadTestPage as ɵn, MatBadgeIconTestPage as ɵo, ToastTestingModule as ɵp, ToastTestingPage as ɵq };
+export { APP_ABOUT_DEVELOPERS, APP_ABOUT_PARTNERS, APP_CONFIG_OPTIONS, APP_FORM_ERROR_I18N_KEYS, APP_GRAPHQL_TYPE_POLICIES, APP_HOME_BUTTONS, APP_LOCALES, APP_LOCAL_SETTINGS, APP_LOCAL_SETTINGS_OPTIONS, APP_LOCAL_STORAGE_TYPE_POLICIES, APP_MENU_ITEMS, APP_TESTING_PAGES, AboutModal, AbstractUserEventService, Account, AccountPage, AccountService, AccountToStringPipe, ActionsColumnComponent, AdminModule, AdminRoutingModule, Alerts, AndroidOsEnvironment, AnimationState, AppEditor, AppEditorOptions, AppEntityEditor, AppEntityEditorModal, AppEntityEditorModalOptions, AppForm, AppFormField, AppFormProvider, AppFormUtils, AppGestureConfig, AppGraphQLModule, AppHelpModal, AppInMemoryTable, AppInstallUpgradeCard, AppListForm, AppLoadingSpinner, AppMenuModule, AppNullForm, AppPropertiesForm, AppTabEditor, AppTabEditorOptions, AppTable, AppTableDataSourceOptions, AppTableUtils, AppValidatorService, AppendToInputDirective, ArrayFilterPipe, ArrayFirstPipe, ArrayIncludesPipe, ArrayLengthPipe, ArrayPluckPipe, AudioProvider, AuthForm, AuthGuardService, AuthModal, AutoTitleDirective, AutocompleteTestPage, AutofocusDirective, Base58, BaseEntityService, BaseGraphqlService, BaseGraphqlServiceOptions, BaseReferential, Beans, CORE_CONFIG_OPTIONS, CORE_TESTING_PAGES, CellValueChangeListener, ChipsTestPage, Color, ColorScale, ComponentDirtyGuard, ConfigService, Configuration, CoreModule, CoreTestingModule, CryptoService, CsvUtils, DATE_ISO_PATTERN, DATE_UNIX_MS_TIMESTAMP, DATE_UNIX_TIMESTAMP, DEFAULT_MENU_SHOW_WHEN, DEFAULT_PAGE_SIZE, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_PLACEHOLDER_CHAR, DEFAULT_REQUIRED_COLUMNS, DateDiffDurationPipe, DateFormatPipe, DateFromNowPipe, DateTimeTestPage, DateUtils, Department, DepartmentToStringPipe, DragAndDropDirective, DurationPipe, ENTITIES_STORAGE_KEY_PREFIX, ENVIRONMENT, EmptyArrayPipe, EntitiesService, EntitiesStorage, EntitiesTableDataSource, Entity, EntityClass, EntityClasses, EntityFilter, EntityFilterUtils, EntityMetadataComponent, EntityStore, EntityUtils, Environment, ErrorCodes, EvenPipe, FileResponse, FileService, FileSizePipe, FilesUtils, FormArrayHelper, FormButtonsBarComponent, FormButtonsBarToken, FormErrorTranslatePipe, FormErrorTranslator, FormFieldValuesHolder, FormGetArrayPipe, FormGetControlPipe, FormGetGroupPipe, FormGetPipe, FormGetValuePipe, Fragments$1 as Fragments, GraphqlService, HAMMER_PRESS_TIME, HAMMER_TAP_TIME, HighlightPipe, HomePage, Hotkeys, HotkeysDialogComponent, InMemoryEntitiesService, IsLoginAccountPipe, IsNilOrBlankPipe, IsNotNilOrBlankPipe, IsNotOnFieldModePipe, IsOnFieldModePipe, Job, JobModule, JobProgression, JobProgressionComponent, JobProgressionService, JobProgressionServiceToken, JobUtils, KEYBOARD_HIDE_DELAY_MS, LAT_LONG_DEFAULT_MAX_DECIMALS, LAT_LONG_PATTERNS, LatLongFormatPipe, LatLongTestPage, LatitudeFormatPipe, LocalSettingsService, LongitudeFormatPipe, MINIFY_ENTITY_FOR_LOCAL_STORAGE, MINIFY_ENTITY_FOR_POD, MapGetPipe, MapKeysPipe, MapValuesPipe, MatAutocompleteConfigHolder, MatAutocompleteField, MatBadgeIconDirective, MatBooleanField, MatChipsField, MatDate, MatDateShort, MatDateTime, MatDuration, MatLatLongField, MatNumpadComponent, MatNumpadContainerComponent, MatNumpadContent, MatPaginatorI18n, MatStepperI18n, MatSwipeField, MaterialTestingModule, MathAbsPipe, MenuComponent, MenuItems, MenuService, Message, MessageFilter, MessageForm, MessageModal, MessageModule, MessageService, MessageTypeList, MessageTypes, MimeTypes, ModalToolbarComponent, NetworkService, NgInitDirective, NgVarDirective, NotEmptyArrayPipe, NumberFormatPipe, NumpadDirective, OddPipe, PRIORITIZED_AUTHORITIES, PUBKEY_REGEXP, Peer, Person, PersonFilter, PersonFragments, PersonService, PersonToStringPipe, PersonUtils, PersonValidatorService, PlatformService, ProgressBarService, ProgressInterceptor, PropertyFormatPipe, PropertyGetPipe, RESERVED_END_COLUMNS, RESERVED_START_COLUMNS, Referential, ReferentialFilter, ReferentialRef, ReferentialUtils, ReferentialValidatorService, RegisterConfirmPage, ResizableComponent, ResizableDirective, ResizableModule, SETTINGS_DISPLAY_COLUMNS, SETTINGS_FILTER, SETTINGS_PAGE_SIZE, SETTINGS_SORTED_COLUMN, SETTINGS_STORAGE_KEY, SETTINGS_TRANSIENT_PROPERTIES, SHARED_MATERIAL_TESTING_PAGES, SHARED_TESTING_PAGES, SPACE_PLACEHOLDER_CHAR, SelectPeerModal, ServerErrorCodes, SettingsPage, SharedAsyncValidators, SharedDirectivesModule, SharedFormArrayValidators, SharedFormGroupValidators, SharedHotkeysModule, SharedMatAutocompleteModule, SharedMatBadgeIconModule, SharedMatBooleanModule, SharedMatChipsModule, SharedMatDateTimeModule, SharedMatDurationModule, SharedMatLatLongModule, SharedMatNumpadModule, SharedMatSwipeModule, SharedMaterialModule, SharedModule, SharedPipesModule, SharedRoutingModule, SharedTestingModule, SharedTestsPage, SharedValidators, SocialErrorCodes, SocialModule, SocialModuleOptionsToken, Software, StartableService, StatusById, StatusIds, StatusList, StrIncludesPipe, StrLengthPipe, SwipeTestPage, TableSelectColumnsComponent, TableTestPage, TableTestingModule, TextForm, TextPopover, TextPopoverTestingModule, TextPopoverTestingPage, ToStringPipe, Toasts, ToolbarComponent, ToolbarToken, TranslatablePipe, TranslateContextPipe, TranslateContextService, UploadFile, UploadFileComponent, UploadFilePopover, UploadFileTestingModule, UploadFileTestingPage, UriUtils, UserEvent, UserEventFilter, UserEventFragments, UserEventModule, UserEventNotificationComponent, UserEventService, UserEventServiceToken, UserEventTypes, UserEventsTable, UserSettings, UsersPage, accountToString, adaptValueToControl, addValueInArray, arrayDistinct, arrayGroupBy, arraySize, asInputElement, canHaveFocus, capitalizeFirstLetter, chainPromises, changeCaseToUnderscore, clearValueInArray, copyEntity2Form, createPromiseEvent, createPromiseEventEmitter, departmentToString, departmentsToString, disableControls, emitPromiseEvent, entityToString, equals, equalsOrNil, escapeRegExp, fadeInAnimation, fadeInOutAnimation, filterFalse, filterNotNil, filterNumberInput, filterTrue, firstArrayValue, firstFalse, firstFalsePromise, firstNotNil, firstNotNilPromise, firstTrue, firstTruePromise, focusInput, focusNextInput, focusPreviousInput, formatLatitude, formatLongitude, fromDateISOString, fromScrollEndEvent, fromUnixMsTimestamp, fromUnixTimestamp, getCaretPosition, getColorContrast, getColorShade, getColorTint, getConnectionType, getControlFromPath, getFocusableInputElements, getFormErrors, getFormValueFromEntity, getProperty, getPropertyByPath, getPropertyByPathAsString, getRandomImage, hexToRgb, hexToRgbArray, isAndroid, isBlankString, isControlHasInput, isCordova, isEmptyArray, isIOS, isInputElement, isInstanceOf, isInt, isMobile, isNil, isNilOrBlank, isNilOrNaN, isNotEmptyArray, isNotNil, isNotNilBoolean, isNotNilOrBlank, isNotNilOrNaN, isNotNilString, isNumber, isNumberRange, isProgressEvent, isResponseEvent, isTouchUi, isWindows, joinProperties, joinPropertiesPath, logFormErrors, markAllAsTouched, markAsUntouched, markControlAsTouched, markFormGroupAsTouched, matchMedia, matchUpperCase, mergeLoadResult, mixHex, moment$5 as moment, moveInputCaretToSeparator, noTrailingSlash, notNilOrDefault, nullIfUndefined, parseLatitudeOrLongitude, propertiesPathComparator, propertyComparator, propertyPathComparator, referentialToString, referentialsToString, remove, removeAll, removeDiacritics, removeDuplicatesFromArray, removeEnd, removeValueInArray, replaceAll, resetCalculatedValue, resizeArray, rgbArrayToHex, rgbToHex, round, scrollFactory, selectInputContent, selectInputRange, setCalculatedValue, setTabIndex, sleep, slideInOutAnimation, slideUpDownAnimation, sort, splitById, splitByProperty, startsWithUpperCase, suggestFromArray, suggestFromStringArray, tabindexComparator, testUserAgent, toBoolean, toDateISOString, toDuration, toFloat, toInt, toNotNil, toNumber, trimEmptyToNull, tz, uncapitalizeFirstLetter, updateValueAndValidity, waitFor, waitForTrue, waitIdle, waitWhilePending, ɵ0, CustomReuseStrategy as ɵa, MatNumpadDomService as ɵb, isFocusableElement as ɵc, RegisterForm as ɵd, AccountValidatorService as ɵe, RegisterModal as ɵf, UserSettingsValidatorService as ɵg, LocalSettingsValidatorService as ɵh, AppUpdateOfflineModeCard as ɵi, AppIconComponent as ɵj, UserEventNotificationList as ɵk, UserEventTestService as ɵl, JobProgressionList as ɵm, DateTestPage as ɵn, NumpadTestPage as ɵo, MatBadgeIconTestPage as ɵp, ToastTestingModule as ɵq, ToastTestingPage as ɵr };
 //# sourceMappingURL=sumaris-net.ngx-components.js.map