70504: New user registration

src/app/app-routing.module.ts

@@ -71,6 +71,7 @@ export function getDSOPath(dso: DSpaceObject): string {
       { path: 'community-list', loadChildren: './community-list-page/community-list-page.module#CommunityListPageModule' },
       { path: 'id', loadChildren: './+lookup-by-id/lookup-by-id.module#LookupIdModule' },
       { path: 'handle', loadChildren: './+lookup-by-id/lookup-by-id.module#LookupIdModule' },
+      { path: 'register', loadChildren: './register-page/register-page.module#RegisterPageModule' },
       { path: COMMUNITY_MODULE_PATH, loadChildren: './+community-page/community-page.module#CommunityPageModule' },
       { path: COLLECTION_MODULE_PATH, loadChildren: './+collection-page/collection-page.module#CollectionPageModule' },
       { path: ITEM_MODULE_PATH, loadChildren: './+item-page/item-page.module#ItemPageModule' },

src/app/core/cache/response.models.ts

@@ -15,6 +15,7 @@ import { DSpaceObject } from '../shared/dspace-object.model';
 import { MetadataSchema } from '../metadata/metadata-schema.model';
 import { MetadataField } from '../metadata/metadata-field.model';
 import { ContentSource } from '../shared/content-source.model';
+import { Registration } from '../shared/registration.model';
 
 /* tslint:disable:max-classes-per-file */
 export class RestResponse {
@@ -302,4 +303,17 @@ export class ContentSourceSuccessResponse extends RestResponse {
     super(true, statusCode, statusText);
   }
 }
+
+/**
+ * A successful response containing a Registration
+ */
+export class RegistrationSuccessResponse extends RestResponse {
+  constructor(
+    public registration: Registration,
+    public statusCode: number,
+    public statusText: string,
+  ) {
+    super(true, statusCode, statusText);
+  }
+}
 /* tslint:enable:max-classes-per-file */

src/app/core/core.module.ts

@@ -145,6 +145,8 @@ import { Version } from './shared/version.model';
 import { VersionHistory } from './shared/version-history.model';
 import { WorkflowActionDataService } from './data/workflow-action-data.service';
 import { WorkflowAction } from './tasks/models/workflow-action-object.model';
+import { EpersonRegistrationService } from './data/eperson-registration.service';
+import { Registration } from './shared/registration.model';
 
 /**
  * When not in production, endpoint responses can be mocked for testing purposes
@@ -314,7 +316,8 @@ export const models =
     ExternalSourceEntry,
     Version,
     VersionHistory,
-    WorkflowAction
+    WorkflowAction,
+    Registration
   ];
 
 @NgModule({

src/app/core/data/eperson-registration.service.spec.ts

@@ -0,0 +1,84 @@
+import { RequestService } from './request.service';
+import { EpersonRegistrationService } from './eperson-registration.service';
+import { HALEndpointServiceStub } from '../../shared/testing/hal-endpoint-service-stub';
+import { RegistrationSuccessResponse, RestResponse } from '../cache/response.models';
+import { RequestEntry } from './request.reducer';
+import { cold } from 'jasmine-marbles';
+import { PostRequest } from './request.models';
+import { Registration } from '../shared/registration.model';
+
+describe('EpersonRegistrationService', () => {
+  let service: EpersonRegistrationService;
+  let requestService: RequestService;
+
+  let halService: any;
+
+  const registration = new Registration();
+  registration.email = 'test@mail.org';
+
+  beforeEach(() => {
+    halService = new HALEndpointServiceStub('rest-url');
+
+    requestService = jasmine.createSpyObj('requestService', {
+      generateRequestId: 'request-id',
+      configure: {},
+      getByUUID: cold('a',
+        {a: Object.assign(new RequestEntry(), {response: new RestResponse(true, 200, 'Success')})})
+    });
+    service = new EpersonRegistrationService(
+      requestService,
+      halService
+    );
+  });
+
+  describe('getRegistrationEndpoint', () => {
+    it('should retrieve the registration endpoint', () => {
+      const expected = service.getRegistrationEndpoint();
+
+      expected.subscribe(((value) => {
+        expect(value).toEqual('rest-url/registrations');
+      }));
+    });
+  });
+
+  describe('getTokenSearchEndpoint', () => {
+    it('should return the token search endpoint for a specified token', () => {
+      const expected = service.getTokenSearchEndpoint('test-token');
+
+      expected.subscribe(((value) => {
+        expect(value).toEqual('rest-url/registrations/search/findByToken?token=test-token');
+      }));
+    });
+  });
+
+  describe('registerEmail', () => {
+    it('should send an email registration', () => {
+
+      const expected = service.registerEmail('test@mail.org');
+
+      expect(requestService.configure).toHaveBeenCalledWith(new PostRequest('request-id', 'rest-url/registrations', registration));
+      expect(expected).toBeObservable(cold('a', {a: new RestResponse(true, 200, 'Success')}));
+    });
+  });
+
+  describe('searchByToken', () => {
+    beforeEach(() => {
+      (requestService.getByUUID as jasmine.Spy).and.returnValue(
+        cold('a',
+          {a: Object.assign(new RequestEntry(), {response: new RegistrationSuccessResponse(registration, 200, 'Success')})})
+      );
+    });
+    it('should return a registration corresponding to the provided token', () => {
+      const expected = service.searchByToken('test-token');
+
+      expect(expected).toBeObservable(cold('(a|)', {
+        a: Object.assign(new Registration(), {
+          email: registration.email,
+          token: 'test-token'
+        })
+      }));
+
+    });
+  });
+
+});

src/app/core/data/eperson-registration.service.ts

@@ -0,0 +1,108 @@
+import { Injectable } from '@angular/core';
+import { RequestService } from './request.service';
+import { HALEndpointService } from '../shared/hal-endpoint.service';
+import { GetRequest, PostRequest } from './request.models';
+import { Observable } from 'rxjs';
+import { filter, find, map, take } from 'rxjs/operators';
+import { hasValue, isNotEmpty } from '../../shared/empty.util';
+import { Registration } from '../shared/registration.model';
+import { filterSuccessfulResponses, getResponseFromEntry } from '../shared/operators';
+import { ResponseParsingService } from './parsing.service';
+import { GenericConstructor } from '../shared/generic-constructor';
+import { RegistrationResponseParsingService } from './registration-response-parsing.service';
+import { RegistrationSuccessResponse } from '../cache/response.models';
+
+@Injectable(
+  {
+    providedIn: 'root',
+  }
+)
+/**
+ * Service that will register a new email address and request a token
+ */
+export class EpersonRegistrationService {
+
+  protected linkPath = 'registrations';
+  protected searchByTokenPath = '/search/findByToken?token=';
+
+  constructor(
+    protected requestService: RequestService,
+    protected halService: HALEndpointService,
+  ) {
+
+  }
+
+  /**
+   * Retrieves the Registration endpoint
+   */
+  getRegistrationEndpoint(): Observable<string> {
+    return this.halService.getEndpoint(this.linkPath);
+  }
+
+  /**
+   * Retrieves the endpoint to search by registration token
+   */
+  getTokenSearchEndpoint(token: string): Observable<string> {
+    return this.halService.getEndpoint(this.linkPath).pipe(
+      filter((href: string) => isNotEmpty(href)),
+      map((href: string) => `${href}${this.searchByTokenPath}${token}`));
+  }
+
+  /**
+   * Register a new email address
+   * @param email
+   */
+  registerEmail(email: string) {
+    const registration = new Registration();
+    registration.email = email;
+
+    const requestId = this.requestService.generateRequestId();
+
+    const hrefObs = this.getRegistrationEndpoint();
+
+    hrefObs.pipe(
+      find((href: string) => hasValue(href)),
+      map((href: string) => {
+        const request = new PostRequest(requestId, href, registration);
+        this.requestService.configure(request);
+      })
+    ).subscribe();
+
+    return this.requestService.getByUUID(requestId).pipe(
+      getResponseFromEntry()
+    );
+  }
+
+  /**
+   * Search a registration based on the provided token
+   * @param token
+   */
+  searchByToken(token: string): Observable<Registration> {
+    const requestId = this.requestService.generateRequestId();
+
+    const hrefObs = this.getTokenSearchEndpoint(token);
+
+    hrefObs.pipe(
+      find((href: string) => hasValue(href)),
+      map((href: string) => {
+        const request = new GetRequest(requestId, href);
+        const parser = Object.assign(request, {
+          getResponseParser(): GenericConstructor<ResponseParsingService> {
+            return RegistrationResponseParsingService;
+          }
+        });
+        this.requestService.configure(request);
+      })
+    ).subscribe();
+
+    return this.requestService.getByUUID(requestId).pipe(
+      filterSuccessfulResponses(),
+      map((restResponse: RegistrationSuccessResponse) => {
+        return Object.assign(new Registration(), {email: restResponse.registration.email, token: token});
+      }),
+      take(1),
+    );
+
+  }
+
+}

src/app/core/data/registration-response-parsing.service.spec.ts

@@ -0,0 +1,22 @@
+import { Registration } from '../shared/registration.model';
+import { RegistrationResponseParsingService } from './registration-response-parsing.service';
+import { RegistrationSuccessResponse } from '../cache/response.models';
+
+describe('RegistrationResponseParsingService', () => {
+  describe('parse', () => {
+    const registration = Object.assign(new Registration(), {email: 'test@email.org', token: 'test-token'});
+    const registrationResponseParsingService = new RegistrationResponseParsingService();
+
+    const data = {
+      payload: {email: 'test@email.org', token: 'test-token'},
+      statusCode: 200,
+      statusText: 'Success'
+    };
+
+    it('should parse a registration response', () => {
+      const expected = registrationResponseParsingService.parse({} as any, data);
+
+      expect(expected).toEqual(new RegistrationSuccessResponse(registration, 200, 'Success'));
+    });
+  });
+});

src/app/core/data/registration-response-parsing.service.ts

@@ -0,0 +1,24 @@
+import { Injectable } from '@angular/core';
+import { RegistrationSuccessResponse, RestResponse } from '../cache/response.models';
+import { DSpaceRESTV2Response } from '../dspace-rest-v2/dspace-rest-v2-response.model';
+import { ResponseParsingService } from './parsing.service';
+import { RestRequest } from './request.models';
+import { Registration } from '../shared/registration.model';
+
+@Injectable({
+  providedIn: 'root',
+})
+/**
+ * Parsing service responsible for parsing a Registration response
+ */
+export class RegistrationResponseParsingService implements ResponseParsingService {
+
+  parse(request: RestRequest, data: DSpaceRESTV2Response): RestResponse {
+    const payload = data.payload;
+
+    const registration = Object.assign(new Registration(), payload);
+
+    return new RegistrationSuccessResponse(registration, data.statusCode, data.statusText);
+  }
+
+}

src/app/core/eperson/eperson-data.service.spec.ts

@@ -14,7 +14,7 @@ import { CoreState } from '../core.reducers';
 import { ChangeAnalyzer } from '../data/change-analyzer';
 import { PaginatedList } from '../data/paginated-list';
 import { RemoteData } from '../data/remote-data';
-import { DeleteByIDRequest, FindListOptions, PatchRequest } from '../data/request.models';
+import { DeleteByIDRequest, FindListOptions, PatchRequest, PostRequest } from '../data/request.models';
 import { RequestEntry } from '../data/request.reducer';
 import { RequestService } from '../data/request.service';
 import { HALEndpointService } from '../shared/hal-endpoint.service';
@@ -291,6 +291,15 @@ describe('EPersonDataService', () => {
     });
   });
 
