added assigned to task

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

@@ -91,10 +91,10 @@
           <span>Done</span
           ><img src="./../../../assets/img/board/add.svg" alt="add" />
         </div>
-        <div id="todo" class="details">
+        <div id="done" class="details">
-          @if(getTask('todo').length > 0) {
+          @if(getTask('done').length > 0) {
           <app-task
-            *ngFor="let task of getTask('todo')"
+            *ngFor="let task of getTask('done')"
             [task]="task"
           ></app-task>
           } @else {

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

@@ -29,8 +29,9 @@
     }
     <div class="footer">
       <div class="footer-badge">
-        @if (task.assigned) { @for (assigned of task.assigned; track assigned) {
+        @if (task.assigned.length > 0) { @for (assigned of task.assigned; track
-        <span class="footer-badged">{{ assigned }}</span>
+        assigned) {
+        <span class="footer-badged">{{ userBadged(assigned) }}</span>
         } }
       </div>
       <div class="footer-priority prio-{{ task.priority }}"></div>

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

@@ -2,6 +2,7 @@ import { CommonModule } from '@angular/common';
 import { Component, Input } from '@angular/core';
 import { DragDropService } from '../../../services/drag-drop.service';
 import { TaskService } from '../../../services/task.service';
+import { UserService } from '../../../services/user.service';
 import { Task } from '../../../interfaces/task.interface';
 
 @Component({
@@ -23,12 +24,17 @@ export class TaskComponent {
 
   constructor(
     public dragDropService: DragDropService,
-    private taskService: TaskService
+    private taskService: TaskService,
+    private userService: UserService
   ) {}
 
+  ngOnDestroy() {
+    this.userService.unsubUser();
+  }
+
   // Subtasks
 
-  completedSubtasks() {
+  completedSubtasks(): number {
     return this.task.subtasksDone.filter((subtask: boolean) => subtask === true)
       .length;
   }
@@ -41,4 +47,22 @@ export class TaskComponent {
 
     return (completedSubtasksCount / subtasks.length) * 100;
   }
+
+  // Assigned
+
+  userBadged(id: number) {
+    const userId = String(id);
+    const user = this.userService.allUsers.find((user) => user.id === userId);
+    if (user) {
+      if (user.firstName === 'Guest') {
+        return user.firstName.charAt(0);
+      } else {
+        const firstNameLetter = user.firstName.charAt(0);
+        const lastNameLetter = user.lastName.charAt(0);
+        return firstNameLetter + lastNameLetter;
+      }
+    } else {
+      return;
+    }
+  }
 }

src/app/interfaces/user.interface.ts

@@ -1,4 +1,5 @@
 export interface User {
   id?: string;
-  name: string;
+  firstName: string;
+  lastName: string;
 }