import { CHANNEL, CHANNEL_TOKEN, TalyStateService } from '@allianz/taly-core';
import { pushEvent } from '@allianz/tracking';
import { Component, DestroyRef, effect, inject, Inject, input, Input } from '@angular/core';
import { AccordionStyle } from '@aposin/ng-aquila/accordion';
import startCase from 'lodash/startCase';
import { first, tap } from 'rxjs/operators';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';

type StyleOfThePanel = Uppercase<AccordionStyle>;

@Component({
  selector: 'bc-summary-panel',
  templateUrl: 'summary-panel.component.html',
  styleUrls: ['summary-panel.component.scss'],
  standalone: false
})
export class SummaryPanelComponent {
  @Input() set id(id: string) {
    this._id = id;
    this._trackingId = this.formatTrackingId(this._id);
  }

  @Input() title = '';
  expanded = input<string | boolean>(false);
  @Input() variant?: StyleOfThePanel;

  isExpert: boolean;
  evaluatedExpandedState = false;
  private _trackingId = '';
  private _id = '';

  private talyStateService = inject(TalyStateService, { optional: true });
  private destroyRef = inject(DestroyRef);

  constructor(@Inject(CHANNEL_TOKEN) private _channel: CHANNEL) {
    this.isExpert = this._channel === CHANNEL.EXPERT;

    effect(() => {
      const expandedValue = this.expanded();

      if (typeof expandedValue === 'string') {
        if (!this.talyStateService) {
          console.warn(
            'Please provide TalyStateService if you want to make panels expandable based on conditions'
          );
          return;
        }

        this.talyStateService
          .evaluateCondition$(expandedValue, false)
          .pipe(
            takeUntilDestroyed(this.destroyRef),
            first(),
            tap((evaluatedCondition) => (this.evaluatedExpandedState = evaluatedCondition))
          )
          .subscribe();
      } else {
        this.evaluatedExpandedState = expandedValue;
      }
    });
  }

  get ndbxStyle(): AccordionStyle {
    return (this.variant?.toLowerCase() as AccordionStyle) ?? 'regular';
  }

  private formatTrackingId(configId: string): string {
    const id = startCase(configId).replace(/\s/g, '');
    return `btn_Accordion_${id}`;
  }

  pushEvent(expanded: boolean): void {
    const status = expanded ? 'Open' : 'Closed';
    pushEvent(this._trackingId, status);
  }
}