generator-jhipster 7.8.0 → 7.9.1

package/generators/client/templates/angular/src/main/webapp/app/account/password-reset/finish/password-reset-finish.component.html.ejs

@@ -19,33 +19,33 @@
 <div>
   <div class="d-flex justify-content-center">
     <div class="col-md-4">
-      <h1 <%= jhiPrefix %>Translate="reset.finish.title">Reset password</h1>
+      <h1 <%= jhiPrefix %>Translate="reset.finish.title"><%- this._getClientTranslation('reset.finish.title') %></h1>
 
       <div class="alert alert-danger" <%= jhiPrefix %>Translate="reset.finish.messages.keymissing" *ngIf="initialized && !key">
-        <strong>The password reset key is missing.</strong>
+        <%- this._getClientTranslation('reset.finish.messages.keymissing') %>
       </div>
 
       <div class="alert alert-warning" *ngIf="key && !success">
-        <span <%= jhiPrefix %>Translate="reset.finish.messages.info">Choose a new password</span>
+        <span <%= jhiPrefix %>Translate="reset.finish.messages.info"><%- this._getClientTranslation('reset.finish.messages.info') %></span>
       </div>
 
       <div class="alert alert-danger" *ngIf="error">
-        <span <%= jhiPrefix %>Translate="reset.finish.messages.error">Your password couldn't be reset. Remember a password request is only valid for 24 hours.</span>
+        <span <%= jhiPrefix %>Translate="reset.finish.messages.error"><%- this._getClientTranslation('reset.finish.messages.error') %></span>
       </div>
 
       <div class="alert alert-success" *ngIf="success">
-        <span <%= jhiPrefix %>Translate="reset.finish.messages.success"><strong>Your password has been reset.</strong> Please </span>
-        <a class="alert-link" routerLink="/login" <%= jhiPrefix %>Translate="global.messages.info.authenticated.link">sign in</a>.
+        <span <%= jhiPrefix %>Translate="reset.finish.messages.success"><%- this._getClientTranslation('reset.finish.messages.success') %> </span>
+        <a class="alert-link" routerLink="/login" <%= jhiPrefix %>Translate="global.messages.info.authenticated.link"><%- this._getClientTranslation('global.messages.info.authenticated.link') %></a>.
       </div>
 
       <div class="alert alert-danger" *ngIf="doNotMatch" <%= jhiPrefix %>Translate="global.messages.error.dontmatch">
-        The password and its confirmation do not match!
+        <%- this._getClientTranslation('global.messages.error.dontmatch') %>
       </div>
 
       <div *ngIf="key && !success">
         <form name="form" role="form" (ngSubmit)="finishReset()" [formGroup]="passwordForm">
           <div class="mb-3">
-            <label class="form-label" for="newPassword" <%= jhiPrefix %>Translate="global.form.newpassword.label">New password</label>
+            <label class="form-label" for="newPassword" <%= jhiPrefix %>Translate="global.form.newpassword.label"><%- this._getClientTranslation('global.form["newpassword.label"]') %></label>
             <input
               type="password"
               class="form-control"
@@ -68,7 +68,7 @@
                 *ngIf="passwordForm.get('newPassword')?.errors?.required"
                 <%= jhiPrefix %>Translate="global.messages.validate.newpassword.required"
               >
-                Your password is required.
+               <%- this._getClientTranslation('global.messages.validate.newpassword.required') %>
               </small>
 
               <small
@@ -76,7 +76,7 @@
                 *ngIf="passwordForm.get('newPassword')?.errors?.minlength"
                 <%= jhiPrefix %>Translate="global.messages.validate.newpassword.minlength"
               >
-                Your password is required to be at least 4 characters.
+                <%- this._getClientTranslation('global.messages.validate.newpassword.minlength') %>
               </small>
 
               <small
@@ -84,7 +84,7 @@
                 *ngIf="passwordForm.get('newPassword')?.errors?.maxlength"
                 <%= jhiPrefix %>Translate="global.messages.validate.newpassword.maxlength"
               >
