import {
    ChangeDetectionStrategy,
    Component,
    EventEmitter,
    Input,
    Output,
} from '@angular/core';
import { DropdownBoxOptionsInterface } from './../../models';

@Component({
    changeDetection: ChangeDetectionStrategy.OnPush,
    selector: 'product-sizes-content-component',
    styleUrls: [
        './product-sizes-content.component.scss',
    ],
    templateUrl:
    './product-sizes-content.component.template.pug',
})
export class ProductSizesContentComponent {
    @Input()
    public title: string = 'Sizes';
    @Input()
    public productDisplaySkus: Map<string, boolean>;
    @Input()
    public sizes: string[];
    @Input()
    public apparelSizeChart: Map<string, string[]>;
    @Input()
    public unitsOfMeasure: Map<string, boolean>;
    @Input()
    public usePrintShopClass: boolean = false;

    @Output()
    public onChangeSelectedUnitsOfMeasure = new EventEmitter<string>();

    @Output()
    public onChangeSelectedDisplaySku = new EventEmitter<string>();

    public get showContent() {
        return Boolean(
            (this.productDisplaySkus && this.productDisplaySkus.size > 0)
            && (this.apparelSizeChart && this.apparelSizeChart.size > 0),
        );
    }

    public get productDisplaySkuAsOptions(): DropdownBoxOptionsInterface[] {
        return Array.from(this.productDisplaySkus).map(([label]) => ({
            label,
            value: label,
        }));
    }

    public get productDisplaySkuOptionsSelectedValue(): string {
        const selectedDisplaySku =
            Array.from(this.productDisplaySkus).find(([, value]) => (
                value === true
            ));
        return selectedDisplaySku && selectedDisplaySku[0];
    }

    public get getApparelSizeChartAsArray(): Array<[string, string[]]> {
        return Array.from(this.apparelSizeChart);
    }

    public get getUnitsOfMeasureAsArray(): Array<[string, boolean]> {
        return Array.from(this.unitsOfMeasure);
    }

    public changeSelectedUnitsOfMeasure(units: string) {
        this.onChangeSelectedUnitsOfMeasure.emit(units);
    }

    public changeSelectedDisplaySku(displaySku: string) {
        this.onChangeSelectedDisplaySku.emit(displaySku);
    }

    public isChangeSkuSelectVisible() {
        return this.productDisplaySkus.size > 1;
    }
}