import { CommonModule } from '@angular/common';
import { Component, Input } from '@angular/core';
import { MatIconModule } from '@angular/material/icon';
import { BehaviorSubject, map } from 'rxjs';
import { TimePerTourMetric } from '../../../../core/data-access/graphql/generated/generated';
import { summarizeMetrics } from '../../util/summarize-metrics';

@Component({
    selector: 'dks-average-revenue-summary',
    imports: [CommonModule, MatIconModule],
    templateUrl: './average-revenue-summary.component.html',
    styleUrls: ['./average-revenue-summary.component.css'],
    host: {
      class: 'flex justify-center items-center',
    },
})
export class AverageRevenueSummaryComponent {
  @Input() set metrics(value: TimePerTourMetric[]) {
    this._metrics$.next(value);
  }

  private _metrics$ = new BehaviorSubject<TimePerTourMetric[]>([]);

  metricsSummary$ = this._metrics$.pipe(
    map((metrics) => summarizeMetrics(metrics))
  );
}
