import { CommonModule } from '@angular/common';
import {
    Component,
    EventEmitter,
    Input,
    Output,
    ViewEncapsulation,
} from '@angular/core';

// Modules
import { NgbModule, NgbPopover } from '@ng-bootstrap/ng-bootstrap';
import { AngularSvgIconModule } from 'angular-svg-icon';

// Components
import { CaAppTooltipV2Component } from '../ca-app-tooltip-v2/ca-app-tooltip-v2.component';

// Enums
import {
    eColor,
    eDateTimeFormats,
    eGpsHeadingDirection,
    ePosition,
    eSharedString,
    eStringPlaceholder,
    eThousandSeparatorFormat,
    eUnit,
} from '../../enums';

// Interfaces
import {
    LoadDelivery,
    LoadListLoadStopResponse,
    LoadPickup,
    LoadStopLoadListResponse,
} from './interfaces/load-pickup-delivery.interface';

// Types
import { LoadType } from './types';

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

// Pipes
import { FormatDurationPipe, DateWaitTimePipe } from '../../pipes';
import { SafeHtmlPipe } from '../../pipes';

// Helpers
import { GpsLocationHelper } from '../../utils/helpers';

@Component({
    selector: 'app-ca-load-pickup-delivery',
    templateUrl: './ca-load-pickup-delivery.component.html',
    styleUrls: ['./ca-load-pickup-delivery.component.scss'],
    imports: [
        CommonModule,
        NgbModule,
        AngularSvgIconModule,
        // Components
        CaAppTooltipV2Component,
        // Pipes
        FormatDurationPipe,
        DateWaitTimePipe,
        SafeHtmlPipe,
    ],
    encapsulation: ViewEncapsulation.None,
})
export class CaLoadPickupDeliveryComponent {
    @Input() pickup!: LoadPickup;
    @Input() delivery!: LoadDelivery;
    @Input() isHoveringRow!: boolean;
    @Input() loadType!: LoadType;
    @Input() set stopsData(value: LoadListLoadStopResponse) {
        if (value) this.handleStopsData(value);
    }
    @Input() set columnWidth(value: number) {
        if (value) this._columnWidth = value;
    }
    @Output() onPickupDeliveryClick: EventEmitter<number> =
        new EventEmitter<number>();

    public _stopsData: LoadListLoadStopResponse | null = null;
    public _columnWidth: number | null = null;

    public stopTypeCounts: Record<string, number> | null = null;

    public isPopoverOpen: boolean = false;

    public hoveredStopIndex: number = -1;

    // current location
    public gpsIcon: string | null = null;
    public gpsLocationIcon: string | null = null;
    public gpsTitle: string | null = null;
    public gpsTitleClass: string | null = null;

    // enums
    public eColor = eColor;
    public eSharedString = eSharedString;
    public ePosition = ePosition;
    public eDateTimeFormats = eDateTimeFormats;
    public eThousandSeparatorFormat = eThousandSeparatorFormat;
    public eUnit = eUnit;
    public eStringPlaceholder = eStringPlaceholder;

    // svg routes
    public sharedSvgRoutes = SharedSvgRoutes;

    constructor() {}

    public openPopover(t2: NgbPopover): void {
        t2.open();
        this.isPopoverOpen = true;

        this.onPickupDeliveryClick.emit();
    }

    public closePopover(t2: NgbPopover): void {
        this.isPopoverOpen = false;
        t2.close();
    }

    public onHoverStop(index: number): void {
        this.hoveredStopIndex = this.hoveredStopIndex === index ? -1 : index;
    }

    private handleStopsData(stopsData: LoadListLoadStopResponse): void {
        this._stopsData = stopsData;

        this.stopTypeCounts =
            stopsData.loadStops?.reduce(
                (acc: Record<string, number>, stop) => {
                    if (stop.stopType && stop.stopType.name) {
                        const key = stop.stopType.name;
                        acc[key] = (acc[key] || 0) + 1;
                    }
                    return acc;
                },
                {} as Record<string, number>
            ) || {};

        if (this._stopsData?.truckMovement?.truckInfo) {
            const { motionStatus, headingString } =
                this._stopsData?.truckMovement?.truckInfo;

            if (motionStatus) {
                this.gpsIcon = GpsLocationHelper.getGpsIcon(
                    motionStatus,
                    headingString as eGpsHeadingDirection
                );
                this.gpsTitle = GpsLocationHelper.getGpsTitle(
                    motionStatus,
                    headingString as eGpsHeadingDirection
                );
                this.gpsTitleClass = GpsLocationHelper.getGpsTitleColorClass(
                    motionStatus,
                    true
                );
                this.gpsLocationIcon =
                    GpsLocationHelper.getGpsCurrentLocationIcon(motionStatus);
            }
        }
    }
}