import { CommonModule } from '@angular/common';
import { Component, Input, OnChanges, OnInit } from '@angular/core';

// Models
import { SelectedStatus, StatusOrder } from '../ca-input-dropdown/models';

// Pipes
import { LoadStatusStringClassPipe } from './pipes/load-status-string-class.pipe';
import { LoadStatusColorPipe } from '../../pipes/load-status-color.pipe';
import { DropdownLoadStatusColorPipe } from '../../pipes/dropdown-load-status-color.pipe';
import { DispatchStatusColorPipe } from '../../pipes/dispatch-status-color.pipe';

@Component({
    selector: 'ca-load-status-string',
    templateUrl: './ca-load-status-string.component.html',
    styleUrls: ['./ca-load-status-string.component.scss'],
    imports: [
        CommonModule,
        // Pipes
        LoadStatusColorPipe,
        DropdownLoadStatusColorPipe,
        DispatchStatusColorPipe,
        LoadStatusStringClassPipe,
    ]
})
export class CaLoadStatusStringComponent implements OnInit, OnChanges {
    @Input() status!: SelectedStatus;
    @Input() justifyStart?: boolean;
    @Input() isDetailsLayout?: boolean;
    @Input() isDispatchHistoryModalLayout?: boolean;
    @Input() isDropdownColor?: boolean;
    @Input() statusOrder?: StatusOrder;
    @Input() isDispatch?: boolean = false;
    @Input() isDarkColor?: boolean = false;

    public displayString: string[] = [];
    public className!: string;

    constructor() {}

    ngOnInit(): void {
        this.generateDisplayString();
    }

    ngOnChanges() {
        this.generateDisplayString();
    }

    private generateDisplayString(): void {
        this.displayString = this.status?.name?.split(' ') as string[];
        this.className = this.status.valueForRequest?.toLowerCase() as string;
    }
}