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

// components
import { SvgIconComponent } from 'angular-svg-icon';

// interfaces
import { IFuelPricesRangeConfig } from './interfaces';

// constants
import { FuelPricesRangeConstants } from './utils/constants';
import { LastFuelPriceProgressConstants } from '../ca-last-fuel-price-progress/utils/constants';

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

// enums
import { eUnit } from '../../enums';

// pipes
import { FuelPricesRangePipe } from './pipes';

@Component({
    selector: 'app-ca-fuel-prices-range',
    templateUrl: './ca-fuel-prices-range.component.html',
    styleUrl: './ca-fuel-prices-range.component.scss',
    imports: [
        CommonModule,

        // components
        SvgIconComponent,

        // pipes
        FuelPricesRangePipe,
    ],
})
export class CaFuelPricesRangeComponent {
    @Input() fuelPricesRangeConfig!: IFuelPricesRangeConfig;
    @Input() isCardVariation: boolean = false;

    public isFuelLastPriceHovered = false;

    // map fuel last price color key to svg fill class
    public fuelPricesRangeCircleSvgClassColor =
        FuelPricesRangeConstants.FUEL_PRICES_RANGE_CIRCLE_SVG_CLASS_COLOR;
    public fuelPricesRangeArrowSvgClassColor =
        FuelPricesRangeConstants.FUEL_PRICES_RANGE_ARROW_SVG_CLASS_COLOR;
    public fuelPricesRangeColor =
        LastFuelPriceProgressConstants.LAST_FUEL_PRICE_COLORS;

    // svg routes
    public sharedSvgRoutes = SharedSvgRoutes;

    // enums
    public eUnit = eUnit;

    constructor() {}

    public onHoverFuelLastPrice(): void {
        this.isFuelLastPriceHovered = !this.isFuelLastPriceHovered;
    }
}