+  describe('createEPersonForToken', () => {
+    it('should sent a postRquest with an eperson to the token endpoint', () => {
+      service.createEPersonForToken(EPersonMock, 'test-token');
+
+      const expected = new PostRequest(requestService.generateRequestId(), epersonsEndpoint + '?token=test-token', EPersonMock);
+      expect(requestService.configure).toHaveBeenCalledWith(expected);
+    });
+  });
+
 });
 
 function getRemotedataObservable(obj: any): Observable<RemoteData<any>> {

src/app/core/eperson/eperson-data.service.ts

@@ -3,7 +3,7 @@ import { Injectable } from '@angular/core';
 import { createSelector, select, Store } from '@ngrx/store';
 import { Operation } from 'fast-json-patch/lib/core';
 import { Observable } from 'rxjs';
-import { filter, map, take } from 'rxjs/operators';
+import { filter, find, map, take } from 'rxjs/operators';
 import {
   EPeopleRegistryCancelEPersonAction,
   EPeopleRegistryEditEPersonAction
@@ -22,7 +22,7 @@ import { DataService } from '../data/data.service';
 import { DSOChangeAnalyzer } from '../data/dso-change-analyzer.service';
 import { PaginatedList } from '../data/paginated-list';
 import { RemoteData } from '../data/remote-data';
-import { FindListOptions, FindListRequest, PatchRequest, } from '../data/request.models';
+import { FindListOptions, FindListRequest, PatchRequest, PostRequest, } from '../data/request.models';
 import { RequestService } from '../data/request.service';
 import { HALEndpointService } from '../shared/hal-endpoint.service';
 import { getRemoteDataPayload, getSucceededRemoteData } from '../shared/operators';
@@ -165,17 +165,17 @@ export class EPersonDataService extends DataService<EPerson> {
     if (hasValue(oldEPerson.email) && oldEPerson.email !== newEPerson.email) {
       operations = [...operations, {
         op: 'replace', path: '/email', value: newEPerson.email
-      }]
+      }];
     }
     if (hasValue(oldEPerson.requireCertificate) && oldEPerson.requireCertificate !== newEPerson.requireCertificate) {
       operations = [...operations, {
         op: 'replace', path: '/certificate', value: newEPerson.requireCertificate
-      }]
+      }];
     }
     if (hasValue(oldEPerson.canLogIn) && oldEPerson.canLogIn !== newEPerson.canLogIn) {
       operations = [...operations, {
         op: 'replace', path: '/canLogIn', value: newEPerson.canLogIn
-      }]
+      }];
     }
     return operations;
   }
