import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

import * as _ from 'lodash';

import { Settings } from '../../core/settings';
import { HistoryService } from '../shared/history.service';
import { History } from '../shared/history.model';

@Component({
  selector: 'hi-history-list',
  templateUrl: './history-list.component.html',
  styleUrls: ['./history-list.component.scss'],
  providers: [HistoryService],
  // FIXME: have to turn off shadow dom or .current-controller won't work
  encapsulation: ViewEncapsulation.None
})
export class HistoryListComponent implements OnInit {

  rows: History[];
  rowHeight = Settings.tableRowHeight;
  headerHeight = Settings.tableHeaderHeight;
  isController: boolean;
  isLoading = true;
  sorts = [
    { prop: 'date', dir: 'desc'}
  ];

  // to let ngx-datatable helper funcs have 'this' context
  bindFunc = _.bind;

  constructor(
    private route: ActivatedRoute,
    private service: HistoryService
  ) { }

  ngOnInit() {
    if (this.route.parent) {
      const clusterName = this.route.parent.snapshot.params['cluster_name'];
      const instanceName = this.route.parent.snapshot.params['instance_name'];
      const observable = instanceName
        ? this.service.getInstanceHistory(clusterName, instanceName)
        : this.service.getControllerHistory(clusterName);

      this.isController = !instanceName;

      observable.subscribe(
        histories => this.rows = histories,
        error => {},
        () => this.isLoading = false
      );
    }
  }

  getControllerCellClass({ value }): any {
    return {
      current: value == this.rows[this.rows.length - 1].controller
    };
  }

  getSessionCellClass({ value }): any {
    return {
      current: value == this.rows[this.rows.length - 1].session
    };
  }

}
