import { Component, OnInit } from '@angular/core';
import { RouterExtensions } from '@nativescript/angular';
import { Select, Store } from '@ngxs/store';
import { Observable } from 'rxjs';
import { StatsDataBase } from '~/pages/sts/entities/stats-data-base';
import { LoadStatsEnrollInvoices } from '~/pages/sts/state-mgmt/sts-stats.actions';
import { StsStatsState } from '~/pages/sts/state-mgmt/sts-stats.state';
import { DateTimePipe } from '~/shared/pipes/date-time.pipe';

@Component({
    selector: 'StsStats',
    moduleId: module.id,
    templateUrl: './sts-stats.component.html',
    styleUrls: ['./_sts-stats.component.scss']
})
export class StsStatsComponent implements OnInit {
    @Select(StsStatsState.getStatsDataBase) statsDataBase$: Observable<StatsDataBase[]>;
    @Select(StsStatsState.isLoading) isLoading$: Observable<boolean>;

    statsDataBase: StatsDataBase[];

    constructor(
        private routerExtensions: RouterExtensions,
        private dateTimePipe: DateTimePipe,
        private store: Store
    ) {
    }

    ngOnInit() {
        this.store.dispatch(new LoadStatsEnrollInvoices());
        this.statsDataBase$.subscribe(statsDataBase => this.statsDataBase = statsDataBase);
    }

    onBackButton(): void {
        this.routerExtensions.back();
    }
}