@@ -200,7 +200,7 @@ export class EPersonDataService extends DataService<EPerson> {
    * Method to retrieve the eperson that is currently being edited
    */
   public getActiveEPerson(): Observable<EPerson> {
-    return this.store.pipe(select(editEPersonSelector))
+    return this.store.pipe(select(editEPersonSelector));
   }
 
   /**
@@ -249,4 +249,25 @@ export class EPersonDataService extends DataService<EPerson> {
     return '/admin/access-control/epeople';
   }
 
+  /**
+   * Create a new EPerson using a token
+   * @param eperson
+   * @param token
+   */
+  public createEPersonForToken(eperson: EPerson, token: string) {
+    const requestId = this.requestService.generateRequestId();
+    const hrefObs = this.getBrowseEndpoint().pipe(
+      map((href: string) => `${href}?token=${token}`));
+    hrefObs.pipe(
+      find((href: string) => hasValue(href)),
+      map((href: string) => {
+        const request = new PostRequest(requestId, href, eperson);
+        this.requestService.configure(request);
+      })
+    ).subscribe();
+
+    return this.fetchResponse(requestId);
+
+  }
+
 }

src/app/core/eperson/models/eperson.model.ts

@@ -57,6 +57,12 @@ export class EPerson extends DSpaceObject {
   @autoserialize
   public selfRegistered: boolean;
 
+  /**
+   * The password of this EPerson
+   */
+  @autoserialize
+  public password: string;
+
   /**
    * Getter to retrieve the EPerson's full name as a string
    */

src/app/core/shared/registration.model.ts

@@ -0,0 +1,26 @@
+/**
+ * Model representing a registration
+ */
+export class Registration {
+
+  /**
+   * The object type
+   */
+  type: string;
+
+  /**
+   * The email linked to the registration
+   */
+  email: string;
+
+  /**
+   * The user linked to the registration
+   */
+  user: string;
+
+  /**
+   * The token linked to the registration
+   */
+  token: string;
+
+}

src/app/register-page/create-profile/confirmed.validator.spec.ts

@@ -0,0 +1,32 @@
+import { FormBuilder, FormControl } from '@angular/forms';
+import { async, fakeAsync } from '@angular/core/testing';
+import { ConfirmedValidator } from './confirmed.validator';
+
+describe('ConfirmedValidator', () => {
+  let passwordForm;
+
+  beforeEach(async(() => {
+
+    passwordForm = (new FormBuilder()).group({
+      password: new FormControl('', {}),
+      confirmPassword: new FormControl('', {})
+    }, {
+      validator: ConfirmedValidator('password', 'confirmPassword')
+    });
+  }));
+
+  it('should validate a language according to the iso-639-1 standard', fakeAsync(() => {
+
+    passwordForm.get('password').patchValue('test-password');
+    passwordForm.get('confirmPassword').patchValue('test-password-mismatch');
+
+    expect(passwordForm.valid).toBe(false);
+  }));
+
+  it('should invalidate a language that does not comply to the iso-639-1 standard', fakeAsync(() => {
+    passwordForm.get('password').patchValue('test-password');
+    passwordForm.get('confirmPassword').patchValue('test-password');
+
+    expect(passwordForm.valid).toBe(true);
+  }));
+});

src/app/register-page/create-profile/confirmed.validator.ts

@@ -0,0 +1,19 @@
+import { FormGroup } from '@angular/forms';
+
+/**
+ * Validator used to confirm that the password and confirmed password value are the same
+ */
+export function ConfirmedValidator(controlName: string, matchingControlName: string) {
+  return (formGroup: FormGroup) => {
+    const control = formGroup.controls[controlName];
+    const matchingControl = formGroup.controls[matchingControlName];
+    if (matchingControl.errors && !matchingControl.errors.confirmedValidator) {
+      return;
+    }
+    if (control.value !== matchingControl.value) {
+      matchingControl.setErrors({confirmedValidator: true});
+    } else {
+      matchingControl.setErrors(null);
+    }
+  };
+}

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

@@ -0,0 +1,101 @@
+<div class="container">
+    <h2>{{'register-page.create-profile.header' | translate}}</h2>
+    <h4>{{'register-page.create-profile.identification.header' | translate}}</h4>
+    <div class="row">
+        <div class="col-12">
+            <label class="font-weight-bold"
+                   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">
+
+        <div class="form-group">
+            <div class="row">
+                <div class="col-12">
+                    <label class="font-weight-bold"
+                           for="firstName">{{'register-page.create-profile.identification.first-name' | translate}}</label>
+                    <input [className]="(firstName.invalid) && (firstName.dirty || firstName.touched) ? 'form-control is-invalid' :'form-control'"
+                           type="text" id="firstName" formControlName="firstName"/>
+                    <div *ngIf="firstName.invalid && (firstName.dirty || firstName.touched)"
+                         class="invalid-feedback show-feedback">
+                    <span *ngIf="firstName.errors && firstName.errors.required">
+                        {{ 'register-page.create-profile.identification.first-name.error' | translate }}
+                    </span>
+                    </div>
+                </div>
+
+            </div>
+            <div class="row">
+                <div class="col-12">
+                    <label class="font-weight-bold"
+                           for="lastName">{{'register-page.create-profile.identification.last-name' | translate}}</label>
+                    <input
+                            [className]="(lastName.invalid) && (lastName.dirty || lastName.touched) ? 'form-control is-invalid' :'form-control'"
+                            id="lastName" formControlName="lastName">
+                    <div *ngIf="lastName.invalid && (lastName.dirty || lastName.touched)"
+                         class="invalid-feedback show-feedback">
+                    <span *ngIf="lastName.errors && lastName.errors.required">
+                        {{ 'register-page.create-profile.identification.last-name.error' | translate }}
+                    </span>
+                    </div>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col-12">
+                    <label class="font-weight-bold"
+                           for="contactPhone">{{'register-page.create-profile.identification.contact' | translate}}</label>
+                    <input class="form-control" id="contactPhone" formControlName="contactPhone">
+                </div>
+            </div>
+            <div class="row">
+                <div class="col-12">
+                    <label class="font-weight-bold"
+                           for="language">{{'register-page.create-profile.identification.language' |translate}}</label>
+
+                    <select id="language" formControlName="language" class="form-control">
+                        <option [value]="''"></option>
+                        <option *ngFor="let lang of activeLangs" [value]="lang.code">{{lang.label}}</option>
+                    </select>
+                </div>
+            </div>
+        </div>
+    </form>
+
+    <h4>{{'register-page.create-profile.security.header' | translate}}</h4>
+    <p>{{'register-page.create-profile.security.info' | translate}}</p>
+
+    <form class="form-horizontal" [formGroup]="passwordForm">
+        <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'"
+                           type="text" id="password" formControlName="password"/>
+                </div>
+            </div>
+            <div class="row">
+                <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'"
+                           id="confirmPassword" formControlName="confirmPassword">
+                    <div *ngIf="passwordForm.invalid && (password.dirty || password.touched) && (confirmPassword.dirty || confirmPassword.touched)"
+                         class="invalid-feedback show-feedback">
+                        {{ 'register-page.create-profile.security.password.error' | translate }}
+                    </div>
+                </div>
+            </div>
+        </div>
+    </form>
+
+    <div class="row">
+        <div class="col-12">
+            <button
+                    [disabled]="passwordForm.invalid || userInfoForm.invalid"
+                    class="btn btn-default btn-primary" (click)="submitEperson()">{{'register-page.create-profile.submit' | translate}}</button>
+        </div>
+    </div>
+
+
+</div>

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

@@ -0,0 +1,170 @@
+import { CreateProfileComponent } from './create-profile.component';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { Registration } from '../../core/shared/registration.model';
+import { CommonModule } from '@angular/common';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { Store } from '@ngrx/store';
+import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
+import { EPersonDataService } from '../../core/eperson/eperson-data.service';
+import { RouterStub } from '../../shared/testing/router-stub';
+import { NotificationsService } from '../../shared/notifications/notifications.service';
+import { of as observableOf } from 'rxjs';
+import { RestResponse } from '../../core/cache/response.models';
+import { By } from '@angular/platform-browser';
+import { GLOBAL_CONFIG } from '../../../config';
+import { CoreState } from '../../core/core.reducers';
+import { NotificationsServiceStub } from '../../shared/testing/notifications-service-stub';
+import { EPerson } from '../../core/eperson/models/eperson.model';
+import { AuthenticateAction } from '../../core/auth/auth.actions';
+
+describe('CreateProfileComponent', () => {
+  let comp: CreateProfileComponent;
+  let fixture: ComponentFixture<CreateProfileComponent>;
+
+  let router;
+  let route;
+  let ePersonDataService: EPersonDataService;
+  let notificationsService;
+  let store: Store<CoreState>;
+
+  const registration = Object.assign(new Registration(), {email: 'test@email.org', token: 'test-token'});
+
+  const values = {
+    metadata: {
+      'eperson.firstname': [
+        {
+          value: 'First'
+        }
+      ],
+      'eperson.lastname': [
+        {
+          value: 'Last'
+        },
+      ],
+      'eperson.phone': [
+        {
+          value: 'Phone'
+        }
+      ],
+      'eperson.language': [
+        {
+          value: 'en'
+        }
+      ]
+    },
+    email: 'test@email.org',
+    password: 'password',
+    canLogIn: true,
+    requireCertificate: false
+  };
+  const eperson = Object.assign(new EPerson(), values);
+
+  beforeEach(async(() => {
+    const mockConfig = {
+      languages: [{
+        code: 'en',
+        label: 'English',
+        active: true,
+      }, {
+        code: 'de',
+        label: 'Deutsch',
+        active: false
+      }]
+    };
+    route = {data: observableOf({registration: registration})};
+    router = new RouterStub();
+    notificationsService = new NotificationsServiceStub();
+
+    ePersonDataService = jasmine.createSpyObj('ePersonDataService', {
+      createEPersonForToken: observableOf(new RestResponse(true, 200, 'Success'))
+    });
+
+    store = jasmine.createSpyObj('store', {
+      dispatch: {},
+    });
+
+    TestBed.configureTestingModule({
+      imports: [CommonModule, RouterTestingModule.withRoutes([]), TranslateModule.forRoot(), ReactiveFormsModule],
+      declarations: [CreateProfileComponent],
+      providers: [
+        {provide: GLOBAL_CONFIG, useValue: mockConfig},
+        {provide: Router, useValue: router},
+        {provide: ActivatedRoute, useValue: route},
+        {provide: Store, useValue: store},
+        {provide: EPersonDataService, useValue: ePersonDataService},
+        {provide: FormBuilder, useValue: new FormBuilder()},
+        {provide: NotificationsService, useValue: notificationsService},
+      ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA]
+    }).compileComponents();
+  }));
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CreateProfileComponent);
+    comp = fixture.componentInstance;
+
+    fixture.detectChanges();
+  });
+
+  describe('init', () => {
+    it('should initialise mail address', () => {
+      const elem = fixture.debugElement.queryAll(By.css('span#email'))[0].nativeElement;
+      expect(elem.innerHTML).toContain('test@email.org');
+    });
+    it('should initialise the form', () => {
+      const firstName = fixture.debugElement.queryAll(By.css('input#firstName'))[0].nativeElement;
+      const lastName = fixture.debugElement.queryAll(By.css('input#lastName'))[0].nativeElement;
+      const contactPhone = fixture.debugElement.queryAll(By.css('input#contactPhone'))[0].nativeElement;
+      const language = fixture.debugElement.queryAll(By.css('select#language'))[0].nativeElement;
+      const password = fixture.debugElement.queryAll(By.css('input#password'))[0].nativeElement;
+      const confirmPassword = fixture.debugElement.queryAll(By.css('input#confirmPassword'))[0].nativeElement;
+
+      expect(firstName).toBeDefined();
+      expect(lastName).toBeDefined();
+      expect(contactPhone).toBeDefined();
+      expect(language).toBeDefined();
+      expect(password).toBeDefined();
+      expect(confirmPassword).toBeDefined();
+    });
+  });
+
+  describe('submitEperson', () => {
+
+    it('should submit an eperson for creation and log in on success', () => {
+      comp.firstName.patchValue('First');
+      comp.lastName.patchValue('Last');
+      comp.contactPhone.patchValue('Phone');
+      comp.language.patchValue('en');
+      comp.password.patchValue('password');
+      comp.confirmPassword.patchValue('password');
+
+      comp.submitEperson();
+
+      expect(ePersonDataService.createEPersonForToken).toHaveBeenCalledWith(eperson, 'test-token');
+      expect(store.dispatch).toHaveBeenCalledWith(new AuthenticateAction('test@email.org', 'password'));
+      expect(router.navigate).toHaveBeenCalledWith(['/home']);
+      expect(notificationsService.success).toHaveBeenCalled();
+    });
+
+    it('should submit an eperson for creation and stay on page on error', () => {
+
+      (ePersonDataService.createEPersonForToken as jasmine.Spy).and.returnValue(observableOf(new RestResponse(false, 500, 'Error')));
+
+      comp.firstName.patchValue('First');
+      comp.lastName.patchValue('Last');
+      comp.contactPhone.patchValue('Phone');
+      comp.language.patchValue('en');
+      comp.password.patchValue('password');
+      comp.confirmPassword.patchValue('password');
+
+      comp.submitEperson();
+
+      expect(ePersonDataService.createEPersonForToken).toHaveBeenCalledWith(eperson, 'test-token');
+      expect(store.dispatch).not.toHaveBeenCalled();
+      expect(router.navigate).not.toHaveBeenCalled();
+      expect(notificationsService.error).toHaveBeenCalled();
+    });
+  });
+});

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

