import { Component, OnInit } from '@angular/core';
import { AuditMetadata } from '../models/audit-metadata';
import { DARSState } from '../store/state';
import { Store } from '@ngrx/store';
import { GlobalState } from '@app/core/state';
import * as selectors from '../store/selectors';
import { Observable } from 'rxjs';
import * as darsActions from '../store/actions';

@Component({
  selector: 'cse-dars-view',
  templateUrl: './dars-view.component.html',
  styleUrls: ['./dars-view.component.scss'],
})
export class DARSViewComponent implements OnInit {
  public metadataStatus$: Observable<DARSState['metadata']['status']>;
  public visibleAuditStatus$: Observable<DARSState['visibleAudit']['status']>;

  constructor(private store: Store<GlobalState>) {}

  public ngOnInit() {
    this.store.dispatch(new darsActions.StartLoadingMetadata());
    this.metadataStatus$ = this.store.select(selectors.metadataStatus);
    this.visibleAuditStatus$ = this.store.select(selectors.visibleAuditStatus);
  }

  public openAudit(metadata: AuditMetadata) {
    this.store.dispatch(new darsActions.StartLoadingAudit({ metadata }));
  }

  public closeAudit() {
    this.store.dispatch(new darsActions.CloseAudit());
  }
}