import { Component, EventEmitter, Input, OnInit, Output, Pipe, PipeTransform } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { Page } from "src/app/models/Page";

@Component({
  selector: 'app-pages-list',
  templateUrl: './pages-list.component.html',
  styleUrls: ['./pages-list.component.css']
})
export class PagesListComponent implements OnInit {

  @Input() pages: Page[] = [];
  @Output() externalLink = new EventEmitter<Page>();
  @Output() view = new EventEmitter<Page>();
  @Output() edit = new EventEmitter<Page>();
  @Output() delete = new EventEmitter<Page>();
  searchText: string = "";

  constructor(public translate: TranslateService) { }

  ngOnInit(): void {
  }

  externalLinkPage(page: Page) {
    this.externalLink.emit(page);
  }

  viewPage(page: Page) {
    this.view.emit(page);
  }

  editPage(page: Page) {
    this.edit.emit(page);
  }

  deletePage(page: Page) {
    this.delete.emit(page);
  }

}

@Pipe({
  name: "filterPages"
})
export class FilterPagesPipe implements PipeTransform {
  transform(value: Page[], pattern: string = ""): Page[] {

      // If there is no data to filter return empty array
      if (!value)
        return [];

      // Try to filter values by pattern.
      if (!pattern)
        return value;

      return value.filter(o =>
          (o.name && o.name.toUpperCase().indexOf(pattern.toUpperCase()) >= 0) ||
          (o.slug && o.slug.toUpperCase().indexOf(pattern.toUpperCase()) >= 0)
      );
  }
}