@@ -0,0 +1,155 @@
+import { Component, Inject, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { map } from 'rxjs/operators';
+import { Registration } from '../../core/shared/registration.model';
+import { Observable } from 'rxjs';
+import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
+import { ConfirmedValidator } from './confirmed.validator';
+import { TranslateService } from '@ngx-translate/core';
+import { EPersonDataService } from '../../core/eperson/eperson-data.service';
+import { EPerson } from '../../core/eperson/models/eperson.model';
+import { LangConfig } from '../../../config/lang-config.interface';
+import { GLOBAL_CONFIG, GlobalConfig } from '../../../config';
+import { Store } from '@ngrx/store';
+import { CoreState } from '../../core/core.reducers';
+import { AuthenticateAction } from '../../core/auth/auth.actions';
+import { NotificationsService } from '../../shared/notifications/notifications.service';
+
+/**
+ * Component that renders the create profile page to be used by a user registering through a token
+ */
+@Component({
+  selector: 'ds-create-profile',
+  templateUrl: './create-profile.component.html'
+})
+export class CreateProfileComponent implements OnInit {
+  private registration$: Observable<Registration>;
+
+  email: string;
+  token: string;
+
+  userInfoForm: FormGroup;
+  passwordForm: FormGroup;
+  activeLangs: LangConfig[];
+
+  constructor(
+    @Inject(GLOBAL_CONFIG) public config: GlobalConfig,
+    private translateService: TranslateService,
+    private ePersonDataService: EPersonDataService,
+    private store: Store<CoreState>,
+    private router: Router,
+    private route: ActivatedRoute,
+    private formBuilder: FormBuilder,
+    private notificationsService: NotificationsService
+  ) {
+
+  }
+
+  ngOnInit(): void {
+    this.registration$ = this.route.data.pipe(
+      map((data) => data.registration as Registration),
+    );
+    this.registration$.subscribe((registration: Registration) => {
+      this.email = registration.email;
+      this.token = registration.token;
+    });
+    this.activeLangs = this.config.languages.filter((MyLangConfig) => MyLangConfig.active === true);
+
+    this.userInfoForm = this.formBuilder.group({
+      firstName: new FormControl('', {
+        validators: [Validators.required],
+      }),
+      lastName: new FormControl('', {
+        validators: [Validators.required],
+      }),
+      contactPhone: new FormControl(''),
+      language: new FormControl(''),
+    });
+
+    this.passwordForm = this.formBuilder.group({
+      password: new FormControl('', {
+        validators: [Validators.required, Validators.minLength(6)],
+        updateOn: 'blur'
+      }),
+      confirmPassword: new FormControl('', {
+        validators: [Validators.required],
+        updateOn: 'blur'
+      })
+    }, {
+      validator: ConfirmedValidator('password', 'confirmPassword')
+    });
+  }
+
+  get firstName() {
+    return this.userInfoForm.get('firstName');
+  }
+
+  get lastName() {
+    return this.userInfoForm.get('lastName');
+  }
+
+  get contactPhone() {
+    return this.userInfoForm.get('contactPhone');
+  }
+
+  get language() {
+    return this.userInfoForm.get('language');
+  }
+
+  get password() {
+    return this.passwordForm.get('password');
+  }
+
+  get confirmPassword() {
+    return this.passwordForm.get('confirmPassword');
+  }
+
+  /**
+   * Submits the eperson to the service to be created.
+   * The submission will not be made when the form is not valid.
+   */
+  submitEperson() {
+    if (!(this.userInfoForm.invalid || this.passwordForm.invalid)) {
+      const values = {
+        metadata: {
+          'eperson.firstname': [
+            {
+              value: this.firstName.value
+            }
+          ],
+          'eperson.lastname': [
+            {
+              value: this.lastName.value
+            },
+          ],
+          'eperson.phone': [
+            {
+              value: this.contactPhone.value
+            }
+          ],
+          'eperson.language': [
+            {
+              value: this.language.value
+            }
+          ]
+        },
+        email: this.email,
+        password: this.password.value,
+        canLogIn: true,
+        requireCertificate: false
+      };
+
+      const eperson = Object.assign(new EPerson(), values);
+      this.ePersonDataService.createEPersonForToken(eperson, this.token).subscribe((response) => {
+        if (response.isSuccessful) {
+          this.notificationsService.success('register-page.create-profile.submit.success.head', 'register-page.create-profile.submit.success.content');
+          this.store.dispatch(new AuthenticateAction(this.email, this.password.value));
+          this.router.navigate(['/home']);
+        } else {
+          this.notificationsService.error('register-page.create-profile.submit.error.head', 'register-page.create-profile.submit.error.content');
+        }
+      });
+
+    }
+  }
+}

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

@@ -0,0 +1,36 @@
+<div class="container">
+    <h2>{{'register-page.registration.header'|translate}}</h2>
+    <p>{{'register-page.registration.info' | translate}}</p>
+
+    <form [class]="'ng-invalid'" [formGroup]="form">
+
+        <div class="form-group">
+            <div class="row">
+                <div class="col-12">
+                    <label class="font-weight-bold"
+                           for="email">{{'register-page.registration.email' | translate}}</label>
+                    <input [className]="(email.invalid) && (email.dirty || email.touched) ? 'form-control is-invalid' :'form-control'"
+                           type="text" id="email" formControlName="email"/>
+                    <div *ngIf="email.invalid && (email.dirty || email.touched)"
+                         class="invalid-feedback show-feedback">
+                    <span *ngIf="email.errors && email.errors.required">
+                        {{ 'register-page.registration.email.error.required' | translate }}
+                    </span>
+                    <span *ngIf="email.errors && email.errors.pattern">
+                        {{ 'register-page.registration.email.error.pattern' | translate }}
+                    </span>
+                    </div>
+                </div>
+                <div class="col-12">
+                    {{'register-page.registration.email.hint' |translate}}
+                </div>
+
+            </div>
+
+        </div>
+    </form>
+    
+    <button class="btn btn-primary"
+            [disabled]="form.invalid"
+            (click)="register()">{{'register-page.registration.register'| translate}}</button>
+</div>

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

@@ -0,0 +1,92 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { of as observableOf } from 'rxjs';
+import { RouterStub } from '../../shared/testing/router-stub';
+import { NotificationsServiceStub } from '../../shared/testing/notifications-service-stub';
+import { RestResponse } from '../../core/cache/response.models';
+import { CommonModule } from '@angular/common';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
+import { Router } from '@angular/router';
+import { NotificationsService } from '../../shared/notifications/notifications.service';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { RegisterEmailComponent } from './register-email.component';
+import { EpersonRegistrationService } from '../../core/data/eperson-registration.service';
+import { By } from '@angular/platform-browser';
+
+describe('RegisterEmailComponent', () => {
+
+  let comp: RegisterEmailComponent;
+  let fixture: ComponentFixture<RegisterEmailComponent>;
+
+  let router;
+  let epersonRegistrationService: EpersonRegistrationService;
+  let notificationsService;
+
+  beforeEach(async(() => {
+
+    router = new RouterStub();
+    notificationsService = new NotificationsServiceStub();
+
+    epersonRegistrationService = jasmine.createSpyObj('epersonRegistrationService', {
+      registerEmail: observableOf(new RestResponse(true, 200, 'Success'))
+    });
+
+    TestBed.configureTestingModule({
+      imports: [CommonModule, RouterTestingModule.withRoutes([]), TranslateModule.forRoot(), ReactiveFormsModule],
+      declarations: [RegisterEmailComponent],
+      providers: [
+        {provide: Router, useValue: router},
+        {provide: EpersonRegistrationService, useValue: epersonRegistrationService},
+        {provide: FormBuilder, useValue: new FormBuilder()},
+        {provide: NotificationsService, useValue: notificationsService},
+      ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA]
+    }).compileComponents();
+  }));
+  beforeEach(() => {
+    fixture = TestBed.createComponent(RegisterEmailComponent);
+    comp = fixture.componentInstance;
+
+    fixture.detectChanges();
+  });
+  describe('init', () => {
+    it('should initialise the form', () => {
+      const elem = fixture.debugElement.queryAll(By.css('input#email'))[0].nativeElement;
+      expect(elem).toBeDefined();
+    });
+  });
+  describe('email validation', () => {
+    it('should be invalid when no email is present', () => {
+      expect(comp.form.invalid).toBeTrue();
+    });
+    it('should be invalid when no valid email is present', () => {
+      comp.form.patchValue({email: 'invalid'});
+      expect(comp.form.invalid).toBeTrue();
+    });
+    it('should be invalid when no valid email is present', () => {
+      comp.form.patchValue({email: 'valid@email.org'});
+      expect(comp.form.invalid).toBeFalse();
+    });
+  });
+  describe('register', () => {
+    it('should send a registration to the service and on success display a message and return to home', () => {
+      comp.form.patchValue({email: 'valid@email.org'});
+
+      comp.register();
+      expect(epersonRegistrationService.registerEmail).toHaveBeenCalledWith('valid@email.org');
+      expect(notificationsService.success).toHaveBeenCalled();
+      expect(router.navigate).toHaveBeenCalledWith(['/home']);
+    });
+    it('should send a registration to the service and on error display a message', () => {
+      (epersonRegistrationService.registerEmail as jasmine.Spy).and.returnValue(observableOf(new RestResponse(false, 400, 'Bad Request')));
+
+      comp.form.patchValue({email: 'valid@email.org'});
+
+      comp.register();
+      expect(epersonRegistrationService.registerEmail).toHaveBeenCalledWith('valid@email.org');
+      expect(notificationsService.error).toHaveBeenCalled();
+      expect(router.navigate).not.toHaveBeenCalled();
+    });
+  });
+});

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

@@ -0,0 +1,62 @@
+import { Component, OnInit } from '@angular/core';
+import { EpersonRegistrationService } from '../../core/data/eperson-registration.service';
+import { RestResponse } from '../../core/cache/response.models';
+import { NotificationsService } from '../../shared/notifications/notifications.service';
+import { TranslateService } from '@ngx-translate/core';
+import { Router } from '@angular/router';
+import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
+
+@Component({
+  selector: 'ds-register-email',
+  templateUrl: './register-email.component.html'
+})
+/**
+ * Component responsible the email registration step
+ */
+export class RegisterEmailComponent implements OnInit {
+
+  form: FormGroup;
+
+  constructor(
+    private epersonRegistrationService: EpersonRegistrationService,
+    private notificationService: NotificationsService,
+    private translateService: TranslateService,
+    private router: Router,
+    private formBuilder: FormBuilder
+  ) {
+
+  }
+
+  ngOnInit(): void {
+    this.form = this.formBuilder.group({
+      email: new FormControl('', {
+        validators: [Validators.required,
+          Validators.pattern('^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$')
+        ],
+      })
+    });
+
+  }
+
+  /**
+   * Register an email address
+   */
+  register() {
+    this.epersonRegistrationService.registerEmail(this.email.value).subscribe((response: RestResponse) => {
+        if (response.isSuccessful) {
+          this.notificationService.success(this.translateService.get('register-page.registration.success.head'),
+            this.translateService.get('register-page.registration.success.content', {email: this.email.value}));
+          this.router.navigate(['/home']);
+        } else {
+          this.notificationService.error(this.translateService.get('register-page.registration.error.head'),
+            this.translateService.get('register-page.registration.error.content', {email: this.email.value}));
+        }
+      }
+    );
+  }
+
+  get email() {
+    return this.form.get('email');
+  }
+
+}

src/app/register-page/register-page-routing.module.ts

@@ -0,0 +1,32 @@
+import { NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { RegisterEmailComponent } from './register-email/register-email.component';
+import { CreateProfileComponent } from './create-profile/create-profile.component';
+import { RegistrationResolver } from './registration.resolver';
+import { ItemPageResolver } from '../+item-page/item-page.resolver';
+
+@NgModule({
+  imports: [
+    RouterModule.forChild([
+      {
+        path: '',
+        component: RegisterEmailComponent,
+        data: {title: 'register-email.title'},
+      },
+      {
+        path: ':token',
+        component: CreateProfileComponent,
+        resolve: {registration: RegistrationResolver}
+      }
+    ])
+  ],
+  providers: [
+    RegistrationResolver,
+    ItemPageResolver
+  ]
+})
+/**
+ * This module defines the default component to load when navigating to the mydspace page path.
+ */
+export class RegisterPageRoutingModule {
+}

src/app/register-page/register-page.module.ts

@@ -0,0 +1,24 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { SharedModule } from '../shared/shared.module';
+import { RegisterPageRoutingModule } from './register-page-routing.module';
+import { RegisterEmailComponent } from './register-email/register-email.component';
+import { CreateProfileComponent } from './create-profile/create-profile.component';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    SharedModule,
+    RegisterPageRoutingModule,
+  ],
+  declarations: [
+    RegisterEmailComponent,
+    CreateProfileComponent
+  ],
+  providers: [],
+  entryComponents: []
+})
+
+export class RegisterPageModule {
+
+}

