UI: Refactoring call ngZone in table widgets

ui-ngx/src/app/modules/home/components/widget/lib/alarms-table-widget.component.ts

@@ -260,9 +260,7 @@ export class AlarmsTableWidgetComponent extends PageComponent implements OnInit,
 
   public onDataUpdated() {
     this.updateTitle(true);
-    this.ngZone.run(() => {
     this.alarmsDatasource.updateAlarms();
-    });
   }
 
   public pageLinkSortDirection(): SortDirection {
@@ -428,7 +426,7 @@ export class AlarmsTableWidgetComponent extends PageComponent implements OnInit,
       this.displayedColumns.push('actions');
     }
 
-    this.alarmsDatasource = new AlarmsDatasource(this.subscription, latestDataKeys);
+    this.alarmsDatasource = new AlarmsDatasource(this.subscription, latestDataKeys, this.ngZone);
     if (this.enableSelection) {
       this.alarmsDatasource.selectionModeChanged$.subscribe((selectionMode) => {
         const hideTitlePanel = selectionMode || this.textSearchMode;
@@ -959,7 +957,8 @@ class AlarmsDatasource implements DataSource<AlarmDataInfo> {
   private appliedSortOrderLabel: string;
 
   constructor(private subscription: IWidgetSubscription,
-              private dataKeys: Array<DataKey>) {
+              private dataKeys: Array<DataKey>,
+              private ngZone: NgZone) {
   }
 
   connect(collectionViewer: CollectionViewer): Observable<AlarmDataInfo[] | ReadonlyArray<AlarmDataInfo>> {
@@ -991,6 +990,7 @@ class AlarmsDatasource implements DataSource<AlarmDataInfo> {
   updateAlarms() {
     const subscriptionAlarms = this.subscription.alarms;
     let alarms = new Array<AlarmDataInfo>();
+    let isEmptySelection = false;
     subscriptionAlarms.data.forEach((alarmData) => {
       alarms.push(this.alarmDataToInfo(alarmData));
     });
@@ -1003,7 +1003,7 @@ class AlarmsDatasource implements DataSource<AlarmDataInfo> {
       const toRemove = this.selection.selected.filter(alarmId => alarmIds.indexOf(alarmId) === -1);
       this.selection.deselect(...toRemove);
       if (this.selection.isEmpty()) {
-        this.onSelectionModeChanged(false);
+        isEmptySelection = true;
       }
     }
     const alarmsPageData: PageData<AlarmDataInfo> = {
@@ -1012,9 +1012,14 @@ class AlarmsDatasource implements DataSource<AlarmDataInfo> {
       totalElements: subscriptionAlarms.totalElements,
       hasNext: subscriptionAlarms.hasNext
     };
+    this.ngZone.run(() => {
+      if (isEmptySelection) {
+        this.onSelectionModeChanged(false);
+      }
       this.alarmsSubject.next(alarms);
       this.pageDataSubject.next(alarmsPageData);
       this.dataLoading = false;
+    });
   }
 
   private alarmDataToInfo(alarmData: AlarmData): AlarmDataInfo {

ui-ngx/src/app/modules/home/components/widget/lib/entities-table-widget.component.ts

@@ -221,9 +221,7 @@ export class EntitiesTableWidgetComponent extends PageComponent implements OnIni
 
   public onDataUpdated() {
     this.updateTitle(true);
-    this.ngZone.run(() => {
     this.entityDatasource.dataUpdated();
-    });
   }
 
   public pageLinkSortDirection(): SortDirection {
@@ -417,8 +415,7 @@ export class EntitiesTableWidgetComponent extends PageComponent implements OnIni
     if (this.actionCellDescriptors.length) {
       this.displayedColumns.push('actions');
     }
-    this.entityDatasource = new EntityDatasource(
+    this.entityDatasource = new EntityDatasource(this.translate, dataKeys, this.subscription, this.ngZone);
-      this.translate, dataKeys, this.subscription);
   }
 
   private editColumnsToDisplay($event: Event) {
@@ -691,7 +688,8 @@ class EntityDatasource implements DataSource<EntityData> {
   constructor(
        private translate: TranslateService,
        private dataKeys: Array<DataKey>,
-       private subscription: IWidgetSubscription
+       private subscription: IWidgetSubscription,
+       private ngZone: NgZone
     ) {
   }
 
@@ -734,9 +732,11 @@ class EntityDatasource implements DataSource<EntityData> {
       totalElements: datasourcesPageData.totalElements,
       hasNext: datasourcesPageData.hasNext
     };
+    this.ngZone.run(() => {
       this.entitiesSubject.next(entities);
       this.pageDataSubject.next(entitiesPageData);
       this.dataLoading = false;
+    });
   }
 
   private datasourceToEntityData(datasource: Datasource, data: DatasourceData[]): EntityData {

ui-ngx/src/app/modules/home/components/widget/lib/timeseries-table-widget.component.ts

@@ -193,9 +193,7 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
   }
 
   public onDataUpdated() {
-    this.ngZone.run(() => {
     this.updateCurrentSourceData();
-    });
   }
 
   private initialize() {
@@ -288,7 +286,7 @@ export class TimeseriesTableWidgetComponent extends PageComponent implements OnI
         if (this.actionCellDescriptors.length) {
           source.displayedColumns.push('actions');
         }
-        const tsDatasource = new TimeseriesDatasource(source, this.hideEmptyLines, this.dateFormatFilter, this.datePipe);
+        const tsDatasource = new TimeseriesDatasource(source, this.hideEmptyLines, this.dateFormatFilter, this.datePipe, this.ngZone);
         tsDatasource.dataUpdated(this.data);
         this.sources.push(source);
       }
@@ -547,7 +545,8 @@ class TimeseriesDatasource implements DataSource<TimeseriesRow> {
     private source: TimeseriesTableSource,
     private hideEmptyLines: boolean,
     private dateFormatFilter: string,
-    private datePipe: DatePipe
+    private datePipe: DatePipe,
+    private ngZone: NgZone
   ) {
     this.source.timeseriesDatasource = this;
   }
@@ -570,8 +569,10 @@ class TimeseriesDatasource implements DataSource<TimeseriesRow> {
       catchError(() => of(emptyPageData<TimeseriesRow>())),
     ).subscribe(
       (pageData) => {
+        this.ngZone.run(() => {
           this.rowsSubject.next(pageData.data);
           this.pageDataSubject.next(pageData);
+        });
       }
     );
   }