import { Component, OnInit, Inject } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
import { GroupDetailData } from '@ucap-webmessenger/protocol-sync';

export interface EditGroupDialogData {
  title: string;
  group: GroupDetailData;
}

export interface EditGroupDialogResult {
  choice: boolean;
  groupName: string;
  group: GroupDetailData;
}

@Component({
  selector: 'app-layout-messenger-edit-group',
  templateUrl: './edit-group.dialog.component.html',
  styleUrls: ['./edit-group.dialog.component.scss']
})
export class EditGroupDialogComponent implements OnInit {
  groupName: string;
  inputForm: FormGroup;

  constructor(
    public dialogRef: MatDialogRef<EditGroupDialogData, EditGroupDialogResult>,
    @Inject(MAT_DIALOG_DATA) public data: EditGroupDialogData,
    private formBuilder: FormBuilder
  ) {}

  ngOnInit(): void {
    this.inputForm = this.formBuilder.group({
      groupName: [this.data.group.name, [Validators.required]]
    });
  }

  onClickChoice(choice: boolean): void {
    this.dialogRef.close({
      choice,
      groupName: this.inputForm.get('groupName').value,
      group: this.data.group
    });
  }
}