Fix occurences of ExpressionChangedAfterItHasBeenCheckedError

src/app/app.component.ts

@@ -1,4 +1,4 @@
-import { Component, Inject, ApplicationRef } from '@angular/core';
+import { Component, Inject, ApplicationRef, ChangeDetectorRef } from '@angular/core';
 import { Location } from '@angular/common';
 import { User } from './users/user';
 import { TWIGS_SERVICE, TwigsService } from './shared/twigs.service';
@@ -31,6 +31,7 @@ export class AppComponent {
     private activatedRoute: ActivatedRoute,
     private appRef: ApplicationRef,
     private updates: SwUpdate,
+    private changeDetector: ChangeDetectorRef,
   ) {
     if (this.cookieService.check('Authorization')) {
       this.twigsService.getProfile().subscribe(user => {
@@ -43,16 +44,26 @@ export class AppComponent {
       this.router.navigateByUrl("/login")
     }
 
-    updates.available.subscribe(event => {
+    updates.available.subscribe(
-      console.log('current version is', event.current);
+      event => {
-      console.log('available version is', event.available);
+        console.log('current version is', event.current);
-      // TODO: Prompt user to click something to update
+        console.log('available version is', event.available);
-      updates.activateUpdate();
+        // TODO: Prompt user to click something to update
-    });
+        updates.activateUpdate();
-    updates.activated.subscribe(event => {
+      },
-      console.log('old version was', event.previous);
+      err => {
-      console.log('new version is', event.current);
+
-    });
+      }
+    );
+    updates.activated.subscribe(
+      event => {
+        console.log('old version was', event.previous);
+        console.log('new version is', event.current);
+      },
+      err => {
+
+      }
+    );
 
     const appIsStable$ = appRef.isStable.pipe(first(isStable => isStable === true));
     const everySixHours$ = interval(6 * 60 * 60 * 1000);
@@ -82,4 +93,19 @@ export class AppComponent {
       this.location.go('/');
     });
   }
+
+  setActionable(actionable: Actionable): void {
+    this.actionable = actionable;
+    this.changeDetector.detectChanges();
+  }
+
+  setBackEnabled(enabled: boolean): void {
+    this.backEnabled = enabled;
+    this.changeDetector.detectChanges();
+  }
+
+  setTitle(title: string) {
+    this.title = title;
+    this.changeDetector.detectChanges();
+  }
 }

src/app/budgets/add-edit-budget/add-edit-budget.component.ts

@@ -20,8 +20,8 @@ export class AddEditBudgetComponent {
         private app: AppComponent,
         @Inject(TWIGS_SERVICE) private twigsService: TwigsService,
     ) {
-        this.app.title = this.title;
+        this.app.setTitle(this.title)
-        this.app.backEnabled = true;
+        this.app.setBackEnabled(true);
         this.users = [new UserPermission(this.app.user.value.id, Permission.OWNER)];
     }
 

src/app/budgets/budget-details/budget-details.component.ts

@@ -39,7 +39,7 @@ export class BudgetDetailsComponent implements OnInit {
 
   ngOnInit() {
     this.getBudget();
-    this.app.backEnabled = false;
+    this.app.setBackEnabled(false);
     this.categoryBalances = new Map();
   }
 
@@ -47,7 +47,7 @@ export class BudgetDetailsComponent implements OnInit {
     const id = Number.parseInt(this.route.snapshot.paramMap.get('id'));
     this.twigsService.getBudget(id)
       .subscribe(budget => {
-        this.app.title = budget.name;
+        this.app.setTitle(budget.name)
         this.budget = budget;
         this.getBalance();
         this.getTransactions();

src/app/budgets/budget.component.ts

@@ -20,8 +20,8 @@ export class BudgetsComponent implements OnInit {
   ) { }
 
   ngOnInit() {
-    this.app.backEnabled = false;
+    this.app.setBackEnabled(false);
-    this.app.title = 'Budgets';
+    this.app.setTitle('Budgets')
     this.app.user.subscribe(
       user => {
         if (!user) {

src/app/categories/categories.component.ts

@@ -26,8 +26,8 @@ export class CategoriesComponent implements OnInit {
 
   ngOnInit() {
     this.budgetId = Number.parseInt(this.route.snapshot.paramMap.get('budgetId'));
-    this.app.title = 'Categories';
+    this.app.setTitle('Categories')
-    this.app.backEnabled = true;
+    this.app.setBackEnabled(true);
     this.getCategories();
     this.categoryBalances = new Map();
   }

src/app/categories/category-details/category-details.component.ts

@@ -33,13 +33,13 @@ export class CategoryDetailsComponent implements OnInit, OnDestroy, Actionable {
   }
 
   ngOnInit() {
-    this.app.backEnabled = true;
+    this.app.setBackEnabled(true);
-    this.app.actionable = this;
+    this.app.setActionable(this)
     this.getCategory();
   }
 
   ngOnDestroy() {
-    this.app.actionable = null;
+    this.app.setActionable(null)
   }
 
   getCategory(): void {
@@ -47,7 +47,7 @@ export class CategoryDetailsComponent implements OnInit, OnDestroy, Actionable {
     this.twigsService.getCategory(id)
       .subscribe(category => {
         category.amount /= 100;
-        this.app.title = category.title;
+        this.app.setTitle(category.title)
         this.category = category;
         this.budgetId = category.budgetId;
       });

src/app/categories/category-form/category-form.component.ts

@@ -20,8 +20,8 @@ export class CategoryFormComponent implements OnInit {
   ) { }
 
   ngOnInit() {
-    this.app.backEnabled = true;
+    this.app.setBackEnabled(true);
-    this.app.title = this.title;
+    this.app.setTitle(this.title)
   }
 
   save(): void {

src/app/categories/edit-category/edit-category.component.ts

@@ -21,7 +21,7 @@ export class EditCategoryComponent implements OnInit {
   ) { }
 
   ngOnInit(): void {
-    this.app.backEnabled = true;
+    this.app.setBackEnabled(true);
     this.getCategory();
   }
 
@@ -30,7 +30,7 @@ export class EditCategoryComponent implements OnInit {
     this.twigsService.getCategory(id)
       .subscribe(category => {
         category.amount /= 100;
-        this.app.title = category.title;
+        this.app.setTitle(category.title)
         this.category = category;
         this.budgetId = category.budgetId;
       });

src/app/transactions/add-edit-transaction/add-edit-transaction.component.ts

@@ -27,8 +27,8 @@ export class AddEditTransactionComponent implements OnInit, OnChanges {
   ) { }
 
   ngOnInit() {
-    this.app.title = this.title;
+    this.app.setTitle(this.title)
-    this.app.backEnabled = true;
+    this.app.setBackEnabled(true);
     let d: Date, expense: boolean;
     if (this.currentTransaction) {
       d = new Date(this.currentTransaction.date);

src/app/transactions/transactions.component.ts

@@ -20,7 +20,7 @@ export class TransactionsComponent implements OnInit {
   ngOnInit() {
     this.budgetId = Number.parseInt(this.route.snapshot.paramMap.get('budgetId'));
     this.categoryId = Number.parseInt(this.route.snapshot.queryParamMap.get('categoryId'));
-    this.app.backEnabled = true;
+    this.app.setBackEnabled(true);
-    this.app.title = 'Transactions';
+    this.app.setTitle('Transactions')
   }
 }

src/app/users/login/login.component.ts

@@ -22,8 +22,8 @@ export class LoginComponent implements OnInit {
   ) { }
 
   ngOnInit() {
-    this.app.title = 'Login';
+    this.app.setTitle('Login')
-    this.app.backEnabled = true;
+    this.app.setBackEnabled(true);
   }
 
   login(): void {

src/app/users/register/register.component.ts

@@ -23,8 +23,8 @@ export class RegisterComponent implements OnInit {
   ) { }
 
   ngOnInit() {
-    this.app.title = 'Register';
+    this.app.setTitle('Register')
-    this.app.backEnabled = true;
+    this.app.setBackEnabled(true);
   }
 
   register(): void {