import { AbstractFormDialog } from '@/shared/abstractClasses';
import { DescriptionComponent, NameComponent, SkuComponent } from '@/shared/components';
import { FormFooterActionsComponent } from '@/shared/components/formFooterActions/form-footer-actions.component';
import { Component, Input, signal } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';

import { Maybe } from '@/core';
import { EnumSelectComponent } from '@/shared/apiEnum/select.component';
import { CatalogGuildGoodCategoriesSelectComponent } from '@/shared/catalog/guildGoodCategories';
import { CatalogMeasureUnitsSelectComponent } from '@/shared/catalog/measureUnits';
import { SharedDialogComponent } from '@/shared/components/dialog/dialog.component';
import { onSelectFileArgs } from '@/shared/components/uploadFile/model';
import { fieldControl } from '@/shared/constants';
import { buildFormData } from '@/utils';
import { Observable } from 'rxjs';
import { SharedUploadFileComponent } from '../uploadFile/upload-file.component';
import { IGoodRequestPayload, IGoodResponse } from './types';

@Component({
  selector: 'shared-good-form',
  templateUrl: './form.component.html',
  imports: [
    ReactiveFormsModule,
    SharedDialogComponent,
    FormFooterActionsComponent,
    EnumSelectComponent,
    SkuComponent,
    CatalogMeasureUnitsSelectComponent,
    NameComponent,
    DescriptionComponent,
    SharedUploadFileComponent,
    CatalogGuildGoodCategoriesSelectComponent,
  ],
})
export class SharedGoodFormComponent extends AbstractFormDialog<
  IGoodRequestPayload,
  IGoodResponse
> {
  @Input({ required: true }) guildId!: string;
  @Input({ required: true }) createFn!: (payload: FormData) => Observable<IGoodResponse>;
  @Input({ required: true }) updateFn!: (payload: FormData) => Observable<IGoodResponse>;

  goodImage = signal<Maybe<File>>(null);

  form = this.fb.group({
    name: fieldControl.name(this.initialValues?.name || '', true),
    sku_id: fieldControl.sku(this.initialValues?.sku.id || '', true),
    measure_unit_id: fieldControl.measure_unit(this.initialValues?.measure_unit.id || '', true),
    pricing_model: fieldControl.pricing_model(this.initialValues?.pricing_model || '', true),
    category_id: fieldControl.category_id(this.initialValues?.category.id || '', true),
    description: fieldControl.description(this.initialValues?.description || '', false),
  });

  get preparedTitle() {
    return `${this.editMode ? 'ویرایش' : 'افزودن'} کالا`;
  }

  changeFile(payload: onSelectFileArgs) {
    this.goodImage.set(payload.file);
  }

  override ngOnChanges(): void {
    this.form.patchValue(this.initialValues || {});
    this.form.controls.category_id.setValue(this.initialValues?.category.id || '');
    this.form.controls.measure_unit_id.setValue(this.initialValues?.measure_unit.id || '');
    this.form.controls.sku_id.setValue(this.initialValues?.sku.id || '');
  }

  override submitForm() {
    const formData = buildFormData(this.form, { image: this.goodImage() });
    if (this.editMode) {
      return this.updateFn(formData);
    }
    return this.createFn(formData);
  }
}
