import { Component, Input, OnInit } from '@angular/core';
import { UntypedFormArray, UntypedFormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material/dialog';
import { ReferenceType } from '@app/core/model/reference-type/reference-type';
import { ReferenceService } from '@app/core/services/reference/reference.service';
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/single/single-auto-complete-configuration';
import { BaseComponent } from '@common/base/base.component';
import { takeUntil } from 'rxjs/operators';
import { ReferenceDialogEditorComponent } from './editor/reference-dialog-editor.component';
import { ReferencePersist } from '@app/core/model/reference/reference';

@Component({
	selector: 'app-reference-field-component',
	templateUrl: 'reference-field.component.html',
	styleUrls: ['./reference-field.component.scss']
})
export class ReferenceFieldComponent extends BaseComponent implements OnInit {

	@Input() referenceType: ReferenceType = null;
	@Input() form: UntypedFormGroup = null;
	@Input() label: string = null;
	@Input() required: boolean = false;
	@Input() multiple: boolean = true;
	@Input() hint: string;
	@Input() placeholder: string;

	multipleAutoCompleteSearchConfiguration: MultipleAutoCompleteConfiguration;
	singleAutoCompleteSearchConfiguration: SingleAutoCompleteConfiguration;

	constructor(
		private referenceService: ReferenceService,
		public enumUtils: EnumUtils,
		private dialog: MatDialog,
	) { super(); }

	ngOnInit() {
		if (this.multiple) {
			this.multipleAutoCompleteSearchConfiguration = this.referenceService.getMultipleAutoCompleteSearchConfiguration(this.referenceType.id);
		} else {
			this.singleAutoCompleteSearchConfiguration = this.referenceService.getSingleAutocompleteSearchConfiguration(this.referenceType.id);
		}
	}

	addReference() {
		const dialogRef = this.dialog.open(ReferenceDialogEditorComponent, {
			width: '500px',
			restoreFocus: false,
			data: {
				referenceTypeId: this.referenceType.id,
				label: this.label ?? this.referenceType.name
			},
		});
		dialogRef.afterClosed()
			.pipe(takeUntil(this._destroyed))
			.subscribe(newResult => {
				if (!newResult) { return; }
				// const dataRepositoryModel = new ExternalDataRepositoryEditorModel(result.id, result.name, result.abbreviation, result.uri, result.pid, result.source);
				// (<UntypedFormArray>this.formGroup.get('dataRepositories')).push(dataRepositoryModel.buildForm());

				let results = this.form.value as ReferencePersist[];
				if (results == undefined) results = [];
				results.push(newResult);
				this.form.setValue(results);
			});
	}
}