import {HttpClient} from '@angular/common/http';
import { Component, ViewChild, OnInit } from '@angular/core';
import { Plant } from 'src/app/models/plant';
import { PlantsService } from 'src/app/services/plants.service';
import {MatPaginator} from '@angular/material/paginator';
import {MatSort} from '@angular/material/sort';
import {merge, Observable, of as observableOf} from 'rxjs';
import {catchError, map, startWith, switchMap} from 'rxjs/operators';
import {MatTableDataSource} from '@angular/material/table';


@Component({
  selector: 'app-plants-datatables',
  templateUrl: './plants-datatables.component.html',
  styleUrls: ['./plants-datatables.component.scss']
})

export class PlantsDatatablesComponent implements OnInit {
  displayedColumns: string[] = ['name','state', 'installDate', 'country', 'city', 'installedCapacity'];
  //displayedColumns: string[] = ['state'];


  listData: Plant[] = [];
  dataSource = new MatTableDataSource(this.listData);

  resultsLength = 0;
  isLoadingResults = true;
  isRateLimitReached = false;

  @ViewChild(MatPaginator, {static: true}) paginator: MatPaginator;
  @ViewChild(MatSort, {static: true}) sort: MatSort;

  constructor(private plantsService: PlantsService) {}

  ngOnInit() {
    this.plantsService.getPlants().subscribe(res =>
      this.listData = res
    );
    this.dataSource.data = this.listData;
    this.dataSource.paginator = this.paginator;
    this.dataSource.sort = this.sort;
  }



  applyFilter(filterValue: string) {
    this.dataSource.filter = filterValue.trim().toLowerCase();
    if (this.dataSource.paginator) {
      this.dataSource.paginator.firstPage();
    }
  }

}
