import {Component, computed} from '@angular/core';
import {MatDivider} from '@angular/material/divider';
import {
  MatAccordion,
  MatExpansionPanel,
  MatExpansionPanelHeader,
  MatExpansionPanelTitle,
} from '@angular/material/expansion';
import {NshmpLibNgAppMetadataComponent} from '@ghsc/nshmp-lib-ng/nshmp';
import {
  NshmpLibNgPlotComponent,
  NshmpLibNgPlotsContainerComponent,
} from '@ghsc/nshmp-lib-ng/plot';

import {AppService} from '../../services/app.service';
import {ParameterSummaryComponent} from '../parameter-summary/parameter-summary.component';

/**
 * Ground motion vs distance Ploty plot with parameter summary.
 */
@Component({
  imports: [
    NshmpLibNgPlotsContainerComponent,
    NshmpLibNgPlotComponent,
    NshmpLibNgAppMetadataComponent,
    MatAccordion,
    MatExpansionPanel,
    MatExpansionPanelHeader,
    MatExpansionPanelTitle,
    MatDivider,
    ParameterSummaryComponent,
  ],
  selector: 'app-plots',
  styleUrl: './plots.component.scss',
  templateUrl: './plots.component.html',
})
export class PlotsComponent {
  /** GM vs distance plot data */
  meanPlotData = computed(() => this.service.meanPlotState()?.plotData);

  /** Repo metadata */
  repositories = computed(() => this.service.usage()?.metadata.repositories);

  constructor(public service: AppService) {}
}