import {LowerCasePipe} from '@angular/common';
import {ChangeDetectionStrategy, Component, input} from '@angular/core';
import {
  MatExpansionPanel,
  MatExpansionPanelHeader,
  MatExpansionPanelTitle,
} from '@angular/material/expansion';
import {
  NshmpDataTableComponent,
  NshmpExportDataTableComponent,
  TableData,
} from '@ghsc/nshmp-lib-ng/nshmp';

/**
 * Expansion panel with data table and export.
 */
@Component({
  changeDetection: ChangeDetectionStrategy.OnPush,
  host: {id: 'dev-hazard-dynamic-compare-table-data-panel'},
  imports: [
    LowerCasePipe,
    MatExpansionPanel,
    MatExpansionPanelHeader,
    MatExpansionPanelTitle,
    NshmpDataTableComponent,
    NshmpExportDataTableComponent,
  ],
  selector: 'app-table-data-panel',
  styleUrl: './table-data-panel.component.scss',
  templateUrl: './table-data-panel.component.html',
})
export class TableDataPanelComponent {
  /** Text for export button */
  readonly buttonText = input('Export as CSV');

  /** Filename for export  */
  readonly filename = input<string>('hazard.csv');

  /** Expansion panel title */
  readonly panelTitle = input<string>('');

  /** Table data */
  readonly tableData = input<TableData[]>([]);
}