import { HttpClient } from '@angular/common/http';
import { Component, inject } from '@angular/core';
import { FormGroup, FormControl, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { HotToastService } from '@ngxpert/hot-toast';
import { CommonModule } from '@angular/common';

@Component({
  selector: 'app-register',
  standalone: true,
  imports: [CommonModule, FormsModule, ReactiveFormsModule],
  templateUrl: './register.component.html',
  styleUrl: '../auth.scss'
})
export class RegisterComponent {
  private http: HttpClient = inject(HttpClient);
  private route: ActivatedRoute = inject(ActivatedRoute);
  private toast: HotToastService = inject(HotToastService);
  private router: Router = inject(Router);

  redirectUri = null;
  client: string = "";
  client_id = null;

  registerForm = new FormGroup({
    username: new FormControl('', [Validators.required, Validators.email, Validators.maxLength(100)]),
    password: new FormControl('', [Validators.required, Validators.minLength(6), Validators.maxLength(20)]),
    repeatPassword: new FormControl('', [Validators.required, Validators.minLength(6), Validators.maxLength(20)]),
    firstName: new FormControl('', [Validators.required, Validators.maxLength(100)]),
    lastName: new FormControl('', [Validators.required, Validators.maxLength(100)]),
  })

  constructor() {
    this.getclient();
  }


  getclient() {
    const params = (this.route.snapshot.queryParamMap as any)["params"];
    this.redirectUri = params.redirect_uri;
    this.client_id = params.client_id;
    this.http.get<any>('api/client', {
      params
    }).subscribe({
      next: (client) => {
        this.client = client.clientName;
      },
      error: (error) => {
        console.error(error);
        this.toast.error('Invalid client');
      }
    })
  }

  register() {
    if (this.registerForm.value.password != this.registerForm.value.repeatPassword) {
      this.toast.error('Passwords do not match');
      return;
    }
    this.http.post('api/register?'+ 'client_id=' + this.client_id, this.registerForm.value).pipe(
      this.toast.observe({
        loading: 'Registering...',
        success: 'Registration successfull, please log in',
      })
    ).subscribe({
      next: () => {
        this.router.navigate(['/login'], { queryParams: this.route.snapshot.queryParams });
      },
      error: (error) => {
        console.error(error);
        this.toast.error('Registration not successfull');
      }
    })
  }

  toLogin() {
    this.router.navigate(['/login'], { queryParams: this.route.snapshot.queryParams });
  }
}