import { Component } from '@angular/core';
import { PasswordWrapper } from '../../core/entities';
import { ChangePasswordService } from './change-password.service';
import { RouteReuseStrategy, Router } from '@angular/router';
import { NotificationsComponent } from 'src/app/core/notifications/notifications.component';

@Component({
	selector: 'app-change-password',
	templateUrl: './change-password.component.html',
	styles: [`
		#form.card-body {
			padding-bottom: 10px;
		}

		.submitFormArea {
			line-height: 50px;
		}

		#errorMsg {
			max-height: 0;
			overflow: hidden;
			transition: max-height 0.5s ease-out;
			margin: 0;
		}
	`]
})
export class ChangePasswordComponent {
	model: PasswordWrapper = new PasswordWrapper('', '', '');

	constructor(
		private router: Router,
		private changePasswordService: ChangePasswordService
	) {}

	onSubmit(): void {
		if (this.model.newPassword !== this.model.confirmPassword) {
			NotificationsComponent.error('Les mots de passe saisis ne correspondent pas.');
		} else {
			this.changePasswordService.changePassword(this.model).subscribe(() => {
				NotificationsComponent.success('Mot de passe modifié.');
				this.router.navigate(['/accountSettings']);
			}, error => {
				console.error(error);
				NotificationsComponent.error('Le mot de passe saisi ne correspond pas au votre.');
			});
		}
	}
}
