import { Component, Input, OnChanges, OnDestroy, OnInit } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { Subscription } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { BaseComponent } from '../../../../../core/common/base/base.component';
import { Field } from '../../../../../core/model/dataset-profile-definition/field';
import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service';

@Component({
	selector: 'app-form-field',
	templateUrl: './form-field.component.html',
	styleUrls: ['./form-field.component.scss']
})
export class FormFieldComponent extends BaseComponent implements OnInit {
	@Input() field: Field;
	form: FormGroup;

	change: Subscription;
	trackByFn = (index, item) => item ? item['id'] : null;

	constructor(
		public visibilityRulesService: VisibilityRulesService
	) { super(); }

	ngOnInit() {
		if (this.field) {
			this.form = this.visibilityRulesService.getFormGroup(this.field.id);
			this.change = this.form.get('value').valueChanges
				.pipe(takeUntil(this._destroyed))
				.subscribe(item => {
					this.visibilityRulesService.updateValueAndVisibility(this.field.id);
				});
		}
	}

	assignDropdownItem(item: any) {
		if (!item) { return null; }
		return (typeof item === 'string') ? JSON.parse(item) : JSON.stringify(item);
	}
}