import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { SpinnerService } from '@core/services/spinner.service';
import { ClientSettingsService } from '@features/client-settings/client-settings.service';
import { AddCustomDataTableModalComponent } from '@features/custom-data-tables/add-custom-data-table-modal/add-custom-data-table-modal.component';
import { FormBuilderService } from '@features/formio/form-builder/services/form-builder/form-builder.service';
import { FormLogicService } from '@features/formio/services/form-logic/form-logic.service';
import { BulkFormFieldImportModalComponent } from '@features/reference-fields/bulk-form-field-import-modal/bulk-form-field-import-modal.component';
import { CreateEditCategoryModalComponent } from '@features/reference-fields/create-edit-category-modal/create-edit-category-modal.component';
import { CreateEditReferenceFieldModalComponent } from '@features/reference-fields/create-edit-reference-field-modal/create-edit-reference-field-modal.component';
import { ReferenceFieldsService } from '@features/reference-fields/services/reference-fields.service';
import { ModalFactory } from '@yourcause/common/modals';
import { CreateEditFormModalComponent } from '../create-edit-form-modal/create-edit-form-modal.component';
import { FormTypes, ImportFileType } from '../form.typing';
import { FormsService } from '../services/forms/forms.service';

@Component({
  selector: 'gc-forms-page-wrapper',
  templateUrl: './forms-page-wrapper.component.html'
})
export class FormsPageWrapperComponent implements OnInit {
  @ViewChild('importFile') importFileButton: ElementRef;
  hasInternational = this.clientSettingsService.clientSettings.hasInternational;
  hasLangs = !this.clientSettingsService.noSelectedLanguages;
  FileTypes = ImportFileType;

  constructor (
    private spinnerService: SpinnerService,
    private referenceFieldsService: ReferenceFieldsService,
    private formService: FormsService,
    private clientSettingsService: ClientSettingsService,
    private modalFactory: ModalFactory,
    private router: Router,
    private activatedRoute: ActivatedRoute,
    private formBuilderService: FormBuilderService,
    private formLogicService: FormLogicService
  ) { }

  get isCustomDataTables () {
    return location.pathname.includes('data-tables');
  }

  get isForms () {
    return location.pathname.includes('all') ;
  }

  get isReferenceFields () {
    return location.pathname.includes('reference-fields');
  }

  get isCategories () {
    return location.pathname.includes('categories');
  }

  ngOnInit () {
    const openCreateFormModal = !!this.activatedRoute.snapshot.queryParams?.createFormType;
    if (openCreateFormModal) {
      this.createFormModal(+this.activatedRoute.snapshot.queryParams?.createFormType as FormTypes);
    }
  }

  async createFormModal (formType?: FormTypes) {
    const response = await this.modalFactory.open(
      CreateEditFormModalComponent,
      {
        forceFormType: formType
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      const route = await this.formLogicService.handleCreateForm(response.formGroup);
      await this.formService.refreshForms();
      this.spinnerService.stopSpinner();
      if (route) {
        if (response.openQuickAddModal) {
          this.formBuilderService.setOpenQuickAddModal(true);
        }
        this.router.navigate([route]);
      }
    }
  }

  async createReferenceField () {
    const result = await this.modalFactory.open(
      CreateEditReferenceFieldModalComponent,
      {}
    );

    if (result) {
      this.spinnerService.startSpinner();
      await this.referenceFieldsService.handleCreateOrUpdateField(
        null,
        result.field,
        result.tableFields
      );
      this.spinnerService.stopSpinner();
    }
  }

  importFileByType (type: ImportFileType) {
    const onChange = (changeEvent: any) => {
      const [file] = changeEvent.target.files;

      const fileReader = new FileReader();

      fileReader.addEventListener('loadend', async (loadEvent: any) => {
        this.spinnerService.startSpinner();
        const result = loadEvent.target.result;
        switch (type) {
          case ImportFileType.FORM:
            await this.formService.importForms(result);
            break;
          case ImportFileType.REFERENCE_FIELD:
            await this.referenceFieldsService.importReferenceFields(result);
            break;
        }
        this.spinnerService.stopSpinner();
      });

      fileReader.readAsText(file);
    };
    this.importFileButton.nativeElement.onchange = onChange;
    this.importFileButton.nativeElement.click();
  }


  addCustomDataTable () {
    this.modalFactory.open(
      AddCustomDataTableModalComponent,
      { }
    );
  }

  async bulkCreateReferenceFields () {
    const formFieldsToImport = await this.modalFactory.open(
      BulkFormFieldImportModalComponent,
      {}
    );
    if (formFieldsToImport) {
      this.spinnerService.startSpinner();
      await this.referenceFieldsService.handleBulkCreateReferenceFields(
        formFieldsToImport
      );
      this.spinnerService.stopSpinner();
    }
  }

  async createCategory () {
    const categoryName = await this.modalFactory.open(
      CreateEditCategoryModalComponent,
      { }
    );
    if (categoryName) {
      this.spinnerService.startSpinner();
      await this.referenceFieldsService.handleCreateOrEditCategory(
        null,
        categoryName
      );
      this.spinnerService.stopSpinner();
    }
  }
}