import {Component, CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';
import {MatCard, MatCardContent, MatCardHeader} from '@angular/material/card';
import {MatDivider} from '@angular/material/divider';
import {MatTab, MatTabGroup} from '@angular/material/tabs';
import {
  MatCell,
  MatCellDef,
  MatColumnDef,
  MatHeaderCell, MatHeaderCellDef,
  MatHeaderRow, MatHeaderRowDef,
  MatRow,
  MatRowDef,
  MatTable
} from '@angular/material/table';
import {MatList, MatListItem} from '@angular/material/list';
import {MatIconButton} from '@angular/material/button';
import {SystemService} from '../../services/system.service';
import {Bean} from '../../models/Bean';
import {MatIcon} from '@angular/material/icon';

@Component({
  selector: 'app-system.component',
  imports: [
    MatCard,
    MatCardHeader,
    MatCardContent,
    MatDivider,
    MatTabGroup,
    MatTab,
    MatTable,
    MatColumnDef,
    MatIcon,
    MatCell,
    MatCellDef,
    MatList,
    MatListItem,
    MatRow,
    MatHeaderRow,
    MatRowDef,
    MatHeaderCell,
    MatHeaderCellDef,
    MatIconButton,
    MatIcon,
    MatHeaderRowDef
  ],
  templateUrl: './system.component.html',
  styleUrl: './system.component.scss',
  schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class SystemComponent {
  customBeans:Bean[] = [] ;
  allBeans:Bean[] = [] ;
  displayedColumns: string[] = ['shortName', 'typeShortName', 'scope'];

  columnsToDisplayWithExpand = [...this.displayedColumns, 'expand'];

  expandedElement: Bean | null = null;

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

constructor(private systemService: SystemService) { }

ngOnInit(): void {
  this.retrieveBeans();
}

retrieveBeans(): void {
  this.systemService.getCustomBeans()
    .subscribe(
      (data: Bean[]) => {
        this.customBeans = data;
        console.log(data);
      },
      (error: any) => {
        console.log(error);
      });
  this.systemService.getAllBeans()
    .subscribe(
      (data: Bean[]) => {
        this.allBeans = data;
        console.log(data);
      },
      (error: any) => {
        console.log(error);
      });
}

/** Checks whether an element is expanded. */
isExpanded(element: Bean) {
  return this.expandedElement === element;
}

/** Toggles the expanded state of an element. */
toggle(element: Bean) {
  this.expandedElement = this.isExpanded(element) ? null : element;
}



//ngAfterViewInit() {
  //this.exampleDatabase = new ExampleHttpDatabase(this._httpClient);

  // If the user changes the sort order, reset back to the first page.
  /*  this.sort.sortChange.subscribe(() => (this.paginator.pageIndex = 0));

    merge(this.sort.sortChange, this.paginator.page)
      .pipe(
        startWith({}),
        switchMap(() => {
          this.isLoadingResults = true;
          return this.exampleDatabase!.getRepoIssues(
            this.sort.active,
            this.sort.direction,
            this.paginator.pageIndex,
          ).pipe(catchError(() => observableOf(null)));
        }),
        map(data => {
          // Flip flag to show that loading has finished.
          this.isLoadingResults = false;
          this.isRateLimitReached = data === null;

          if (data === null) {
            return [];
          }

          // Only refresh the result length if there is new data. In case of rate
          // limit errors, we do not want to reset the paginator to zero, as that
          // would prevent users from re-triggering requests.
          this.resultsLength = data.total_count;
          return data.items;
        }),
      )
      .subscribe(data => (this.data = data));*/
}