import {Component, OnDestroy, OnInit} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {Fraction} from '../../utils/fraction.enum';
import {Rank} from '../../models/model-interfaces';
import {RankService} from '../../services/army-management/rank.service';
import {MatBottomSheet} from '@angular/material';
import {UserListSheetComponent} from '../user-list-sheet/user-list-sheet.component';


@Component({
  selector: 'cc-rank-overview',
  templateUrl: './rank-overview.component.html',
  styleUrls: ['./rank-overview.component.scss']
})
export class RankOverviewComponent implements OnInit, OnDestroy {

  ranksOpfor: Rank[];

  ranksBlufor: Rank[];

  displayedColumns: string[] = ['picture', 'name'];

  readonly fraction = Fraction;

  constructor(private router: Router,
              private route: ActivatedRoute,
              private rankService: RankService,
              private bottomSheet: MatBottomSheet) {
  }

  ngOnInit() {
    // init rank data
    this.rankService.findRanks()
        .subscribe(ranks => {
          this.ranksBlufor = ranks.filter(r => r.fraction === 'BLUFOR');
          this.ranksOpfor = ranks.filter(r => r.fraction === 'OPFOR');
        });
  };

  ngOnDestroy() {
    this.bottomSheet.dismiss();
  }

  selectRow(rank: Rank) {
    this.bottomSheet.open(UserListSheetComponent, {data: {rank: rank}});
  }
}