import {Component, computed, inject} from '@angular/core';
import {NshmpPlotSettingsExpansionPanelComponent, PlotSettingsPlots} from '@ghsc/nshmp-lib-ng/plot';

import {AppService} from '../../services/app.service';

/**
 * Settings for all plots.
 */
@Component({
  imports: [NshmpPlotSettingsExpansionPanelComponent],
  selector: 'app-plot-settings-panel',
  styleUrl: './plot-settings-panel.component.scss',
  templateUrl: './plot-settings-panel.component.html',
})
export class PlotSettingsPanelComponent {
  private service = inject(AppService);

  plots = computed<PlotSettingsPlots[]>(() => {
    const plots = this.service.plots();
    const expanded = false;

    return [
      {
        defaultPlotSetting: plots.hazard.settingsForm.getRawValue(),
        expanded,
        plot: plots.hazard,
      },
      {
        defaultPlotSetting: plots.hazardDifferences.settingsForm.getRawValue(),
        expanded,
        plot: plots.hazardDifferences,
      },
      {
        defaultPlotSetting: plots.spectrum.settingsForm.getRawValue(),
        expanded,
        plot: plots.spectrum,
      },
      {
        defaultPlotSetting: plots.spectrumDifferences.settingsForm.getRawValue(),
        expanded,
        plot: plots.spectrumDifferences,
      },
      {
        defaultPlotSetting: plots.hazardComponents.settingsForm.getRawValue(),
        expanded,
        plot: plots.hazardComponents,
      },
      {
        defaultPlotSetting: plots.spectrumComponents.settingsForm.getRawValue(),
        expanded,
        plot: plots.spectrumComponents,
      },
    ];
  });
}