import { InputComponent } from '@/shared/components';
import { FormFooterActionsComponent } from '@/shared/components/formFooterActions/form-footer-actions.component';
import { Component, effect, EventEmitter, inject, Input, Output, signal } from '@angular/core';
import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
import { Dialog } from 'primeng/dialog';
import { IInventoryRequest, IInventoryResponse } from '../models';
import { InventoriesService } from '../services/main.service';

@Component({
  selector: 'inventory-form',
  templateUrl: './form.component.html',
  imports: [ReactiveFormsModule, Dialog, InputComponent, FormFooterActionsComponent],
})
export class InventoryFormComponent {
  @Input() initialValues?: IInventoryResponse;

  @Input()
  set visible(v: boolean) {
    this.visibleSignal.set(!!v);
  }
  get visible() {
    return this.visibleSignal();
  }
  private visibleSignal = signal(false);

  @Output() visibleChange = new EventEmitter<boolean>();
  @Output() onSubmit = new EventEmitter<IInventoryResponse>();

  private fb = inject(FormBuilder);
  constructor(private service: InventoriesService) {
    effect(() => {
      const v = this.visibleSignal();
      if (!v) this.form.reset();
    });
  }

  form = this.fb.group({
    name: [this.initialValues?.name || null, [Validators.required]],
    location: [this.initialValues?.location || null, [Validators.required]],
    isActive: [this.initialValues?.isActive || false, [Validators.required]],
  });

  submitLoading = signal(false);

  submit() {
    this.form.markAllAsTouched();
    if (this.form.valid) {
      this.form.disable();
      this.submitLoading.set(true);
      this.service.create(this.form.value as IInventoryRequest).subscribe({
        next: (res) => {
          this.submitLoading.set(false);
          this.form.enable();
          this.form.reset();
          this.onSubmit.emit(res);
        },
        error: () => {
          this.submitLoading.set(false);
          this.form.enable();
        },
      });
    }
  }

  close() {
    this.visibleChange.emit(false);
  }
}