From 66e72a702385ed0ca54402e83447bbc2408e71ca Mon Sep 17 00:00:00 2001 From: Chneemann Date: Sat, 30 Mar 2024 08:10:02 +0100 Subject: [PATCH] update task service & board --- src/app/components/board/board.component.html | 8 +-- src/app/components/board/board.component.ts | 57 ++++++++----------- .../components/board/task/task.component.ts | 2 +- .../components/contacts/contacts.component.ts | 3 +- .../components/summary/summary.component.ts | 8 +-- src/app/services/task.service.ts | 57 +++++++++++++------ src/app/services/user.service.ts | 8 +-- 7 files changed, 76 insertions(+), 67 deletions(-) diff --git a/src/app/components/board/board.component.html b/src/app/components/board/board.component.html index c5a8ef9..d0652d7 100644 --- a/src/app/components/board/board.component.html +++ b/src/app/components/board/board.component.html @@ -32,7 +32,7 @@ >add
- @for(task of todoTasks; track task) { + @for(task of getTaskStatus("todo"); track task) { } @empty { No tasks @@ -49,7 +49,7 @@ >add
- @for(task of inprogressTasks; track task) { + @for(task of getTaskStatus("inprogress"); track task) { } @empty { No tasks @@ -66,7 +66,7 @@ >add
- @for(task of awaitfeedbackTasks; track task) { + @for(task of getTaskStatus("awaitfeedback"); track task) { } @empty { No tasks @@ -83,7 +83,7 @@ >add
- @for(task of doneTasks; track task) { + @for(task of getTaskStatus("done"); track task) { } @empty { No tasks diff --git a/src/app/components/board/board.component.ts b/src/app/components/board/board.component.ts index 92c74bc..c60a2df 100644 --- a/src/app/components/board/board.component.ts +++ b/src/app/components/board/board.component.ts @@ -15,19 +15,12 @@ import { TaskEmptyComponent } from './task/task-empty/task-empty.component'; }) export class BoardComponent { @ViewChild('searchField') searchField!: ElementRef; - todoTasks: Task[] = []; - inprogressTasks: Task[] = []; - awaitfeedbackTasks: Task[] = []; - doneTasks: Task[] = []; - constructor( public dragDropService: DragDropService, private taskService: TaskService - ) { - this.taskService.subTaskList().subscribe(() => { - this.loadAllTasks(); - }); - } + ) {} + + search!: string; ngOnInit() { this.dragDropService.itemDropped.subscribe(({ id, status }) => { @@ -35,22 +28,20 @@ export class BoardComponent { }); } - getTask(status: string): Task[] { - const search = this.searchField.nativeElement.value.toLowerCase(); - if (this.taskService.filteredTasks.length >= 0 && search !== '') { - return this.taskService.filteredTasks.filter( - (task) => task.status === status - ); - } else { - return this.taskService.allTasks.filter((task) => task.status === status); + getTaskStatus(status: string) { + if (this.searchField) { + this.search = this.searchField.nativeElement.value.toLowerCase(); + if (this.search.length > 0) { + return this.taskService + .getFiltertTasks() + .filter((task) => task.status === status); + } else { + return this.taskService + .getAllTasks() + .filter((task) => task.status === status); + } } - } - - loadAllTasks() { - this.todoTasks = this.getTask('todo'); - this.inprogressTasks = this.getTask('inprogress'); - this.awaitfeedbackTasks = this.getTask('awaitfeedback'); - this.doneTasks = this.getTask('done'); + return; } handleItemDropped(id: string, status: string): void { @@ -68,13 +59,13 @@ export class BoardComponent { } searchTask(): void { - const search = this.searchField.nativeElement.value.toLowerCase(); - this.taskService.filteredTasks = this.taskService.allTasks.filter( - (task) => - task.title.toLowerCase().includes(search) || - task.description.toLowerCase().includes(search) || - task.category.toLowerCase().includes(search) - ); - this.loadAllTasks(); + this.taskService.filteredTasks = this.taskService + .getAllTasks() + .filter( + (task) => + task.title.toLowerCase().includes(this.search) || + task.description.toLowerCase().includes(this.search) || + task.category.toLowerCase().includes(this.search) + ); } } diff --git a/src/app/components/board/task/task.component.ts b/src/app/components/board/task/task.component.ts index 1b314ab..206735f 100644 --- a/src/app/components/board/task/task.component.ts +++ b/src/app/components/board/task/task.component.ts @@ -46,7 +46,7 @@ export class TaskComponent { userBadged(id: number) { const userId = String(id); - const user = this.userService.allUsers.find((user) => user.id === userId); + const user = this.userService.getUsers().find((user) => user.id === userId); if (user) { if (user.firstName === 'Guest') { return user.firstName.charAt(0); diff --git a/src/app/components/contacts/contacts.component.ts b/src/app/components/contacts/contacts.component.ts index b27cc20..127462d 100644 --- a/src/app/components/contacts/contacts.component.ts +++ b/src/app/components/contacts/contacts.component.ts @@ -43,8 +43,7 @@ export class ContactsComponent { } checkUsersFirstLetter() { - let usersFirstLetter = []; - usersFirstLetter = Array.from( + let usersFirstLetter = Array.from( new Set( this.loadAllUserWithoutGuest().map((user) => user.firstName[0].toUpperCase() diff --git a/src/app/components/summary/summary.component.ts b/src/app/components/summary/summary.component.ts index 3822dbf..7f5a45b 100644 --- a/src/app/components/summary/summary.component.ts +++ b/src/app/components/summary/summary.component.ts @@ -19,11 +19,9 @@ export class SummaryComponent { urgentTasksDate: String = ''; constructor(private taskService: TaskService) { - this.taskService.subTaskList().subscribe(() => { - this.updateTasksCount(); - this.updateAllTasksCount(); - this.updateUrgentTasksCount(); - }); + this.updateTasksCount(); + this.updateAllTasksCount(); + this.updateUrgentTasksCount(); } updateAllTasksCount() { diff --git a/src/app/services/task.service.ts b/src/app/services/task.service.ts index e03a624..79e7c71 100644 --- a/src/app/services/task.service.ts +++ b/src/app/services/task.service.ts @@ -1,4 +1,4 @@ -import { EventEmitter, Injectable, inject } from '@angular/core'; +import { EventEmitter, Injectable, OnDestroy, inject } from '@angular/core'; import { Firestore, collection, @@ -7,36 +7,53 @@ import { updateDoc, } from '@angular/fire/firestore'; import { Task } from '../interfaces/task.interface'; -import { Observable } from 'rxjs'; - @Injectable({ providedIn: 'root', }) -export class TaskService { +export class TaskService implements OnDestroy { firestore: Firestore = inject(Firestore); allTasks: Task[] = []; filteredTasks: Task[] = []; - constructor() {} + unsubTask; + + constructor() { + this.unsubTask = this.subTaskList(); + } subTaskList() { - return new Observable((observer) => { - 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(); + return onSnapshot(collection(this.firestore, 'tasks'), (list) => { + this.allTasks = []; + list.forEach((element) => { + this.allTasks.push(this.setUserObject(element.data(), element.id)); + }); }); } + setUserObject(obj: any, id: string): Task { + return { + id: id, + title: obj.title, + description: obj.description, + category: obj.category, + status: obj.status, + priority: obj.priority, + subtasksTitle: obj.subtasksTitle, + subtasksDone: obj.subtasksDone, + assigned: obj.assigned, + timestamp: obj.timestamp, + }; + } + + getAllTasks(): Task[] { + return this.allTasks; + } + + getFiltertTasks(): Task[] { + return this.filteredTasks; + } + async updateTask(taskId: any, index: number) { await updateDoc( doc(collection(this.firestore, 'tasks'), taskId), @@ -54,4 +71,8 @@ export class TaskService { status: task.status, }; } + + ngOnDestroy() { + this.unsubTask(); + } } diff --git a/src/app/services/user.service.ts b/src/app/services/user.service.ts index 17d08a8..19bca3c 100644 --- a/src/app/services/user.service.ts +++ b/src/app/services/user.service.ts @@ -17,10 +17,6 @@ export class UserService implements OnDestroy { this.unsubUser = this.subUserList(); } - getUsers(): User[] { - return this.allUsers; - } - subUserList() { return onSnapshot(collection(this.firestore, 'users'), (list) => { this.allUsers = []; @@ -42,6 +38,10 @@ export class UserService implements OnDestroy { }; } + getUsers(): User[] { + return this.allUsers; + } + getUserDetails(userId: string, query: keyof User) { const filteredUsers = this.getUsers().filter((user) => user.id === userId); return filteredUsers.map((user) => user[query]);