import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core';
import { FormGroup, FormControl, Validators, FormControlName } from '@angular/forms';

import { Instance } from 'src/app/metamodel/store/models';

@Component({
    selector: 'app-instance-form',
    templateUrl: 'instance-form.component.html'
})
export class InstanceFormComponent implements OnInit {
    @Input() instance: Instance;
    @Output() onSubmit: EventEmitter<Instance> = new EventEmitter();

    public form = new FormGroup({
        name: new FormControl('', [Validators.required]),
        label: new FormControl('', [Validators.required]),
        client_url: new FormControl('', [Validators.required]),
        config: new FormGroup({
            search: new FormGroup({
                search_by_criteria_allowed: new FormControl(true),
                search_multiple_allowed: new FormControl(false),
                search_multiple_all_datasets_selected: new FormControl({value: false, disabled: true})
            }),
            documentation: new FormGroup({
                documentation_allowed: new FormControl(false)
            })
        })
    });

    ngOnInit() {
        if (this.instance) {
            this.form.patchValue(this.instance);
        }
    }

    checkDisableAllDatasetsSelected() {
        const configFormGroup = this.form.controls['config'] as FormGroup;
        const searchFormGroup = configFormGroup.controls['search'] as FormGroup;
        const searchMultipleAllDatasetsSelected = searchFormGroup.controls['search_multiple_all_datasets_selected'];

        const instance = this.form.value as Instance;
        if (!instance.config.search.search_multiple_allowed) {
            searchMultipleAllDatasetsSelected.disable();
            searchMultipleAllDatasetsSelected.setValue(false);
        } else {
            searchMultipleAllDatasetsSelected.enable();
        }
    }

    submit() {
        if (this.instance) {
            this.onSubmit.emit({
                ...this.instance,
                ...this.form.value
            });
        } else {
            this.onSubmit.emit(this.form.value);
        }
    }
}