src/app/register-page/registration.resolver.spec.ts

@@ -0,0 +1,32 @@
+import { RegistrationResolver } from './registration.resolver';
+import { EpersonRegistrationService } from '../core/data/eperson-registration.service';
+import { of as observableOf } from 'rxjs';
+import { Registration } from '../core/shared/registration.model';
+import { first } from 'rxjs/operators';
+
+describe('RegistrationResolver', () => {
+  let resolver: RegistrationResolver;
+  let epersonRegistrationService: EpersonRegistrationService;
+
+  const token = 'test-token';
+  const registration = Object.assign(new Registration(), {email: 'test@email.org', token: token});
+
+  beforeEach(() => {
+    epersonRegistrationService = jasmine.createSpyObj('epersonRegistrationService', {
+      searchByToken: observableOf(registration)
+    });
+    resolver = new RegistrationResolver(epersonRegistrationService);
+  });
+  describe('resolve', () => {
+    it('should resolve a registration based on the token', () => {
+      resolver.resolve({params: {token: token}} as any, undefined)
+        .pipe(first())
+        .subscribe(
+          (resolved) => {
+            expect(resolved.token).toEqual(token);
+            expect(resolved.email).toEqual('test@email.org');
+          }
+        );
+    });
+  });
+});

src/app/register-page/registration.resolver.ts

