Implement community feedback

Remove other registration references
Enabled enter submit in registration form
Fixed create-profile password validation to be on debounce
Fixed register page title

src/app/core/auth/auth.actions.ts

@@ -3,7 +3,6 @@ import { Action } from '@ngrx/store';
 // import type function
 import { type } from '../../shared/ngrx/type';
 // import models
-import { EPerson } from '../eperson/models/eperson.model';
 import { AuthTokenInfo } from './models/auth-token-info.model';
 import { AuthMethod } from './models/auth.method';
 import { AuthStatus } from './models/auth-status.model';
@@ -31,9 +30,6 @@ export const AuthActionTypes = {
   LOG_OUT: type('dspace/auth/LOG_OUT'),
   LOG_OUT_ERROR: type('dspace/auth/LOG_OUT_ERROR'),
   LOG_OUT_SUCCESS: type('dspace/auth/LOG_OUT_SUCCESS'),
-  REGISTRATION: type('dspace/auth/REGISTRATION'),
-  REGISTRATION_ERROR: type('dspace/auth/REGISTRATION_ERROR'),
-  REGISTRATION_SUCCESS: type('dspace/auth/REGISTRATION_SUCCESS'),
   SET_REDIRECT_URL: type('dspace/auth/SET_REDIRECT_URL'),
   RETRIEVE_AUTHENTICATED_EPERSON: type('dspace/auth/RETRIEVE_AUTHENTICATED_EPERSON'),
   RETRIEVE_AUTHENTICATED_EPERSON_SUCCESS: type('dspace/auth/RETRIEVE_AUTHENTICATED_EPERSON_SUCCESS'),
@@ -263,48 +259,6 @@ export class RetrieveTokenAction implements Action {
   public type: string = AuthActionTypes.RETRIEVE_TOKEN;
 }
 
-/**
- * Sign up.
- * @class RegistrationAction
- * @implements {Action}
- */
-export class RegistrationAction implements Action {
-  public type: string = AuthActionTypes.REGISTRATION;
-  payload: EPerson;
-
-  constructor(user: EPerson) {
-    this.payload = user;
-  }
-}
-
-/**
- * Sign up error.
- * @class RegistrationErrorAction
- * @implements {Action}
- */
-export class RegistrationErrorAction implements Action {
-  public type: string = AuthActionTypes.REGISTRATION_ERROR;
-  payload: Error;
-
-  constructor(payload: Error) {
-    this.payload = payload;
-  }
-}
-
-/**
- * Sign up success.
- * @class RegistrationSuccessAction
- * @implements {Action}
- */
-export class RegistrationSuccessAction implements Action {
-  public type: string = AuthActionTypes.REGISTRATION_SUCCESS;
-  payload: EPerson;
-
-  constructor(user: EPerson) {
-    this.payload = user;
-  }
-}
-
 /**
  * Add uthentication message.
  * @class AddAuthenticationMessageAction
@@ -439,9 +393,6 @@ export type AuthActions
   | CheckAuthenticationTokenCookieAction
   | RedirectWhenAuthenticationIsRequiredAction
   | RedirectWhenTokenExpiredAction
-  | RegistrationAction
-  | RegistrationErrorAction
-  | RegistrationSuccessAction
   | AddAuthenticationMessageAction
   | RefreshTokenAction
   | RefreshTokenErrorAction

src/app/core/auth/auth.effects.ts

@@ -32,9 +32,6 @@ import {
   RefreshTokenAction,
   RefreshTokenErrorAction,
   RefreshTokenSuccessAction,
-  RegistrationAction,
-  RegistrationErrorAction,
-  RegistrationSuccessAction,
   RetrieveAuthenticatedEpersonAction,
   RetrieveAuthenticatedEpersonErrorAction,
   RetrieveAuthenticatedEpersonSuccessAction,
@@ -138,18 +135,6 @@ export class AuthEffects {
     })
   );
 
-  @Effect()
-  public createUser$: Observable<Action> = this.actions$.pipe(
-    ofType(AuthActionTypes.REGISTRATION),
-    debounceTime(500), // to remove when functionality is implemented
-    switchMap((action: RegistrationAction) => {
-      return this.authService.create(action.payload).pipe(
-        map((user: EPerson) => new RegistrationSuccessAction(user)),
-        catchError((error) => observableOf(new RegistrationErrorAction(error)))
-      );
-    })
-  );
-
   @Effect()
   public retrieveToken$: Observable<Action> = this.actions$.pipe(
     ofType(AuthActionTypes.RETRIEVE_TOKEN),

src/app/core/auth/auth.reducer.ts

@@ -115,7 +115,6 @@ export function authReducer(state: any = initialState, action: AuthActions): Aut
       });
 
     case AuthActionTypes.AUTHENTICATE_ERROR:
-    case AuthActionTypes.REGISTRATION_ERROR:
       return Object.assign({}, state, {
         authenticated: false,
         authToken: undefined,
@@ -157,18 +156,6 @@ export function authReducer(state: any = initialState, action: AuthActions): Aut
         userId: undefined
       });
 
-    case AuthActionTypes.REGISTRATION:
-      return Object.assign({}, state, {
-        authenticated: false,
-        authToken: undefined,
-        error: undefined,
-        loading: true,
-        info: undefined
-      });
-
-    case AuthActionTypes.REGISTRATION_SUCCESS:
-      return state;
-
     case AuthActionTypes.REFRESH_TOKEN:
       return Object.assign({}, state, {
         refreshing: true,

src/app/core/auth/auth.service.ts

@@ -270,18 +270,6 @@ export class AuthService {
     return observableOf(authMethods);
   }
 
-  /**
-   * Create a new user
-   * @returns {User}
-   */
-  public create(user: EPerson): Observable<EPerson> {
-    // Normally you would do an HTTP request to POST the user
-    // details and then return the new user object
-    // but, let's just return the new user for this example.
-    // this._authenticated = true;
-    return observableOf(user);
-  }
-
   /**
    * End session
    * @returns {Observable<boolean>}

src/app/register-page/create-profile/create-profile.component.html

@@ -7,7 +7,7 @@
                    for="email">{{'register-page.create-profile.identification.email' | translate}}</label>
             <span id="email">{{(registration$ |async).email}}</span></div>
     </div>
-    <form [class]="'ng-invalid'" [formGroup]="userInfoForm">
+    <form [class]="'ng-invalid'" [formGroup]="userInfoForm" (ngSubmit)="submitEperson()">
 
         <div class="form-group">
             <div class="row">
@@ -64,13 +64,13 @@
     <h4>{{'register-page.create-profile.security.header' | translate}}</h4>
     <p>{{'register-page.create-profile.security.info' | translate}}</p>
 
-    <form class="form-horizontal" [formGroup]="passwordForm">
+    <form class="form-horizontal" [formGroup]="passwordForm" (ngSubmit)="submitEperson()">
         <div class="form-group">
             <div class="row">
                 <div class="col-12">
                     <label class="font-weight-bold" for="password">{{'register-page.create-profile.security.password' |translate}}</label>
                     <input [type]="'password'"
-                           [className]="(passwordForm.invalid) && (password.dirty || password.touched) && (confirmPassword.dirty || confirmPassword.touched) ? 'form-control is-invalid' :'form-control'"
+                           [className]="(!(isValidPassWord$|async)) && (password.dirty || password.touched) && (confirmPassword.dirty || confirmPassword.touched) ? 'form-control is-invalid' :'form-control'"
                            type="text" id="password" formControlName="password"/>
                 </div>
             </div>
@@ -78,9 +78,9 @@
                 <div class="col-12">
                     <label class="font-weight-bold" for="confirmPassword">{{'register-page.create-profile.security.confirm-password' |translate}}</label>
                     <input [type]="'password'"
-                           [className]="(passwordForm.invalid) && (password.dirty || password.touched) && (confirmPassword.dirty || confirmPassword.touched) ? 'form-control is-invalid' :'form-control'"
+                           [className]="(!(isValidPassWord$|async)) && (password.dirty || password.touched) && (confirmPassword.dirty || confirmPassword.touched) ? 'form-control is-invalid' :'form-control'"
                            id="confirmPassword" formControlName="confirmPassword">
-                    <div *ngIf="passwordForm.invalid && (password.dirty || password.touched) && (confirmPassword.dirty || confirmPassword.touched)"
+                    <div *ngIf="!(isValidPassWord$|async) && (password.dirty || password.touched) && (confirmPassword.dirty || confirmPassword.touched)"
                          class="invalid-feedback show-feedback">
                         {{ 'register-page.create-profile.security.password.error' | translate }}
                     </div>
@@ -92,7 +92,7 @@
     <div class="row">
         <div class="col-12">
             <button
-                    [disabled]="passwordForm.invalid || userInfoForm.invalid"
+                    [disabled]=" !(isValidPassWord$|async) || userInfoForm.invalid"
                     class="btn btn-default btn-primary" (click)="submitEperson()">{{'register-page.create-profile.submit' | translate}}</button>
         </div>
     </div>

src/app/register-page/create-profile/create-profile.component.ts

@@ -1,6 +1,6 @@
-import { Component, Inject, OnInit } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
-import { map } from 'rxjs/operators';
+import { debounceTime, map } from 'rxjs/operators';
 import { Registration } from '../../core/shared/registration.model';
 import { Observable } from 'rxjs';
 import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
@@ -32,6 +32,8 @@ export class CreateProfileComponent implements OnInit {
   passwordForm: FormGroup;
   activeLangs: LangConfig[];
 
+  isValidPassWord$: Observable<boolean>;
+
   constructor(
     private translateService: TranslateService,
     private ePersonDataService: EPersonDataService,
@@ -68,15 +70,26 @@ export class CreateProfileComponent implements OnInit {
     this.passwordForm = this.formBuilder.group({
       password: new FormControl('', {
         validators: [Validators.required, Validators.minLength(6)],
-        updateOn: 'blur'
+        updateOn: 'change'
       }),
       confirmPassword: new FormControl('', {
         validators: [Validators.required],
-        updateOn: 'blur'
+        updateOn: 'change'
       })
     }, {
       validator: ConfirmedValidator('password', 'confirmPassword')
     });
+
+    this.isValidPassWord$ = this.passwordForm.statusChanges.pipe(
+      debounceTime(300),
+      map((status: string) => {
+        if (status === 'VALID') {
+          return true;
+        } else {
+          return false;
+        }
+      })
+    );
   }
 
   get firstName() {

src/app/register-page/register-email/register-email.component.html

@@ -2,7 +2,7 @@
     <h2>{{'register-page.registration.header'|translate}}</h2>
     <p>{{'register-page.registration.info' | translate}}</p>
 
-    <form [class]="'ng-invalid'" [formGroup]="form">
+    <form [class]="'ng-invalid'" [formGroup]="form" (ngSubmit)="register()">
 
         <div class="form-group">
             <div class="row">

src/app/register-page/register-email/register-email.component.ts

@@ -42,6 +42,7 @@ export class RegisterEmailComponent implements OnInit {
    * Register an email address
    */
   register() {
+    if (!this.form.invalid) {
       this.epersonRegistrationService.registerEmail(this.email.value).subscribe((response: RestResponse) => {
           if (response.isSuccessful) {
             this.notificationService.success(this.translateService.get('register-page.registration.success.head'),
@@ -54,6 +55,7 @@ export class RegisterEmailComponent implements OnInit {
         }
       );
     }
+  }
 
   get email() {
     return this.form.get('email');

src/assets/i18n/en.json5

@@ -2037,6 +2037,7 @@
   "publication.search.title": "DSpace Angular :: Publication Search",
 
 
+  "register-email.title": "New user registration",
 
   "register-page.create-profile.header": "Create Profile",