import { Component, OnInit, ViewChild, Input } from '@angular/core';
import { CommentService } from '../../services/comment.service';
import { FormBuilder, FormGroup, Validators, NgForm } from '@angular/forms';

@Component({
  selector: 'ui-commentform',
  templateUrl: './commentform.ui.html',
  styleUrls: [ './commentform.ui.scss' ]
})
export class UiCommentForm implements OnInit {

  @Input() target: number;
  @Input() parent: number;
  @Input() change: Function;
  working: boolean = false;
  form: FormGroup;
  @ViewChild('formDirective') private formDirective: NgForm;

  constructor(private commentService: CommentService,
    private formBuilder: FormBuilder) { }

  ngOnInit(): void {
    this.form = this.formBuilder.group({
      text: [ '', Validators.required ],
    });
  }

  hasError(controlName: string): boolean {
    return this.form.controls[ controlName ].errors != null;
  }

  create(): void {
    const comment: any = {};
    comment.target = this.target;
    comment.parent = this.parent;
    comment.text = this.form.get("text").value;

    this.commentService.create(comment).subscribe((data) => {
      this.formDirective.resetForm();
      this.change && this.change();
    });
  }
}