import { Component, Inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ReactiveFormsModule, FormControl } from '@angular/forms';
import { FormsModule } from '@angular/forms';

import { MatDialog, MAT_DIALOG_DATA, MatDialogRef, MatDialogTitle,
         MatDialogContent, MatDialogActions, MatDialogClose,} from '@angular/material/dialog';

import { MatButtonModule } from '@angular/material/button';
import { MatDialogModule } from '@angular/material/dialog';
import { MatInputModule } from '@angular/material/input';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { UsersService } from '../../services/users.service';

@Component({
  selector: 'app-edit-user-details-dialog',
  standalone: true,
  imports: [
    CommonModule,
    ReactiveFormsModule,
    MatButtonModule,
    MatDialogModule,
    MatInputModule,
    MatFormFieldModule,
    FormsModule,
    MatDialogTitle,
    MatDialogContent,
    MatDialogActions,
    MatDialogClose,
    MatIconModule,
  ],
  templateUrl: './edit-user-details-dialog.component.html',
  styleUrl: './edit-user-details-dialog.component.scss'
})
export class EditUserDetailsDialogComponent {
  nickname = new FormControl('');
  realname = new FormControl('');
  additionalData: any;

  constructor(
    @Inject(MAT_DIALOG_DATA) additionalData: any,
    private usersService: UsersService
  ) 
  {
    this.additionalData = additionalData;
  }

  ngOnInit() {
    this.nickname.setValue(this.additionalData.currentNickName);
    this.realname.setValue(this.additionalData.currentRealName);
  }

  onClickSubmit() {
    let nickname = this.nickname.value != undefined ? this.nickname.value : "";
    let realname = this.realname.value != undefined ? this.realname.value : "";

    this.usersService.updateUserDetails(nickname, realname).subscribe(data =>{
      console.log(data);
    });
  }
}