import { Component, inject, output } from '@angular/core';
import { FormBuilder, FormControl, ReactiveFormsModule, Validators } from '@angular/forms';
import { SearchFilters } from '@app/domain/search/search-filters';
import { SearchService } from '@app/infrastructure/search/search.service';

@Component({
  selector: 'app-search',
  standalone: true,
  imports: [ReactiveFormsModule],
  templateUrl: './search.component.html',
  styleUrl: './search.component.scss',
})
export class SearchComponent {
  private readonly searchService = inject(SearchService);
  onSearchChange = output<SearchFilters>();
  private formBuilder: FormBuilder = inject(FormBuilder);

  searchForm = this.formBuilder.group({
    search: new FormControl('', Validators.required),
  });

  onSubmit() {
    const search = this.searchForm.value.search?.toLowerCase()!;
    this.searchService.search(search);
    const filters = this.searchService.getFilters();
    this.onSearchChange.emit({ ...filters(), search });
  }
}
