import {Component, EventEmitter, Input, Output} from '@angular/core';
import {User} from '../user/user.model';
import {Task} from '../task/task.model';
import {TaskComponent} from '../task/task.component';
import {NewTaskComponent} from './new-task/new-task.component';
import {TaskContent} from './new-task/task-content.model';

@Component({
  selector: 'app-tasks',
  imports: [TaskComponent, NewTaskComponent],
  templateUrl: './tasks.component.html',
  styleUrl: './tasks.component.css'
})
export class TasksComponent {
  @Input({ required: true }) user!: User;

  isAddingTask = false;

  tasks: Task[] = [
    {
      id: 't1',
      userId: 'u1',
      title: 'Master Angular',
      summary: 'Learn all the basic and advanced features of Angular & how to apply them.',
      dueDate: '2025-12-31',
    },
    {
      id: 't2',
      userId: 'u3',
      title: 'Build first prototype',
      summary: 'Build a first prototype of the online shop website',
      dueDate: '2024-05-31',
    },
    {
      id: 't3',
      userId: 'u3',
      title: 'Prepare issue template',
      summary: 'Prepare and describe an issue template which will help with project management',
      dueDate: '2024-06-15',
    },
  ];

  get selectedUserTasks() {
    return this.tasks.filter((task) => task.userId === this.user.id);
  }

  onCompleteTask(taskId: string) {
    this.tasks = this.tasks.filter((task) => task.id !== taskId);
  }

  onStartAddTask() {
    this.isAddingTask = true;
  }

  onCancelAddTask() {
    this.isAddingTask = false;
  }

  onAddTask(taskContent: TaskContent) {
    let nextTaskId = this.tasks.length + 1;
    let taskId = 't' + (nextTaskId).toString();

    let task: Task = {
      id: taskId,
      userId: this.user.id,
      title: taskContent.title,
      summary: taskContent.summary,
      dueDate: taskContent.date,
    };
    this.tasks.push(task);

    this.onCancelAddTask()
  }
}