-                Your password cannot be longer than 50 characters.
+                <%- this._getClientTranslation('global.messages.validate.newpassword.maxlength') %>
               </small>
             </div>
 
@@ -92,7 +92,7 @@
           </div>
 
           <div class="mb-3">
-            <label class="form-label" for="confirmPassword" <%= jhiPrefix %>Translate="global.form.confirmpassword.label">New password confirmation</label>
+            <label class="form-label" for="confirmPassword" <%= jhiPrefix %>Translate="global.form.confirmpassword.label"><%- this._getClientTranslation('global.form["confirmpassword.label"]') %></label>
             <input
               type="password"
               class="form-control"
@@ -114,7 +114,7 @@
                 *ngIf="passwordForm.get('confirmPassword')?.errors?.required"
                 <%= jhiPrefix %>Translate="global.messages.validate.confirmpassword.required"
               >
-                Your password confirmation is required.
+              <%- this._getClientTranslation('global.messages.validate.confirmpassword.required') %>
               </small>
 
               <small
@@ -122,7 +122,7 @@
                 *ngIf="passwordForm.get('confirmPassword')?.errors?.minlength"
                 <%= jhiPrefix %>Translate="global.messages.validate.confirmpassword.minlength"
               >
-                Your password confirmation is required to be at least 4 characters.
+                 <%- this._getClientTranslation('global.messages.validate.confirmpassword.minlength') %>
               </small>
 
               <small
@@ -130,7 +130,7 @@
                 *ngIf="passwordForm.get('confirmPassword')?.errors?.maxlength"
                 <%= jhiPrefix %>Translate="global.messages.validate.confirmpassword.maxlength"
               >
-                Your password confirmation cannot be longer than 50 characters.
+               <%- this._getClientTranslation('global.messages.validate.confirmpassword.maxlength') %>
               </small>
             </div>
           </div>
@@ -142,7 +142,7 @@
             <%= jhiPrefix %>Translate="reset.finish.form.button"
             data-cy="submit"
           >
-            Reset Password
+              <%- this._getClientTranslation('reset.finish.form.button') %>
           </button>
         </form>
       </div>

package/generators/client/templates/angular/src/main/webapp/app/account/password-reset/finish/password-reset-finish.component.ts.ejs

@@ -17,7 +17,7 @@
  limitations under the License.
 -%>
 import { Component, OnInit, AfterViewInit, ElementRef, ViewChild } from '@angular/core';
-import { FormBuilder, Validators } from '@angular/forms';
+import { FormGroup, FormControl, Validators } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
 
 import { PasswordResetFinishService } from './password-reset-finish.service';
