import { Component, OnDestroy, OnInit } from '@angular/core';
import { SpecialHandlingModalComponent } from '@core/components/special-handling-modal/special-handling-modal.component';
import { SpinnerService } from '@core/services/spinner.service';
import { ALL_SKIP_FILTER, DebounceFactory, FileService, PaginationOptions, SimpleStringMap, TableDataFactory, TopLevelFilter } from '@yourcause/common';
import { I18nService } from '@yourcause/common/i18n';
import { ModalFactory } from '@yourcause/common/modals';
import { Subscription } from 'rxjs';
import { AddressRequestsService } from '../address-requests.service';
import { AddressRequestApproveApi, AddressRequestFileForUI, AddressRequestForUI, AddressRequestFromApi, AddressRequestRejectApi, AddressRequestStatus } from '../address-requests.typing';
import { ApproveRejectAddressRequestModalComponent } from '../approve-reject-address-request-modal/approve-reject-address-request-modal.component';
import { ToggleHoldStatusModalComponent } from '../toggle-hold-status-modal/toggle-hold-status-modal.component';

@Component({
  selector: 'gc-address-requests-table',
  templateUrl: './address-requests-table.component.html',
  styleUrls: ['./address-requests-table.component.scss']
})
export class AddressRequestsTableComponent implements OnDestroy, OnInit {
  tableDataFactory: TableDataFactory<AddressRequestForUI>;
  topLevelFilters: TopLevelFilter[] = [];
  hiddenFilters: TopLevelFilter[] = [];
  tableKey: string;
  addressRequestStatusMap = this.addressRequestService.getAddressRequestsStatusMap();
  addressRequestStatusOptions = this.addressRequestService.getAddressRequestStatusOptions();
  sub = new Subscription();
  AddressRequestStatus = AddressRequestStatus;
  drilldownMap: SimpleStringMap<AddressRequestFileForUI[]> = {};

  constructor (
    private addressRequestService: AddressRequestsService,
    private i18n: I18nService,
    private modalFactory: ModalFactory,
    private spinnerService: SpinnerService,
    private fileService: FileService
  ) { }

  get isActiveTab () {
    return location.pathname.includes('active');
  }

  ngOnInit () {
    this.tableKey = this.isActiveTab ?
      'ACTIVE_ADDRESS_REQUESTS' :
      'APPROVED_OR_REJECTED_ADDRESS_REQUESTS';
    this.setHiddenFilters();
    this.setTopLevelFilters();
    this.tableDataFactory = DebounceFactory.createSimple(
      async (options: PaginationOptions<AddressRequestForUI>) => {
        return this.addressRequestService.getAddressRequestRecords(
          options
        );
      }
    );
  }

  setHiddenFilters () {
    const statuses = this.isActiveTab ?
      [
        AddressRequestStatus.OnHold,
        AddressRequestStatus.Pending
      ] :
      [
        AddressRequestStatus.Approved,
        AddressRequestStatus.Rejected
      ];
    const hiddenStatusFilter = new TopLevelFilter(
      'checkboxDropdown',
      'addressRequestStatus',
      statuses,
      undefined,
      {
        selectOptions: this.addressRequestStatusOptions
      }
    );
    this.hiddenFilters = [hiddenStatusFilter];
  }

