import {Component, Input, Inject, ViewChildren, QueryList} from '@angular/core';
import { BaseComponent } from './base.component';
import { LoggerService } from './logger.service';
import { UtilityService } from './utility.service';
import { isEmpty as _isEmpty, get as _get, merge as _merge } from 'lodash-es';
import { RecordSource } from './record.model';
import { RecordPropViewMetaDto } from '@researchdatabox/sails-ng-common';
import { LoDashTemplateUtilityService } from './lodash-template-utility.service';
import {HeaderSortComponent} from "./header-sort.component";

/**
 * This component displays records in a table.
 *
 * Features:
 * - Pagination
 * - Sortable column headers (pending)
 * - Group by workflow stages (pending)
 *
 * Requires:
 * - Data source, with async support
 * - Config block used to render the table
 *
 * * Author: <a href='https://github.com/shilob' target='_blank'>Shilo B</a>
 */
@Component({
  selector: 'record-table',
  templateUrl: './record-table.component.html'
})
export class RecordTableComponent extends BaseComponent {
  // row/column config
  @Input() columnConfig: RecordPropViewMetaDto[] = null as any;
  // the data source
  @Input() dataSource: RecordSource = null as any;
  // additional binding data for templates
  @Input() optTemplateData: any = {};
  // pagination
  @Input() paginationItemsPerPage: number = 10;
  @Input() paginationDirectionLinks:boolean = false;
  @Input() paginationBoundaryLinks: boolean = true;
  @Input() paginationClass: string = 'pagination-sm';
  @Input() paginationMaxSize:number = 10;
  @Input() paginationRotate: boolean = true;
  // which actions to show in the table
  @Input() showActions: {name:string, classes: string, label:string}[] = [];
  // whether to enable table sorting
  @Input() enableSort: boolean = false;
  // whether to enable actions column
  @Input() enableActions: boolean = false;
  // find the header sort elements and provide references to them
  @ViewChildren(HeaderSortComponent) headerSortItems: QueryList<HeaderSortComponent> | undefined;

  constructor(
    @Inject(LoggerService) private loggerService: LoggerService,
    @Inject(UtilityService) private utilService: UtilityService,
    @Inject(LoDashTemplateUtilityService) private lodashTemplateUtilityService: LoDashTemplateUtilityService,
    ) {
    super();
    // no deps
    this.initDependencies = [];
  }

  protected override async initComponent():Promise<void> {
    if (_isEmpty(this.dataSource)) {
      this.loggerService.error(`RecordTableComponent is missing a datasource parameter!`);
      throw new Error(`RecordTableComponent is missing a datasource parameter!`);
    }
  }

  getColValue(row: any, col: RecordPropViewMetaDto) {
    if (col.multivalue) {
      let retVal = [];
      for (let val of _get(row, col.property)) {
        retVal.push(this.getEntryValue(row, col, val));
      }
      return retVal.join('');
    } else {
      return this.getEntryValue(row, col);
    }
  }

  getEntryValue(row: any, col: RecordPropViewMetaDto, val: any = undefined) {
    let retVal = '';
    if (!_isEmpty(col.template)) {
      const data = _merge({}, row, {
        recordTableMeta: {
          col: col,
          val: val
        },
        optTemplateData: this.optTemplateData
      });
      retVal = this.lodashTemplateUtilityService.runTemplate(data, {template: col.template});
    } else {
      retVal = _get(row, col.property, val);
    }
    return retVal;
  }

  async gotoPage(event: any) {
    await this.dataSource.gotoPage(event.page);
  }

  async headerSortChanged(event: any, data: any) {
    // Reset the sort order for all headers, except the header that was clicked.
    this.headerSortItems?.forEach(item => {
      if (item.step == event.step && item.variable == event.variable) {
        return;
      }
      item.sort = '';
    })
  }
}