import { ChangeDetectionStrategy, Component, input, output } from '@angular/core';
import { Task, TaskState } from '../../data-access/models/task.model';

@Component({
  selector: 'emi-task-board-column',
  imports: [],
  templateUrl: './task-board-column.html',
  styleUrl: './task-board-column.css',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class TaskBoardColumn {
  state = input.required<TaskState>();
  title = input.required<string>();
  tasks = input.required<Task[]>();

  view = output<Task>();
  edit = output<Task>();
  delete = output<Task>();
  add = output<void>();

  get stateClass(): string {
    return `board-column--${this.state()}`;
  }

  onView(task: Task): void {
    this.view.emit(task);
  }

  onEdit(task: Task): void {
    this.edit.emit(task);
  }

  onDelete(task: Task): void {
    this.delete.emit(task);
  }

  onAdd(): void {
    this.add.emit();
  }
}