import { Component, Input, OnDestroy, OnInit } from '@angular/core';
import { SpinnerService } from '@core/services/spinner.service';
import { AutoTableRepository, AutoTableRepositoryFactory, TableDataFactory, ValueComparisonService } from '@yourcause/common';
import { YCModalComponent } from '@yourcause/common/modals';
import { NotifierService } from '@yourcause/common/notifier';
import { Subscription } from 'rxjs';
import { ApplicationActivityForUi } from '../activity.typing';

@Component({
  selector: 'gc-recent-activity-modal',
  templateUrl: './recent-activity-modal.component.html',
  styleUrls: ['./recent-activity-modal.component.scss']
})
export class RecentActivityModalComponent extends YCModalComponent<void> implements OnInit, OnDestroy {
  @Input() tableDataFactory: TableDataFactory<ApplicationActivityForUi>;
  @Input() showAppId = false;
  @Input() defaultCurrency: string;

  sub = new Subscription();
  repository: AutoTableRepository<ApplicationActivityForUi>;

  constructor (
    private autoTableFactory: AutoTableRepositoryFactory,
    private spinnerService: SpinnerService,
    private notifierService: NotifierService,
    private valueComparisonService: ValueComparisonService
  ) {
    super();
  }

  ngOnInit () {
    this.repository = this.autoTableFactory.create({
      key: 'ACTIVITY',
      columns: [],
      notifier: this.notifierService,
      valueComparisonService: this.valueComparisonService,
      tableDataFactory: this.tableDataFactory,
      rowsPerPage: 4,
      debounceDuration: 0
    });
    this.sub.add(this.repository.loading.subscribe((val) => {
      if (val) {
        this.spinnerService.startSpinner();
      } else {
        this.spinnerService.stopSpinner();
      }
    }));

    this.repository.reset();
  }

  onCancel () {
    this.closeModal.emit();
  }

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