@@ -0,0 +1,20 @@
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, Resolve, RouterStateSnapshot } from '@angular/router';
+import { EpersonRegistrationService } from '../core/data/eperson-registration.service';
+import { Registration } from '../core/shared/registration.model';
+import { Observable } from 'rxjs';
+
+@Injectable()
+/**
+ * Resolver to resolve a Registration object based on the provided token
+ */
+export class RegistrationResolver implements Resolve<Registration> {
+
+  constructor(private epersonRegistrationService: EpersonRegistrationService) {
+  }
+
+  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Registration> {
+    const token = route.params.token;
+    return this.epersonRegistrationService.searchByToken(token);
+  }
+}

src/assets/i18n/en.json5

@@ -2038,6 +2038,69 @@
 
 
 
+  "register-page.create-profile.header": "Create Profile",
+
+  "register-page.create-profile.identification.header": "Identify",
+
+  "register-page.create-profile.identification.email": "Email Address",
+
+  "register-page.create-profile.identification.first-name": "First Name *",
+
+  "register-page.create-profile.identification.first-name.error": "Please fill in a First Name",
+
+  "register-page.create-profile.identification.last-name": "Last Name *",
+
+  "register-page.create-profile.identification.last-name.error": "Please fill in a Last Name",
+
+  "register-page.create-profile.identification.contact": "Contact Telephone",
+
+  "register-page.create-profile.identification.language": "Language",
+
+  "register-page.create-profile.security.header": "Security",
+
+  "register-page.create-profile.security.info": "Please enter a password in the box below, and confirm it by typing it again into the second box. It should be at least six characters long.",
+
+  "register-page.create-profile.security.password": "Password *",
+
+  "register-page.create-profile.security.confirm-password": "Retype to confirm *",
+
+  "register-page.create-profile.security.password.error": "Please enter a password in the box below, and confirm it by typing it again into the second box. It should be at least six characters long.",
+
+  "register-page.create-profile.submit": "Complete Registration",
+
+  "register-page.create-profile.submit.error.content": "Registration failed",
+
+  "register-page.create-profile.submit.error.head": "Something went wrong while registering a new user.",
+
+  "register-page.create-profile.submit.success.content": "Registration completed",
+
+  "register-page.create-profile.submit.success.head": "The registration was successful. You have been logged in as the created user.",
+
+
+  "register-page.registration.header": "New user registration",
+
+  "register-page.registration.info": "Register an account to subscribe to collections for email updates, and submit new items to DSpace.",
+
+  "register-page.registration.email": "Email Address *",
+
+  "register-page.registration.email.error.required": "Please fill in an email address",
+
+  "register-page.registration.email.error.pattern": "Please fill in a valid email address",
+
+  "register-page.registration.email.hint": "This address will be verified and used as your login name.",
+
+  "register-page.registration.register": "Register",
+
+  "register-page.registration.success.head": "Verification email sent",
+
+  "register-page.registration.success.content": "An email has been sent to {{ email }} containing a special URL and further instructions.",
+
+  "register-page.registration.error.head": "Error when trying to register email",
+
+  "register-page.registration.error.content": "An error occured when registering the following email address: {{ email }}",
+
+
+
   "relationships.isAuthorOf": "Authors",
 
   "relationships.isIssueOf": "Journal Issues",