  setTopLevelFilters () {
    const selectOptions = [{
      label: this.i18n.translate(
        'GLOBAL:textAllActiveRequests',
        {},
        'All active requests'
      ),
      value: ALL_SKIP_FILTER
    }].concat(
      this.addressRequestStatusOptions.filter((opt) => {
        return this.isActiveTab ?
          [
            AddressRequestStatus.OnHold,
            AddressRequestStatus.Pending
          ].includes(opt.value) :
          [
            AddressRequestStatus.Approved,
            AddressRequestStatus.Rejected
          ].includes(opt.value);
      })
    );
    this.topLevelFilters = [
      new TopLevelFilter(
        'text',
        'applicantFullName',
        '',
        this.i18n.translate(
          'GLOBAL:textSearchByNonprofitApplicanNameOrEmail',
          {},
          'Search by nonprofit, applicant name, or email'
        ),
        undefined,
        undefined,
        [{
          column: 'applicantFullName',
          filterType: 'cn'
        }, {
          column: 'organizationName',
          filterType: 'cn'
        }, {
          column: 'organizationIdentification',
          filterType: 'cn'
        }, {
          column: 'applicantEmail',
          filterType: 'cn'
        }]
      ),
      new TopLevelFilter(
        'typeaheadSingleEquals',
        'addressRequestStatus',
        ALL_SKIP_FILTER,
        '',
        {
          selectOptions
        },
        this.i18n.translate('common:lblActiveStatusOptions')
      )
    ];
  }

  async onDrilldown (row: AddressRequestFromApi) {
    if (!this.drilldownMap[row.addressRequestId]) {
      const files = await this.addressRequestService.getFilesForAddressRequest(
        row.addressRequestId,
        row.applicationId
      );
      this.drilldownMap = {
        ...this.drilldownMap,
        [row.addressRequestId]: files
      };
    }
  }

  async downloadFile (
    url: string,
    applicationId: number,
    decode: boolean,
    fileName?: string
  ) {
    this.spinnerService.startSpinner();
    if (decode) {
      await this.addressRequestService.downloadAddressRequestFile(
        url,
        applicationId
      );
    } else {
      await this.fileService.downloadUrlAs(url, fileName);
    }
    this.spinnerService.stopSpinner();
  }


  async toggleHold (row: AddressRequestFromApi) {
    const releaseHold = row.addressRequestStatus === AddressRequestStatus.OnHold;
    const response = await this.modalFactory.open(
      ToggleHoldStatusModalComponent,
      {
        releaseHold,
        orgName: row.organizationName,
        applicantName: row.applicantFullName
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      const passed = await this.addressRequestService.handleToggleHold(
        row.addressRequestId,
        releaseHold ?
          AddressRequestStatus.Pending :
          AddressRequestStatus.OnHold,
        response.comment
      );
      if (passed) {
        this.tableDataFactory.reset.emit();
      }
      this.spinnerService.stopSpinner();
    }
  }


  async viewDetails (row: AddressRequestForUI) {
    await this.modalFactory.open(
      SpecialHandlingModalComponent,
      {
        isViewOnly: true,
        paymentId: row.paymentId,
        name: row.organizationName || row.applicantFullName,
        payeeOverride: {
          notes: row.notes,
          address1: row.newAddress.address,
          address2: row.newAddress.address2,
          city: row.newAddress.city,
          state: row.newAddress.state,
          country: row.newAddress.country,
          postalCode: row.newAddress.postalCode,
          applicationId: row.applicationId,
          paymentId: row.paymentId,
          reason: row.reason,
          fileUrl: row.fileUrl
        },
        applicationId: row.applicationId
      }
    );
  }

  async approveRequest (row: AddressRequestForUI) {
    const response = await this.modalFactory.open(
      ApproveRejectAddressRequestModalComponent,
      {
        approve: true,
        addressRequest: row
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      await this.addressRequestService.handleApproveRequest(
        response as AddressRequestApproveApi
      );
      this.tableDataFactory.reset.emit();
      this.spinnerService.stopSpinner();
    }
  }

  async rejectRequest (row: AddressRequestForUI) {
    const response = await this.modalFactory.open(
      ApproveRejectAddressRequestModalComponent,
      {
        approve: false,
        addressRequest: row
      }
    );
    if (response) {
      this.spinnerService.startSpinner();
      await this.addressRequestService.handleRejectRequest(
        response as AddressRequestRejectApi
      );
      this.tableDataFactory.reset.emit();
      this.spinnerService.stopSpinner();
    }
  }

  ngOnDestroy () {
    this.sub.unsubscribe();
  }
}