import { Component, Inject, OnInit } from '@angular/core';
import { AbstractControl, FormControl, FormGroup, ValidationErrors, Validators } from '@angular/forms';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { NanoDialogBase } from 'src/app/shared/dialogs/nano-base-dialog';
import { NanoValidators } from 'src/app/shared/nano-validators';

@Component({
  selector: 'app-change-username-dialog',
  templateUrl: './change-username-dialog.component.html',
  styleUrls: ['./change-username-dialog.component.scss']
})
export class ChangeUsernameDialogComponent extends NanoDialogBase<ChangeUsernameDialogComponent> implements OnInit {
  originalName: string;

  usernameForm = new FormGroup({
    userName: new FormControl('', [Validators.required])
  });

  constructor(public dialogRef: MatDialogRef<ChangeUsernameDialogComponent>, @Inject(MAT_DIALOG_DATA) public changeUsernameData: ChangeUsernameData) { 
    super(dialogRef);
  }

  ngOnInit(): void {
    this.usernameForm.addValidators([Validators.required]);
    this.originalName = this.changeUsernameData.userName;

    var userNameControl = this.usernameForm.get('userName');
    userNameControl.setValue(this.originalName);
    userNameControl.addValidators([NanoValidators.stringNotEquals(this.originalName)]);
  }

  changeUsername(){
    this.dialogRef.close(this.usernameForm.get('userName').value);
  }
}

interface ChangeUsernameData{
  userName: string;
  firstSetup: boolean;
}