Add functionalty to add task

frontend/allowance-planner-v2/src/app/pages/tasks/tasks.page.ts

@@ -1,34 +1,39 @@
-import { Component, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component } from '@angular/core';
 import { TaskService } from 'src/app/services/task.service';
 import { Task } from 'src/app/models/task';
 import { ActivatedRoute, Router } from '@angular/router';
+import { BehaviorSubject } from 'rxjs';
+import { ViewWillEnter } from '@ionic/angular';
 
 @Component({
   selector: 'app-tasks',
   templateUrl: 'tasks.page.html',
   styleUrls: ['tasks.page.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: false,
 })
-export class TasksPage implements OnInit {
-  public tasks: Array<Task> = [];
+export class TasksPage implements ViewWillEnter {
+  public tasks$: BehaviorSubject<Array<Task>> = new BehaviorSubject<Array<Task>>([]);
 
   constructor(
     private taskService: TaskService,
     private router: Router,
     private route: ActivatedRoute
-  ) {}
+  ) {
+    this.getTasks();
+  }
 
-  ngOnInit(): void {
+  ionViewWillEnter(): void {
     this.getTasks();
   }
 
   getTasks() {
     this.taskService.getTaskList().subscribe(tasks => {
-      this.tasks = tasks;
+      this.tasks$.next(tasks);
     });
   }
 
   createTask() {
-    this.router.navigate(['edit', 1], { relativeTo: this.route });
+    this.router.navigate(['add'], { relativeTo: this.route });
   }
 }