Merge pull request #21 from Quantum-P3/feature/US-06-fix

Fix US-06 user and admin registration form validations and styles

src/main/resources/config/application-dev.yml

@@ -95,7 +95,7 @@ jhipster:
         token-validity-in-seconds: 86400
         token-validity-in-seconds-for-remember-me: 2592000
   mail: # specific JHipster mail property, for standard properties see MailProperties
-    base-url: http://127.0.0.1:8080
+    base-url: http://localhost:9000
   logging:
     use-json-format: false # By default, logs are not in Json format
     logstash: # Forward logs to logstash over a socket, used by LoggingConfiguration

src/main/webapp/app/account/register/register.component.html

@@ -23,6 +23,10 @@
               <strong>Registration failed!</strong> Please try again later.
             </div>
 
+            <div class="alert alert-danger" *ngIf="errorUserExists" jhiTranslate="register.messages.error.userexists">
+              <strong>Login name already registered!</strong> Please choose another one.
+            </div>
+
             <div class="alert alert-danger" *ngIf="errorEmailExists" jhiTranslate="register.messages.error.emailexists">
               <strong>Email is already in use!</strong> Please choose another one.
             </div>
@@ -34,7 +38,7 @@
             <form
               name="form"
               role="form"
-              class="form"
+              class="ds-form"
               (ngSubmit)="register()"
               [formGroup]="registerForm"
               *ngIf="!success"
@@ -42,7 +46,7 @@
             >
               <div class="mb-3">
                 <div class="form-group">
-                  <label for="name" class="form-label">Nombre</label>
+                  <label for="name" class="form-label">Nombre completo</label>
                   <input
                     type="text"
                     class="form-control"
@@ -136,13 +140,17 @@
                     >
                       Your email cannot be longer than 100 characters.
                     </small>
+
+                    <small class="form-text text-danger" *ngIf="registerForm.get('email')?.errors?.email">
+                      Se requiere un correo electrónico válido.
+                    </small>
                   </div>
                 </div>
               </div>
 
               <div class="mb-3">
                 <div class="form-group">
-                  <label for="password" jhiTranslate="global.form.newpassword.label">Password</label>
+                  <label for="password">Nueva contraseña</label>
                   <input
                     type="password"
                     class="form-control"
@@ -188,7 +196,7 @@
 
               <div class="mb-3">
                 <div class="form-group">
-                  <label for="password" jhiTranslate="global.form.newpassword.label">Password</label>
+                  <label for="password">Repetir nueva contraseña</label>
                   <input
                     type="password"
                     class="form-control"
@@ -243,7 +251,7 @@
                 <button
                   type="submit"
                   [disabled]="registerForm.invalid"
-                  class="btn btn-primary w-100"
+                  class="ds-btn ds-btn--primary w-100"
                   jhiTranslate="register.form.button"
                   data-cy="submit"
                 >

src/main/webapp/app/account/register/register.component.ts