@@ -36,12 +36,18 @@ export class PasswordResetFinishComponent implements OnInit, AfterViewInit {
   success = false;
   key = '';
 
-  passwordForm = this.fb.group({
-    newPassword: ['', [Validators.required, Validators.minLength(4), Validators.maxLength(50)]],
-    confirmPassword: ['', [Validators.required, Validators.minLength(4), Validators.maxLength(50)]],
+  passwordForm = new FormGroup({
+    newPassword: new FormControl('', {
+      nonNullable: true,
+      validators: [Validators.required, Validators.minLength(4), Validators.maxLength(50)],
+    }),
+    confirmPassword: new FormControl('', {
+      nonNullable: true,
+      validators: [Validators.required, Validators.minLength(4), Validators.maxLength(50)],
+    }),
   });
 
-  constructor(private passwordResetFinishService: PasswordResetFinishService, private route: ActivatedRoute, private fb: FormBuilder) {}
+  constructor(private passwordResetFinishService: PasswordResetFinishService, private route: ActivatedRoute) {}
 
   ngOnInit(): void {
     this.route.queryParams.subscribe(params => {
@@ -62,15 +68,14 @@ export class PasswordResetFinishComponent implements OnInit, AfterViewInit {
     this.doNotMatch = false;
     this.error = false;
 
-    const newPassword = this.passwordForm.get(['newPassword'])!.value;
-    const confirmPassword = this.passwordForm.get(['confirmPassword'])!.value;
+    const { newPassword, confirmPassword } = this.passwordForm.getRawValue();
 
     if (newPassword !== confirmPassword) {
       this.doNotMatch = true;
     } else {
       this.passwordResetFinishService.save(this.key, newPassword).subscribe({
-        next: () => this.success = true,
-        error: () => this.error = true
+        next: () => (this.success = true),
+        error: () => (this.error = true),
       });
     }
   }

package/generators/client/templates/angular/src/main/webapp/app/account/password-reset/init/password-reset-init.component.html.ejs

@@ -19,21 +19,21 @@
 <div>
   <div class="d-flex justify-content-center">
     <div class="col-md-8">
-      <h1 <%= jhiPrefix %>Translate="reset.request.title">Reset your password</h1>
+      <h1 <%= jhiPrefix %>Translate="reset.request.title"><%- this._getClientTranslation('reset.request.title') %></h1>
 
       <<%= jhiPrefixDashed %>-alert-error></<%= jhiPrefixDashed %>-alert-error>
 
       <div class="alert alert-warning" *ngIf="!success">
-        <span <%= jhiPrefix %>Translate="reset.request.messages.info">Enter the email address you used to register.</span>
+        <span <%= jhiPrefix %>Translate="reset.request.messages.info"><%- this._getClientTranslation('reset.request.messages.info') %></span>
       </div>
 
       <div class="alert alert-success" *ngIf="success">
-        <span <%= jhiPrefix %>Translate="reset.request.messages.success">Check your emails for details on how to reset your password.</span>
+        <span <%= jhiPrefix %>Translate="reset.request.messages.success"><%- this._getClientTranslation('reset.request.messages.success') %></span>
       </div>
 
       <form *ngIf="!success" name="form" role="form" (ngSubmit)="requestReset()" [formGroup]="resetRequestForm">
         <div class="mb-3">
-          <label class="form-label" for="email" <%= jhiPrefix %>Translate="global.form.email.label">Email</label>
+          <label class="form-label" for="email" <%= jhiPrefix %>Translate="global.form.email.label"><%- this._getClientTranslation('global.form["email.label"]') %></label>
           <input
             type="email"
             class="form-control"
@@ -56,7 +56,7 @@
               *ngIf="resetRequestForm.get('email')?.errors?.required"
               <%= jhiPrefix %>Translate="global.messages.validate.email.required"
             >
-              Your email is required.
+              <%- this._getClientTranslation('global.messages.validate.email.required') %>
             </small>
 
             <small
@@ -64,7 +64,7 @@
               *ngIf="resetRequestForm.get('email')?.errors?.email"
               <%= jhiPrefix %>Translate="global.messages.validate.email.invalid"
             >
-              Your email is invalid.
+              <%- this._getClientTranslation('global.messages.validate.email.invalid') %>
             </small>
 
             <small
@@ -72,7 +72,7 @@
               *ngIf="resetRequestForm.get('email')?.errors?.minlength"
               <%= jhiPrefix %>Translate="global.messages.validate.email.minlength"
             >
-              Your email is required to be at least 5 characters.
+               <%- this._getClientTranslation('global.messages.validate.email.minlength') %>
             </small>
 
             <small
@@ -80,7 +80,7 @@
               *ngIf="resetRequestForm.get('email')?.errors?.maxlength"
               <%= jhiPrefix %>Translate="global.messages.validate.email.maxlength"
             >
-              Your email cannot be longer than 100 characters.
+              <%- this._getClientTranslation('global.messages.validate.email.maxlength') %>
             </small>
           </div>
         </div>
@@ -92,7 +92,7 @@
           <%= jhiPrefix %>Translate="reset.request.form.button"
           data-cy="submit"
         >
-          Reset
+           <%- this._getClientTranslation('reset.request.form.button') %>
         </button>
       </form>
     </div>

package/generators/client/templates/angular/src/main/webapp/app/account/register/register.component.html.ejs

@@ -19,26 +19,26 @@
 <div>
   <div class="d-flex justify-content-center">
     <div class="col-md-8">
-      <h1 <%= jhiPrefix %>Translate="register.title" data-cy="registerTitle">Registration</h1>
+      <h1 <%= jhiPrefix %>Translate="register.title" data-cy="registerTitle"><%- this._getClientTranslation('register.title') %></h1>
 
       <div class="alert alert-success" *ngIf="success" <%= jhiPrefix %>Translate="register.messages.success">
-        <strong>Registration saved!</strong> Please check your email for confirmation.
+        <%- this._getClientTranslation('register.messages.success') %>
       </div>
 
       <div class="alert alert-danger" *ngIf="error" <%= jhiPrefix %>Translate="register.messages.error.fail">
-        <strong>Registration failed!</strong> Please try again later.
+        <%- this._getClientTranslation('register.messages.error.fail') %>
       </div>
 
       <div class="alert alert-danger" *ngIf="errorUserExists" <%= jhiPrefix %>Translate="register.messages.error.userexists">
-        <strong>Login name already registered!</strong> Please choose another one.
+        <%- this._getClientTranslation('register.messages.error.userexists') %>
       </div>
 
       <div class="alert alert-danger" *ngIf="errorEmailExists" <%= jhiPrefix %>Translate="register.messages.error.emailexists">
-        <strong>Email is already in use!</strong> Please choose another one.
+        <%- this._getClientTranslation('register.messages.error.emailexists') %>
       </div>
 
       <div class="alert alert-danger" *ngIf="doNotMatch" <%= jhiPrefix %>Translate="global.messages.error.dontmatch">
-        The password and its confirmation do not match!
+        <%- this._getClientTranslation('global.messages.error.dontmatch') %>
       </div>
     </div>
   </div>
@@ -47,7 +47,7 @@
     <div class="col-md-8">
       <form name="form" role="form" (ngSubmit)="register()" [formGroup]="registerForm" *ngIf="!success">
         <div class="mb-3">
-          <label class="form-label" for="login" <%= jhiPrefix %>Translate="global.form.username.label">Username</label>
+          <label class="form-label" for="login" <%= jhiPrefix %>Translate="global.form.username.label"><%- this._getClientTranslation('global.form["username.label"]') %></label>
           <input
             type="text"
             class="form-control"
@@ -65,7 +65,7 @@
               *ngIf="registerForm.get('login')?.errors?.required"
               <%= jhiPrefix %>Translate="register.messages.validate.login.required"
             >
-              Your username is required.
+               <%- this._getClientTranslation('register.messages.validate.login.required') %>
             </small>
 
             <small
@@ -73,7 +73,7 @@
               *ngIf="registerForm.get('login')?.errors?.minlength"
               <%= jhiPrefix %>Translate="register.messages.validate.login.minlength"
             >
-              Your username is required to be at least 1 character.
+              <%- this._getClientTranslation('register.messages.validate.login.minlength') %>
             </small>
 
             <small
@@ -81,7 +81,7 @@
               *ngIf="registerForm.get('login')?.errors?.maxlength"
               <%= jhiPrefix %>Translate="register.messages.validate.login.maxlength"
             >
-              Your username cannot be longer than 50 characters.
+              <%- this._getClientTranslation('register.messages.validate.login.maxlength') %>
             </small>
 
             <small
@@ -89,13 +89,13 @@
               *ngIf="registerForm.get('login')?.errors?.pattern"
               <%= jhiPrefix %>Translate="register.messages.validate.login.pattern"
             >
-              Your username can only contain letters and digits.
+              <%- this._getClientTranslation('register.messages.validate.login.pattern') %>
             </small>
           </div>
         </div>
 
         <div class="mb-3">
-          <label class="form-label" for="email" <%= jhiPrefix %>Translate="global.form.email.label">Email</label>
+          <label class="form-label" for="email" <%= jhiPrefix %>Translate="global.form.email.label"><%- this._getClientTranslation('global.form["email.label"]') %></label>
           <input
             type="email"
             class="form-control"
@@ -112,7 +112,7 @@
               *ngIf="registerForm.get('email')?.errors?.required"
               <%= jhiPrefix %>Translate="global.messages.validate.email.required"
             >
-              Your email is required.
+              <%- this._getClientTranslation('global.messages.validate.email.required') %>
             </small>
 
             <small
@@ -120,7 +120,7 @@
               *ngIf="registerForm.get('email')?.errors?.invalid"
               <%= jhiPrefix %>Translate="global.messages.validate.email.invalid"
             >
-              Your email is invalid.
+               <%- this._getClientTranslation('global.messages.validate.email.invalid') %>
             </small>
 
             <small
@@ -128,7 +128,7 @@
               *ngIf="registerForm.get('email')?.errors?.minlength"
               <%= jhiPrefix %>Translate="global.messages.validate.email.minlength"
             >
-              Your email is required to be at least 5 characters.
+              <%- this._getClientTranslation('global.messages.validate.email.minlength') %>
             </small>
 
             <small
@@ -136,13 +136,13 @@
               *ngIf="registerForm.get('email')?.errors?.maxlength"
               <%= jhiPrefix %>Translate="global.messages.validate.email.maxlength"
             >
-              Your email cannot be longer than 100 characters.
+              <%- this._getClientTranslation('global.messages.validate.email.maxlength') %>
             </small>
           </div>
         </div>
 
         <div class="mb-3">
-          <label class="form-label" for="password" <%= jhiPrefix %>Translate="global.form.newpassword.label">New password</label>
+          <label class="form-label" for="password" <%= jhiPrefix %>Translate="global.form.newpassword.label"><%- this._getClientTranslation('global.form["newpassword.label"]') %></label>
           <input
             type="password"
             class="form-control"
@@ -164,7 +164,7 @@
               *ngIf="registerForm.get('password')?.errors?.required"
               <%= jhiPrefix %>Translate="global.messages.validate.newpassword.required"
             >
-              Your password is required.
+              <%- this._getClientTranslation('global.messages.validate.newpassword.required') %>
             </small>
 
             <small
@@ -172,7 +172,7 @@
               *ngIf="registerForm.get('password')?.errors?.minlength"
               <%= jhiPrefix %>Translate="global.messages.validate.newpassword.minlength"
             >
-              Your password is required to be at least 4 characters.
+              <%- this._getClientTranslation('global.messages.validate.newpassword.minlength') %>
             </small>
 
             <small
@@ -180,7 +180,7 @@
               *ngIf="registerForm.get('password')?.errors?.maxlength"
               <%= jhiPrefix %>Translate="global.messages.validate.newpassword.maxlength"
             >
-              Your password cannot be longer than 50 characters.
+               <%- this._getClientTranslation('global.messages.validate.newpassword.maxlength') %>
             </small>
           </div>
 
@@ -188,7 +188,7 @@
         </div>
 
         <div class="mb-3">
-          <label class="form-label" for="confirmPassword" <%= jhiPrefix %>Translate="global.form.confirmpassword.label">New password confirmation</label>
+          <label class="form-label" for="confirmPassword" <%= jhiPrefix %>Translate="global.form.confirmpassword.label"><%- this._getClientTranslation('global.form["confirmpassword.label"]') %></label>
           <input
             type="password"
             class="form-control"
@@ -210,7 +210,7 @@
               *ngIf="registerForm.get('confirmPassword')?.errors?.required"
               <%= jhiPrefix %>Translate="global.messages.validate.confirmpassword.required"
             >
-              Your confirmation password is required.
+              <%- this._getClientTranslation('global.messages.validate.confirmpassword.required') %>
             </small>
 
             <small
@@ -218,7 +218,7 @@
               *ngIf="registerForm.get('confirmPassword')?.errors?.minlength"
               <%= jhiPrefix %>Translate="global.messages.validate.confirmpassword.minlength"
             >
-              Your confirmation password is required to be at least 4 characters.
+              <%- this._getClientTranslation('global.messages.validate.confirmpassword.minlength') %>
             </small>
 
             <small
@@ -226,7 +226,7 @@
               *ngIf="registerForm.get('confirmPassword')?.errors?.maxlength"
               <%= jhiPrefix %>Translate="global.messages.validate.confirmpassword.maxlength"
             >
-              Your confirmation password cannot be longer than 50 characters.
+              <%- this._getClientTranslation('global.messages.validate.confirmpassword.maxlength') %>
             </small>
           </div>
         </div>
@@ -238,13 +238,13 @@
           <%= jhiPrefix %>Translate="register.form.button"
           data-cy="submit"
         >
-          Register
+          <%- this._getClientTranslation('register.form.button') %>
         </button>
       </form>
 
       <div class="mt-3 alert alert-warning">
-        <span <%= jhiPrefix %>Translate="global.messages.info.authenticated.prefix">If you want to </span>
-        <a class="alert-link" routerLink="/login" <%= jhiPrefix %>Translate="global.messages.info.authenticated.link">sign in</a><span <%= jhiPrefix %>Translate="global.messages.info.authenticated.suffix">, you can try the default accounts:<br/>- Administrator (login="admin" and password="admin") <br/>- User (login="user" and password="user").</span>
+        <span <%= jhiPrefix %>Translate="global.messages.info.authenticated.prefix"><%- this._getClientTranslation('global.messages.info.authenticated.prefix') %> </span>
+        <a class="alert-link" routerLink="/login" <%= jhiPrefix %>Translate="global.messages.info.authenticated.link"><%- this._getClientTranslation('global.messages.info.authenticated.link') %></a><span <%= jhiPrefix %>Translate="global.messages.info.authenticated.suffix"><%- this._getClientTranslation('global.messages.info.authenticated.suffix') %></span>
       </div>
     </div>
   </div>

package/generators/client/templates/angular/src/main/webapp/app/account/register/register.component.ts.ejs

@@ -18,7 +18,7 @@
 -%>
 import { Component, AfterViewInit, ElementRef, ViewChild } from '@angular/core';
 import { HttpErrorResponse } from '@angular/common/http';
-import { FormBuilder, Validators } from '@angular/forms';
+import { FormGroup, FormControl, Validators } from '@angular/forms';
 <%_ if (enableTranslation) { _%>
 import { TranslateService } from '@ngx-translate/core';
 <%_ } _%>
@@ -40,11 +40,28 @@ export class RegisterComponent implements AfterViewInit {
   errorUserExists = false;
   success = false;
 
-  registerForm = this.fb.group({
-    login: ['', [Validators.required, Validators.minLength(1), Validators.maxLength(50), Validators.pattern("<%- LOGIN_REGEX %>")]],
-    email: ['', [Validators.required, Validators.minLength(5), Validators.maxLength(254), Validators.email]],
-    password: ['', [Validators.required, Validators.minLength(4), Validators.maxLength(50)]],
-    confirmPassword: ['', [Validators.required, Validators.minLength(4), Validators.maxLength(50)]],
+  registerForm = new FormGroup({
+    login: new FormControl('', {
+      nonNullable: true,
+      validators: [
+        Validators.required,
+        Validators.minLength(1),
+        Validators.maxLength(50),
+        Validators.pattern('^[a-zA-Z0-9!$&*+=?^_`{|}~.-]+@[a-zA-Z0-9-]+(?:\\.[a-zA-Z0-9-]+)*$|^[_.@A-Za-z0-9-]+$'),
+      ],
+    }),
+    email: new FormControl('', {
+      nonNullable: true,
+      validators: [Validators.required, Validators.minLength(5), Validators.maxLength(254), Validators.email],
+    }),
+    password: new FormControl('', {
+      nonNullable: true,
+      validators: [Validators.required, Validators.minLength(4), Validators.maxLength(50)],
+    }),
+    confirmPassword: new FormControl('', {
+      nonNullable: true,
+      validators: [Validators.required, Validators.minLength(4), Validators.maxLength(50)],
+    }),
   });
 
   constructor(
@@ -52,7 +69,6 @@ export class RegisterComponent implements AfterViewInit {
     private translateService: TranslateService,
     <%_ } _%>
     private registerService: RegisterService,
-    private fb: FormBuilder
   ) {}
 
   ngAfterViewInit(): void {
@@ -67,15 +83,14 @@ export class RegisterComponent implements AfterViewInit {
     this.errorEmailExists = false;
     this.errorUserExists = false;
 
-    const password = this.registerForm.get(['password'])!.value;
-    if (password !== this.registerForm.get(['confirmPassword'])!.value) {
+    const { password, confirmPassword } = this.registerForm.getRawValue();
+    if (password !== confirmPassword) {
       this.doNotMatch = true;
     } else {
-      const login = this.registerForm.get(['login'])!.value;
-      const email = this.registerForm.get(['email'])!.value;
+      const { login, email } = this.registerForm.getRawValue();
       this.registerService
-        .save({ login, email, password, langKey: <% if (enableTranslation) { %>this.translateService.currentLang<% } else { %>'en'<% } %> })
-        .subscribe({ next: () => (this.success = true), error: response => this.processError(response)});
+        .save({ login, email, password, langKey: <% if (enableTranslation) { %>this.translateService.currentLang<% } else { %>'<%= nativeLanguage %>'<% } %> })
+        .subscribe({ next: () => (this.success = true), error: response => this.processError(response) });
     }
   }
 

package/generators/client/templates/angular/src/main/webapp/app/account/sessions/sessions.component.html.ejs

@@ -17,23 +17,23 @@
  limitations under the License.
 -%>
 <div>
-  <h2 id="session-page-heading" <%= jhiPrefix %>Translate="sessions.title" [translateValues]="{ username: account.login }" *ngIf="account">Active sessions for [<strong>{{ account.login }}</strong>]</h2>
+  <h2 id="session-page-heading" <%= jhiPrefix %>Translate="sessions.title" [translateValues]="{ username: account.login }" *ngIf="account"><%- this._getClientTranslation('sessions.title', { username: '{{ account.login }}' }) %></h2>
 
   <div class="alert alert-success" *ngIf="success" <%= jhiPrefix %>Translate="sessions.messages.success">
-    <strong>Session invalidated!</strong>
+    <%- this._getClientTranslation('sessions.messages.success') %>
   </div>
 
   <div class="alert alert-danger" *ngIf="error" <%= jhiPrefix %>Translate="sessions.messages.error">
-    <strong>An error has occurred!</strong> The session could not be invalidated.
+     <%- this._getClientTranslation('sessions.messages.error') %>
   </div>
 
   <div class="table-responsive">
     <table class="table table-striped" aria-describedby="session-page-heading">
       <thead>
         <tr>
-          <th scope="col" <%= jhiPrefix %>Translate="sessions.table.ipaddress">IP Address</th>
-          <th scope="col" <%= jhiPrefix %>Translate="sessions.table.useragent">User agent</th>
-          <th scope="col" <%= jhiPrefix %>Translate="sessions.table.date">Date</th>
+          <th scope="col" <%= jhiPrefix %>Translate="sessions.table.ipaddress"><%- this._getClientTranslation('sessions.table.ipaddress') %></th>
+          <th scope="col" <%= jhiPrefix %>Translate="sessions.table.useragent"><%- this._getClientTranslation('sessions.table.useragent') %></th>
+          <th scope="col" <%= jhiPrefix %>Translate="sessions.table.date"><%- this._getClientTranslation('sessions.table.date') %></th>
           <th scope="col"></th>
         </tr>
       </thead>
@@ -49,7 +49,7 @@
               (click)="invalidate(session.series)"
               <%= jhiPrefix %>Translate="sessions.table.button"
             >
-              Invalidate
+              <%- this._getClientTranslation('sessions.table.button') %>
             </button>
           </td>
         </tr>