import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { SpinnerService } from '@core/services/spinner.service';
import { ReferenceFieldAPI } from '@core/typings/api/reference-fields.typing';
import { ClientSettingsService } from '@features/client-settings/client-settings.service';
import { ReferenceFieldsService } from '@features/reference-fields/services/reference-fields.service';
import { TopLevelFilter } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { ModalFactory } from '@yourcause/common/modals';
import { AddCustomDataTableModalComponent } from '../add-custom-data-table-modal/add-custom-data-table-modal.component';
import { CopyCustomDataTableModalComponent } from '../copy-custom-data-table-modal/copy-custom-data-table-modal.component';
import { CustomDataTablesService } from '../custom-data-table.service';
import { CustomDataTable } from '../custom-data-tables.typing';
import { DeleteDataTableModalComponent } from '../delete-data-table-modal/delete-data-table-modal.component';
import { MergeDataTablesModalComponent } from '../merge-data-tables-modal/merge-data-tables-modal.component';
import { UpdateCustomDataTableModalComponent } from '../update-custom-data-table-modal/update-custom-data-table-modal.component';


@Component({
  selector: 'gc-custom-data-tables-page',
  templateUrl: './custom-data-tables-page.component.html',
  styleUrls: ['./custom-data-tables-page.component.scss']
})
export class CustomDataTablesPageComponent implements OnInit {
  topLevelFilters: TopLevelFilter[] = [];
  customDataTables$ = this.customDataTablesService.changesTo$('customDataTables');
  drilldownInfo: ReferenceFieldAPI.ReferenceFieldDisplayModel[];

  constructor (
    private i18n: I18nService,
    private customDataTablesService: CustomDataTablesService,
    private modalFactory: ModalFactory,
    private router: Router,
    private clientSettingsService: ClientSettingsService,
    private spinnerService: SpinnerService,
    private refFieldsService: ReferenceFieldsService
  ) { }

  get customDataTables () {
    return this.customDataTablesService.customDataTables;
  }

  get isRootZone () {
    return this.clientSettingsService.clientSettings.isRootClient;
  }

  ngOnInit () {
    this.setTopLevelFilters();
  }

  setTopLevelFilters () {
    this.topLevelFilters = [
      new TopLevelFilter(
        'text',
        'name',
        '',
        this.i18n.translate(
          'FORMS:textSearchByTableName',
          {},
          'Search by table name'
        )
      )
    ];
  }

  onDrilldown (row: CustomDataTable) {
    this.drilldownInfo = null;
    const drilldownInfo = this.formFieldsUsingThisCDT(row);
    this.drilldownInfo = drilldownInfo;
  }

  formFieldsUsingThisCDT (row: CustomDataTable) {
    return this.refFieldsService.allReferenceFields.filter((refField) => {
      return refField.customDataTableGuid === row.guid;
    });
  }

  async updateName (row: CustomDataTable) {
    // determine if cdt is in use
    const formFieldsUsingThisCDT = this.formFieldsUsingThisCDT(row);
    const isInUse = formFieldsUsingThisCDT.length !== 0;
    const response = await this.modalFactory.open(
      UpdateCustomDataTableModalComponent,
      {
        dataTableId: row.id,
        name: row.name,
        parentPicklistId: row.parentPicklistId,
        isInUse
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      await this.customDataTablesService.handleUpdateDataTableName(
        row.id,
        response.tableName,
        row.defaultLanguageId,
        response.parentPicklistId
      );
      this.spinnerService.stopSpinner();
    }
  }

  async openDeleteDataTableModal (row: CustomDataTable) {
    const response = await this.modalFactory.open(
      DeleteDataTableModalComponent,
      {
        customDataTable: row
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      await this.customDataTablesService.handleDeleteDataTable(
        row.id
      );
      this.spinnerService.stopSpinner();
    }
  }

  async importData (row: CustomDataTable) {
    const route = await this.modalFactory.open(
      AddCustomDataTableModalComponent,
      {
        importOnly: true,
        id: row.id,
        parentPicklistId: row.parentPicklistId
      }
    );
    if (route) {
      this.router.navigate([route]);
    }
  }

  async exportData (row: CustomDataTable) {
    this.spinnerService.startSpinner();
    await this.customDataTablesService.exportData(
      row.id,
      row.defaultLanguageId || this.clientSettingsService.defaultLanguage,
      !!row.parentPicklistId
    );
    this.spinnerService.stopSpinner();
  }

  async copy (row: CustomDataTable) {
    const newName = await this.modalFactory.open(
      CopyCustomDataTableModalComponent,
      {
        cdtToCopy: row
      }
    );
    if (newName) {
      this.spinnerService.startSpinner();
      const id = await this.customDataTablesService.handleCopyTable(
        row.id,
        newName
      );
      this.spinnerService.stopSpinner();
      if (id) {
        this.router.navigate(['/management/program-setup/forms/data-table/' + id]);
      }
    }
  }

  async merge (row: CustomDataTable) {
    const result = await this.modalFactory.open(
      MergeDataTablesModalComponent,
      {
        cdtToMerge: row
      }
    );
    if (result) {
      this.spinnerService.startSpinner();
      await this.customDataTablesService.mergePicklists(result);
      this.spinnerService.stopSpinner();
    }
  }
}