refactor(ui): onPush on favorite module

ovh · Jul 18, 2019 · 5948d3e · 5948d3e
1 parent 5faf06b
commit 5948d3e
Showing 1 changed file with 19 additions and 13 deletions.
diff --git a/ui/src/app/views/favorite/favorite.component.ts b/ui/src/app/views/favorite/favorite.component.ts
@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
 import { Bookmark } from 'app/model/bookmark.model';
 import { NavbarProjectData } from 'app/model/navbar.model';
 import { UserService } from 'app/service/services.module';
@@ -10,7 +10,8 @@ import { AutoUnsubscribe } from '../../shared/decorator/autoUnsubscribe';
 @Component({
     selector: 'app-favorite',
     templateUrl: './favorite.component.html',
-    styleUrls: ['./favorite.component.scss']
+    styleUrls: ['./favorite.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush
 })
 @AutoUnsubscribe()
 export class FavoriteComponent {
@@ -24,21 +25,23 @@ export class FavoriteComponent {
 
     constructor(
       private _userService: UserService,
-      private _navbarService: NavbarService
+      private _navbarService: NavbarService,
+      private _cd: ChangeDetectorRef
     ) {
       this.loadBookmarks();
 
       this._navbarSub = this._navbarService.getData(true)
         .subscribe((data) => {
-          this.loading = false;
-          if (Array.isArray(data)) {
-            let favorites = data.filter((fav) => fav.favorite);
-            this.projects = data.filter((elt) => elt.type === 'project');
-            this.workflows = data.filter((elt) => {
-              return elt.type === 'workflow' &&
-                !favorites.find((fav) => fav.type === 'workflow' && fav.workflow_name === elt.workflow_name);
-            });
-          }
+            this._cd.markForCheck();
+            this.loading = false;
+            if (Array.isArray(data)) {
+                let favorites = data.filter((fav) => fav.favorite);
+                this.projects = data.filter((elt) => elt.type === 'project');
+                this.workflows = data.filter((elt) => {
+                return elt.type === 'workflow' &&
+                    !favorites.find((fav) => fav.type === 'workflow' && fav.workflow_name === elt.workflow_name);
+                });
+            }
         });
     }
 
@@ -47,7 +50,10 @@ export class FavoriteComponent {
       this._userService.getBookmarks()
         .pipe(
           first(),
-          finalize(() => this.loading = false)
+          finalize(() => {
+              this.loading = false;
+              this._cd.markForCheck();
+          })
         ).subscribe((bookmarks) => this.favorites = bookmarks);
     }