import { UikitFieldComponent } from '@/uikit';
import { DOCUMENT } from '@angular/common';
import { Component, Inject, computed, inject, Input } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
import { Select } from 'primeng/select';
import { Observable } from 'rxjs';
import { AbstractSelectComponent } from '../abstractClasses';
import { apiEnumTranslates } from './constants';
import { IApiEnumResponse, TEnumApi } from './models';
import { EnumsService } from './services';

@Component({
  selector: 'app-enum-select',
  templateUrl: './select.component.html',
  imports: [UikitFieldComponent, Select, ReactiveFormsModule],
})
export class EnumSelectComponent extends AbstractSelectComponent<string, IApiEnumResponse[]> {
  @Input({ required: true }) type!: TEnumApi;
  @Input() name?: string;
  @Input() customLabel?: string;

  private readonly service = inject(EnumsService);
  constructor(@Inject(DOCUMENT) private readonly document: Document) {
    super();
  }

  label = computed(() => this.customLabel ?? apiEnumTranslates[this.type]);

  override getDataService(): Observable<IApiEnumResponse[]> {
    return this.service.getAll(this.type);
  }

  ngOnInit() {
    this.getData();
  }

  overlayOptions() {
    return {
      autoZIndex: true,
      baseZIndex: this.overlayBaseZIndex(),
    };
  }

  overlayBaseZIndex() {
    const drawers = Array.from(this.document.body.querySelectorAll('.p-drawer,[data-pc-name="drawer"]')) as HTMLElement[];
    const zIndexes = drawers
      .map((drawer) => Number.parseInt(drawer.style.zIndex || '0', 10))
      .filter((zIndex) => Number.isFinite(zIndex) && zIndex > 0);

    return zIndexes.length ? Math.max(...zIndexes) + 2 : 1000;
  }
}