import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl, Validators } from '@angular/forms';
import { AuthenticationService } from '../../services/authentication.service';
import { User } from '../../models/user';

@Component({
  selector: 'app-user-profile',
  templateUrl: './user-profile.component.html',
  styleUrls: ['./user-profile.component.css'],
})
export class UserProfileComponent implements OnInit {
  public userForm: FormGroup;

  constructor(private authenticationService: AuthenticationService) { }

  ngOnInit(): void {
    const currentUser = this.authenticationService.currentUserValue;

    this.userForm = new FormGroup(
      {
        login: new FormControl(currentUser.login, Validators.required),
        firstName: new FormControl(currentUser.firstName, [
          Validators.required,
          Validators.minLength(3),
        ]),
        lastName: new FormControl(currentUser.lastName, [
          Validators.required,
          Validators.minLength(3),
        ]),
        email: new FormControl(currentUser.email, [
          Validators.required,
          Validators.email,
        ]),
        currentPassword: new FormControl(
          '',
          Validators.pattern('^[A-Za-z0-9_-]{8,15}$')
        ),
        newPassword: new FormControl(
          '',
          Validators.pattern('^[A-Za-z0-9_-]{8,15}$')
        ),
      },
      { updateOn: 'blur' }
    );
  }

  onSubmit(formData) {
    if (this.userForm.invalid) {
      return;
    }

    const updatedUser = new User();
    updatedUser.login = formData.username;
    updatedUser.password = formData.password;
    updatedUser.firstName = formData.firstname;
    updatedUser.lastName = formData.lastname;
    updatedUser.email = formData.email;

    this.authenticationService.create(updatedUser);
  }
}