bugfixes search

src/app/components/board/board.component.html

@@ -32,7 +32,7 @@
           ><img src="./../../../assets/img/board/add.svg" alt="add" />
         </div>
         <div id="todo" class="details">
-          @for(task of todoTasks; ; track task) {
+          @for(task of todoTasks; track task) {
           <app-task [task]="task"></app-task>
           } @empty {
           <app-task-empty>No tasks</app-task-empty>

src/app/components/board/board.component.ts

@@ -24,19 +24,21 @@ export class BoardComponent {
   constructor(
     public dragDropService: DragDropService,
     private taskService: TaskService
-  ) {}
-
-  ngOnInit() {
-    this.dragDropService.itemDropped.subscribe(({ id, status }) => {
-      this.handleItemDropped(id, status);
-    });
+  ) {
     this.taskService.subTaskList().subscribe(() => {
       this.loadAllTasks();
     });
   }
 
+  ngOnInit() {
+    this.dragDropService.itemDropped.subscribe(({ id, status }) => {
+      this.handleItemDropped(id, status);
+    });
+  }
+
   getTask(status: string): Task[] {
-    if (this.taskService.filteredTasks.length > 0) {
+    const search = this.searchField.nativeElement.value.toLowerCase();
+    if (this.taskService.filteredTasks.length >= 0 && search !== '') {
       return this.taskService.filteredTasks.filter(
         (task) => task.status === status
       );
@@ -74,5 +76,6 @@ export class BoardComponent {
         task.description.toLowerCase().includes(search) ||
         task.category.toLowerCase().includes(search)
     );
+    this.loadAllTasks();
   }
 }

src/app/services/task.service.ts

@@ -22,24 +22,21 @@ export class TaskService {
 
   subTaskList() {
     return new Observable<void>((observer) => {
-      const unsubscribe = onSnapshot(this.getTaskRef(), (list) => {
-        this.allTasks = [];
-        list.forEach((element) => {
-          const taskData = { ...(element.data() as Task), id: element.id };
-          this.allTasks.push(taskData);
-        });
-        observer.next();
-      });
-
-      // Cleanup function
+      const unsubscribe = onSnapshot(
+        collection(this.firestore, 'tasks'),
+        (list) => {
+          this.allTasks = [];
+          list.forEach((element) => {
+            const taskData = { ...(element.data() as Task), id: element.id };
+            this.allTasks.push(taskData);
+          });
+          observer.next();
+        }
+      );
       return () => unsubscribe();
     });
   }
 
-  getTaskRef() {
-    return collection(this.firestore, 'tasks');
-  }
-
   async updateTask(taskId: any, index: number) {
     await updateDoc(
       doc(collection(this.firestore, 'tasks'), taskId),