Correction of change password component and its back-office processing.

src/main/java/org/codiki/account/AccountController.java

@@ -2,6 +2,7 @@ package org.codiki.account;
 
 import java.io.IOException;
 import java.security.Principal;
+import java.util.Optional;
 
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
@@ -10,6 +11,7 @@ import org.codiki.core.entities.dto.PasswordWrapperDTO;
 import org.codiki.core.entities.dto.UserDTO;
 import org.codiki.core.entities.dto.View;
 import org.codiki.core.entities.persistence.User;
+import org.codiki.core.services.UserService;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.security.authentication.BadCredentialsException;
 import org.springframework.security.core.Authentication;
@@ -29,6 +31,8 @@ import com.fasterxml.jackson.annotation.JsonView;
 public class AccountController {
 	@Autowired
 	private AccountService accountService;
+	@Autowired
+	private UserService userService;
 
 	@JsonView(View.UserDTO.class)
 	@PostMapping("/login")
@@ -63,13 +67,12 @@ public class AccountController {
 			final HttpServletRequest pRequest,
 			final HttpServletResponse pResponse,
 			final Principal pPrincipal) throws IOException {
-//		final Optional<User> connectedUser = tokenService.getAuthenticatedUserByToken(pRequest);
-//		if(connectedUser.isPresent()) {
-//			accountService.changePassword(connectedUser.get(), pPasswordWrapper, pResponse);
-//		} else {
-//			pResponse.sendError(HttpServletResponse.SC_UNAUTHORIZED);
-//		}
-
+		final Optional<User> connectedUser = userService.getUserByPrincipal(pPrincipal);
+		if(connectedUser.isPresent()) {
+			accountService.changePassword(connectedUser.get(), pPasswordWrapper, pResponse);
+		} else {
+			pResponse.sendError(HttpServletResponse.SC_UNAUTHORIZED);
+		}
 	}
 	
 	@PostMapping("/signin")

src/main/ts-v7/src/app/account-settings/change-password/change-password.component.html

@@ -3,7 +3,7 @@
 		<h4 class="card-title">Mot de passe</h4>
 		<form (ngSubmit)="onSubmit()" #changePasswordForm="ngForm">
 			<div class="md-form">
-				<input mdbActive
+				<input mdbInputDirective
 						id="oldPassword"
 						name="oldPassword"
 						type="password"
@@ -11,12 +11,12 @@
 						[(ngModel)]="model.oldPassword"
 						#oldPassword="ngModel"
 						data-error="Veuillez saisir votre mot de passe actuel"
-						data-sucess=""
+						[validateSuccess]="false"
 						required />
 				<label for="oldPassword">Mot de passe actuel</label>
 			</div>
 			<div class="md-form">
-				<input mdbActive
+				<input mdbInputDirective
 						id="newPassword"
 						name="newPassword"
 						type="password"
@@ -24,12 +24,12 @@
 						[(ngModel)]="model.newPassword"
 						#newPassword="ngModel"
 						data-error="Veuillez saisir votre nouveau mot de passe"
-						data-sucess=""
+						[validateSuccess]="false"
 						required />
 				<label for="newPassword">Nouveau mot de passe</label>
 			</div>
 			<div class="md-form">
-				<input mdbActive
+				<input mdbInputDirective
 						id="confirmPassword"
 						name="confirmPassword"
 						type="password"
@@ -37,11 +37,11 @@
 						[(ngModel)]="model.confirmPassword"
 						#confirmPassword="ngModel"
 						data-error="Veuillez confirmer votre nouveau mot de passe"
-						data-sucess=""
+						[validateSuccess]="false"
 						required />
 				<label for="confirmPassword">Confirmation de votre mot de passe</label>
 			</div>
-			<div class="card red lighten-2 text-center z-depth-2" *ngIf="error">
+			<div id="errorMsg" class="card red lighten-2 text-center z-depth-2">
 				<div class="card-body">
 					<p class="white-text mb-0">{{error}}</p>
 				</div>
@@ -58,4 +58,3 @@
 		</form>
 	</div>
 </div>
-	

src/main/ts-v7/src/app/account-settings/change-password/change-password.component.ts

@@ -1,6 +1,7 @@
 import { Component } from '@angular/core';
 import { PasswordWrapper } from '../../core/entities';
 import { ChangePasswordService } from './change-password.service';
+import { RouteReuseStrategy, Router } from '@angular/router';
 
 @Component({
 	selector: 'app-change-password',
@@ -13,24 +14,47 @@ import { ChangePasswordService } from './change-password.service';
 		.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('', '', '');
-
 	error: string;
 
 	constructor(
+		private router: Router,
 		private changePasswordService: ChangePasswordService
 	) {}
 
 	onSubmit(): void {
 		if (this.model.newPassword !== this.model.confirmPassword) {
-			this.error = 'Les mots de passe saisis ne correspondent pas.';
+			this.setMessage('Les mots de passe saisis ne correspondent pas.');
 		} else {
-			this.changePasswordService.changePassword(this.model).subscribe(null, error => {
-				this.error = 'Le mot de passe saisi ne correspond pas au votre.';
+			this.changePasswordService.changePassword(this.model).subscribe(() => {
+				this.router.navigate(['/accountSettings']);
+			}, error => {
+				this.setMessage('Le mot de passe saisi ne correspond pas au votre.');
 			});
 		}
 	}
+
+	setMessage(message: string): void {
+		this.error = message;
+
+		const resultMsgDiv = document.getElementById('errorMsg');
+		resultMsgDiv.style.maxHeight = '64px';
+
+		setTimeout(() => {
+			resultMsgDiv.style.maxHeight = '0px';
+			setTimeout(() => {
+				this.error = undefined;
+			}, 550);
+		}, 3000);
+	}
 }

src/main/ts-v7/src/app/app.routing.ts

@@ -7,6 +7,7 @@ import { HomeComponent } from './home/home.component';
 import { DisconnectionComponent } from './disconnection/disconnection.component';
 import { MyPostsComponent } from './posts/myPosts/my-posts.component';
 import { AccountSettingsComponent } from './account-settings/account-settings.component';
+import { ChangePasswordComponent } from './account-settings/change-password/change-password.component';
 
 
 export const appRoutes: Routes = [
@@ -16,5 +17,6 @@ export const appRoutes: Routes = [
 	{ path: 'disconnection', component: DisconnectionComponent },
 	{ path: 'myPosts', component: MyPostsComponent, canActivate: [AuthGuard] },
 	{ path: 'accountSettings', component: AccountSettingsComponent, canActivate: [AuthGuard] },
+	{ path: 'changePassword', component: ChangePasswordComponent, canActivate: [AuthGuard] },
 	{ path: '**', redirectTo: '/home' }
 ];