import { FormGroup } from '@angular/forms';
import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewContainerRef } from '@angular/core';

import { Sizes } from '../../../shared/enums';
import { Field } from '../../../core/field/abstract';


@Component({
    selector: 'cmn-input',
    templateUrl: './input.component.html',
    styleUrls: [ './input.component.scss' ],
})

export class InputComponent extends Field implements OnInit, OnChanges {
    @Input() public value: string;
    @Input() public readonly size: Sizes;
    @Input() public readonly name: string;
    @Input() public readonly iconLeft: string;
    @Input() public readonly iconRight: string;
    @Input() public readonly isLoading: boolean;
    @Input() public readonly placeholder: string;
    @Input() public readonly forceError: boolean;
    @Input() public readonly isDisabled: boolean;
    @Input() public readonly formGroup: FormGroup;
    @Input() public readonly type: string = 'text';

    @Output('onClickIconRight') public readonly fireClickIconRight: EventEmitter<void> = new EventEmitter<void>();

    public sizeIcon: string;

    constructor(private readonly viewRef: ViewContainerRef) {
        super(viewRef);
    }

    public ngOnInit(): void {
        if (!this.formGroup) {
            super.ngOnInit();
        }
    }

    public ngOnChanges(changes: SimpleChanges): void {
        const { forceError } = changes;

        if (forceError && !forceError.firstChange && forceError.currentValue) {
            (this.formGroup || this.form).controls[this.name].markAsDirty();
        }
    }
}