@@ -59,8 +59,8 @@ export class RegisterComponent implements AfterViewInit {
   registerForm = this.fb.group({
     name: ['', [Validators.required, Validators.minLength(2), Validators.maxLength(254)]],
     email: ['', [Validators.required, Validators.minLength(5), Validators.maxLength(254), Validators.email]],
-    password: ['', [Validators.required, Validators.minLength(4), Validators.maxLength(50)]],
+    password: ['', [Validators.required, Validators.minLength(8), Validators.maxLength(50)]],
-    confirmPassword: ['', [Validators.required, Validators.minLength(4), Validators.maxLength(50)]],
+    confirmPassword: ['', [Validators.required, Validators.minLength(8), Validators.maxLength(50)]],
   });
 
   constructor(private translateService: TranslateService, private registerService: RegisterService, private fb: FormBuilder) {}

src/main/webapp/app/entities/usuario-extra/update/usuario-extra-update.component.html

@@ -9,12 +9,12 @@
         <div class="card-body p-4">
           <div class="text-center w-75 m-auto">
             <h4 class="text-dark-50 text-center pb-0 fw-bold p-0 m-0" style="color: #727070; font-weight: 700; font-size: 1.3rem">
-              REGISTRAR ADMIN
+              REGISTRAR ADMINISTRADOR
             </h4>
             <p class="mb-4" style="color: rgba(146, 146, 146, 0.664)">Ingrese los datos para registrar a un admin.</p>
           </div>
 
-          <div class="alert alert-success" *ngIf="success" jhiTranslate="register.messages.adminsuccess">
+          <div class="alert alert-success" *ngIf="success" jhiTranslate="register.messages.success">
             <strong>Registration saved!</strong> Please check your email for confirmation.
           </div>
 
@@ -22,6 +22,10 @@
             <strong>Registration failed!</strong> Please try again later.
           </div>
 
+          <div class="alert alert-danger" *ngIf="errorUserExists" jhiTranslate="register.messages.error.userexists">
+            <strong>Login name already registered!</strong> Please choose another one.
+          </div>
+
           <div class="alert alert-danger" *ngIf="errorEmailExists" jhiTranslate="register.messages.error.emailexists">
             <strong>Email is already in use!</strong> Please choose another one.
           </div>
@@ -33,13 +37,13 @@
           <form name="form" role="form" class="form" (ngSubmit)="register()" [formGroup]="registerForm" *ngIf="!success" autocomplete="off">
             <div class="mb-3">
               <div class="form-group">
-                <label for="name" class="form-label">Nombre</label>
+                <label for="name" class="form-label">Nombre completo</label>
                 <input
                   type="text"
                   class="form-control"
                   id="name"
                   name="name"
-                  placeholder="{{ 'global.form.name.placeholder' | translate }}"
+                  placeholder="Nombre completo"
                   formControlName="name"
                   data-cy="name"
                 />
@@ -88,7 +92,7 @@
                   class="form-control"
                   id="email"
                   name="email"
-                  placeholder="{{ 'global.form.email.placeholder' | translate }}"
+                  placeholder="Correo electrónico"
                   formControlName="email"
                   data-cy="email"
                 />
@@ -125,13 +129,17 @@
                   >
                     Your email cannot be longer than 100 characters.
                   </small>
+
+                  <small class="form-text text-danger" *ngIf="registerForm.get('email')?.errors?.email">
+                    Se requiere un correo electrónico válido.
+                  </small>
                 </div>
               </div>
             </div>
 
             <div class="mb-3">
               <div class="form-group">
-                <label for="password" jhiTranslate="global.form.newpassword.label">Password</label>
+                <label for="password">Nueva contraseña</label>
                 <input
                   type="password"
                   class="form-control"
@@ -176,7 +184,7 @@
 
             <div class="mb-3">
               <div class="form-group">
-                <label for="password" jhiTranslate="global.form.newpassword.label">Password</label>
+                <label for="password">Repetir nueva contraseña</label>
                 <input
                   type="password"
                   class="form-control"

src/main/webapp/app/entities/usuario-extra/update/usuario-extra-update.component.ts

@@ -57,8 +57,8 @@ export class UsuarioExtraUpdateComponent {
   registerForm = this.fb.group({
     name: ['', [Validators.required, Validators.minLength(2), Validators.maxLength(254)]],
     email: ['', [Validators.required, Validators.minLength(5), Validators.maxLength(254), Validators.email]],
-    password: ['', [Validators.required, Validators.minLength(4), Validators.maxLength(50)]],
+    password: ['', [Validators.required, Validators.minLength(8), Validators.maxLength(50)]],
-    confirmPassword: ['', [Validators.required, Validators.minLength(4), Validators.maxLength(50)]],
+    confirmPassword: ['', [Validators.required, Validators.minLength(8), Validators.maxLength(50)]],
   });
 
   constructor(private translateService: TranslateService, private registerService: RegisterService, private fb: FormBuilder) {}

src/main/webapp/app/login/login.component.ts

@@ -28,7 +28,7 @@ export class LoginComponent implements OnInit, AfterViewInit {
 
   loginForm = this.fb.group({
     username: [null, [Validators.required, Validators.email, Validators.minLength(5), Validators.maxLength(254)]],
-    password: [null, [Validators.required, Validators.minLength(4), Validators.maxLength(50)]],
+    password: [null, [Validators.required, Validators.minLength(8), Validators.maxLength(50)]],
     rememberMe: [false],
   });
 

src/main/webapp/i18n/es/global.json

@@ -78,13 +78,13 @@
       "validate": {
         "newpassword": {
           "required": "Se requiere que ingrese una contraseña.",
-          "minlength": "Se requiere que su contraseña tenga por lo menos 4 caracteres",
+          "minlength": "Se requiere que su contraseña tenga por lo menos 8 caracteres",
           "maxlength": "Su contraseña no puede tener más de 50 caracteres",
           "strength": "Seguridad de la contraseña:"
         },
         "confirmpassword": {
           "required": "Se requiere que confirme la contraseña.",
-          "minlength": "Se requiere que su contraseña de confirmación tenga por lo menos 4 caracteres",
+          "minlength": "Se requiere que su contraseña de confirmación tenga por lo menos 8 caracteres",
           "maxlength": "Su contraseña de confirmación no puede tener más de 50 caracteres"
         },
         "email": {

src/main/webapp/i18n/es/register.json

@@ -17,7 +17,7 @@
       "adminsuccess": "<strong>¡Registro guardado!</strong> Por favor, revise el correo electrónico para confirmar.",
       "error": {
         "fail": "<strong>¡El registro ha fallado!</strong> Por favor, inténtelo de nuevo más tarde.",
-        "userexists": "<strong>¡El nombre de usuario ya está registrado!</strong> Por favor, escoja otro usuario.",
+        "userexists": "<strong>¡El correo electrónico ya está en uso!</strong> Por favor, escoja otro correo.",
         "emailexists": "<strong>¡El correo electrónico ya está en uso!</strong> Por favor, escoja otro email."
       }
     }