import { ChangeDetectionStrategy, Component, Input, OnChanges } from '@angular/core';
import { DossierStats, StatusSorter } from '@red/domain';
import { List } from '@iqser/common-ui/lib/utils';
import { StatusBarConfig } from '@iqser/common-ui/lib/shared';

@Component({
    selector: 'redaction-dossier-documents-status',
    templateUrl: './dossier-documents-status.component.html',
    changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DossierDocumentsStatusComponent implements OnChanges {
    @Input() stats: DossierStats;
    statusBarConfig: List<StatusBarConfig<string>>;

    private get _statusConfig(): List<StatusBarConfig<string>> {
        const { fileCountPerWorkflowStatus } = this.stats;
        const statuses = Object.keys(fileCountPerWorkflowStatus).sort(StatusSorter.byStatus);
        return statuses.map(status => ({ length: fileCountPerWorkflowStatus[status], color: status }));
    }

    ngOnChanges(): void {
        this.statusBarConfig = this._statusConfig;
    }
}
