import { Component } from '@angular/core';
import { DetailsComponentBase } from '@objects-view/details-component-base';
import { IHeatStackModel } from '@fleio-api/openstack/orchestration/model/heat-stack.model';
import { FormatHelper } from '@shared/ui-api/helpers/format-helper';
import { ConfigService } from '@shared/config/config.service';
import { HeatStacksApiService } from '@fleio-api/openstack/orchestration/heat-stacks/heat-stacks-api.service';
import { IHeatStackEventsModel } from '@fleio-api/openstack/orchestration/model/heat-stack-events.model';

@Component({
  selector: 'app-heat-stack-details-events',
  templateUrl: './heat-stack-details-events.component.html',
  styleUrls: ['./heat-stack-details-events.component.scss']
})
export class HeatStackDetailsEventsComponent extends DetailsComponentBase<IHeatStackModel> {
  formatHelper = new FormatHelper();
  events: IHeatStackEventsModel;
  loading = true;

  constructor(
    public config: ConfigService,
    private heatStacksApi: HeatStacksApiService,
  ) {
    super();
  }

  protected tabActivated() {
    super.tabActivated();
    this.loadEvents();
  }

  private loadEvents() {
    this.loading = true;
    this.heatStacksApi.events(this.object.id).subscribe(events => {
      for (const event of events.events) {
        event.resource_status = this.formatHelper.formatStatus(event.resource_status);
      }
      this.events = events;
    }).add(() => {
      this.loading = false;
    });
  }
}
