import {CommonModule} from "@angular/common";
import {Component, effect, inject} from "@angular/core";
import {MatProgressSpinner} from "@angular/material/progress-spinner";
import {ActivatedRoute} from "@angular/router";
import {Observable} from "rxjs";
import {PublicationListComponent} from "../../components/publication-list/publication-list.component";
import {Publication} from "../../core/rest-services/publications/model/publication";
import {SearchPublicationsService} from "./search-publications.service";
import {toSignal} from "@angular/core/rxjs-interop";

@Component({
    selector: 'app-search-publications',
    templateUrl: './search-publications.component.html',
    styleUrl: './search-publications.component.scss',
    imports: [CommonModule, MatProgressSpinner, PublicationListComponent],
    providers: [SearchPublicationsService]
})
export class SearchPublicationsComponent {
    private searchPublicationsService = inject(SearchPublicationsService);
    private activatedRoute = inject(ActivatedRoute);

    constructor() {
      const queryParams = toSignal(this.activatedRoute.queryParamMap);
      effect(() => {
        let params = queryParams();
        if (params) {
          const categoryId = params.get('category-id');
          if (categoryId) {
            this.searchPublicationsService.loadPublications(`category_id=${categoryId}`);
          }
          const query = params.get('query')
          if (query) {
            this.searchPublicationsService.loadPublications(query);
          }
        }
      });
    }

    get publications$(): Observable<Publication[]> {
        return this.searchPublicationsService.publications$;
    }

    get isLoading$(): Observable<boolean> {
        return this.searchPublicationsService.isLoading$;
    }

    get isLoaded$(): Observable<boolean> {
        return this.searchPublicationsService.isLoaded$;
    }
}