import { ERROR_DEFAULT_OPTIONS, ErrorStyleType } from '@allianz/ng-aquila/base';
import { CHANNEL, CHANNEL_TOKEN, ValidationConfig } from '@allianz/taly-core';
import { ChangeDetectionStrategy, Component, Input, inject } from '@angular/core';
import { ValidationErrors } from '@angular/forms';
import { Observable } from 'rxjs';
import { ValidationErrorsService } from './validation-errors.service';

@Component({
  selector: 'taly-validation-errors',
  templateUrl: 'validation-errors.component.html',
  standalone: false,
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class ValidationErrorsComponent {
  @Input() isInputDateYear = false;

  private validationErrorsService = inject(ValidationErrorsService);
  private _controlErrors: ValidationErrors = {};
  private _validationConfigs: ValidationConfig[] = [];

  errorMessages$: Observable<string>[] = [];

  @Input()
  set controlErrors(value: ValidationErrors | null | undefined) {
    this._controlErrors = value || {};
    this.errorMessages$ = this.getErrorMessageStreams();
  }

  @Input()
  set errorMessages(value: ValidationConfig[] | undefined) {
    this._validationConfigs = value?.filter((config) => config.validatorName) ?? [];
    this.errorMessages$ = this.getErrorMessageStreams();
  }
  get errorMessages(): ValidationConfig[] {
    return this._validationConfigs;
  }

  /** `nx-error` appearance. Only use this to override default behavior: `text` for Expert and
   *  `message` for Retail. */
  @Input() appearance: ErrorStyleType;

  constructor() {
    const channel = inject<CHANNEL>(CHANNEL_TOKEN);

    this.appearance =
      inject(ERROR_DEFAULT_OPTIONS, { optional: true })?.appearance ||
      (channel === CHANNEL.EXPERT ? 'text' : 'message');
  }

  getErrorMessageStreams(): Observable<string>[] {
    return this.validationErrorsService.resolveErrorMessages({
      controlErrors: this._controlErrors,
      validationConfigs: this._validationConfigs,
      isInputDateYear: this.isInputDateYear
    });
  }
}