import { Component, EventEmitter, Input, Output } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AngularSvgIconModule } from 'angular-svg-icon';

// Routes
import { SharedSvgRoutes } from '../../utils/svg-routes/shared-svg.routes';

// Components
import { CaLoadStatusComponent } from '../ca-load-status/ca-load-status.component';

// Enums
import { eSharedString } from '../../enums/shared-string.enum';

// Models
import { LoadStatusHistoryResponse } from '../../models';

// Pipes
import { LoadStatusBackgroundColorPipe } from '../../pipes/load-status-background-color.pipe';
import { FormatDurationPipe } from '../../pipes/format-duration.pipe';
import { DateToTimeFromBackendPipe } from '../../pipes/date-to-time-from-backend.pipe';
import { DateFromBackendPipe } from '../../pipes/date-from-backend.pipe';

@Component({
    selector: 'app-ca-load-status-log',
    templateUrl: './ca-load-status-log.component.html',
    styleUrls: ['./ca-load-status-log.component.scss'],
    imports: [
        // Modules
        CommonModule,
        AngularSvgIconModule,
        // Components
        CaLoadStatusComponent,
        // Pipes
        LoadStatusBackgroundColorPipe,
        FormatDurationPipe,
        DateToTimeFromBackendPipe,
        DateFromBackendPipe,
    ]
})
export class CaLoadStatusLogComponent {
    @Input() loadStatusHistory!: LoadStatusHistoryResponse[];

    @Output() onSortChange = new EventEmitter<string>();

    public sharedSvgRoutes = SharedSvgRoutes;
    public eSharedString = eSharedString;

    public sortDirection = eSharedString.DSC;

    constructor() {}

    public onSortClick(): void {
        this.sortDirection =
            this.sortDirection === eSharedString.DSC
                ? eSharedString.ASC
                : eSharedString.DSC;

        this.onSortChange.emit(this.sortDirection);
    }
}