import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { ImportExportService } from '@core/services/import-export.service';
import { SpinnerService } from '@core/services/spinner.service';
import { BulkAction, DebounceFactory, PaginationOptions, TableDataFactory, TopLevelFilter } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { ConfirmationModalComponent, ModalFactory } from '@yourcause/common/modals';
import { CreateDocumentTemplateModalComponent } from '../create-document-template-modal/create-document-template-modal.component';
import { DocumentTemplatePreviewModalComponent } from '../document-template-preview-modal/document-template-preview-modal.component';
import { DocumentTemplateService } from '../document-template.service';
import { DocumentTemplateForUi, ExportDocumentTemplate } from '../document-template.typing';

@Component({
  selector: 'gc-document-templates-table',
  templateUrl: './document-templates-table.component.html',
  styleUrls: ['./document-templates-table.component.scss']
})
export class DocumentTemplatesTableComponent implements OnInit {
  topLevelFilters: TopLevelFilter[] = [];
  tableDataFactory: TableDataFactory<DocumentTemplateForUi>;
  bulkActions: BulkAction<DocumentTemplateForUi>[] = [{
    disabled: () => false,
    label: this.i18n.translate('CONFIG:textExportDocumentTemplates', {}, 'Export document templates'),
    exec: (fields: DocumentTemplateForUi[]) => this.exportDocumentTemplates(fields)
  }];

  constructor (
    private documentTemplateService: DocumentTemplateService,
    private i18n: I18nService,
    private modalFactory: ModalFactory,
    private spinnerService: SpinnerService,
    private router: Router,
    private importExportService: ImportExportService
  ) { }

  ngOnInit () {
    this.setTopLevelFilters();
    this.setTableDataFactory();
  }

  setTopLevelFilters () {
    this.topLevelFilters = [
      new TopLevelFilter(
        'text',
        'name',
        '',
        this.i18n.translate(
          'CONFIG:textSearchForATemplate',
          {},
          'Search for a template'
        )
      )
    ];
  }

  setTableDataFactory () {
    this.tableDataFactory = DebounceFactory.createSimple(
      async (options: PaginationOptions<DocumentTemplateForUi>) => {
        const response = await this.documentTemplateService.getDocumentTemplatesPaginated(
          options
        );

        return {
          success: true,
          data: {
            records: this.documentTemplateService.adaptDocumentTemplates(response.records),
            recordCount: response.recordCount
          }
        };
      }
    );
  }

  navigateToDetail (id: number) {
    this.router.navigate([
      `/management/configure/document-templates/detail/${id}`
    ]);
  }

  async createTemplateModal () {
    const name = await this.modalFactory.open(
      CreateDocumentTemplateModalComponent,
      {}
    );
    if (name) {
      this.spinnerService.startSpinner();
      const id = await this.documentTemplateService.handleCreateDocumentTemplate(
        name
      );
      this.spinnerService.stopSpinner();
      if (id) {
        this.tableDataFactory.reset.emit();
        this.navigateToDetail(id);
      }
    }
  }

  async copyTemplateModal (row: DocumentTemplateForUi) {
    const response = await this.modalFactory.open(
      ConfirmationModalComponent,
      {
        confirmButtonText: this.i18n.translate(
          'common:textCopy',
          {},
          'Copy'
        ),
        confirmText: this.i18n.translate(
          'CONFIG:textAreYouSureYouWantToCopyThisDocumentTemplate',
          {},
          'Are you sure you want to copy this document template?'
        ),
        modalHeader: this.i18n.translate(
          'CONFIG:hdrCopyDocumentTemplate',
          {},
          'Copy Document Template'
        ),
        modalSubHeader: row.name
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      const id = await this.documentTemplateService.handleCopyTemplate(row.id);
      if (id) {
        this.tableDataFactory.reset.emit();
        this.navigateToDetail(id);
      }
      this.spinnerService.stopSpinner();
    }
  }

  previewTemplateModal (row: DocumentTemplateForUi) {
    this.modalFactory.open(
      DocumentTemplatePreviewModalComponent,
      {
        templateId: row.id,
        templateName: row.name
      }
    );
  }

  async deleteTemplateModal (row: DocumentTemplateForUi) {
    const response = await this.modalFactory.open(
      ConfirmationModalComponent,
      {
        confirmButtonText: this.i18n.translate(
          'common:btnDelete',
          {},
          'Delete'
        ),
        confirmText: this.i18n.translate(
          'CONFIG:textAreYouSureYouWantToDeleteThisDocumentTemplate',
          {},
          'Are you sure you want to delete this document template?'
        ),
        modalHeader: this.i18n.translate(
          'CONFIG:hdrDeleteDocumentTemplate',
          {},
          'Delete Document Template'
        ),
        modalSubHeader: row.name
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      const passed = await this.documentTemplateService.handleDeleteTemplate(row.id);
      if (passed) {
        this.tableDataFactory.reset.emit();
      }
      this.spinnerService.stopSpinner();
    }
  }

  async importDocumentTemplates () {
    const templates = await this.importExportService.handleImportFileClick<ExportDocumentTemplate[]>();
    this.spinnerService.startSpinner();
    const passed =  await this.documentTemplateService.importDocumentTemplates(
      templates
    );
    if (passed) {
      this.tableDataFactory.reset.emit();
    }
    this.spinnerService.stopSpinner();
  }

  async exportDocumentTemplates (templates: DocumentTemplateForUi[]) {
    this.spinnerService.startSpinner();
    await this.documentTemplateService.exportDocumentTemplates(
      templates.map((template) => template.id)
    );
    this.spinnerService.stopSpinner();
  }
}