From 0e7e6a4832f0f8d9c6521eeef7fad712e7ee69f6 Mon Sep 17 00:00:00 2001
From: Art Lowel <art.lowel@atmire.com>
Date: Wed, 6 Mar 2019 18:36:57 +0100
Subject: [PATCH 01/24] replace pathSelector by ngrx memoized selectors

---
 src/app/core/cache/object-cache.service.ts    |  43 ++++---
 .../core/cache/server-sync-buffer.effects.ts  |   3 +-
 src/app/core/core.reducers.ts                 |   6 +-
 src/app/core/core.selectors.ts                |   4 +
 .../object-updates/object-updates.service.ts  |   3 +-
 src/app/core/data/request.service.spec.ts     |   2 +-
 src/app/core/data/request.service.ts          | 121 +++++++++---------
 src/app/core/index/index.reducer.spec.ts      |   4 +-
 src/app/core/index/index.reducer.ts           |  25 ++--
 src/app/core/index/index.selectors.ts         |  45 +++++++
 src/app/core/shared/selectors.ts              |  17 ---
 11 files changed, 154 insertions(+), 119 deletions(-)
 create mode 100644 src/app/core/core.selectors.ts
 create mode 100644 src/app/core/index/index.selectors.ts
 delete mode 100644 src/app/core/shared/selectors.ts

diff --git a/src/app/core/cache/object-cache.service.ts b/src/app/core/cache/object-cache.service.ts
index d4d52b404f..9be895c41a 100644
--- a/src/app/core/cache/object-cache.service.ts
+++ b/src/app/core/cache/object-cache.service.ts
@@ -1,36 +1,39 @@
+import { Injectable } from '@angular/core';
+import { createSelector, MemoizedSelector, select, Store } from '@ngrx/store';
+import { applyPatch, Operation } from 'fast-json-patch';
 import { combineLatest as observableCombineLatest, Observable } from 'rxjs';
 
 import { distinctUntilChanged, filter, map, mergeMap, take, } from 'rxjs/operators';
-import { Injectable } from '@angular/core';
-import { MemoizedSelector, select, Store } from '@ngrx/store';
-import { IndexName } from '../index/index.reducer';
-
-import { CacheableObject, ObjectCacheEntry } from './object-cache.reducer';
+import { hasNoValue, hasValue, isNotEmpty } from '../../shared/empty.util';
+import { CoreState } from '../core.reducers';
+import { coreSelector } from '../core.selectors';
+import { RestRequestMethod } from '../data/rest-request-method';
+import { selfLinkFromUuidSelector } from '../index/index.selectors';
+import { GenericConstructor } from '../shared/generic-constructor';
+import { NormalizedObjectFactory } from './models/normalized-object-factory';
+import { NormalizedObject } from './models/normalized-object.model';
 import {
   AddPatchObjectCacheAction,
   AddToObjectCacheAction,
   ApplyPatchObjectCacheAction,
   RemoveFromObjectCacheAction
 } from './object-cache.actions';
-import { hasNoValue, isNotEmpty } from '../../shared/empty.util';
-import { GenericConstructor } from '../shared/generic-constructor';
-import { coreSelector, CoreState } from '../core.reducers';
-import { pathSelector } from '../shared/selectors';
-import { NormalizedObjectFactory } from './models/normalized-object-factory';
-import { NormalizedObject } from './models/normalized-object.model';
-import { applyPatch, Operation } from 'fast-json-patch';
+
+import { CacheableObject, ObjectCacheEntry, ObjectCacheState } from './object-cache.reducer';
 import { AddToSSBAction } from './server-sync-buffer.actions';
-import { RestRequestMethod } from '../data/rest-request-method';
 
-function selfLinkFromUuidSelector(uuid: string): MemoizedSelector<CoreState, string> {
-  return pathSelector<CoreState, string>(coreSelector, 'index', IndexName.OBJECT, uuid);
-}
+const objectCacheSelector = createSelector(
+  coreSelector,
+  (state: CoreState) => state['cache/object']
+);
 
-function entryFromSelfLinkSelector(selfLink: string): MemoizedSelector<CoreState, ObjectCacheEntry> {
-  return pathSelector<CoreState, ObjectCacheEntry>(coreSelector, 'cache/object', selfLink);
-}
+const entryFromSelfLinkSelector =
+  (selfLink: string): MemoizedSelector<CoreState, ObjectCacheEntry> => createSelector(
+    objectCacheSelector,
+    (state: ObjectCacheState) => state[selfLink],
+  );
 
-/**
+  /**
  * A service to interact with the object cache
  */
 @Injectable()
diff --git a/src/app/core/cache/server-sync-buffer.effects.ts b/src/app/core/cache/server-sync-buffer.effects.ts
index 0d7392e555..036b18d280 100644
--- a/src/app/core/cache/server-sync-buffer.effects.ts
+++ b/src/app/core/cache/server-sync-buffer.effects.ts
@@ -1,6 +1,7 @@
 import { delay, exhaustMap, map, switchMap, take } from 'rxjs/operators';
 import { Inject, Injectable } from '@angular/core';
 import { Actions, Effect, ofType } from '@ngrx/effects';
+import { coreSelector } from '../core.selectors';
 import {
   AddToSSBAction,
   CommitSSBAction,
@@ -9,7 +10,7 @@ import {
 } from './server-sync-buffer.actions';
 import { GLOBAL_CONFIG } from '../../../config';
 import { GlobalConfig } from '../../../config/global-config.interface';
-import { coreSelector, CoreState } from '../core.reducers';
+import { CoreState } from '../core.reducers';
 import { Action, createSelector, MemoizedSelector, select, Store } from '@ngrx/store';
 import { ServerSyncBufferEntry, ServerSyncBufferState } from './server-sync-buffer.reducer';
 import { combineLatest as observableCombineLatest, of as observableOf } from 'rxjs';
diff --git a/src/app/core/core.reducers.ts b/src/app/core/core.reducers.ts
index e0ddb4a9de..abfc3b69cc 100644
--- a/src/app/core/core.reducers.ts
+++ b/src/app/core/core.reducers.ts
@@ -4,7 +4,7 @@ import {
 } from '@ngrx/store';
 
 import { objectCacheReducer, ObjectCacheState } from './cache/object-cache.reducer';
-import { indexReducer, IndexState } from './index/index.reducer';
+import { indexReducer, MetaIndexState } from './index/index.reducer';
 import { requestReducer, RequestState } from './data/request.reducer';
 import { authReducer, AuthState } from './auth/auth.reducer';
 import { serverSyncBufferReducer, ServerSyncBufferState } from './cache/server-sync-buffer.reducer';
@@ -18,7 +18,7 @@ export interface CoreState {
   'cache/syncbuffer': ServerSyncBufferState,
   'cache/object-updates': ObjectUpdatesState
   'data/request': RequestState,
-  'index': IndexState,
+  'index': MetaIndexState,
   'auth': AuthState,
 }
 
@@ -30,5 +30,3 @@ export const coreReducers: ActionReducerMap<CoreState> = {
   'index': indexReducer,
   'auth': authReducer,
 };
-
-export const coreSelector = createFeatureSelector<CoreState>('core');
diff --git a/src/app/core/core.selectors.ts b/src/app/core/core.selectors.ts
new file mode 100644
index 0000000000..2ad701eba1
--- /dev/null
+++ b/src/app/core/core.selectors.ts
@@ -0,0 +1,4 @@
+import { createFeatureSelector } from '@ngrx/store';
+import { CoreState } from './core.reducers';
+
+export const coreSelector = createFeatureSelector<CoreState>('core');
diff --git a/src/app/core/data/object-updates/object-updates.service.ts b/src/app/core/data/object-updates/object-updates.service.ts
index 85e17b5b2f..a13fb9487b 100644
--- a/src/app/core/data/object-updates/object-updates.service.ts
+++ b/src/app/core/data/object-updates/object-updates.service.ts
@@ -1,6 +1,7 @@
 import { Injectable } from '@angular/core';
 import { createSelector, MemoizedSelector, select, Store } from '@ngrx/store';
-import { coreSelector, CoreState } from '../../core.reducers';
+import { CoreState } from '../../core.reducers';
+import { coreSelector } from '../../core.selectors';
 import {
   FieldState,
   FieldUpdates,
diff --git a/src/app/core/data/request.service.spec.ts b/src/app/core/data/request.service.spec.ts
index b28436f3a8..642d83544b 100644
--- a/src/app/core/data/request.service.spec.ts
+++ b/src/app/core/data/request.service.spec.ts
@@ -22,7 +22,7 @@ import { ActionsSubject, Store } from '@ngrx/store';
 import { TestScheduler } from 'rxjs/testing';
 import { BehaviorSubject } from 'rxjs/internal/BehaviorSubject';
 import { MockStore } from '../../shared/testing/mock-store';
-import { IndexState } from '../index/index.reducer';
+import { MetaIndexState } from '../index/index.reducer';
 
 describe('RequestService', () => {
   let scheduler: TestScheduler;
diff --git a/src/app/core/data/request.service.ts b/src/app/core/data/request.service.ts
index 93a7a10506..745a8ea000 100644
--- a/src/app/core/data/request.service.ts
+++ b/src/app/core/data/request.service.ts
@@ -1,38 +1,79 @@
 import { merge as observableMerge, Observable, of as observableOf } from 'rxjs';
 import {
-  distinctUntilChanged,
   filter,
-  find,
-  first,
   map,
   mergeMap,
-  reduce,
-  startWith,
   switchMap,
   take,
-  tap
 } from 'rxjs/operators';
 import { race as observableRace } from 'rxjs';
 import { Injectable } from '@angular/core';
 
 import { createSelector, MemoizedSelector, select, Store } from '@ngrx/store';
-import { hasNoValue, hasValue, isNotEmpty, isNotUndefined } from '../../shared/empty.util';
+import { AppState } from '../../app.reducer';
+import { hasNoValue, hasValue, isNotEmpty } from '../../shared/empty.util';
 import { CacheableObject } from '../cache/object-cache.reducer';
 import { ObjectCacheService } from '../cache/object-cache.service';
 import { DSOSuccessResponse, RestResponse } from '../cache/response.models';
-import { coreSelector, CoreState } from '../core.reducers';
-import { IndexName, IndexState } from '../index/index.reducer';
-import { pathSelector } from '../shared/selectors';
+import { CoreState } from '../core.reducers';
+import { coreSelector } from '../core.selectors';
+import {
+  IndexName, IndexState,
+  MetaIndexState
+} from '../index/index.reducer';
+import {
+  originalRequestUUIDFromRequestUUIDSelector, requestIndexSelector,
+  uuidFromHrefSelector
+} from '../index/index.selectors';
 import { UUIDService } from '../shared/uuid.service';
 import { RequestConfigureAction, RequestExecuteAction, RequestRemoveAction } from './request.actions';
 import { GetRequest, RestRequest } from './request.models';
 
-import { RequestEntry } from './request.reducer';
+import { RequestEntry, RequestState } from './request.reducer';
 import { CommitSSBAction } from '../cache/server-sync-buffer.actions';
 import { RestRequestMethod } from './rest-request-method';
 import { getResponseFromEntry } from '../shared/operators';
 import { AddToIndexAction, RemoveFromIndexBySubstringAction } from '../index/index.actions';
 
+const requestCacheSelector = createSelector(
+  coreSelector,
+  (state: CoreState) => state['data/request']
+);
+
+const entryFromUUIDSelector = (uuid: string): MemoizedSelector<CoreState, RequestEntry> => createSelector(
+  requestCacheSelector,
+  (state: RequestState) => {
+    return hasValue(state) ? state[uuid] : undefined;
+  }
+);
+
+/**
+ * Create a selector that fetches a list of request UUIDs from a given index substate of which the request href
+ * contains a given substring
+ * @param selector    MemoizedSelector to start from
+ * @param name        The name of the index substate we're fetching request UUIDs from
+ * @param href        Substring that the request's href should contain
+ */
+const uuidsFromHrefSubstringSelector =
+  (selector: MemoizedSelector<AppState, IndexState>, href: string): MemoizedSelector<AppState, string[]> => createSelector(
+    selector,
+    (state: IndexState) => getUuidsFromHrefSubstring(state, href)
+  );
+
+/**
+ * Fetch a list of request UUIDs from a given index substate of which the request href contains a given substring
+ * @param state   The IndexState
+ * @param href    Substring that the request's href should contain
+ */
+const getUuidsFromHrefSubstring = (state: IndexState, href: string): string[] => {
+  let result = [];
+  if (isNotEmpty(state)) {
+    result = Object.values(state)
+      .filter((value: string) => value.startsWith(href));
+  }
+  return result;
+};
+
 @Injectable()
 export class RequestService {
   private requestsOnTheirWayToTheStore: string[] = [];
@@ -40,51 +81,7 @@ export class RequestService {
   constructor(private objectCache: ObjectCacheService,
               private uuidService: UUIDService,
               private store: Store<CoreState>,
-              private indexStore: Store<IndexState>) {
-  }
-
-  private entryFromUUIDSelector(uuid: string): MemoizedSelector<CoreState, RequestEntry> {
-    return pathSelector<CoreState, RequestEntry>(coreSelector, 'data/request', uuid);
-  }
-
-  private uuidFromHrefSelector(href: string): MemoizedSelector<CoreState, string> {
-    return pathSelector<CoreState, string>(coreSelector, 'index', IndexName.REQUEST, href);
-  }
-
-  private originalUUIDFromUUIDSelector(uuid: string): MemoizedSelector<CoreState, string> {
-    return pathSelector<CoreState, string>(coreSelector, 'index', IndexName.UUID_MAPPING, uuid);
-  }
-
-  /**
-   * Create a selector that fetches a list of request UUIDs from a given index substate of which the request href
-   * contains a given substring
-   * @param selector    MemoizedSelector to start from
-   * @param name        The name of the index substate we're fetching request UUIDs from
-   * @param href        Substring that the request's href should contain
-   */
-  private uuidsFromHrefSubstringSelector(selector: MemoizedSelector<any, IndexState>, name: string, href: string): MemoizedSelector<any, string[]> {
-    return createSelector(selector, (state: IndexState) => this.getUuidsFromHrefSubstring(state, name, href));
-  }
-
-  /**
-   * Fetch a list of request UUIDs from a given index substate of which the request href contains a given substring
-   * @param state   The IndexState
-   * @param name    The name of the index substate we're fetching request UUIDs from
-   * @param href    Substring that the request's href should contain
-   */
-  private getUuidsFromHrefSubstring(state: IndexState, name: string, href: string): string[] {
-    let result = [];
-    if (isNotEmpty(state)) {
-      const subState = state[name];
-      if (isNotEmpty(subState)) {
-        for (const value in subState) {
-          if (value.indexOf(href) > -1) {
-            result = [...result, subState[value]];
-          }
-        }
-      }
-    }
-    return result;
+              private indexStore: Store<MetaIndexState>) {
   }
 
   generateRequestId(): string {
@@ -110,11 +107,11 @@ export class RequestService {
 
   getByUUID(uuid: string): Observable<RequestEntry> {
     return observableRace(
-      this.store.pipe(select(this.entryFromUUIDSelector(uuid))),
+      this.store.pipe(select(entryFromUUIDSelector(uuid))),
       this.store.pipe(
-        select(this.originalUUIDFromUUIDSelector(uuid)),
+        select(originalRequestUUIDFromRequestUUIDSelector(uuid)),
         mergeMap((originalUUID) => {
-            return this.store.pipe(select(this.entryFromUUIDSelector(originalUUID)))
+            return this.store.pipe(select(entryFromUUIDSelector(originalUUID)))
           },
         ))
     );
@@ -122,7 +119,7 @@ export class RequestService {
 
   getByHref(href: string): Observable<RequestEntry> {
     return this.store.pipe(
-      select(this.uuidFromHrefSelector(href)),
+      select(uuidFromHrefSelector(href)),
       mergeMap((uuid: string) => this.getByUUID(uuid))
     );
   }
@@ -159,7 +156,7 @@ export class RequestService {
    */
   removeByHrefSubstring(href: string) {
     this.store.pipe(
-      select(this.uuidsFromHrefSubstringSelector(pathSelector<CoreState, IndexState>(coreSelector, 'index'), IndexName.REQUEST, href)),
+      select(uuidsFromHrefSubstringSelector(requestIndexSelector, href)),
       take(1)
     ).subscribe((uuids: string[]) => {
       for (const uuid of uuids) {
@@ -230,7 +227,7 @@ export class RequestService {
    */
   private trackRequestsOnTheirWayToTheStore(request: GetRequest) {
     this.requestsOnTheirWayToTheStore = [...this.requestsOnTheirWayToTheStore, request.href];
-    this.store.pipe(select(this.entryFromUUIDSelector(request.href)),
+    this.store.pipe(select(entryFromUUIDSelector(request.href)),
       filter((re: RequestEntry) => hasValue(re)),
       take(1)
     ).subscribe((re: RequestEntry) => {
diff --git a/src/app/core/index/index.reducer.spec.ts b/src/app/core/index/index.reducer.spec.ts
index d1403ac5bf..ef46c760c6 100644
--- a/src/app/core/index/index.reducer.spec.ts
+++ b/src/app/core/index/index.reducer.spec.ts
@@ -1,6 +1,6 @@
 import * as deepFreeze from 'deep-freeze';
 
-import { IndexName, indexReducer, IndexState } from './index.reducer';
+import { IndexName, indexReducer, MetaIndexState } from './index.reducer';
 import { AddToIndexAction, RemoveFromIndexBySubstringAction, RemoveFromIndexByValueAction } from './index.actions';
 
 class NullAction extends AddToIndexAction {
@@ -17,7 +17,7 @@ describe('requestReducer', () => {
   const key2 = '1911e8a4-6939-490c-b58b-a5d70f8d91fb';
   const val1 = 'https://dspace7.4science.it/dspace-spring-rest/api/core/items/567a639f-f5ff-4126-807c-b7d0910808c8';
   const val2 = 'https://dspace7.4science.it/dspace-spring-rest/api/core/items/1911e8a4-6939-490c-b58b-a5d70f8d91fb';
-  const testState: IndexState = {
+  const testState: MetaIndexState = {
     [IndexName.OBJECT]: {
       [key1]: val1
     },[IndexName.REQUEST]: {
diff --git a/src/app/core/index/index.reducer.ts b/src/app/core/index/index.reducer.ts
index 3597c786d8..d95748ef8a 100644
--- a/src/app/core/index/index.reducer.ts
+++ b/src/app/core/index/index.reducer.ts
@@ -1,8 +1,9 @@
 import {
+  AddToIndexAction,
   IndexAction,
   IndexActionTypes,
-  AddToIndexAction,
-  RemoveFromIndexByValueAction, RemoveFromIndexBySubstringAction
+  RemoveFromIndexBySubstringAction,
+  RemoveFromIndexByValueAction
 } from './index.actions';
 
 export enum IndexName {
@@ -11,16 +12,18 @@ export enum IndexName {
   UUID_MAPPING = 'get-request/configured-to-cache-uuid'
 }
 
-export type IndexState = {
-  [name in IndexName]: {
-    [key: string]: string
-  }
+export interface IndexState {
+  [key: string]: string
+}
+
+export type MetaIndexState = {
+  [name in IndexName]: IndexState
 }
 
 // Object.create(null) ensures the object has no default js properties (e.g. `__proto__`)
-const initialState: IndexState = Object.create(null);
+const initialState: MetaIndexState = Object.create(null);
 
-export function indexReducer(state = initialState, action: IndexAction): IndexState {
+export function indexReducer(state = initialState, action: IndexAction): MetaIndexState {
   switch (action.type) {
 
     case IndexActionTypes.ADD: {
@@ -41,7 +44,7 @@ export function indexReducer(state = initialState, action: IndexAction): IndexSt
   }
 }
 
-function addToIndex(state: IndexState, action: AddToIndexAction): IndexState {
+function addToIndex(state: MetaIndexState, action: AddToIndexAction): MetaIndexState {
   const subState = state[action.payload.name];
   const newSubState = Object.assign({}, subState, {
     [action.payload.key]: action.payload.value
@@ -52,7 +55,7 @@ function addToIndex(state: IndexState, action: AddToIndexAction): IndexState {
   return obs;
 }
 
-function removeFromIndexByValue(state: IndexState, action: RemoveFromIndexByValueAction): IndexState {
+function removeFromIndexByValue(state: MetaIndexState, action: RemoveFromIndexByValueAction): MetaIndexState {
   const subState = state[action.payload.name];
   const newSubState = Object.create(null);
   for (const value in subState) {
@@ -70,7 +73,7 @@ function removeFromIndexByValue(state: IndexState, action: RemoveFromIndexByValu
  * @param state     The IndexState to remove values from
  * @param action    The RemoveFromIndexByValueAction containing the necessary information to remove the values
  */
-function removeFromIndexBySubstring(state: IndexState, action: RemoveFromIndexByValueAction): IndexState {
+function removeFromIndexBySubstring(state: MetaIndexState, action: RemoveFromIndexByValueAction): MetaIndexState {
   const subState = state[action.payload.name];
   const newSubState = Object.create(null);
   for (const value in subState) {
diff --git a/src/app/core/index/index.selectors.ts b/src/app/core/index/index.selectors.ts
new file mode 100644
index 0000000000..51821120ca
--- /dev/null
+++ b/src/app/core/index/index.selectors.ts
@@ -0,0 +1,45 @@
+import { createSelector, MemoizedSelector } from '@ngrx/store';
+import { AppState } from '../../app.reducer';
+import { hasValue } from '../../shared/empty.util';
+import { CoreState } from '../core.reducers';
+import { coreSelector } from '../core.selectors';
+import { IndexName, IndexState, MetaIndexState } from './index.reducer';
+
+export const metaIndexSelector: MemoizedSelector<AppState, MetaIndexState> = createSelector(
+  coreSelector,
+  (state: CoreState) => state.index
+);
+export const objectIndexSelector: MemoizedSelector<AppState, IndexState> = createSelector(
+  metaIndexSelector,
+  (state: MetaIndexState) => state[IndexName.OBJECT]
+);
+export const requestIndexSelector: MemoizedSelector<AppState, IndexState> = createSelector(
+  metaIndexSelector,
+  (state: MetaIndexState) => state[IndexName.REQUEST]
+);
+export const requestUUIDIndexSelector: MemoizedSelector<AppState, IndexState> = createSelector(
+  metaIndexSelector,
+  (state: MetaIndexState) => state[IndexName.UUID_MAPPING]
+);
+export const selfLinkFromUuidSelector =
+  (uuid: string): MemoizedSelector<AppState, string> => createSelector(
+    objectIndexSelector,
+    (state: IndexState) => hasValue(state) ? state[uuid] : undefined
+  );
+export const uuidFromHrefSelector =
+  (href: string): MemoizedSelector<AppState, string> => createSelector(
+    requestIndexSelector,
+    (state: IndexState) => hasValue(state) ? state[href] : undefined
+  );
+/**
+ * If a request wasn't sent to the server because the result was already cached,
+ * this selector allows you to find the UUID of the cached request based on the
+ * UUID of the new request
+ *
+ * @param uuid    The uuid of the new request
+ */
+export const originalRequestUUIDFromRequestUUIDSelector =
+  (uuid: string): MemoizedSelector<AppState, string> => createSelector(
+    requestUUIDIndexSelector,
+    (state: IndexState) => hasValue(state) ? state[uuid] : undefined
+  );
diff --git a/src/app/core/shared/selectors.ts b/src/app/core/shared/selectors.ts
deleted file mode 100644
index 7bd35d39c1..0000000000
--- a/src/app/core/shared/selectors.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { createSelector, MemoizedSelector } from '@ngrx/store';
-import { hasNoValue, isEmpty } from '../../shared/empty.util';
-
-export function pathSelector<From, To>(selector: MemoizedSelector<any, From>, ...path: string[]): MemoizedSelector<any, To> {
-  return createSelector(selector, (state: any) => getSubState(state, path));
-}
-
-function getSubState(state: any, path: string[]) {
-  const current = path[0];
-  const remainingPath = path.slice(1);
-  const subState = state[current];
-  if (hasNoValue(subState) || isEmpty(remainingPath)) {
-    return subState;
-  } else {
-    return getSubState(subState, remainingPath);
-  }
-}

From bc305e2aa6aec5b822007484431cce9313ca2f1d Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Wed, 20 Feb 2019 16:21:03 +0100
Subject: [PATCH 02/24] 60113: context sensitive popup started from submission
 branch

---
 .../admin-sidebar/admin-sidebar.component.ts  |  17 ++-
 src/app/+admin/admin.module.ts                |   4 +-
 .../builders/remote-data-build.service.ts     |  21 ++-
 ...tion-selector-modal-wrapper.component.html |   6 +
 ...ection-selector-modal-wrapper.component.ts |  10 ++
 .../collection-selector.component.html        |  26 ++++
 .../collection-selector.component.ts          | 125 ++++++++++++++++++
 src/app/shared/menu/initial-menus-state.ts    |   2 +-
 .../menu/menu-item/models/onclick.model.ts    |  11 ++
 .../onclick-menu-item.component.html          |   1 +
 .../menu-item/onclick-menu-item.component.ts  |  20 +++
 src/app/shared/menu/menu.module.ts            |   7 +-
 src/app/shared/shared.module.ts               |   8 +-
 13 files changed, 246 insertions(+), 12 deletions(-)
 create mode 100644 src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html
 create mode 100644 src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts
 create mode 100644 src/app/shared/dso-selector/collection-selector/collection-selector.component.html
 create mode 100644 src/app/shared/dso-selector/collection-selector/collection-selector.component.ts
 create mode 100644 src/app/shared/menu/menu-item/models/onclick.model.ts
 create mode 100644 src/app/shared/menu/menu-item/onclick-menu-item.component.html
 create mode 100644 src/app/shared/menu/menu-item/onclick-menu-item.component.ts

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index eb48f64d4d..f3d417b93d 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -1,6 +1,6 @@
 import { Component, Injector, OnInit } from '@angular/core';
 import { Observable } from 'rxjs/internal/Observable';
-import { slide, slideHorizontal, slideSidebar } from '../../shared/animations/slide';
+import { slideHorizontal, slideSidebar } from '../../shared/animations/slide';
 import { CSSVariableService } from '../../shared/sass-helper/sass-helper.service';
 import { MenuService } from '../../shared/menu/menu.service';
 import { MenuID, MenuItemType } from '../../shared/menu/initial-menus-state';
@@ -10,6 +10,9 @@ import { LinkMenuItemModel } from '../../shared/menu/menu-item/models/link.model
 import { AuthService } from '../../core/auth/auth.service';
 import { first, map } from 'rxjs/operators';
 import { combineLatest as combineLatestObservable } from 'rxjs';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { OnClickMenuItemModel } from '../../shared/menu/menu-item/models/onclick.model';
+import { CollectionSelectorModalWrapperComponent } from '../../shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component';
 
 /**
  * Component representing the admin sidebar
@@ -52,7 +55,8 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
   constructor(protected menuService: MenuService,
               protected injector: Injector,
               private variableService: CSSVariableService,
-              private authService: AuthService
+              private authService: AuthService,
+              private modalService: NgbModal
   ) {
     super(menuService, injector);
   }
@@ -104,10 +108,13 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
         active: false,
         visible: true,
         model: {
-          type: MenuItemType.LINK,
+          type: MenuItemType.ONCLICK,
           text: 'menu.section.new_community',
-          link: '/communities/submission'
-        } as LinkMenuItemModel,
+          function: () => {
+            const modal = this.modalService.open(CollectionSelectorModalWrapperComponent);
+            modal.componentInstance.currentCollectionID = 'c069b0c2-dc6a-40de-92c3-6803cd66023e';
+          }
+        } as OnClickMenuItemModel,
       },
       {
         id: 'new_collection',
diff --git a/src/app/+admin/admin.module.ts b/src/app/+admin/admin.module.ts
index 41d00223ab..1495d0fd8c 100644
--- a/src/app/+admin/admin.module.ts
+++ b/src/app/+admin/admin.module.ts
@@ -1,12 +1,14 @@
 import { NgModule } from '@angular/core';
 import { AdminRegistriesModule } from './admin-registries/admin-registries.module';
 import { AdminRoutingModule } from './admin-routing.module';
+import { SharedModule } from '../shared/shared.module';
 
 @NgModule({
   imports: [
     AdminRegistriesModule,
     AdminRoutingModule,
-  ]
+    SharedModule,
+  ],
 })
 export class AdminModule {
 
diff --git a/src/app/core/cache/builders/remote-data-build.service.ts b/src/app/core/cache/builders/remote-data-build.service.ts
index 7cfbcdd252..697d98fc68 100644
--- a/src/app/core/cache/builders/remote-data-build.service.ts
+++ b/src/app/core/cache/builders/remote-data-build.service.ts
@@ -5,8 +5,14 @@ import {
   race as observableRace
 } from 'rxjs';
 import { Injectable } from '@angular/core';
-import { distinctUntilChanged, flatMap, map, startWith, switchMap } from 'rxjs/operators';
-import { hasValue, hasValueOperator, isEmpty, isNotEmpty } from '../../../shared/empty.util';
+import { distinctUntilChanged, flatMap, map, startWith, switchMap, tap } from 'rxjs/operators';
+import {
+  hasValue,
+  hasValueOperator,
+  isEmpty,
+  isNotEmpty,
+  isNotUndefined
+} from '../../../shared/empty.util';
 import { PaginatedList } from '../../data/paginated-list';
 import { RemoteData } from '../../data/remote-data';
 import { RemoteDataError } from '../../data/remote-data-error';
@@ -113,8 +119,19 @@ export class RemoteDataBuildService {
     }
 
     const requestEntry$ = href$.pipe(getRequestFromRequestHref(this.requestService));
+    requestEntry$.subscribe((t) => {
+      console.log('requestEntry$', t)
+    });
     const tDomainList$ = requestEntry$.pipe(
       getResourceLinksFromResponse(),
+      tap((resourceUUIDs: string[]) => {
+        const g = (href$ as Observable<string>)
+
+        g.subscribe((t) => {
+          console.log('href', t)
+        });
+        console.log(resourceUUIDs);
+      }),
       flatMap((resourceUUIDs: string[]) => {
         return this.objectCache.getList(resourceUUIDs).pipe(
           map((normList: Array<NormalizedObject<T>>) => {
diff --git a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html
new file mode 100644
index 0000000000..7fadd477f4
--- /dev/null
+++ b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html
@@ -0,0 +1,6 @@
+<div>
+    <div class="modal-header">New item</div>
+    <div class="modal-body">
+        <ds-collection-selector [currentCollectionId]="currentCollectionID"></ds-collection-selector>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts
new file mode 100644
index 0000000000..c60d6f2938
--- /dev/null
+++ b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts
@@ -0,0 +1,10 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'ds-collection-selector-modal-wrapper',
+  // styleUrls: ['./collection-selector.component.scss'],
+  templateUrl: './collection-selector-modal-wrapper.component.html',
+})
+export class CollectionSelectorModalWrapperComponent {
+    @Input() currentCollectionID: string;
+}
diff --git a/src/app/shared/dso-selector/collection-selector/collection-selector.component.html b/src/app/shared/dso-selector/collection-selector/collection-selector.component.html
new file mode 100644
index 0000000000..e137f5e119
--- /dev/null
+++ b/src/app/shared/dso-selector/collection-selector/collection-selector.component.html
@@ -0,0 +1,26 @@
+<div class="form-group w-100 pr-2 pl-2">
+    <input *ngIf="searchField"
+           type="search"
+           class="form-control w-100"
+           (click)="$event.stopPropagation();"
+           placeholder="{{ 'submission.sections.general.search-collection' | translate }}"
+           [formControl]="searchField">
+</div>
+<div class="dropdown-divider"></div>
+<div class="scrollable-menu" aria-labelledby="dropdownMenuButton">
+    <button class="dropdown-item disabled" *ngIf="(searchListCollection$ | async)?.length == 0">
+        {{'submission.sections.general.no-collection' | translate}}
+    </button>
+    <button *ngFor="let listItem of (searchListCollection$ | async)"
+            class="dropdown-item collection-item"
+            title="{{ listItem.collection.name }}"
+            (click)="onSelect(listItem)">
+        <ul class="list-unstyled mb-0">
+            <li class="list-item text-truncate text-secondary"
+                *ngFor="let item of listItem.communities">
+                {{ item.name}} <i class="fa fa-level-down" aria-hidden="true"></i>
+            </li>
+            <li class="list-item text-truncate text-primary font-weight-bold">{{ listItem.collection.name}}</li>
+        </ul>
+    </button>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/collection-selector/collection-selector.component.ts b/src/app/shared/dso-selector/collection-selector/collection-selector.component.ts
new file mode 100644
index 0000000000..6b9625c8a6
--- /dev/null
+++ b/src/app/shared/dso-selector/collection-selector/collection-selector.component.ts
@@ -0,0 +1,125 @@
+import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
+import { FormControl } from '@angular/forms';
+
+import { BehaviorSubject, combineLatest, Observable, Subscription } from 'rxjs';
+import {
+  debounceTime,
+  distinctUntilChanged,
+  filter,
+  find,
+  flatMap,
+  map,
+  mergeMap,
+  reduce,
+  startWith
+} from 'rxjs/operators';
+
+import { Collection } from '../../../core/shared/collection.model';
+import { CommunityDataService } from '../../../core/data/community-data.service';
+import { Community } from '../../../core/shared/community.model';
+import { hasValue, isEmpty, isNotEmpty } from '../../../shared/empty.util';
+import { RemoteData } from '../../../core/data/remote-data';
+import { PaginatedList } from '../../../core/data/paginated-list';
+import { getSucceededRemoteData } from '../../../core/shared/operators';
+
+interface CollectionListEntryItem {
+  id: string;
+  name: string;
+}
+
+interface CollectionListEntry {
+  communities: CollectionListEntryItem[],
+  collection: CollectionListEntryItem
+}
+
+@Component({
+  selector: 'ds-collection-selector',
+  // styleUrls: ['./collection-selector.component.scss'],
+  templateUrl: './collection-selector.component.html'
+})
+export class CollectionSelectorComponent implements OnChanges {
+  @Input() currentCollectionId: string;
+
+  public disabled$ = new BehaviorSubject<boolean>(true);
+  public model: any;
+  public searchField: FormControl = new FormControl();
+  public searchListCollection$: Observable<CollectionListEntry[]>;
+  public selectedCollectionId: string;
+  public selectedCollectionName$: Observable<string>;
+
+  private subs: Subscription[] = [];
+
+  constructor(private communityDataService: CommunityDataService) {
+  }
+
+  ngOnChanges(changes: SimpleChanges) {
+    if (hasValue(changes.currentCollectionId)
+      && hasValue(changes.currentCollectionId.currentValue)) {
+      this.selectedCollectionId = this.currentCollectionId;
+
+      // @TODO replace with search/top browse endpoint
+      // @TODO implement community/subcommunity hierarchy
+      const communities$ = this.communityDataService.findAll().pipe(
+        find((communities: RemoteData<PaginatedList<Community>>) => isNotEmpty(communities.payload)),
+        mergeMap((communities: RemoteData<PaginatedList<Community>>) => communities.payload.page));
+      communities$.subscribe((t) => {console.log('communities', t)});
+    //   const listCollection$ = communities$.pipe(
+    //     flatMap((communityData: Community) => {
+    //       return communityData.collections.pipe(
+    //         getSucceededRemoteData(),
+    //         mergeMap((collections: RemoteData<PaginatedList<Collection>>) => collections.payload.page),
+    //         filter((collectionData: Collection) => isNotEmpty(collectionData)),
+    //         map((collectionData: Collection) => ({
+    //           communities: [{ id: communityData.id, name: communityData.name }],
+    //           collection: { id: collectionData.id, name: collectionData.name }
+    //         }))
+    //       );
+    //     }),
+    //     reduce((acc: any, value: any) => [...acc, ...value], []),
+    //     startWith([])
+    //   );
+    //
+    //   this.selectedCollectionName$ = communities$.pipe(
+    //     flatMap((communityData: Community) => {
+    //       return communityData.collections.pipe(
+    //         getSucceededRemoteData(),
+    //         mergeMap((collections: RemoteData<PaginatedList<Collection>>) => collections.payload.page),
+    //         filter((collectionData: Collection) => isNotEmpty(collectionData)),
+    //         filter((collectionData: Collection) => collectionData.id === this.selectedCollectionId),
+    //         map((collectionData: Collection) => collectionData.name)
+    //       );
+    //     }),
+    //     startWith('')
+    //   );
+    //
+    //   const searchTerm$ = this.searchField.valueChanges.pipe(
+    //     debounceTime(200),
+    //     distinctUntilChanged(),
+    //     startWith('')
+    //   );
+    //
+    //   this.searchListCollection$ = combineLatest(searchTerm$, listCollection$).pipe(
+    //     map(([searchTerm, listCollection]) => {
+    //       this.disabled$.next(isEmpty(listCollection));
+    //       if (isEmpty(searchTerm)) {
+    //         return listCollection;
+    //       } else {
+    //         return listCollection.filter((v) => v.collection.name.toLowerCase().indexOf(searchTerm.toLowerCase()) > -1).slice(0, 5)
+    //       }
+    //     }));
+    }
+  }
+
+  ngOnDestroy(): void {
+    this.subs.filter((sub) => hasValue(sub)).forEach((sub) => sub.unsubscribe());
+  }
+
+  onSelect(event) {
+    this.searchField.reset();
+    this.disabled$.next(true);
+  }
+
+  onClose() {
+    this.searchField.reset();
+  }
+}
diff --git a/src/app/shared/menu/initial-menus-state.ts b/src/app/shared/menu/initial-menus-state.ts
index 7f3482f41f..7b900540b6 100644
--- a/src/app/shared/menu/initial-menus-state.ts
+++ b/src/app/shared/menu/initial-menus-state.ts
@@ -12,7 +12,7 @@ export enum MenuID {
  * List of possible MenuItemTypes
  */
 export enum MenuItemType {
-  TEXT, LINK, ALTMETRIC, SEARCH
+  TEXT, LINK, ALTMETRIC, SEARCH, ONCLICK
 }
 
 /**
diff --git a/src/app/shared/menu/menu-item/models/onclick.model.ts b/src/app/shared/menu/menu-item/models/onclick.model.ts
new file mode 100644
index 0000000000..4cef3084f9
--- /dev/null
+++ b/src/app/shared/menu/menu-item/models/onclick.model.ts
@@ -0,0 +1,11 @@
+import { MenuItemModel } from './menu-item.model';
+import { MenuItemType } from '../../initial-menus-state';
+
+/**
+ * Model representing an OnClick Menu Section
+ */
+export class OnClickMenuItemModel implements MenuItemModel {
+  type = MenuItemType.ONCLICK;
+  text: string;
+  function: () => {};
+}
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.html b/src/app/shared/menu/menu-item/onclick-menu-item.component.html
new file mode 100644
index 0000000000..0790ef7479
--- /dev/null
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.html
@@ -0,0 +1 @@
+<a class="nav-item nav-link" (click)="item.function()">{{item.text | translate}}</a>
\ No newline at end of file
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.ts b/src/app/shared/menu/menu-item/onclick-menu-item.component.ts
new file mode 100644
index 0000000000..14fd5d8ffd
--- /dev/null
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.ts
@@ -0,0 +1,20 @@
+import { Component, Inject } from '@angular/core';
+import { MenuItemType } from '../initial-menus-state';
+import { rendersMenuItemForType } from '../menu-item.decorator';
+import { GLOBAL_CONFIG, GlobalConfig } from '../../../../config';
+import { OnClickMenuItemModel } from './models/onclick.model';
+
+/**
+ * Component that renders a menu section of type LINK
+ */
+@Component({
+  selector: 'ds-onclick-menu-item',
+  templateUrl: './onclick-menu-item.component.html'
+})
+@rendersMenuItemForType(MenuItemType.ONCLICK)
+export class OnClickMenuItemComponent {
+  item: OnClickMenuItemModel;
+  constructor(@Inject('itemModelProvider') item: OnClickMenuItemModel, @Inject(GLOBAL_CONFIG) private EnvConfig: GlobalConfig) {
+    this.item = item;
+  }
+}
diff --git a/src/app/shared/menu/menu.module.ts b/src/app/shared/menu/menu.module.ts
index 736da5c267..7e900d18e6 100644
--- a/src/app/shared/menu/menu.module.ts
+++ b/src/app/shared/menu/menu.module.ts
@@ -5,17 +5,20 @@ import { TranslateModule } from '@ngx-translate/core';
 import { RouterModule } from '@angular/router';
 import { LinkMenuItemComponent } from './menu-item/link-menu-item.component';
 import { TextMenuItemComponent } from './menu-item/text-menu-item.component';
+import { OnClickMenuItemComponent } from './menu-item/onclick-menu-item.component';
 
 const COMPONENTS = [
   MenuSectionComponent,
   MenuComponent,
   LinkMenuItemComponent,
-  TextMenuItemComponent
+  TextMenuItemComponent,
+  OnClickMenuItemComponent
 ];
 
 const ENTRY_COMPONENTS = [
   LinkMenuItemComponent,
-  TextMenuItemComponent
+  TextMenuItemComponent,
+  OnClickMenuItemComponent
 ];
 
 const MODULES = [
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 5ae3e517e3..da45faee9f 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -91,6 +91,8 @@ import { CreateComColPageComponent } from './comcol-forms/create-comcol-page/cre
 import { EditComColPageComponent } from './comcol-forms/edit-comcol-page/edit-comcol-page.component';
 import { DeleteComColPageComponent } from './comcol-forms/delete-comcol-page/delete-comcol-page.component';
 import { LangSwitchComponent } from './lang-switch/lang-switch.component';
+import { CollectionSelectorComponent } from './dso-selector/collection-selector/collection-selector.component';
+import { CollectionSelectorModalWrapperComponent } from './dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component';
 import { ObjectValuesPipe } from './utils/object-values-pipe';
 import { InListValidator } from './utils/in-list-validator.directive';
 import { AutoFocusDirective } from './utils/auto-focus.directive';
@@ -177,6 +179,8 @@ const COMPONENTS = [
   TruncatablePartComponent,
   BrowseByComponent,
   InputSuggestionsComponent,
+  CollectionSelectorComponent,
+  CollectionSelectorModalWrapperComponent
 ];
 
 const ENTRY_COMPONENTS = [
@@ -189,7 +193,9 @@ const ENTRY_COMPONENTS = [
   CollectionGridElementComponent,
   CommunityGridElementComponent,
   SearchResultGridElementComponent,
-  BrowseEntryListElementComponent
+  BrowseEntryListElementComponent,
+  CollectionSelectorComponent,
+  CollectionSelectorModalWrapperComponent
 ];
 
 const PROVIDERS = [

From 61a5620efe761ec79027f7ee625a820c301553f0 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Fri, 1 Mar 2019 16:41:38 +0100
Subject: [PATCH 03/24] refactored lookup

---
 config/environment.default.js                 |   5 +-
 .../admin-sidebar/admin-sidebar.component.ts  |  21 +--
 .../collection-page.module.ts                 |   1 -
 src/app/+search-page/search-page.module.ts    |   1 -
 .../builders/remote-data-build.service.ts     |  11 --
 src/app/core/core.module.ts                   |   2 +
 src/app/core/data/request.models.ts           |   9 +-
 ...tion-selector-modal-wrapper.component.html |   4 +-
 ...ection-selector-modal-wrapper.component.ts |  16 ++-
 .../collection-selector.component.html        |  26 ----
 .../collection-selector.component.ts          | 125 ------------------
 ...nity-selector-modal-wrapper.component.html |   7 +
 ...munity-selector-modal-wrapper.component.ts |  20 +++
 .../dso-selector/dso-selector.component.html  |  27 ++++
 .../dso-selector/dso-selector.component.ts    |  94 +++++++++++++
 ...item-selector-modal-wrapper.component.html |   6 +
 .../item-selector-modal-wrapper.component.ts  |  21 +++
 src/app/shared/shared.module.ts               |  16 ++-
 18 files changed, 223 insertions(+), 189 deletions(-)
 delete mode 100644 src/app/shared/dso-selector/collection-selector/collection-selector.component.html
 delete mode 100644 src/app/shared/dso-selector/collection-selector/collection-selector.component.ts
 create mode 100644 src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.html
 create mode 100644 src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.ts
 create mode 100644 src/app/shared/dso-selector/dso-selector/dso-selector.component.html
 create mode 100644 src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
 create mode 100644 src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.html
 create mode 100644 src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.ts

diff --git a/config/environment.default.js b/config/environment.default.js
index b8eae1ccff..b493d0473a 100644
--- a/config/environment.default.js
+++ b/config/environment.default.js
@@ -10,10 +10,9 @@ module.exports = {
   // The REST API server settings.
   rest: {
     ssl: true,
-    host: 'dspace7.4science.it',
+    host: 'dspace7-internal.atmire.com',
     port: 443,
-    // NOTE: Space is capitalized because 'namespace' is a reserved string in TypeScript
-    nameSpace: '/dspace-spring-rest/api'
+    nameSpace: '/rest/api'
   },
   // Caching settings
   cache: {
diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index f3d417b93d..22cb1f5825 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -13,6 +13,8 @@ import { combineLatest as combineLatestObservable } from 'rxjs';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { OnClickMenuItemModel } from '../../shared/menu/menu-item/models/onclick.model';
 import { CollectionSelectorModalWrapperComponent } from '../../shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component';
+import { ItemSelectorModalWrapperComponent } from '../../shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component';
+import { CommunitySelectorModalWrapperComponent } from '../../shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component';
 
 /**
  * Component representing the admin sidebar
@@ -111,8 +113,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           type: MenuItemType.ONCLICK,
           text: 'menu.section.new_community',
           function: () => {
-            const modal = this.modalService.open(CollectionSelectorModalWrapperComponent);
-            modal.componentInstance.currentCollectionID = 'c069b0c2-dc6a-40de-92c3-6803cd66023e';
+            this.modalService.open(CommunitySelectorModalWrapperComponent);
           }
         } as OnClickMenuItemModel,
       },
@@ -122,10 +123,12 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
         active: false,
         visible: true,
         model: {
-          type: MenuItemType.LINK,
+          type: MenuItemType.ONCLICK,
           text: 'menu.section.new_collection',
-          link: '/collections/submission'
-        } as LinkMenuItemModel,
+          function: () => {
+            this.modalService.open(CollectionSelectorModalWrapperComponent);
+          }
+        } as OnClickMenuItemModel,
       },
       {
         id: 'new_item',
@@ -133,10 +136,12 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
         active: false,
         visible: true,
         model: {
-          type: MenuItemType.LINK,
+          type: MenuItemType.ONCLICK,
           text: 'menu.section.new_item',
-          link: '/items/submission'
-        } as LinkMenuItemModel,
+          function: () => {
+            this.modalService.open(ItemSelectorModalWrapperComponent);
+          }
+        } as OnClickMenuItemModel,
       },
       {
         id: 'new_item_version',
diff --git a/src/app/+collection-page/collection-page.module.ts b/src/app/+collection-page/collection-page.module.ts
index 8424cc02a4..f0e4138d2d 100644
--- a/src/app/+collection-page/collection-page.module.ts
+++ b/src/app/+collection-page/collection-page.module.ts
@@ -15,7 +15,6 @@ import { DeleteCollectionPageComponent } from './delete-collection-page/delete-c
   imports: [
     CommonModule,
     SharedModule,
-    SearchPageModule,
     CollectionPageRoutingModule
   ],
   declarations: [
diff --git a/src/app/+search-page/search-page.module.ts b/src/app/+search-page/search-page.module.ts
index 0c8a4ee306..5fa1fadfae 100644
--- a/src/app/+search-page/search-page.module.ts
+++ b/src/app/+search-page/search-page.module.ts
@@ -65,7 +65,6 @@ const effects = [
     SearchBooleanFilterComponent,
   ],
   providers: [
-    SearchService,
     SearchSidebarService,
     SearchFilterService,
     SearchConfigurationService
diff --git a/src/app/core/cache/builders/remote-data-build.service.ts b/src/app/core/cache/builders/remote-data-build.service.ts
index 697d98fc68..a59039c226 100644
--- a/src/app/core/cache/builders/remote-data-build.service.ts
+++ b/src/app/core/cache/builders/remote-data-build.service.ts
@@ -119,19 +119,8 @@ export class RemoteDataBuildService {
     }
 
     const requestEntry$ = href$.pipe(getRequestFromRequestHref(this.requestService));
-    requestEntry$.subscribe((t) => {
-      console.log('requestEntry$', t)
-    });
     const tDomainList$ = requestEntry$.pipe(
       getResourceLinksFromResponse(),
-      tap((resourceUUIDs: string[]) => {
-        const g = (href$ as Observable<string>)
-
-        g.subscribe((t) => {
-          console.log('href', t)
-        });
-        console.log(resourceUUIDs);
-      }),
       flatMap((resourceUUIDs: string[]) => {
         return this.objectCache.getList(resourceUUIDs).pipe(
           map((normList: Array<NormalizedObject<T>>) => {
diff --git a/src/app/core/core.module.ts b/src/app/core/core.module.ts
index 357f552074..82a25d6d4f 100644
--- a/src/app/core/core.module.ts
+++ b/src/app/core/core.module.ts
@@ -69,6 +69,7 @@ import { NormalizedObjectBuildService } from './cache/builders/normalized-object
 import { DSOChangeAnalyzer } from './data/dso-change-analyzer.service';
 import { ObjectUpdatesService } from './data/object-updates/object-updates.service';
 import { DefaultChangeAnalyzer } from './data/default-change-analyzer.service';
+import { SearchService } from '../+search-page/search-service/search.service';
 
 const IMPORTS = [
   CommonModule,
@@ -138,6 +139,7 @@ const PROVIDERS = [
   CSSVariableService,
   MenuService,
   ObjectUpdatesService,
+  SearchService,
   // register AuthInterceptor as HttpInterceptor
   {
     provide: HTTP_INTERCEPTORS,
diff --git a/src/app/core/data/request.models.ts b/src/app/core/data/request.models.ts
index 18820dbd43..951dbacff6 100644
--- a/src/app/core/data/request.models.ts
+++ b/src/app/core/data/request.models.ts
@@ -14,6 +14,7 @@ import { BrowseItemsResponseParsingService } from './browse-items-response-parsi
 import { RegistryMetadataschemasResponseParsingService } from './registry-metadataschemas-response-parsing.service';
 import { MetadataschemaParsingService } from './metadataschema-parsing.service';
 import { MetadatafieldParsingService } from './metadatafield-parsing.service';
+import { URLCombiner } from '../url-combiner/url-combiner';
 
 /* tslint:disable:max-classes-per-file */
 
@@ -146,11 +147,11 @@ export class FindAllRequest extends GetRequest {
 
 export class EndpointMapRequest extends GetRequest {
   constructor(
-    public uuid: string,
-    public href: string,
-    public body?: any
+    uuid: string,
+    href: string,
+    body?: any
   ) {
-    super(uuid, href, body);
+    super(uuid, new URLCombiner(href, '?endpointMap').toString(), body);
   }
 
   getResponseParser(): GenericConstructor<ResponseParsingService> {
diff --git a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html
index 7fadd477f4..f3bf405651 100644
--- a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html
+++ b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html
@@ -1,6 +1,6 @@
 <div>
-    <div class="modal-header">New item</div>
+    <div class="modal-header">New Collection</div>
     <div class="modal-body">
-        <ds-collection-selector [currentCollectionId]="currentCollectionID"></ds-collection-selector>
+        <ds-dso-selector [currentDSOId]="communityRD?.payload.uuid"></ds-dso-selector>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts
index c60d6f2938..cda2284835 100644
--- a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts
+++ b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts
@@ -1,10 +1,20 @@
-import { Component, Input } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Community } from '../../../core/shared/community.model';
+import { RemoteData } from '../../../core/data/remote-data';
 
 @Component({
   selector: 'ds-collection-selector-modal-wrapper',
   // styleUrls: ['./collection-selector.component.scss'],
   templateUrl: './collection-selector-modal-wrapper.component.html',
 })
-export class CollectionSelectorModalWrapperComponent {
-    @Input() currentCollectionID: string;
+export class CollectionSelectorModalWrapperComponent implements OnInit {
+  @Input() communityRD: RemoteData<Community>;
+
+  constructor(private route: ActivatedRoute) {
+  }
+
+  ngOnInit(): void {
+    this.communityRD = this.route.root.firstChild.firstChild.snapshot.data.community;
+  }
 }
diff --git a/src/app/shared/dso-selector/collection-selector/collection-selector.component.html b/src/app/shared/dso-selector/collection-selector/collection-selector.component.html
deleted file mode 100644
index e137f5e119..0000000000
--- a/src/app/shared/dso-selector/collection-selector/collection-selector.component.html
+++ /dev/null
@@ -1,26 +0,0 @@
-<div class="form-group w-100 pr-2 pl-2">
-    <input *ngIf="searchField"
-           type="search"
-           class="form-control w-100"
-           (click)="$event.stopPropagation();"
-           placeholder="{{ 'submission.sections.general.search-collection' | translate }}"
-           [formControl]="searchField">
-</div>
-<div class="dropdown-divider"></div>
-<div class="scrollable-menu" aria-labelledby="dropdownMenuButton">
-    <button class="dropdown-item disabled" *ngIf="(searchListCollection$ | async)?.length == 0">
-        {{'submission.sections.general.no-collection' | translate}}
-    </button>
-    <button *ngFor="let listItem of (searchListCollection$ | async)"
-            class="dropdown-item collection-item"
-            title="{{ listItem.collection.name }}"
-            (click)="onSelect(listItem)">
-        <ul class="list-unstyled mb-0">
-            <li class="list-item text-truncate text-secondary"
-                *ngFor="let item of listItem.communities">
-                {{ item.name}} <i class="fa fa-level-down" aria-hidden="true"></i>
-            </li>
-            <li class="list-item text-truncate text-primary font-weight-bold">{{ listItem.collection.name}}</li>
-        </ul>
-    </button>
-</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/collection-selector/collection-selector.component.ts b/src/app/shared/dso-selector/collection-selector/collection-selector.component.ts
deleted file mode 100644
index 6b9625c8a6..0000000000
--- a/src/app/shared/dso-selector/collection-selector/collection-selector.component.ts
+++ /dev/null
@@ -1,125 +0,0 @@
-import { Component, Input, OnChanges, SimpleChanges } from '@angular/core';
-import { FormControl } from '@angular/forms';
-
-import { BehaviorSubject, combineLatest, Observable, Subscription } from 'rxjs';
-import {
-  debounceTime,
-  distinctUntilChanged,
-  filter,
-  find,
-  flatMap,
-  map,
-  mergeMap,
-  reduce,
-  startWith
-} from 'rxjs/operators';
-
-import { Collection } from '../../../core/shared/collection.model';
-import { CommunityDataService } from '../../../core/data/community-data.service';
-import { Community } from '../../../core/shared/community.model';
-import { hasValue, isEmpty, isNotEmpty } from '../../../shared/empty.util';
-import { RemoteData } from '../../../core/data/remote-data';
-import { PaginatedList } from '../../../core/data/paginated-list';
-import { getSucceededRemoteData } from '../../../core/shared/operators';
-
-interface CollectionListEntryItem {
-  id: string;
-  name: string;
-}
-
-interface CollectionListEntry {
-  communities: CollectionListEntryItem[],
-  collection: CollectionListEntryItem
-}
-
-@Component({
-  selector: 'ds-collection-selector',
-  // styleUrls: ['./collection-selector.component.scss'],
-  templateUrl: './collection-selector.component.html'
-})
-export class CollectionSelectorComponent implements OnChanges {
-  @Input() currentCollectionId: string;
-
-  public disabled$ = new BehaviorSubject<boolean>(true);
-  public model: any;
-  public searchField: FormControl = new FormControl();
-  public searchListCollection$: Observable<CollectionListEntry[]>;
-  public selectedCollectionId: string;
-  public selectedCollectionName$: Observable<string>;
-
-  private subs: Subscription[] = [];
-
-  constructor(private communityDataService: CommunityDataService) {
-  }
-
-  ngOnChanges(changes: SimpleChanges) {
-    if (hasValue(changes.currentCollectionId)
-      && hasValue(changes.currentCollectionId.currentValue)) {
-      this.selectedCollectionId = this.currentCollectionId;
-
-      // @TODO replace with search/top browse endpoint
-      // @TODO implement community/subcommunity hierarchy
-      const communities$ = this.communityDataService.findAll().pipe(
-        find((communities: RemoteData<PaginatedList<Community>>) => isNotEmpty(communities.payload)),
-        mergeMap((communities: RemoteData<PaginatedList<Community>>) => communities.payload.page));
-      communities$.subscribe((t) => {console.log('communities', t)});
-    //   const listCollection$ = communities$.pipe(
-    //     flatMap((communityData: Community) => {
-    //       return communityData.collections.pipe(
-    //         getSucceededRemoteData(),
-    //         mergeMap((collections: RemoteData<PaginatedList<Collection>>) => collections.payload.page),
-    //         filter((collectionData: Collection) => isNotEmpty(collectionData)),
-    //         map((collectionData: Collection) => ({
-    //           communities: [{ id: communityData.id, name: communityData.name }],
-    //           collection: { id: collectionData.id, name: collectionData.name }
-    //         }))
-    //       );
-    //     }),
-    //     reduce((acc: any, value: any) => [...acc, ...value], []),
-    //     startWith([])
-    //   );
-    //
-    //   this.selectedCollectionName$ = communities$.pipe(
-    //     flatMap((communityData: Community) => {
-    //       return communityData.collections.pipe(
-    //         getSucceededRemoteData(),
-    //         mergeMap((collections: RemoteData<PaginatedList<Collection>>) => collections.payload.page),
-    //         filter((collectionData: Collection) => isNotEmpty(collectionData)),
-    //         filter((collectionData: Collection) => collectionData.id === this.selectedCollectionId),
-    //         map((collectionData: Collection) => collectionData.name)
-    //       );
-    //     }),
-    //     startWith('')
-    //   );
-    //
-    //   const searchTerm$ = this.searchField.valueChanges.pipe(
-    //     debounceTime(200),
-    //     distinctUntilChanged(),
-    //     startWith('')
-    //   );
-    //
-    //   this.searchListCollection$ = combineLatest(searchTerm$, listCollection$).pipe(
-    //     map(([searchTerm, listCollection]) => {
-    //       this.disabled$.next(isEmpty(listCollection));
-    //       if (isEmpty(searchTerm)) {
-    //         return listCollection;
-    //       } else {
-    //         return listCollection.filter((v) => v.collection.name.toLowerCase().indexOf(searchTerm.toLowerCase()) > -1).slice(0, 5)
-    //       }
-    //     }));
-    }
-  }
-
-  ngOnDestroy(): void {
-    this.subs.filter((sub) => hasValue(sub)).forEach((sub) => sub.unsubscribe());
-  }
-
-  onSelect(event) {
-    this.searchField.reset();
-    this.disabled$.next(true);
-  }
-
-  onClose() {
-    this.searchField.reset();
-  }
-}
diff --git a/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.html b/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.html
new file mode 100644
index 0000000000..91b97a25a3
--- /dev/null
+++ b/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.html
@@ -0,0 +1,7 @@
+<div>
+    <div class="modal-header">New Community</div>
+    <div class="modal-body">
+        <input/>
+        <ds-currentDSOId-selector [currentDSOId]="communityRD?.payload.uuid"></ds-currentDSOId-selector>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.ts
new file mode 100644
index 0000000000..8ebee7ea7f
--- /dev/null
+++ b/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.ts
@@ -0,0 +1,20 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Community } from '../../../core/shared/community.model';
+import { RemoteData } from '../../../core/data/remote-data';
+
+@Component({
+  selector: 'ds-community-selector-modal-wrapper',
+  // styleUrls: ['./community-selector.component.scss'],
+  templateUrl: './community-selector-modal-wrapper.component.html',
+})
+export class CommunitySelectorModalWrapperComponent implements OnInit {
+  @Input() communityRD: RemoteData<Community>;
+
+  constructor(private route: ActivatedRoute) {
+  }
+
+  ngOnInit(): void {
+    this.communityRD = this.route.root.firstChild.firstChild.snapshot.data.community;
+  }
+}
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
new file mode 100644
index 0000000000..b15eaf9338
--- /dev/null
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
@@ -0,0 +1,27 @@
+<div class="form-group w-100 pr-2 pl-2">
+    <input type="search"
+           class="form-control"
+           (click)="$event.stopPropagation();"
+           placeholder="{{ 'submission.sections.general.search-collection' | translate }}"
+           [formControl]="input">
+</div>
+
+{{input.value}}
+<div class="dropdown-divider"></div>
+<div class="scrollable-menu">
+    <button class="dropdown-item disabled" *ngIf="(listEntries$ | async)?.length == 0">
+        {{'submission.sections.general.no-collection' | translate}}
+    </button>
+    <button *ngFor="let listEntry of (listEntries$ | async)"
+            class="dropdown-item collection-item"
+            title="{{ listEntry.dso.name }}"
+            (click)="onSelect(listEntry.dso)">
+        <ul class="list-unstyled mb-0">
+            <li class="list-item text-truncate text-secondary"
+                *ngFor="let parent of listEntry.parents">
+                {{ parent.name }} <i class="fa fa-level-down" aria-hidden="true"></i>
+            </li>
+            <li class="list-item text-truncate text-primary font-weight-bold">{{ listEntry.dso.name }}</li>
+        </ul>
+    </button>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
new file mode 100644
index 0000000000..04a5792c87
--- /dev/null
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
@@ -0,0 +1,94 @@
+import { AfterViewInit, Component, Input, OnInit } from '@angular/core';
+import { FormControl } from '@angular/forms';
+
+import { Observable } from 'rxjs';
+import { map, switchMap } from 'rxjs/operators';
+import { SearchService } from '../../../+search-page/search-service/search.service';
+import { PaginatedSearchOptions } from '../../../+search-page/paginated-search-options.model';
+import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model';
+import { RemoteData } from '../../../core/data/remote-data';
+import { PaginatedList } from '../../../core/data/paginated-list';
+import { SearchResult } from '../../../+search-page/search-result.model';
+import { DSpaceObject } from '../../../core/shared/dspace-object.model';
+
+interface DSOSelectListEntry {
+  parents: DSpaceObject[],
+  dso: DSpaceObject
+}
+
+@Component({
+  selector: 'ds-dso-selector',
+  // styleUrls: ['./dso-selector.component.scss'],
+  templateUrl: './dso-selector.component.html'
+})
+export class DSOSelectorComponent implements OnInit, AfterViewInit {
+  @Input() currentDSOId: string;
+  @Input() type: DSpaceObjectType;
+
+  public input: FormControl = new FormControl();
+  // private subs: Subscription[] = [];
+  private defaultPagination = { id: 'dso-selector', currentPage: 1, pageSize: 5 } as any;
+  listEntries$: Observable<DSOSelectListEntry[]>;
+
+  constructor(private searchService: SearchService) {
+
+  }
+
+  ngOnInit(): void {
+    this.listEntries$ = this.input.valueChanges
+      .pipe(
+        switchMap((query) => {
+            return this.searchService.search(
+              new PaginatedSearchOptions({
+                query: query,
+                dsoType: this.type,
+                pagination: this.defaultPagination
+              })
+            )
+          }
+        ),
+        map((searchResultsRD: RemoteData<PaginatedList<SearchResult<DSpaceObject>>>) => {
+          return searchResultsRD.payload.page.map(
+            (searchResult: SearchResult<DSpaceObject>) => {
+              let dso = searchResult.dspaceObject;
+              return {
+                parents: this.retrieveParentList(dso),
+                dso
+              } as DSOSelectListEntry
+            }
+          )
+        })
+      );
+
+  }
+
+
+  retrieveParentList(dso: DSpaceObject, parents: DSpaceObject[] = []) {
+    return [{name: 'Test Community'} as any];
+    // if (hasValue(dso.owner)) {
+    //   dso.owner.pipe(
+    //     first(),
+    //   ).subscribe((parentRD) => {
+    //     const newDSO: DSpaceObject = parentRD.payload;
+    //     parents = [...this.retrieveParentList(newDSO, parents), newDSO];
+    //   });
+    // }
+    // return parents;
+  }
+
+  // ngOnDestroy(): void {
+  //   this.subs.filter((sub) => hasValue(sub)).forEach((sub) => sub.unsubscribe());
+  // }
+
+  onSelect(event) {
+
+  }
+
+  onClose() {
+
+  }
+
+  ngAfterViewInit(): void {
+    this.input.setValue(this.currentDSOId);
+  }
+}
diff --git a/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.html b/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.html
new file mode 100644
index 0000000000..7d100cbece
--- /dev/null
+++ b/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.html
@@ -0,0 +1,6 @@
+<div>
+    <div class="modal-header">New Item</div>
+    <div class="modal-body">
+        <ds-dso-selector [currentDSOId]="collectionRD?.payload.uuid"></ds-dso-selector>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.ts
new file mode 100644
index 0000000000..f8d0a14359
--- /dev/null
+++ b/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.ts
@@ -0,0 +1,21 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Community } from '../../../core/shared/community.model';
+import { RemoteData } from '../../../core/data/remote-data';
+import { Collection } from '../../../core/shared/collection.model';
+
+@Component({
+  selector: 'ds-item-selector-modal-wrapper',
+  // styleUrls: ['./item-selector.component.scss'],
+  templateUrl: './item-selector-modal-wrapper.component.html',
+})
+export class ItemSelectorModalWrapperComponent implements OnInit {
+  @Input() collectionRD: RemoteData<Collection>;
+
+  constructor(private route: ActivatedRoute) {
+  }
+
+  ngOnInit(): void {
+    this.collectionRD = this.route.root.firstChild.firstChild.snapshot.data.collection;
+  }
+}
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index da45faee9f..2d69c70591 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -91,12 +91,14 @@ import { CreateComColPageComponent } from './comcol-forms/create-comcol-page/cre
 import { EditComColPageComponent } from './comcol-forms/edit-comcol-page/edit-comcol-page.component';
 import { DeleteComColPageComponent } from './comcol-forms/delete-comcol-page/delete-comcol-page.component';
 import { LangSwitchComponent } from './lang-switch/lang-switch.component';
-import { CollectionSelectorComponent } from './dso-selector/collection-selector/collection-selector.component';
 import { CollectionSelectorModalWrapperComponent } from './dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component';
 import { ObjectValuesPipe } from './utils/object-values-pipe';
 import { InListValidator } from './utils/in-list-validator.directive';
 import { AutoFocusDirective } from './utils/auto-focus.directive';
 import { ComcolPageBrowseByComponent } from './comcol-page-browse-by/comcol-page-browse-by.component';
+import { DSOSelectorComponent } from './dso-selector/dso-selector/dso-selector.component';
+import { ItemSelectorModalWrapperComponent } from './dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component';
+import { CommunitySelectorModalWrapperComponent } from './dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component';
 
 const MODULES = [
   // Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -179,8 +181,10 @@ const COMPONENTS = [
   TruncatablePartComponent,
   BrowseByComponent,
   InputSuggestionsComponent,
-  CollectionSelectorComponent,
-  CollectionSelectorModalWrapperComponent
+  DSOSelectorComponent,
+  CommunitySelectorModalWrapperComponent,
+  CollectionSelectorModalWrapperComponent,
+  ItemSelectorModalWrapperComponent
 ];
 
 const ENTRY_COMPONENTS = [
@@ -194,8 +198,10 @@ const ENTRY_COMPONENTS = [
   CommunityGridElementComponent,
   SearchResultGridElementComponent,
   BrowseEntryListElementComponent,
-  CollectionSelectorComponent,
-  CollectionSelectorModalWrapperComponent
+  DSOSelectorComponent,
+  CommunitySelectorModalWrapperComponent,
+  CollectionSelectorModalWrapperComponent,
+  ItemSelectorModalWrapperComponent
 ];
 
 const PROVIDERS = [

From 9f02f65a0a8c0840520fe6f61a8e9a4304881001 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Mon, 4 Mar 2019 16:35:04 +0100
Subject: [PATCH 04/24] implemented edit popups and added actions

---
 .../admin-sidebar/admin-sidebar.component.ts  | 40 ++++++++++-------
 .../collection-page-routing.module.ts         | 23 +++++++++-
 .../community-page-routing.module.ts          | 23 +++++++++-
 src/app/app-routing.module.ts                 | 12 +++++-
 ...tion-selector-modal-wrapper.component.html |  6 ---
 ...ection-selector-modal-wrapper.component.ts | 20 ---------
 ...nity-selector-modal-wrapper.component.html |  7 ---
 ...munity-selector-modal-wrapper.component.ts | 20 ---------
 .../dso-selector/dso-selector.component.html  |  4 +-
 .../dso-selector/dso-selector.component.ts    | 34 +++++++++------
 ...item-selector-modal-wrapper.component.html |  6 ---
 .../item-selector-modal-wrapper.component.ts  | 21 ---------
 ...-collection-parent-selector.component.html |  6 +++
 ...te-collection-parent-selector.component.ts | 39 +++++++++++++++++
 ...e-community-parent-selector.component.html |  7 +++
 ...ate-community-parent-selector.component.ts | 43 +++++++++++++++++++
 ...create-item-parent-selector.component.html |  6 +++
 .../create-item-parent-selector.component.ts  | 36 ++++++++++++++++
 ...-collection-parent-selector.component.html |  6 +++
 ...it-collection-parent-selector.component.ts | 33 ++++++++++++++
 ...t-community-parent-selector.component.html |  6 +++
 ...dit-community-parent-selector.component.ts | 32 ++++++++++++++
 .../edit-item-parent-selector.component.html  |  6 +++
 .../edit-item-parent-selector.component.ts    | 34 +++++++++++++++
 .../onclick-menu-item.component.html          |  2 +-
 src/app/shared/shared.module.ts               | 27 ++++++++----
 26 files changed, 371 insertions(+), 128 deletions(-)
 delete mode 100644 src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html
 delete mode 100644 src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts
 delete mode 100644 src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.html
 delete mode 100644 src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.ts
 delete mode 100644 src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.html
 delete mode 100644 src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index 22cb1f5825..8b71bca423 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -12,9 +12,12 @@ import { first, map } from 'rxjs/operators';
 import { combineLatest as combineLatestObservable } from 'rxjs';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { OnClickMenuItemModel } from '../../shared/menu/menu-item/models/onclick.model';
-import { CollectionSelectorModalWrapperComponent } from '../../shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component';
-import { ItemSelectorModalWrapperComponent } from '../../shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component';
-import { CommunitySelectorModalWrapperComponent } from '../../shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component';
+import { CreateCommunityParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component';
+import { CreateItemParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component';
+import { CreateCollectionParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component';
+import { EditCollectionParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component';
+import { EditItemParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component';
+import { EditCommunityParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component';
 
 /**
  * Component representing the admin sidebar
@@ -113,7 +116,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           type: MenuItemType.ONCLICK,
           text: 'menu.section.new_community',
           function: () => {
-            this.modalService.open(CommunitySelectorModalWrapperComponent);
+            this.modalService.open(CreateCommunityParentSelectorComponent);
           }
         } as OnClickMenuItemModel,
       },
@@ -126,7 +129,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           type: MenuItemType.ONCLICK,
           text: 'menu.section.new_collection',
           function: () => {
-            this.modalService.open(CollectionSelectorModalWrapperComponent);
+            this.modalService.open(CreateCollectionParentSelectorComponent);
           }
         } as OnClickMenuItemModel,
       },
@@ -139,7 +142,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           type: MenuItemType.ONCLICK,
           text: 'menu.section.new_item',
           function: () => {
-            this.modalService.open(ItemSelectorModalWrapperComponent);
+            this.modalService.open(CreateItemParentSelectorComponent);
           }
         } as OnClickMenuItemModel,
       },
@@ -173,10 +176,12 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
         active: false,
         visible: true,
         model: {
-          type: MenuItemType.LINK,
+          type: MenuItemType.ONCLICK,
           text: 'menu.section.edit_community',
-          link: '#'
-        } as LinkMenuItemModel,
+          function: () => {
+            this.modalService.open(EditCommunityParentSelectorComponent);
+          }
+        } as OnClickMenuItemModel,
       },
       {
         id: 'edit_collection',
@@ -184,10 +189,12 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
         active: false,
         visible: true,
         model: {
-          type: MenuItemType.LINK,
+          type: MenuItemType.ONCLICK,
           text: 'menu.section.edit_collection',
-          link: '#'
-        } as LinkMenuItemModel,
+          function: () => {
+            this.modalService.open(EditCollectionParentSelectorComponent);
+          }
+        } as OnClickMenuItemModel,
       },
       {
         id: 'edit_item',
@@ -195,10 +202,12 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
         active: false,
         visible: true,
         model: {
-          type: MenuItemType.LINK,
+          type: MenuItemType.ONCLICK,
           text: 'menu.section.edit_item',
-          link: '#'
-        } as LinkMenuItemModel,
+          function: () => {
+            this.modalService.open(EditItemParentSelectorComponent);
+          }
+        } as OnClickMenuItemModel,
       },
 
       /* Import */
@@ -235,7 +244,6 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           link: '#'
         } as LinkMenuItemModel,
       },
-
       /* Export */
       {
         id: 'export',
diff --git a/src/app/+collection-page/collection-page-routing.module.ts b/src/app/+collection-page/collection-page-routing.module.ts
index ddcf36a0cc..cdbd7650b2 100644
--- a/src/app/+collection-page/collection-page-routing.module.ts
+++ b/src/app/+collection-page/collection-page-routing.module.ts
@@ -8,17 +8,36 @@ import { AuthenticatedGuard } from '../core/auth/authenticated.guard';
 import { EditCollectionPageComponent } from './edit-collection-page/edit-collection-page.component';
 import { CreateCollectionPageGuard } from './create-collection-page/create-collection-page.guard';
 import { DeleteCollectionPageComponent } from './delete-collection-page/delete-collection-page.component';
+import { URLCombiner } from '../core/url-combiner/url-combiner';
+import { getCollectionModulePath } from '../app-routing.module';
+
+export const COLLECTION_PARENT_PARAMETER = 'parent';
+
+export function getCollectionPageRoute(collectionId: string) {
+  return new URLCombiner(getCollectionModulePath(), collectionId).toString();
+}
+
+export function getCollectionEditPath(id: string) {
+  return new URLCombiner(getCollectionModulePath(), COLLECTION_EDIT_PATH.replace(/:id/, id)).toString()
+}
+
+export function getCollectionCreatePath() {
+  return new URLCombiner(getCollectionModulePath(), COLLECTION_CREATE_PATH).toString()
+}
+
+const COLLECTION_CREATE_PATH = 'create';
+const COLLECTION_EDIT_PATH = ':id/edit';
 
 @NgModule({
   imports: [
     RouterModule.forChild([
       {
-        path: 'create',
+        path: COLLECTION_CREATE_PATH,
         component: CreateCollectionPageComponent,
         canActivate: [AuthenticatedGuard, CreateCollectionPageGuard]
       },
       {
-        path: ':id/edit',
+        path: COLLECTION_EDIT_PATH,
         pathMatch: 'full',
         component: EditCollectionPageComponent,
         canActivate: [AuthenticatedGuard],
diff --git a/src/app/+community-page/community-page-routing.module.ts b/src/app/+community-page/community-page-routing.module.ts
index 02f28f6375..cecd17ec10 100644
--- a/src/app/+community-page/community-page-routing.module.ts
+++ b/src/app/+community-page/community-page-routing.module.ts
@@ -8,17 +8,36 @@ import { AuthenticatedGuard } from '../core/auth/authenticated.guard';
 import { EditCommunityPageComponent } from './edit-community-page/edit-community-page.component';
 import { CreateCommunityPageGuard } from './create-community-page/create-community-page.guard';
 import { DeleteCommunityPageComponent } from './delete-community-page/delete-community-page.component';
+import { URLCombiner } from '../core/url-combiner/url-combiner';
+import { getCommunityModulePath } from '../app-routing.module';
+
+export const COMMUNITY_PARENT_PARAMETER = 'parent';
+
+export function getCommunityPageRoute(communityId: string) {
+  return new URLCombiner(getCommunityModulePath(), communityId).toString();
+}
+
+export function getCommunityEditPath(id: string) {
+  return new URLCombiner(getCommunityModulePath(), COMMUNITY_EDIT_PATH.replace(/:id/, id)).toString()
+}
+
+export function getCommunityCreatePath() {
+  return new URLCombiner(getCommunityModulePath(), COMMUNITY_CREATE_PATH).toString()
+}
+
+const COMMUNITY_CREATE_PATH = 'create';
+const COMMUNITY_EDIT_PATH = ':id/edit';
 
 @NgModule({
   imports: [
     RouterModule.forChild([
       {
-        path: 'create',
+        path: COMMUNITY_CREATE_PATH,
         component: CreateCommunityPageComponent,
         canActivate: [AuthenticatedGuard, CreateCommunityPageGuard]
       },
       {
-        path: ':id/edit',
+        path: COMMUNITY_EDIT_PATH,
         pathMatch: 'full',
         component: EditCommunityPageComponent,
         canActivate: [AuthenticatedGuard],
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 1476aa5dad..1448601067 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -8,13 +8,21 @@ const ITEM_MODULE_PATH = 'items';
 export function getItemModulePath() {
   return `/${ITEM_MODULE_PATH}`;
 }
+const COLLECTION_MODULE_PATH = 'collections';
+export function getCollectionModulePath() {
+  return `/${COLLECTION_MODULE_PATH}`;
+}
+const COMMUNITY_MODULE_PATH = 'communities';
+export function getCommunityModulePath() {
+  return `/${COMMUNITY_MODULE_PATH}`;
+}
 @NgModule({
   imports: [
     RouterModule.forRoot([
       { path: '', redirectTo: '/home', pathMatch: 'full' },
       { path: 'home', loadChildren: './+home-page/home-page.module#HomePageModule' },
-      { path: 'communities', loadChildren: './+community-page/community-page.module#CommunityPageModule' },
-      { path: 'collections', loadChildren: './+collection-page/collection-page.module#CollectionPageModule' },
+      { 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' },
       { path: 'search', loadChildren: './+search-page/search-page.module#SearchPageModule' },
       { path: 'browse', loadChildren: './+browse-by/browse-by.module#BrowseByModule' },
diff --git a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html
deleted file mode 100644
index f3bf405651..0000000000
--- a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.html
+++ /dev/null
@@ -1,6 +0,0 @@
-<div>
-    <div class="modal-header">New Collection</div>
-    <div class="modal-body">
-        <ds-dso-selector [currentDSOId]="communityRD?.payload.uuid"></ds-dso-selector>
-    </div>
-</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts
deleted file mode 100644
index cda2284835..0000000000
--- a/src/app/shared/dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { ActivatedRoute, Router } from '@angular/router';
-import { Community } from '../../../core/shared/community.model';
-import { RemoteData } from '../../../core/data/remote-data';
-
-@Component({
-  selector: 'ds-collection-selector-modal-wrapper',
-  // styleUrls: ['./collection-selector.component.scss'],
-  templateUrl: './collection-selector-modal-wrapper.component.html',
-})
-export class CollectionSelectorModalWrapperComponent implements OnInit {
-  @Input() communityRD: RemoteData<Community>;
-
-  constructor(private route: ActivatedRoute) {
-  }
-
-  ngOnInit(): void {
-    this.communityRD = this.route.root.firstChild.firstChild.snapshot.data.community;
-  }
-}
diff --git a/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.html b/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.html
deleted file mode 100644
index 91b97a25a3..0000000000
--- a/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<div>
-    <div class="modal-header">New Community</div>
-    <div class="modal-body">
-        <input/>
-        <ds-currentDSOId-selector [currentDSOId]="communityRD?.payload.uuid"></ds-currentDSOId-selector>
-    </div>
-</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.ts
deleted file mode 100644
index 8ebee7ea7f..0000000000
--- a/src/app/shared/dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { ActivatedRoute, Router } from '@angular/router';
-import { Community } from '../../../core/shared/community.model';
-import { RemoteData } from '../../../core/data/remote-data';
-
-@Component({
-  selector: 'ds-community-selector-modal-wrapper',
-  // styleUrls: ['./community-selector.component.scss'],
-  templateUrl: './community-selector-modal-wrapper.component.html',
-})
-export class CommunitySelectorModalWrapperComponent implements OnInit {
-  @Input() communityRD: RemoteData<Community>;
-
-  constructor(private route: ActivatedRoute) {
-  }
-
-  ngOnInit(): void {
-    this.communityRD = this.route.root.firstChild.firstChild.snapshot.data.community;
-  }
-}
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
index b15eaf9338..762f736b5d 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
@@ -5,8 +5,6 @@
            placeholder="{{ 'submission.sections.general.search-collection' | translate }}"
            [formControl]="input">
 </div>
-
-{{input.value}}
 <div class="dropdown-divider"></div>
 <div class="scrollable-menu">
     <button class="dropdown-item disabled" *ngIf="(listEntries$ | async)?.length == 0">
@@ -15,7 +13,7 @@
     <button *ngFor="let listEntry of (listEntries$ | async)"
             class="dropdown-item collection-item"
             title="{{ listEntry.dso.name }}"
-            (click)="onSelect(listEntry.dso)">
+            (click)="onSelect.emit(listEntry.dso)">
         <ul class="list-unstyled mb-0">
             <li class="list-item text-truncate text-secondary"
                 *ngFor="let parent of listEntry.parents">
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
index 04a5792c87..84e800ba6b 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
@@ -1,8 +1,8 @@
-import { AfterViewInit, Component, Input, OnInit } from '@angular/core';
+import { AfterViewInit, Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { FormControl } from '@angular/forms';
 
 import { Observable } from 'rxjs';
-import { map, switchMap } from 'rxjs/operators';
+import { first, map, switchMap } from 'rxjs/operators';
 import { SearchService } from '../../../+search-page/search-service/search.service';
 import { PaginatedSearchOptions } from '../../../+search-page/paginated-search-options.model';
 import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model';
@@ -10,6 +10,8 @@ import { RemoteData } from '../../../core/data/remote-data';
 import { PaginatedList } from '../../../core/data/paginated-list';
 import { SearchResult } from '../../../+search-page/search-result.model';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
+import { Router } from '@angular/router';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 
 interface DSOSelectListEntry {
   parents: DSpaceObject[],
@@ -25,12 +27,14 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
   @Input() currentDSOId: string;
   @Input() type: DSpaceObjectType;
 
+  @Output() onSelect: EventEmitter<DSpaceObject> = new EventEmitter();
+
   public input: FormControl = new FormControl();
   // private subs: Subscription[] = [];
   private defaultPagination = { id: 'dso-selector', currentPage: 1, pageSize: 5 } as any;
   listEntries$: Observable<DSOSelectListEntry[]>;
 
-  constructor(private searchService: SearchService) {
+  constructor(private searchService: SearchService, private modalService: NgbModal) {
 
   }
 
@@ -59,12 +63,23 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
           )
         })
       );
-
   }
 
+  ngAfterViewInit(): void {
+    this.listEntries$
+      .pipe(first())
+      .subscribe((entries) => {
+        if (entries.length === 1) {
+          // SELECT ENTRY
+          console.log(entries);
+        }
+      });
+
+    this.input.setValue(this.currentDSOId);
+  }
 
   retrieveParentList(dso: DSpaceObject, parents: DSpaceObject[] = []) {
-    return [{name: 'Test Community'} as any];
+    return [{ name: 'Test Community' } as any];
     // if (hasValue(dso.owner)) {
     //   dso.owner.pipe(
     //     first(),
@@ -80,15 +95,8 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
   //   this.subs.filter((sub) => hasValue(sub)).forEach((sub) => sub.unsubscribe());
   // }
 
-  onSelect(event) {
-
-  }
 
   onClose() {
-
-  }
-
-  ngAfterViewInit(): void {
-    this.input.setValue(this.currentDSOId);
+    // this.modalService.dismissAll();
   }
 }
diff --git a/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.html b/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.html
deleted file mode 100644
index 7d100cbece..0000000000
--- a/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.html
+++ /dev/null
@@ -1,6 +0,0 @@
-<div>
-    <div class="modal-header">New Item</div>
-    <div class="modal-body">
-        <ds-dso-selector [currentDSOId]="collectionRD?.payload.uuid"></ds-dso-selector>
-    </div>
-</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.ts
deleted file mode 100644
index f8d0a14359..0000000000
--- a/src/app/shared/dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { ActivatedRoute, Router } from '@angular/router';
-import { Community } from '../../../core/shared/community.model';
-import { RemoteData } from '../../../core/data/remote-data';
-import { Collection } from '../../../core/shared/collection.model';
-
-@Component({
-  selector: 'ds-item-selector-modal-wrapper',
-  // styleUrls: ['./item-selector.component.scss'],
-  templateUrl: './item-selector-modal-wrapper.component.html',
-})
-export class ItemSelectorModalWrapperComponent implements OnInit {
-  @Input() collectionRD: RemoteData<Collection>;
-
-  constructor(private route: ActivatedRoute) {
-  }
-
-  ngOnInit(): void {
-    this.collectionRD = this.route.root.firstChild.firstChild.snapshot.data.collection;
-  }
-}
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html
new file mode 100644
index 0000000000..3d65e68e23
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html
@@ -0,0 +1,6 @@
+<div>
+    <div class="modal-header">New Collection</div>
+    <div class="modal-body">
+        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type" (onSelect)="createCollection($event)"></ds-dso-selector>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
new file mode 100644
index 0000000000..57e77ce77d
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
@@ -0,0 +1,39 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
+import { Community } from '../../../../core/shared/community.model';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { map } from 'rxjs/operators';
+import { Observable } from 'rxjs';
+import { COLLECTION_PARENT_PARAMETER } from '../../../../+collection-page/collection-page-routing.module';
+
+@Component({
+  selector: 'ds-create-collection-parent-selector',
+  // styleUrls: ['./create-collection-parent-selector.component.scss'],
+  templateUrl: './create-collection-parent-selector.component.html',
+})
+export class CreateCollectionParentSelectorComponent implements OnInit {
+  @Input() communityRD$: Observable<RemoteData<Community>>;
+  type = DSpaceObjectType.COMMUNITY;
+
+  private createPath = '/collections/create';
+
+  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
+  }
+
+  ngOnInit(): void {
+    this.communityRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.community));
+  }
+
+  createCollection(dso: DSpaceObject) {
+    this.activeModal.close();
+    let navigationExtras: NavigationExtras = {
+      queryParams: {
+        [COLLECTION_PARENT_PARAMETER]: dso.uuid,
+      }
+    };
+    this.router.navigate([this.createPath], navigationExtras);
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html
new file mode 100644
index 0000000000..e32d278a44
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html
@@ -0,0 +1,7 @@
+<div>
+    <div class="modal-header">New Community</div>
+    <div class="modal-body">
+        <button class="form-control" (click)="createCommunity()">Create a new top-level community</button>
+        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type" (onSelect)="createCommunity($event)"></ds-dso-selector>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
new file mode 100644
index 0000000000..8e1eb4e23f
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
@@ -0,0 +1,43 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
+import { Community } from '../../../../core/shared/community.model';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { hasValue } from '../../../empty.util';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { map } from 'rxjs/operators';
+import { Observable } from 'rxjs';
+import { COMMUNITY_PARENT_PARAMETER } from '../../../../+community-page/community-page-routing.module';
+
+@Component({
+  selector: 'ds-create-community-parent-selector',
+  // styleUrls: ['./create-community-parent-selector.component.scss'],
+  templateUrl: './create-community-parent-selector.component.html',
+})
+export class CreateCommunityParentSelectorComponent implements OnInit {
+  @Input() communityRD$: Observable<RemoteData<Community>>;
+  type = DSpaceObjectType.COMMUNITY;
+
+  private createPath = '/communities/create';
+
+  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
+  }
+
+  ngOnInit(): void {
+    this.communityRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.community));
+  }
+
+  createCommunity(dso?: DSpaceObject) {
+    this.activeModal.close();
+    let navigationExtras: NavigationExtras = {};
+    if (hasValue(dso)) {
+      navigationExtras = {
+        queryParams: {
+          [COMMUNITY_PARENT_PARAMETER]: dso.uuid,
+        }
+      };
+    }
+    this.router.navigate([this.createPath], navigationExtras);
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html
new file mode 100644
index 0000000000..1851fb876b
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html
@@ -0,0 +1,6 @@
+<div>
+    <div class="modal-header">New Item</div>
+    <div class="modal-body">
+        <ds-dso-selector [currentDSOId]="(collectionRD$ | async)?.payload.uuid" [type]="type"></ds-dso-selector>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
new file mode 100644
index 0000000000..dba3db6959
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
@@ -0,0 +1,36 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Community } from '../../../../core/shared/community.model';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { Collection } from '../../../../core/shared/collection.model';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { hasValue } from '../../../empty.util';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { map } from 'rxjs/operators';
+import { Observable } from 'rxjs';
+
+@Component({
+  selector: 'ds-create-item-parent-selector',
+  // styleUrls: ['./create-item-parent-selector.component.scss'],
+  templateUrl: './create-item-parent-selector.component.html',
+})
+export class CreateItemParentSelectorComponent implements OnInit {
+  @Input() collectionRD$: Observable<RemoteData<Collection>>;
+  type = DSpaceObjectType.COLLECTION;
+
+  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute) {
+  }
+
+  ngOnInit(): void {
+    this.collectionRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.collection));
+  }
+
+  createItem(dso: DSpaceObject) {
+    this.activeModal.close();
+
+    let path;
+    //   path = this.createPath;
+    // this.router.navigate([path]);
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html
new file mode 100644
index 0000000000..f14110db97
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html
@@ -0,0 +1,6 @@
+<div>
+    <div class="modal-header">Edit Collection</div>
+    <div class="modal-body">
+        <ds-dso-selector [currentDSOId]="(collectionRD$ | async)?.payload.uuid" [type]="type" (onSelect)="editCollection($event)"></ds-dso-selector>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts
new file mode 100644
index 0000000000..422bd8aee0
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts
@@ -0,0 +1,33 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
+import { Community } from '../../../../core/shared/community.model';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { Collection } from '../../../../core/shared/collection.model';
+import { Observable } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { getCollectionEditPath } from '../../../../+collection-page/collection-page-routing.module';
+
+@Component({
+  selector: 'ds-edit-collection-parent-selector',
+  // styleUrls: ['./edit-collection-parent-selector.component.scss'],
+  templateUrl: './edit-collection-parent-selector.component.html',
+})
+export class EditCollectionParentSelectorComponent implements OnInit {
+  @Input() collectionRD$: Observable<RemoteData<Collection>>;
+  type = DSpaceObjectType.COLLECTION;
+
+  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
+  }
+
+  ngOnInit(): void {
+    this.collectionRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.collection));
+  }
+
+  editCollection(dso: DSpaceObject) {
+    this.activeModal.close();
+    this.router.navigate([getCollectionEditPath(dso.uuid)]);
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html
new file mode 100644
index 0000000000..2cc8c8ae19
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html
@@ -0,0 +1,6 @@
+<div>
+    <div class="modal-header">Edit Community</div>
+    <div class="modal-body">
+        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type" (onSelect)="editCommunity($event)"></ds-dso-selector>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts
new file mode 100644
index 0000000000..e14845bfa4
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts
@@ -0,0 +1,32 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Community } from '../../../../core/shared/community.model';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { Observable } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { getCommunityEditPath } from '../../../../+community-page/community-page-routing.module';
+
+@Component({
+  selector: 'ds-edit-community-parent-selector',
+  // styleUrls: ['./edit-community-parent-selector.component.scss'],
+  templateUrl: './edit-community-parent-selector.component.html',
+})
+export class EditCommunityParentSelectorComponent implements OnInit {
+  @Input() communityRD$: Observable<RemoteData<Community>>;
+  type = DSpaceObjectType.COMMUNITY;
+
+  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
+  }
+
+  ngOnInit(): void {
+    this.communityRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.collection));
+  }
+
+  editCommunity(dso: DSpaceObject) {
+    this.activeModal.close();
+    this.router.navigate([getCommunityEditPath(dso.uuid)]);
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html
new file mode 100644
index 0000000000..6bc59b96bd
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html
@@ -0,0 +1,6 @@
+<div>
+    <div class="modal-header">Edit Item</div>
+    <div class="modal-body">
+        <ds-dso-selector [currentDSOId]="(itemRD$ | async)?.payload.uuid" [type]="type" (onSelect)="editItem($event)"></ds-dso-selector>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts
new file mode 100644
index 0000000000..0a3963d6ae
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts
@@ -0,0 +1,34 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
+import { Community } from '../../../../core/shared/community.model';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { Collection } from '../../../../core/shared/collection.model';
+import { Observable } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { Item } from '../../../../core/shared/item.model';
+import { getItemEditPath } from '../../../../+item-page/item-page-routing.module';
+
+@Component({
+  selector: 'ds-edit-item-parent-selector',
+  // styleUrls: ['./edit-item-parent-selector.component.scss'],
+  templateUrl: './edit-item-parent-selector.component.html',
+})
+export class EditItemParentSelectorComponent implements OnInit {
+  @Input() itemRD$: Observable<RemoteData<Item>>;
+  type = DSpaceObjectType.ITEM;
+
+  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
+  }
+
+  ngOnInit(): void {
+    this.itemRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.item));
+  }
+
+  editItem(dso: DSpaceObject) {
+    this.activeModal.close();
+    this.router.navigate([getItemEditPath(dso.uuid)]);
+  }
+}
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.html b/src/app/shared/menu/menu-item/onclick-menu-item.component.html
index 0790ef7479..96c9049ab3 100644
--- a/src/app/shared/menu/menu-item/onclick-menu-item.component.html
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.html
@@ -1 +1 @@
-<a class="nav-item nav-link" (click)="item.function()">{{item.text | translate}}</a>
\ No newline at end of file
+<a class="nav-item nav-link" role="button" (click)="item.function()">{{item.text | translate}}</a>
\ No newline at end of file
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 2d69c70591..3ee20d435d 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -91,14 +91,17 @@ import { CreateComColPageComponent } from './comcol-forms/create-comcol-page/cre
 import { EditComColPageComponent } from './comcol-forms/edit-comcol-page/edit-comcol-page.component';
 import { DeleteComColPageComponent } from './comcol-forms/delete-comcol-page/delete-comcol-page.component';
 import { LangSwitchComponent } from './lang-switch/lang-switch.component';
-import { CollectionSelectorModalWrapperComponent } from './dso-selector/collection-selector-modal-wrapper/collection-selector-modal-wrapper.component';
 import { ObjectValuesPipe } from './utils/object-values-pipe';
 import { InListValidator } from './utils/in-list-validator.directive';
 import { AutoFocusDirective } from './utils/auto-focus.directive';
 import { ComcolPageBrowseByComponent } from './comcol-page-browse-by/comcol-page-browse-by.component';
 import { DSOSelectorComponent } from './dso-selector/dso-selector/dso-selector.component';
-import { ItemSelectorModalWrapperComponent } from './dso-selector/item-selector-modal-wrapper/item-selector-modal-wrapper.component';
-import { CommunitySelectorModalWrapperComponent } from './dso-selector/community-selector-modal-wrapper/community-selector-modal-wrapper.component';
+import { CreateCommunityParentSelectorComponent } from './dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component';
+import { CreateItemParentSelectorComponent } from './dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component';
+import { CreateCollectionParentSelectorComponent } from './dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component';
+import { EditCollectionParentSelectorComponent } from './dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component';
+import { EditItemParentSelectorComponent } from './dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component';
+import { EditCommunityParentSelectorComponent } from './dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component';
 
 const MODULES = [
   // Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -182,9 +185,12 @@ const COMPONENTS = [
   BrowseByComponent,
   InputSuggestionsComponent,
   DSOSelectorComponent,
-  CommunitySelectorModalWrapperComponent,
-  CollectionSelectorModalWrapperComponent,
-  ItemSelectorModalWrapperComponent
+  CreateCommunityParentSelectorComponent,
+  CreateCollectionParentSelectorComponent,
+  CreateItemParentSelectorComponent,
+  EditCommunityParentSelectorComponent,
+  EditCollectionParentSelectorComponent,
+  EditItemParentSelectorComponent,
 ];
 
 const ENTRY_COMPONENTS = [
@@ -199,9 +205,12 @@ const ENTRY_COMPONENTS = [
   SearchResultGridElementComponent,
   BrowseEntryListElementComponent,
   DSOSelectorComponent,
-  CommunitySelectorModalWrapperComponent,
-  CollectionSelectorModalWrapperComponent,
-  ItemSelectorModalWrapperComponent
+  CreateCommunityParentSelectorComponent,
+  CreateCollectionParentSelectorComponent,
+  CreateItemParentSelectorComponent,
+  EditCommunityParentSelectorComponent,
+  EditCollectionParentSelectorComponent,
+  EditItemParentSelectorComponent,
 ];
 
 const PROVIDERS = [

From b4d404e1d38745d53ca39ffe252f75771e26d58d Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Tue, 5 Mar 2019 16:22:52 +0100
Subject: [PATCH 05/24] fixed focus and css

---
 .../dso-selector/dso-selector.component.html  |  6 +--
 .../dso-selector/dso-selector.component.ts    | 48 +++++++++----------
 ...-collection-parent-selector.component.html |  9 +++-
 ...te-collection-parent-selector.component.ts |  6 ++-
 ...e-community-parent-selector.component.html | 18 +++++--
 ...e-community-parent-selector.component.scss |  3 ++
 ...ate-community-parent-selector.component.ts |  8 +++-
 ...create-item-parent-selector.component.html |  6 ++-
 .../create-item-parent-selector.component.ts  |  6 ++-
 ...-collection-parent-selector.component.html |  6 ++-
 ...it-collection-parent-selector.component.ts |  6 ++-
 ...t-community-parent-selector.component.html |  6 ++-
 ...dit-community-parent-selector.component.ts |  7 ++-
 .../edit-item-parent-selector.component.html  |  6 ++-
 .../edit-item-parent-selector.component.ts    |  6 ++-
 15 files changed, 103 insertions(+), 44 deletions(-)
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.scss

diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
index 762f736b5d..ceaefc2ac9 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
@@ -6,14 +6,14 @@
            [formControl]="input">
 </div>
 <div class="dropdown-divider"></div>
-<div class="scrollable-menu">
+<div class="scrollable-menu" #entryList>
     <button class="dropdown-item disabled" *ngIf="(listEntries$ | async)?.length == 0">
         {{'submission.sections.general.no-collection' | translate}}
     </button>
     <button *ngFor="let listEntry of (listEntries$ | async)"
-            class="dropdown-item collection-item"
+            class="dropdown-item list-entry"
             title="{{ listEntry.dso.name }}"
-            (click)="onSelect.emit(listEntry.dso)">
+            (click)="onSelect.emit(listEntry.dso)" #listEntryElement>
         <ul class="list-unstyled mb-0">
             <li class="list-item text-truncate text-secondary"
                 *ngFor="let parent of listEntry.parents">
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
index 84e800ba6b..6eb5716489 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
@@ -1,8 +1,18 @@
-import { AfterViewInit, Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import {
+  AfterViewInit,
+  Component,
+  ElementRef,
+  EventEmitter,
+  Input,
+  OnInit,
+  Output,
+  QueryList,
+  ViewChildren
+} from '@angular/core';
 import { FormControl } from '@angular/forms';
 
 import { Observable } from 'rxjs';
-import { first, map, switchMap } from 'rxjs/operators';
+import { map, startWith, switchMap, take } from 'rxjs/operators';
 import { SearchService } from '../../../+search-page/search-service/search.service';
 import { PaginatedSearchOptions } from '../../../+search-page/paginated-search-options.model';
 import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model';
@@ -10,8 +20,6 @@ import { RemoteData } from '../../../core/data/remote-data';
 import { PaginatedList } from '../../../core/data/paginated-list';
 import { SearchResult } from '../../../+search-page/search-result.model';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
-import { Router } from '@angular/router';
-import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 
 interface DSOSelectListEntry {
   parents: DSpaceObject[],
@@ -33,14 +41,16 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
   // private subs: Subscription[] = [];
   private defaultPagination = { id: 'dso-selector', currentPage: 1, pageSize: 5 } as any;
   listEntries$: Observable<DSOSelectListEntry[]>;
+  @ViewChildren('listEntryElement') listElements: QueryList<ElementRef>;
 
-  constructor(private searchService: SearchService, private modalService: NgbModal) {
+  constructor(private searchService: SearchService) {
 
   }
 
   ngOnInit(): void {
     this.listEntries$ = this.input.valueChanges
       .pipe(
+        startWith(this.currentDSOId),
         switchMap((query) => {
             return this.searchService.search(
               new PaginatedSearchOptions({
@@ -62,20 +72,17 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
             }
           )
         })
-      );
+      )
   }
 
   ngAfterViewInit(): void {
-    this.listEntries$
-      .pipe(first())
-      .subscribe((entries) => {
-        if (entries.length === 1) {
-          // SELECT ENTRY
-          console.log(entries);
-        }
-      });
-
-    this.input.setValue(this.currentDSOId);
+    this.listElements.changes.pipe(
+      take(1)
+    ).subscribe((changes) => {
+      if (changes.length === 1) {
+        this.listElements.first.nativeElement.focus();
+      }
+    });
   }
 
   retrieveParentList(dso: DSpaceObject, parents: DSpaceObject[] = []) {
@@ -90,13 +97,4 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
     // }
     // return parents;
   }
-
-  // ngOnDestroy(): void {
-  //   this.subs.filter((sub) => hasValue(sub)).forEach((sub) => sub.unsubscribe());
-  // }
-
-
-  onClose() {
-    // this.modalService.dismissAll();
-  }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html
index 3d65e68e23..16fd37928f 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html
@@ -1,6 +1,11 @@
 <div>
-    <div class="modal-header">New Collection</div>
+    <div class="modal-header">New Collection
+        <button type="button" class="close" (click)="close()" aria-label="Close">
+            <span aria-hidden="true">×</span>
+        </button>
+    </div>
     <div class="modal-body">
-        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type" (onSelect)="createCollection($event)"></ds-dso-selector>
+        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type"
+                         (onSelect)="createCollection($event)"></ds-dso-selector>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
index 57e77ce77d..c4bff22c7b 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
@@ -28,7 +28,7 @@ export class CreateCollectionParentSelectorComponent implements OnInit {
   }
 
   createCollection(dso: DSpaceObject) {
-    this.activeModal.close();
+    this.close();
     let navigationExtras: NavigationExtras = {
       queryParams: {
         [COLLECTION_PARENT_PARAMETER]: dso.uuid,
@@ -36,4 +36,8 @@ export class CreateCollectionParentSelectorComponent implements OnInit {
     };
     this.router.navigate([this.createPath], navigationExtras);
   }
+
+  close() {
+    this.activeModal.close();
+  }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html
index e32d278a44..a50f1a57c6 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html
@@ -1,7 +1,19 @@
 <div>
-    <div class="modal-header">New Community</div>
+    <div class="modal-header">New Community
+        <button type="button" class="close" (click)="close()" aria-label="Close">
+            <span aria-hidden="true">×</span>
+        </button>
+    </div>
     <div class="modal-body">
-        <button class="form-control" (click)="createCommunity()">Create a new top-level community</button>
-        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type" (onSelect)="createCommunity($event)"></ds-dso-selector>
+        <button class="btn btn-outline-primary btn-lg btn-block" (click)="createCommunity()">Create a new top-level community</button>
+        <h3 class="position-relative py-1 my-3 font-weight-normal">
+            <hr>
+            <div id="create-community-or-separator" class="text-center position-absolute w-100">
+                <span class="px-4 bg-white">or</span>
+            </div>
+        </h3>
+        <h5 class="px-2">Create a new community in</h5>
+        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type"
+                         (onSelect)="createCommunity($event)"></ds-dso-selector>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.scss b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.scss
new file mode 100644
index 0000000000..0daf4cfa5f
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.scss
@@ -0,0 +1,3 @@
+#create-community-or-separator {
+    top: 0;
+}
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
index 8e1eb4e23f..017f933d1f 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
@@ -12,7 +12,7 @@ import { COMMUNITY_PARENT_PARAMETER } from '../../../../+community-page/communit
 
 @Component({
   selector: 'ds-create-community-parent-selector',
-  // styleUrls: ['./create-community-parent-selector.component.scss'],
+  styleUrls: ['./create-community-parent-selector.component.scss'],
   templateUrl: './create-community-parent-selector.component.html',
 })
 export class CreateCommunityParentSelectorComponent implements OnInit {
@@ -29,7 +29,7 @@ export class CreateCommunityParentSelectorComponent implements OnInit {
   }
 
   createCommunity(dso?: DSpaceObject) {
-    this.activeModal.close();
+    this.close();
     let navigationExtras: NavigationExtras = {};
     if (hasValue(dso)) {
       navigationExtras = {
@@ -40,4 +40,8 @@ export class CreateCommunityParentSelectorComponent implements OnInit {
     }
     this.router.navigate([this.createPath], navigationExtras);
   }
+
+  close() {
+    this.activeModal.close();
+  }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html
index 1851fb876b..1009867056 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html
@@ -1,5 +1,9 @@
 <div>
-    <div class="modal-header">New Item</div>
+    <div class="modal-header">New Item
+        <button type="button" class="close" (click)="close()" aria-label="Close">
+            <span aria-hidden="true">×</span>
+        </button>
+    </div>
     <div class="modal-body">
         <ds-dso-selector [currentDSOId]="(collectionRD$ | async)?.payload.uuid" [type]="type"></ds-dso-selector>
     </div>
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
index dba3db6959..44a8d67d04 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
@@ -27,10 +27,14 @@ export class CreateItemParentSelectorComponent implements OnInit {
   }
 
   createItem(dso: DSpaceObject) {
-    this.activeModal.close();
+    this.close();
 
     let path;
     //   path = this.createPath;
     // this.router.navigate([path]);
   }
+
+  close() {
+    this.activeModal.close();
+  }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html
index f14110db97..9d050ef2fc 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html
@@ -1,5 +1,9 @@
 <div>
-    <div class="modal-header">Edit Collection</div>
+    <div class="modal-header">Edit Collection
+        <button type="button" class="close" (click)="close()" aria-label="Close">
+            <span aria-hidden="true">×</span>
+        </button>
+    </div>
     <div class="modal-body">
         <ds-dso-selector [currentDSOId]="(collectionRD$ | async)?.payload.uuid" [type]="type" (onSelect)="editCollection($event)"></ds-dso-selector>
     </div>
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts
index 422bd8aee0..11e1c47f55 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts
@@ -27,7 +27,11 @@ export class EditCollectionParentSelectorComponent implements OnInit {
   }
 
   editCollection(dso: DSpaceObject) {
-    this.activeModal.close();
+    this.close();
     this.router.navigate([getCollectionEditPath(dso.uuid)]);
   }
+
+  close() {
+    this.activeModal.close();
+  }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html
index 2cc8c8ae19..b75a760f8e 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html
@@ -1,5 +1,9 @@
 <div>
-    <div class="modal-header">Edit Community</div>
+    <div class="modal-header">Edit Community
+        <button type="button" class="close" (click)="close()" aria-label="Close">
+            <span aria-hidden="true">×</span>
+        </button>
+    </div>
     <div class="modal-body">
         <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type" (onSelect)="editCommunity($event)"></ds-dso-selector>
     </div>
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts
index e14845bfa4..8932be26ca 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts
@@ -26,7 +26,12 @@ export class EditCommunityParentSelectorComponent implements OnInit {
   }
 
   editCommunity(dso: DSpaceObject) {
-    this.activeModal.close();
+    this.close();
     this.router.navigate([getCommunityEditPath(dso.uuid)]);
   }
+
+
+  close() {
+    this.activeModal.close();
+  }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html
index 6bc59b96bd..a9c508e381 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html
@@ -1,5 +1,9 @@
 <div>
-    <div class="modal-header">Edit Item</div>
+    <div class="modal-header">Edit Item
+        <button type="button" class="close" (click)="close()" aria-label="Close">
+            <span aria-hidden="true">×</span>
+        </button>
+    </div>
     <div class="modal-body">
         <ds-dso-selector [currentDSOId]="(itemRD$ | async)?.payload.uuid" [type]="type" (onSelect)="editItem($event)"></ds-dso-selector>
     </div>
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts
index 0a3963d6ae..f71e61a1fa 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts
@@ -28,7 +28,11 @@ export class EditItemParentSelectorComponent implements OnInit {
   }
 
   editItem(dso: DSpaceObject) {
-    this.activeModal.close();
+    this.close();
     this.router.navigate([getItemEditPath(dso.uuid)]);
   }
+
+  close() {
+    this.activeModal.close();
+  }
 }

From 9abbfa955e3cb6923646f04291089423703a554e Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Wed, 6 Mar 2019 17:03:43 +0100
Subject: [PATCH 06/24] refactored, started tests

---
 config/environment.default.js                 |  5 +-
 resources/i18n/en.json                        | 26 +++++++
 .../admin-sidebar/admin-sidebar.component.ts  | 12 +--
 src/app/+search-page/search-page.module.ts    | 14 ++--
 .../dso-selector/dso-selector.component.html  | 20 ++---
 .../dso-selector.component.spec.ts            | 65 +++++++++++++++++
 .../dso-selector/dso-selector.component.ts    | 73 ++++++++++---------
 ...-collection-parent-selector.component.html | 11 ---
 ...te-collection-parent-selector.component.ts | 39 +++++-----
 ...e-community-parent-selector.component.html | 10 +--
 ...ate-community-parent-selector.component.ts | 34 ++++-----
 ...create-item-parent-selector.component.html | 10 ---
 .../create-item-parent-selector.component.ts  | 28 +++----
 .../dso-selector-modal-wrapper.component.html | 10 +++
 .../dso-selector-modal-wrapper.component.ts   | 43 +++++++++++
 ...-collection-parent-selector.component.html | 10 ---
 ...it-collection-parent-selector.component.ts | 37 ----------
 .../edit-collection-selector.component.ts     | 28 +++++++
 ...t-community-parent-selector.component.html | 10 ---
 ...dit-community-parent-selector.component.ts | 37 ----------
 .../edit-community-selector.component.ts      | 29 ++++++++
 .../edit-item-parent-selector.component.html  | 10 ---
 ...ent.ts => edit-item-selector.component.ts} | 30 ++++----
 src/app/shared/shared.module.ts               | 27 ++++---
 src/app/shared/testing/search-service-stub.ts |  4 +
 25 files changed, 348 insertions(+), 274 deletions(-)
 create mode 100644 src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
 delete mode 100644 src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html
 delete mode 100644 src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.html
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
 delete mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html
 delete mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component.ts
 delete mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html
 delete mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component.ts
 delete mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html
 rename src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/{edit-item-parent-selector.component.ts => edit-item-selector.component.ts} (57%)

diff --git a/config/environment.default.js b/config/environment.default.js
index b493d0473a..b8eae1ccff 100644
--- a/config/environment.default.js
+++ b/config/environment.default.js
@@ -10,9 +10,10 @@ module.exports = {
   // The REST API server settings.
   rest: {
     ssl: true,
-    host: 'dspace7-internal.atmire.com',
+    host: 'dspace7.4science.it',
     port: 443,
-    nameSpace: '/rest/api'
+    // NOTE: Space is capitalized because 'namespace' is a reserved string in TypeScript
+    nameSpace: '/dspace-spring-rest/api'
   },
   // Caching settings
   cache: {
diff --git a/resources/i18n/en.json b/resources/i18n/en.json
index 208e5415a8..38d90e67ea 100644
--- a/resources/i18n/en.json
+++ b/resources/i18n/en.json
@@ -642,5 +642,31 @@
   },
   "chips": {
     "remove": "Remove chip"
+  },
+  "dso-selector": {
+    "create": {
+      "community": {
+        "head": "New community",
+        "sub-level": "Create a new community in",
+        "top-level": "Create a new top-level community"
+      },
+      "collection": {
+        "head": "New collection"
+      },
+      "item": {
+        "head": "New item"
+      }
+    },
+    "edit": {
+      "community": {
+        "head": "Edit community"
+      },
+      "collection": {
+        "head": "Edit collection"
+      },
+      "item": {
+        "head": "Edit item"
+      }
+    }
   }
 }
diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index 8b71bca423..e429b57bae 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -15,9 +15,9 @@ import { OnClickMenuItemModel } from '../../shared/menu/menu-item/models/onclick
 import { CreateCommunityParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component';
 import { CreateItemParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component';
 import { CreateCollectionParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component';
-import { EditCollectionParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component';
-import { EditItemParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component';
-import { EditCommunityParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component';
+import { EditItemSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-selector.component';
+import { EditCommunitySelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component';
+import { EditCollectionSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component';
 
 /**
  * Component representing the admin sidebar
@@ -179,7 +179,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           type: MenuItemType.ONCLICK,
           text: 'menu.section.edit_community',
           function: () => {
-            this.modalService.open(EditCommunityParentSelectorComponent);
+            this.modalService.open(EditCommunitySelectorComponent);
           }
         } as OnClickMenuItemModel,
       },
@@ -192,7 +192,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           type: MenuItemType.ONCLICK,
           text: 'menu.section.edit_collection',
           function: () => {
-            this.modalService.open(EditCollectionParentSelectorComponent);
+            this.modalService.open(EditCollectionSelectorComponent);
           }
         } as OnClickMenuItemModel,
       },
@@ -205,7 +205,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           type: MenuItemType.ONCLICK,
           text: 'menu.section.edit_item',
           function: () => {
-            this.modalService.open(EditItemParentSelectorComponent);
+            this.modalService.open(EditItemSelectorComponent);
           }
         } as OnClickMenuItemModel,
       },
diff --git a/src/app/+search-page/search-page.module.ts b/src/app/+search-page/search-page.module.ts
index 5fa1fadfae..4cd0c9428b 100644
--- a/src/app/+search-page/search-page.module.ts
+++ b/src/app/+search-page/search-page.module.ts
@@ -11,7 +11,6 @@ import { CommunitySearchResultListElementComponent } from '../shared/object-list
 import { ItemSearchResultGridElementComponent } from '../shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component';
 import { CommunitySearchResultGridElementComponent } from '../shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component'
 import { CollectionSearchResultGridElementComponent } from '../shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component';
-import { SearchService } from './search-service/search.service';
 import { SearchSidebarComponent } from './search-sidebar/search-sidebar.component';
 import { SearchSidebarService } from './search-sidebar/search-sidebar.service';
 import { SearchSidebarEffects } from './search-sidebar/search-sidebar.effects';
@@ -46,13 +45,12 @@ const effects = [
     SearchResultsComponent,
     SearchSidebarComponent,
     SearchSettingsComponent,
-    ItemSearchResultListElementComponent,
-    CollectionSearchResultListElementComponent,
-    CommunitySearchResultListElementComponent,
+    // ItemSearchResultListElementComponent,
+    // CollectionSearchResultListElementComponent,
+    // CommunitySearchResultListElementComponent,
     ItemSearchResultGridElementComponent,
     CollectionSearchResultGridElementComponent,
     CommunitySearchResultGridElementComponent,
-    CommunitySearchResultListElementComponent,
     SearchFiltersComponent,
     SearchFilterComponent,
     SearchFacetFilterComponent,
@@ -70,9 +68,9 @@ const effects = [
     SearchConfigurationService
   ],
   entryComponents: [
-    ItemSearchResultListElementComponent,
-    CollectionSearchResultListElementComponent,
-    CommunitySearchResultListElementComponent,
+    // ItemSearchResultListElementComponent,
+    // CollectionSearchResultListElementComponent,
+    // CommunitySearchResultListElementComponent,
     ItemSearchResultGridElementComponent,
     CollectionSearchResultGridElementComponent,
     CommunitySearchResultGridElementComponent,
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
index ceaefc2ac9..bc520bfe3b 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
@@ -6,20 +6,14 @@
            [formControl]="input">
 </div>
 <div class="dropdown-divider"></div>
-<div class="scrollable-menu" #entryList>
-    <button class="dropdown-item disabled" *ngIf="(listEntries$ | async)?.length == 0">
+<div class="scrollable-menu list-group">
+    <button class="list-group-item list-group-item-action border-0 disabled" *ngIf="(listEntries$ | async)?.length == 0">
         {{'submission.sections.general.no-collection' | translate}}
     </button>
-    <button *ngFor="let listEntry of (listEntries$ | async)"
-            class="dropdown-item list-entry"
-            title="{{ listEntry.dso.name }}"
-            (click)="onSelect.emit(listEntry.dso)" #listEntryElement>
-        <ul class="list-unstyled mb-0">
-            <li class="list-item text-truncate text-secondary"
-                *ngFor="let parent of listEntry.parents">
-                {{ parent.name }} <i class="fa fa-level-down" aria-hidden="true"></i>
-            </li>
-            <li class="list-item text-truncate text-primary font-weight-bold">{{ listEntry.dso.name }}</li>
-        </ul>
+    <button *ngFor="let listEntry of (listEntries$ | async)?.payload.page"
+            class="list-group-item list-group-item-action border-0 list-entry"
+            title="{{ listEntry.dspaceObject.name }}"
+            (click)="onSelect.emit(listEntry.dspaceObject)" #listEntryElement>
+        <ds-wrapper-list-element [object]="listEntry"></ds-wrapper-list-element>
     </button>
 </div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
new file mode 100644
index 0000000000..38067f3dc0
--- /dev/null
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
@@ -0,0 +1,65 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { DSOSelectorComponent } from './dso-selector.component';
+import { SearchService } from '../../../+search-page/search-service/search.service';
+import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model';
+import { PaginatedSearchOptions } from '../../../+search-page/paginated-search-options.model';
+import { RemoteData } from '../../../core/data/remote-data';
+import { ItemSearchResult } from '../../object-collection/shared/item-search-result.model';
+import { Item } from '../../../core/shared/item.model';
+import { of as observableOf } from 'rxjs';
+import { PaginatedList } from '../../../core/data/paginated-list';
+
+fdescribe('DSOSelectorComponent', () => {
+  let component: DSOSelectorComponent;
+  let fixture: ComponentFixture<DSOSelectorComponent>;
+  let debugElement: DebugElement;
+
+  const currentDSOId = 'test-uuid-ford-sose';
+  const type = DSpaceObjectType.ITEM;
+  const searchResult = new ItemSearchResult();
+  const item = new Item();
+  item.metadata = { 'dc.title': [{ value: 'Item title', language: undefined }] };
+  searchResult.dspaceObject = item;
+  searchResult.hitHighlights = {};
+  const searchService = jasmine.createSpyObj('searchService', {
+    search: observableOf(new RemoteData(false, false, true, undefined, new PaginatedList(undefined, [searchResult])))
+  });
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [DSOSelectorComponent],
+      providers: [
+        { provide: SearchService, useValue: searchService },
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    })
+      .compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DSOSelectorComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    component.currentDSOId = currentDSOId;
+    component.type = type;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should initially call the search method on the SearchService with the given DSO uuid', () => {
+    const searchOptions = new PaginatedSearchOptions({
+      query: currentDSOId,
+      dsoType: type,
+      pagination: (component as any).defaultPagination
+    });
+    expect(searchService.search).toHaveBeenCalledWith(searchOptions);
+  });
+
+});
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
index 6eb5716489..f3164a37e2 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
@@ -21,32 +21,60 @@ import { PaginatedList } from '../../../core/data/paginated-list';
 import { SearchResult } from '../../../+search-page/search-result.model';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
 
-interface DSOSelectListEntry {
-  parents: DSpaceObject[],
-  dso: DSpaceObject
-}
-
 @Component({
   selector: 'ds-dso-selector',
   // styleUrls: ['./dso-selector.component.scss'],
   templateUrl: './dso-selector.component.html'
 })
+
+/**
+ * Component to render a list of DSO's of which one can be selected
+ * The user can search the list by using the input field
+ */
 export class DSOSelectorComponent implements OnInit, AfterViewInit {
+
+  /**
+   * The initially selected DSO's uuid
+   */
   @Input() currentDSOId: string;
+
+  /**
+   * The type of DSpace objects this components shows a list of
+   */
   @Input() type: DSpaceObjectType;
 
+  /**
+   * Emits the selected Object when a user selects it in the list
+   */
   @Output() onSelect: EventEmitter<DSpaceObject> = new EventEmitter();
 
+  /**
+   * Input form control to query the list
+   */
   public input: FormControl = new FormControl();
-  // private subs: Subscription[] = [];
+
+  /**
+   * Default pagination for this feature
+   */
   private defaultPagination = { id: 'dso-selector', currentPage: 1, pageSize: 5 } as any;
-  listEntries$: Observable<DSOSelectListEntry[]>;
+
+  /**
+   * List with search results of DSpace objects for the current query
+   */
+  listEntries$: Observable<RemoteData<PaginatedList<SearchResult<DSpaceObject>>>>;
+
+  /**
+   * List of element references to all elements
+   */
   @ViewChildren('listEntryElement') listElements: QueryList<ElementRef>;
 
   constructor(private searchService: SearchService) {
-
   }
 
+  /**
+   * Fills the listEntries$ variable with search results based on the input field's current value
+   * The search will always start with the initial currentDSOId value
+   */
   ngOnInit(): void {
     this.listEntries$ = this.input.valueChanges
       .pipe(
@@ -60,21 +88,13 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
               })
             )
           }
-        ),
-        map((searchResultsRD: RemoteData<PaginatedList<SearchResult<DSpaceObject>>>) => {
-          return searchResultsRD.payload.page.map(
-            (searchResult: SearchResult<DSpaceObject>) => {
-              let dso = searchResult.dspaceObject;
-              return {
-                parents: this.retrieveParentList(dso),
-                dso
-              } as DSOSelectListEntry
-            }
-          )
-        })
+        )
       )
   }
 
+  /**
+   * Make sure to set focus on the first list element when the initial search (with currentDSOId) emits a single value
+   */
   ngAfterViewInit(): void {
     this.listElements.changes.pipe(
       take(1)
@@ -84,17 +104,4 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
       }
     });
   }
-
-  retrieveParentList(dso: DSpaceObject, parents: DSpaceObject[] = []) {
-    return [{ name: 'Test Community' } as any];
-    // if (hasValue(dso.owner)) {
-    //   dso.owner.pipe(
-    //     first(),
-    //   ).subscribe((parentRD) => {
-    //     const newDSO: DSpaceObject = parentRD.payload;
-    //     parents = [...this.retrieveParentList(newDSO, parents), newDSO];
-    //   });
-    // }
-    // return parents;
-  }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html
deleted file mode 100644
index 16fd37928f..0000000000
--- a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<div>
-    <div class="modal-header">New Collection
-        <button type="button" class="close" (click)="close()" aria-label="Close">
-            <span aria-hidden="true">×</span>
-        </button>
-    </div>
-    <div class="modal-body">
-        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type"
-                         (onSelect)="createCollection($event)"></ds-dso-selector>
-    </div>
-</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
index c4bff22c7b..631480c04d 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
@@ -5,39 +5,34 @@ import { RemoteData } from '../../../../core/data/remote-data';
 import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
 import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
-import { map } from 'rxjs/operators';
-import { Observable } from 'rxjs';
-import { COLLECTION_PARENT_PARAMETER } from '../../../../+collection-page/collection-page-routing.module';
+import {
+  COLLECTION_PARENT_PARAMETER,
+  getCollectionCreatePath
+} from '../../../../+collection-page/collection-page-routing.module';
+import {
+  DSOSelectorModalWrapperComponent,
+  SelectorActionType
+} from '../dso-selector-modal-wrapper.component';
 
 @Component({
   selector: 'ds-create-collection-parent-selector',
-  // styleUrls: ['./create-collection-parent-selector.component.scss'],
-  templateUrl: './create-collection-parent-selector.component.html',
+  templateUrl: '../dso-selector-modal-wrapper.component.html',
 })
-export class CreateCollectionParentSelectorComponent implements OnInit {
-  @Input() communityRD$: Observable<RemoteData<Community>>;
-  type = DSpaceObjectType.COMMUNITY;
+export class CreateCollectionParentSelectorComponent extends DSOSelectorModalWrapperComponent implements OnInit {
+  objectType = DSpaceObjectType.COLLECTION;
+  selectorType = DSpaceObjectType.COMMUNITY;
+  action = SelectorActionType.CREATE;
 
-  private createPath = '/collections/create';
-
-  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute, private router: Router) {
+    super(activeModal, route);
   }
 
-  ngOnInit(): void {
-    this.communityRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.community));
-  }
-
-  createCollection(dso: DSpaceObject) {
-    this.close();
+  navigate(dso: DSpaceObject) {
     let navigationExtras: NavigationExtras = {
       queryParams: {
         [COLLECTION_PARENT_PARAMETER]: dso.uuid,
       }
     };
-    this.router.navigate([this.createPath], navigationExtras);
-  }
-
-  close() {
-    this.activeModal.close();
+    this.router.navigate([getCollectionCreatePath()], navigationExtras);
   }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html
index a50f1a57c6..e6a0db3b62 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.html
@@ -1,19 +1,19 @@
 <div>
-    <div class="modal-header">New Community
+    <div class="modal-header">{{'dso-selector.'+ action + '.' + objectType.toString().toLowerCase() + '.head' | translate}}
         <button type="button" class="close" (click)="close()" aria-label="Close">
             <span aria-hidden="true">×</span>
         </button>
     </div>
     <div class="modal-body">
-        <button class="btn btn-outline-primary btn-lg btn-block" (click)="createCommunity()">Create a new top-level community</button>
+        <button class="btn btn-outline-primary btn-lg btn-block" (click)="selectObject(undefined)">{{'dso-selector.create.community.top-level' | translate}}</button>
         <h3 class="position-relative py-1 my-3 font-weight-normal">
             <hr>
             <div id="create-community-or-separator" class="text-center position-absolute w-100">
                 <span class="px-4 bg-white">or</span>
             </div>
         </h3>
-        <h5 class="px-2">Create a new community in</h5>
-        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type"
-                         (onSelect)="createCommunity($event)"></ds-dso-selector>
+
+        <h5 class="px-2">{{'dso-selector.create.community.sub-level' | translate}}</h5>
+        <ds-dso-selector [currentDSOId]="(dsoRD$ | async)?.payload.uuid" [type]="selectorType" (onSelect)="selectObject($event)"></ds-dso-selector>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
index 017f933d1f..c3d112a455 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
@@ -8,28 +8,30 @@ import { hasValue } from '../../../empty.util';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 import { map } from 'rxjs/operators';
 import { Observable } from 'rxjs';
-import { COMMUNITY_PARENT_PARAMETER } from '../../../../+community-page/community-page-routing.module';
+import {
+  COMMUNITY_PARENT_PARAMETER,
+  getCommunityCreatePath
+} from '../../../../+community-page/community-page-routing.module';
+import {
+  DSOSelectorModalWrapperComponent,
+  SelectorActionType
+} from '../dso-selector-modal-wrapper.component';
 
 @Component({
   selector: 'ds-create-community-parent-selector',
   styleUrls: ['./create-community-parent-selector.component.scss'],
   templateUrl: './create-community-parent-selector.component.html',
 })
-export class CreateCommunityParentSelectorComponent implements OnInit {
-  @Input() communityRD$: Observable<RemoteData<Community>>;
-  type = DSpaceObjectType.COMMUNITY;
+export class CreateCommunityParentSelectorComponent extends DSOSelectorModalWrapperComponent implements OnInit {
+  objectType = DSpaceObjectType.COMMUNITY;
+  selectorType = DSpaceObjectType.COMMUNITY;
+  action = SelectorActionType.CREATE;
 
-  private createPath = '/communities/create';
-
-  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute, private router: Router) {
+    super(activeModal, route);
   }
 
-  ngOnInit(): void {
-    this.communityRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.community));
-  }
-
-  createCommunity(dso?: DSpaceObject) {
-    this.close();
+  navigate(dso: DSpaceObject) {
     let navigationExtras: NavigationExtras = {};
     if (hasValue(dso)) {
       navigationExtras = {
@@ -38,10 +40,6 @@ export class CreateCommunityParentSelectorComponent implements OnInit {
         }
       };
     }
-    this.router.navigate([this.createPath], navigationExtras);
-  }
-
-  close() {
-    this.activeModal.close();
+    this.router.navigate([getCommunityCreatePath()], navigationExtras);
   }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html
deleted file mode 100644
index 1009867056..0000000000
--- a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<div>
-    <div class="modal-header">New Item
-        <button type="button" class="close" (click)="close()" aria-label="Close">
-            <span aria-hidden="true">×</span>
-        </button>
-    </div>
-    <div class="modal-body">
-        <ds-dso-selector [currentDSOId]="(collectionRD$ | async)?.payload.uuid" [type]="type"></ds-dso-selector>
-    </div>
-</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
index 44a8d67d04..dac79dddcb 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
@@ -9,32 +9,28 @@ import { hasValue } from '../../../empty.util';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 import { map } from 'rxjs/operators';
 import { Observable } from 'rxjs';
+import {
+  DSOSelectorModalWrapperComponent,
+  SelectorActionType
+} from '../dso-selector-modal-wrapper.component';
 
 @Component({
   selector: 'ds-create-item-parent-selector',
   // styleUrls: ['./create-item-parent-selector.component.scss'],
-  templateUrl: './create-item-parent-selector.component.html',
+  templateUrl: '../dso-selector-modal-wrapper.component.html',
 })
-export class CreateItemParentSelectorComponent implements OnInit {
-  @Input() collectionRD$: Observable<RemoteData<Collection>>;
-  type = DSpaceObjectType.COLLECTION;
+export class CreateItemParentSelectorComponent extends DSOSelectorModalWrapperComponent implements OnInit {
+  objectType = DSpaceObjectType.ITEM;
+  selectorType = DSpaceObjectType.COLLECTION;
+  action = SelectorActionType.CREATE;
 
-  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute) {
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute, private router: Router) {
+    super(activeModal, route);
   }
 
-  ngOnInit(): void {
-    this.collectionRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.collection));
-  }
-
-  createItem(dso: DSpaceObject) {
-    this.close();
-
+  navigate(dso: DSpaceObject) {
     let path;
     //   path = this.createPath;
     // this.router.navigate([path]);
   }
-
-  close() {
-    this.activeModal.close();
-  }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.html b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.html
new file mode 100644
index 0000000000..88f4a6f917
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.html
@@ -0,0 +1,10 @@
+<div>
+  <div class="modal-header">{{'dso-selector.'+ action + '.' + objectType.toString().toLowerCase() + '.head' | translate}}
+    <button type="button" class="close" (click)="close()" aria-label="Close">
+      <span aria-hidden="true">×</span>
+    </button>
+  </div>
+  <div class="modal-body">
+    <ds-dso-selector [currentDSOId]="(dsoRD$ | async)?.payload.uuid" [type]="selectorType" (onSelect)="selectObject($event)"></ds-dso-selector>
+  </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
new file mode 100644
index 0000000000..3d053e9dcb
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
@@ -0,0 +1,43 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { Observable } from 'rxjs';
+import { DSpaceObject } from '../../../core/shared/dspace-object.model';
+import { RemoteData } from '../../../core/data/remote-data';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { map } from 'rxjs/operators';
+import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model';
+
+export enum SelectorActionType {
+  CREATE = 'create',
+  EDIT = 'edit'
+};
+
+@Component({
+  selector: 'ds-dso-selector-modal-wrapper',
+  templateUrl: './dso-selector-modal-wrapper.component.html',
+})
+export abstract class DSOSelectorModalWrapperComponent implements OnInit {
+  @Input() dsoRD$: Observable<RemoteData<DSpaceObject>>;
+  objectType: DSpaceObjectType;
+  selectorType: DSpaceObjectType;
+  action: SelectorActionType;
+
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute) {
+  }
+
+  ngOnInit(): void {
+    const typeString = this.selectorType.toString().toLowerCase();
+    this.dsoRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data[typeString]));
+  }
+
+  selectObject(dso: DSpaceObject) {
+    this.close();
+    this.navigate(dso);
+  }
+
+  abstract navigate(dso: DSpaceObject);
+
+  close() {
+    this.activeModal.close();
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html
deleted file mode 100644
index 9d050ef2fc..0000000000
--- a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<div>
-    <div class="modal-header">Edit Collection
-        <button type="button" class="close" (click)="close()" aria-label="Close">
-            <span aria-hidden="true">×</span>
-        </button>
-    </div>
-    <div class="modal-body">
-        <ds-dso-selector [currentDSOId]="(collectionRD$ | async)?.payload.uuid" [type]="type" (onSelect)="editCollection($event)"></ds-dso-selector>
-    </div>
-</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts
deleted file mode 100644
index 11e1c47f55..0000000000
--- a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
-import { Community } from '../../../../core/shared/community.model';
-import { RemoteData } from '../../../../core/data/remote-data';
-import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
-import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
-import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
-import { Collection } from '../../../../core/shared/collection.model';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
-import { getCollectionEditPath } from '../../../../+collection-page/collection-page-routing.module';
-
-@Component({
-  selector: 'ds-edit-collection-parent-selector',
-  // styleUrls: ['./edit-collection-parent-selector.component.scss'],
-  templateUrl: './edit-collection-parent-selector.component.html',
-})
-export class EditCollectionParentSelectorComponent implements OnInit {
-  @Input() collectionRD$: Observable<RemoteData<Collection>>;
-  type = DSpaceObjectType.COLLECTION;
-
-  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
-  }
-
-  ngOnInit(): void {
-    this.collectionRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.collection));
-  }
-
-  editCollection(dso: DSpaceObject) {
-    this.close();
-    this.router.navigate([getCollectionEditPath(dso.uuid)]);
-  }
-
-  close() {
-    this.activeModal.close();
-  }
-}
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component.ts
new file mode 100644
index 0000000000..edf3f37f6e
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component.ts
@@ -0,0 +1,28 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { getCollectionEditPath } from '../../../../+collection-page/collection-page-routing.module';
+import {
+  DSOSelectorModalWrapperComponent,
+  SelectorActionType
+} from '../dso-selector-modal-wrapper.component';
+
+@Component({
+  selector: 'ds-edit-collection-selector',
+  templateUrl: '../dso-selector-modal-wrapper.component.html',
+})
+export class EditCollectionSelectorComponent extends DSOSelectorModalWrapperComponent implements OnInit {
+  objectType = DSpaceObjectType.COLLECTION;
+  selectorType = DSpaceObjectType.COLLECTION;
+  action = SelectorActionType.EDIT;
+
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute, private router: Router) {
+    super(activeModal, route);
+  }
+
+  navigate(dso: DSpaceObject) {
+    this.router.navigate([getCollectionEditPath(dso.uuid)]);
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html
deleted file mode 100644
index b75a760f8e..0000000000
--- a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<div>
-    <div class="modal-header">Edit Community
-        <button type="button" class="close" (click)="close()" aria-label="Close">
-            <span aria-hidden="true">×</span>
-        </button>
-    </div>
-    <div class="modal-body">
-        <ds-dso-selector [currentDSOId]="(communityRD$ | async)?.payload.uuid" [type]="type" (onSelect)="editCommunity($event)"></ds-dso-selector>
-    </div>
-</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts
deleted file mode 100644
index 8932be26ca..0000000000
--- a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { ActivatedRoute, Router } from '@angular/router';
-import { Community } from '../../../../core/shared/community.model';
-import { RemoteData } from '../../../../core/data/remote-data';
-import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
-import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
-import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
-import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
-import { getCommunityEditPath } from '../../../../+community-page/community-page-routing.module';
-
-@Component({
-  selector: 'ds-edit-community-parent-selector',
-  // styleUrls: ['./edit-community-parent-selector.component.scss'],
-  templateUrl: './edit-community-parent-selector.component.html',
-})
-export class EditCommunityParentSelectorComponent implements OnInit {
-  @Input() communityRD$: Observable<RemoteData<Community>>;
-  type = DSpaceObjectType.COMMUNITY;
-
-  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
-  }
-
-  ngOnInit(): void {
-    this.communityRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.collection));
-  }
-
-  editCommunity(dso: DSpaceObject) {
-    this.close();
-    this.router.navigate([getCommunityEditPath(dso.uuid)]);
-  }
-
-
-  close() {
-    this.activeModal.close();
-  }
-}
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component.ts
new file mode 100644
index 0000000000..9af974782a
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component.ts
@@ -0,0 +1,29 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { getCommunityEditPath } from '../../../../+community-page/community-page-routing.module';
+import {
+  DSOSelectorModalWrapperComponent,
+  SelectorActionType
+} from '../dso-selector-modal-wrapper.component';
+
+@Component({
+  selector: 'ds-edit-community-selector',
+  templateUrl: '../dso-selector-modal-wrapper.component.html',
+})
+
+export class EditCommunitySelectorComponent extends DSOSelectorModalWrapperComponent implements OnInit {
+  objectType = DSpaceObjectType.COMMUNITY;
+  selectorType = DSpaceObjectType.COMMUNITY;
+  action = SelectorActionType.EDIT;
+
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute, private router: Router) {
+    super(activeModal, route);
+  }
+
+  navigate(dso: DSpaceObject) {
+    this.router.navigate([getCommunityEditPath(dso.uuid)]);
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html
deleted file mode 100644
index a9c508e381..0000000000
--- a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<div>
-    <div class="modal-header">Edit Item
-        <button type="button" class="close" (click)="close()" aria-label="Close">
-            <span aria-hidden="true">×</span>
-        </button>
-    </div>
-    <div class="modal-body">
-        <ds-dso-selector [currentDSOId]="(itemRD$ | async)?.payload.uuid" [type]="type" (onSelect)="editItem($event)"></ds-dso-selector>
-    </div>
-</div>
\ No newline at end of file
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-selector.component.ts
similarity index 57%
rename from src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts
rename to src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-selector.component.ts
index f71e61a1fa..ff6ab35bf3 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-selector.component.ts
@@ -10,29 +10,25 @@ import { Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
 import { Item } from '../../../../core/shared/item.model';
 import { getItemEditPath } from '../../../../+item-page/item-page-routing.module';
+import {
+  DSOSelectorModalWrapperComponent,
+  SelectorActionType
+} from '../dso-selector-modal-wrapper.component';
 
 @Component({
-  selector: 'ds-edit-item-parent-selector',
-  // styleUrls: ['./edit-item-parent-selector.component.scss'],
-  templateUrl: './edit-item-parent-selector.component.html',
+  selector: 'ds-edit-item-selector',
+  templateUrl: '../dso-selector-modal-wrapper.component.html',
 })
-export class EditItemParentSelectorComponent implements OnInit {
-  @Input() itemRD$: Observable<RemoteData<Item>>;
-  type = DSpaceObjectType.ITEM;
+export class EditItemSelectorComponent extends DSOSelectorModalWrapperComponent implements OnInit {
+  objectType = DSpaceObjectType.ITEM;
+  selectorType = DSpaceObjectType.ITEM;
+  action = SelectorActionType.EDIT;
 
-  constructor(private activeModal: NgbActiveModal, private route: ActivatedRoute, private router: Router) {
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute, private router: Router) {
+    super(activeModal, route);
   }
 
-  ngOnInit(): void {
-    this.itemRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data.item));
-  }
-
-  editItem(dso: DSpaceObject) {
-    this.close();
+  navigate(dso: DSpaceObject) {
     this.router.navigate([getItemEditPath(dso.uuid)]);
   }
-
-  close() {
-    this.activeModal.close();
-  }
 }
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 3ee20d435d..5d87148a73 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -99,9 +99,12 @@ import { DSOSelectorComponent } from './dso-selector/dso-selector/dso-selector.c
 import { CreateCommunityParentSelectorComponent } from './dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component';
 import { CreateItemParentSelectorComponent } from './dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component';
 import { CreateCollectionParentSelectorComponent } from './dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component';
-import { EditCollectionParentSelectorComponent } from './dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-parent-selector.component';
-import { EditItemParentSelectorComponent } from './dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-parent-selector.component';
-import { EditCommunityParentSelectorComponent } from './dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-parent-selector.component';
+import { CommunitySearchResultListElementComponent } from './object-list/search-result-list-element/community-search-result/community-search-result-list-element.component';
+import { CollectionSearchResultListElementComponent } from './object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component';
+import { ItemSearchResultListElementComponent } from './object-list/search-result-list-element/item-search-result/item-search-result-list-element.component';
+import { EditItemSelectorComponent } from './dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-selector.component';
+import { EditCommunitySelectorComponent } from './dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component';
+import { EditCollectionSelectorComponent } from './dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component';
 
 const MODULES = [
   // Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -188,9 +191,12 @@ const COMPONENTS = [
   CreateCommunityParentSelectorComponent,
   CreateCollectionParentSelectorComponent,
   CreateItemParentSelectorComponent,
-  EditCommunityParentSelectorComponent,
-  EditCollectionParentSelectorComponent,
-  EditItemParentSelectorComponent,
+  EditCommunitySelectorComponent,
+  EditCollectionSelectorComponent,
+  EditItemSelectorComponent,
+  CommunitySearchResultListElementComponent,
+  CollectionSearchResultListElementComponent,
+  ItemSearchResultListElementComponent,
 ];
 
 const ENTRY_COMPONENTS = [
@@ -199,6 +205,9 @@ const ENTRY_COMPONENTS = [
   CollectionListElementComponent,
   CommunityListElementComponent,
   SearchResultListElementComponent,
+  CommunitySearchResultListElementComponent,
+  CollectionSearchResultListElementComponent,
+  ItemSearchResultListElementComponent,
   ItemGridElementComponent,
   CollectionGridElementComponent,
   CommunityGridElementComponent,
@@ -208,9 +217,9 @@ const ENTRY_COMPONENTS = [
   CreateCommunityParentSelectorComponent,
   CreateCollectionParentSelectorComponent,
   CreateItemParentSelectorComponent,
-  EditCommunityParentSelectorComponent,
-  EditCollectionParentSelectorComponent,
-  EditItemParentSelectorComponent,
+  EditCommunitySelectorComponent,
+  EditCollectionSelectorComponent,
+  EditItemSelectorComponent,
 ];
 
 const PROVIDERS = [
diff --git a/src/app/shared/testing/search-service-stub.ts b/src/app/shared/testing/search-service-stub.ts
index cbc0611a47..2a46e42ef5 100644
--- a/src/app/shared/testing/search-service-stub.ts
+++ b/src/app/shared/testing/search-service-stub.ts
@@ -40,4 +40,8 @@ export class SearchServiceStub {
   getFilterLabels() {
     return observableOf([]);
   }
+
+  search() {
+    return observableOf({});
+  }
 }

From 31d24284fb7551e8f9aa2eb15d1c0024c491ea8d Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Thu, 7 Mar 2019 14:17:49 +0100
Subject: [PATCH 07/24] added tests for popups

---
 .../admin-sidebar.component.spec.ts           |  29 +++-
 .../admin-sidebar/admin-sidebar.component.ts  |   6 +-
 .../dso-selector.component.spec.ts            |   5 +-
 ...llection-parent-selector.component.spec.ts |  65 +++++++++
 ...ommunity-parent-selector.component.spec.ts |  65 +++++++++
 ...ate-community-parent-selector.component.ts |   6 +-
 ...ate-item-parent-selector.component.spec.ts |  65 +++++++++
 .../create-item-parent-selector.component.ts  |   4 +-
 ...o-selector-modal-wrapper.component.spec.ts | 129 ++++++++++++++++++
 .../dso-selector-modal-wrapper.component.ts   |  38 +++++-
 ...edit-collection-selector.component.spec.ts |  65 +++++++++
 .../edit-collection-selector.component.ts     |   0
 .../edit-community-selector.component.spec.ts |  65 +++++++++
 .../edit-community-selector.component.ts      |   0
 .../edit-item-selector.component.spec.ts      |  65 +++++++++
 .../edit-item-selector.component.ts           |   0
 .../onclick-menu-item.component.spec.ts       |  51 +++++++
 .../menu-item/onclick-menu-item.component.ts  |   5 +-
 src/app/shared/shared.module.ts               |   7 +-
 19 files changed, 639 insertions(+), 31 deletions(-)
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.spec.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.spec.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.spec.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.spec.ts
 rename src/app/shared/dso-selector/modal-wrappers/{edit-collection-parent-selector => edit-collection-selector}/edit-collection-selector.component.ts (100%)
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.spec.ts
 rename src/app/shared/dso-selector/modal-wrappers/{edit-community-parent-selector => edit-community-selector}/edit-community-selector.component.ts (100%)
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts
 rename src/app/shared/dso-selector/modal-wrappers/{edit-item-parent-selector => edit-item-selector}/edit-item-selector.component.ts (100%)
 create mode 100644 src/app/shared/menu/menu-item/onclick-menu-item.component.spec.ts

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
index c99e8adc58..e95949dd94 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
@@ -12,6 +12,7 @@ import { AuthService } from '../../core/auth/auth.service';
 
 import { of as observableOf } from 'rxjs';
 import { By } from '@angular/platform-browser';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 
 describe('AdminSidebarComponent', () => {
   let comp: AdminSidebarComponent;
@@ -26,7 +27,13 @@ describe('AdminSidebarComponent', () => {
         { provide: Injector, useValue: {} },
         { provide: MenuService, useValue: menuService },
         { provide: CSSVariableService, useClass: CSSVariableServiceStub },
-        { provide: AuthService, useClass: AuthServiceStub }
+        { provide: AuthService, useClass: AuthServiceStub },
+        {
+          provide: NgbModal, useValue: {
+            open: () => {
+            }
+          }
+        }
       ],
       schemas: [NO_ERRORS_SCHEMA]
     }).overrideComponent(AdminSidebarComponent, {
@@ -96,7 +103,10 @@ describe('AdminSidebarComponent', () => {
     beforeEach(() => {
       spyOn(menuService, 'toggleMenu');
       const sidebarToggler = fixture.debugElement.query(By.css('#sidebar-collapse-toggle')).query(By.css('a.shortcut-icon'));
-      sidebarToggler.triggerEventHandler('click', {preventDefault: () => {/**/}});
+      sidebarToggler.triggerEventHandler('click', {
+        preventDefault: () => {/**/
+        }
+      });
     });
 
     it('should call toggleMenu on the menuService', () => {
@@ -108,7 +118,10 @@ describe('AdminSidebarComponent', () => {
     beforeEach(() => {
       spyOn(menuService, 'toggleMenu');
       const sidebarToggler = fixture.debugElement.query(By.css('#sidebar-collapse-toggle')).query(By.css('.sidebar-collapsible')).query(By.css('a'));
-      sidebarToggler.triggerEventHandler('click', {preventDefault: () => {/**/}});
+      sidebarToggler.triggerEventHandler('click', {
+        preventDefault: () => {/**/
+        }
+      });
     });
 
     it('should call toggleMenu on the menuService', () => {
@@ -120,7 +133,10 @@ describe('AdminSidebarComponent', () => {
     it('should call expandPreview on the menuService after 100ms', fakeAsync(() => {
       spyOn(menuService, 'expandMenuPreview');
       const sidebarToggler = fixture.debugElement.query(By.css('nav.navbar'));
-      sidebarToggler.triggerEventHandler('mouseenter', {preventDefault: () => {/**/}});
+      sidebarToggler.triggerEventHandler('mouseenter', {
+        preventDefault: () => {/**/
+        }
+      });
       tick(99);
       expect(menuService.expandMenuPreview).not.toHaveBeenCalled();
       tick(1);
@@ -132,7 +148,10 @@ describe('AdminSidebarComponent', () => {
     it('should call collapseMenuPreview on the menuService after 400ms', fakeAsync(() => {
       spyOn(menuService, 'collapseMenuPreview');
       const sidebarToggler = fixture.debugElement.query(By.css('nav.navbar'));
-      sidebarToggler.triggerEventHandler('mouseleave', {preventDefault: () => {/**/}});
+      sidebarToggler.triggerEventHandler('mouseleave', {
+        preventDefault: () => {/**/
+        }
+      });
       tick(399);
       expect(menuService.collapseMenuPreview).not.toHaveBeenCalled();
       tick(1);
diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index e429b57bae..f148627297 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -15,9 +15,9 @@ import { OnClickMenuItemModel } from '../../shared/menu/menu-item/models/onclick
 import { CreateCommunityParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component';
 import { CreateItemParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component';
 import { CreateCollectionParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component';
-import { EditItemSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-selector.component';
-import { EditCommunitySelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component';
-import { EditCollectionSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component';
+import { EditItemSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component';
+import { EditCommunitySelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component';
+import { EditCollectionSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component';
 
 /**
  * Component representing the admin sidebar
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
index 38067f3dc0..b7fa0c420e 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
@@ -11,7 +11,7 @@ import { Item } from '../../../core/shared/item.model';
 import { of as observableOf } from 'rxjs';
 import { PaginatedList } from '../../../core/data/paginated-list';
 
-fdescribe('DSOSelectorComponent', () => {
+describe('DSOSelectorComponent', () => {
   let component: DSOSelectorComponent;
   let fixture: ComponentFixture<DSOSelectorComponent>;
   let debugElement: DebugElement;
@@ -35,8 +35,7 @@ fdescribe('DSOSelectorComponent', () => {
         { provide: SearchService, useValue: searchService },
       ],
       schemas: [NO_ERRORS_SCHEMA]
-    })
-      .compileComponents();
+    }).compileComponents();
 
   }));
 
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.spec.ts
new file mode 100644
index 0000000000..5ffbae79be
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.spec.ts
@@ -0,0 +1,65 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { of as observableOf } from 'rxjs';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ActivatedRoute, Router } from '@angular/router';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { RouterStub } from '../../../testing/router-stub';
+import * as collectionRouter from '../../../../+collection-page/collection-page-routing.module';
+import { Community } from '../../../../core/shared/community.model';
+import { CreateCollectionParentSelectorComponent } from './create-collection-parent-selector.component';
+
+describe('CreateCollectionParentSelectorComponent', () => {
+  let component: CreateCollectionParentSelectorComponent;
+  let fixture: ComponentFixture<CreateCollectionParentSelectorComponent>;
+  let debugElement: DebugElement;
+
+  const community = new Community();
+  community.uuid = '1234-1234-1234-1234';
+  community.metadata = { 'dc.title': [{ value: 'Community title', language: undefined }] };
+  const router = new RouterStub();
+  const communityRD = new RemoteData(false, false, true, undefined, community);
+  const modalStub = jasmine.createSpyObj('modalStub', ['close']);
+  const createPath = 'testCreatePath';
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [CreateCollectionParentSelectorComponent],
+      providers: [
+        { provide: NgbActiveModal, useValue: modalStub },
+        {
+          provide: ActivatedRoute,
+          useValue: { root: { firstChild: { firstChild: { data: observableOf({ community: communityRD }) } } } }
+        },
+        {
+          provide: Router, useValue: router
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    spyOnProperty(collectionRouter, 'getCollectionCreatePath').and.callFake(() => {
+        return () => createPath;
+    });
+
+    fixture = TestBed.createComponent(CreateCollectionParentSelectorComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should call navigate on the router with the correct edit path when navigate is called', () => {
+    component.navigate(community);
+    expect(router.navigate).toHaveBeenCalledWith([createPath], { queryParams: { parent: community.uuid } } );
+  });
+
+});
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.spec.ts
new file mode 100644
index 0000000000..156e8924c8
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.spec.ts
@@ -0,0 +1,65 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { of as observableOf } from 'rxjs';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ActivatedRoute, Router } from '@angular/router';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { RouterStub } from '../../../testing/router-stub';
+import * as communityRouter from '../../../../+community-page/community-page-routing.module';
+import { Community } from '../../../../core/shared/community.model';
+import { CreateCommunityParentSelectorComponent } from './create-community-parent-selector.component';
+
+describe('CreateCommunityParentSelectorComponent', () => {
+  let component: CreateCommunityParentSelectorComponent;
+  let fixture: ComponentFixture<CreateCommunityParentSelectorComponent>;
+  let debugElement: DebugElement;
+
+  const community = new Community();
+  community.uuid = '1234-1234-1234-1234';
+  community.metadata = { 'dc.title': [{ value: 'Community title', language: undefined }] };
+  const router = new RouterStub();
+  const communityRD = new RemoteData(false, false, true, undefined, community);
+  const modalStub = jasmine.createSpyObj('modalStub', ['close']);
+  const createPath = 'testCreatePath';
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [CreateCommunityParentSelectorComponent],
+      providers: [
+        { provide: NgbActiveModal, useValue: modalStub },
+        {
+          provide: ActivatedRoute,
+          useValue: { root: { firstChild: { firstChild: { data: observableOf({ community: communityRD }) } } } }
+        },
+        {
+          provide: Router, useValue: router
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    spyOnProperty(communityRouter, 'getCommunityCreatePath').and.callFake(() => {
+      return () => createPath;
+    });
+
+    fixture = TestBed.createComponent(CreateCommunityParentSelectorComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should call navigate on the router with the correct edit path when navigate is called', () => {
+    component.navigate(community);
+    expect(router.navigate).toHaveBeenCalledWith([createPath], { queryParams: { parent: community.uuid } });
+  });
+
+});
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
index c3d112a455..c8c98503d0 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
@@ -1,13 +1,9 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
-import { Community } from '../../../../core/shared/community.model';
-import { RemoteData } from '../../../../core/data/remote-data';
 import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
 import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
 import { hasValue } from '../../../empty.util';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
-import { map } from 'rxjs/operators';
-import { Observable } from 'rxjs';
 import {
   COMMUNITY_PARENT_PARAMETER,
   getCommunityCreatePath
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.spec.ts
new file mode 100644
index 0000000000..89204ff2b3
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.spec.ts
@@ -0,0 +1,65 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { of as observableOf } from 'rxjs';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ActivatedRoute, Router } from '@angular/router';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { RouterStub } from '../../../testing/router-stub';
+import { Collection } from '../../../../core/shared/collection.model';
+import { CreateItemParentSelectorComponent } from './create-item-parent-selector.component';
+
+describe('CreateItemParentSelectorComponent', () => {
+  let component: CreateItemParentSelectorComponent;
+  let fixture: ComponentFixture<CreateItemParentSelectorComponent>;
+  let debugElement: DebugElement;
+
+  const collection = new Collection();
+  collection.uuid = '1234-1234-1234-1234';
+  collection.metadata = { 'dc.title': [{ value: 'Collection title', language: undefined }] };
+  const router = new RouterStub();
+  const collectionRD = new RemoteData(false, false, true, undefined, collection);
+  const modalStub = jasmine.createSpyObj('modalStub', ['close']);
+  const createPath = 'testCreatePath';
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [CreateItemParentSelectorComponent],
+      providers: [
+        { provide: NgbActiveModal, useValue: modalStub },
+        {
+          provide: ActivatedRoute,
+          useValue: { root: { firstChild: { firstChild: { data: observableOf({ collection: collectionRD }) } } } }
+        },
+        {
+          provide: Router, useValue: router
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    // spyOnProperty(itemRouter, 'getItemCreatePath').and.callFake(() => {
+    //   return () => createPath;
+    // });
+
+    fixture = TestBed.createComponent(CreateItemParentSelectorComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should call navigate on the router with the correct create path when navigate is called', () => {
+    /* TODO when there is a specific submission path */
+    // component.navigate(item);
+    // expect(router.navigate).toHaveBeenCalledWith([createPath]);
+  });
+
+});
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
index dac79dddcb..27610304e5 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
@@ -29,8 +29,6 @@ export class CreateItemParentSelectorComponent extends DSOSelectorModalWrapperCo
   }
 
   navigate(dso: DSpaceObject) {
-    let path;
-    //   path = this.createPath;
-    // this.router.navigate([path]);
+   //There's no submit path per collection yet...
   }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts
new file mode 100644
index 0000000000..edc6a512a5
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts
@@ -0,0 +1,129 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { Component, DebugElement, NO_ERRORS_SCHEMA, OnInit } from '@angular/core';
+import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model';
+import { RemoteData } from '../../../core/data/remote-data';
+import { Item } from '../../../core/shared/item.model';
+import { of as observableOf } from 'rxjs';
+import {
+  DSOSelectorModalWrapperComponent,
+  SelectorActionType
+} from './dso-selector-modal-wrapper.component';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ActivatedRoute } from '@angular/router';
+import { DSpaceObject } from '../../../core/shared/dspace-object.model';
+import { first } from 'rxjs/operators';
+import { By } from '@angular/platform-browser';
+import { DSOSelectorComponent } from '../dso-selector/dso-selector.component';
+import { MockComponent } from 'ng-mocks';
+
+describe('DSOSelectorModalWrapperComponent', () => {
+  let component: DSOSelectorModalWrapperComponent;
+  let fixture: ComponentFixture<DSOSelectorModalWrapperComponent>;
+  let debugElement: DebugElement;
+
+  const item = new Item();
+  item.uuid = '1234-1234-1234-1234';
+  item.metadata = { 'dc.title': [{ value: 'Item title', language: undefined }] };
+
+  const itemRD = new RemoteData(false, false, true, undefined, item);
+  const modalStub = jasmine.createSpyObj('modalStub', ['close']);
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [TestComponent, MockComponent(DSOSelectorComponent)],
+      providers: [
+        { provide: NgbActiveModal, useValue: modalStub },
+        {
+          provide: ActivatedRoute,
+          useValue: { root: { firstChild: { firstChild: { data: observableOf({ item: itemRD }) } } } }
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TestComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+    component.ngOnInit();
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should initially set the DSO to the activated route\'s item/collection/community', () => {
+    component.dsoRD$
+      .pipe(first())
+      .subscribe((a) => {
+        expect(a).toEqual(itemRD);
+      })
+  });
+
+  describe('selectObject', () => {
+    beforeEach(() => {
+      spyOn(component, 'navigate');
+      spyOn(component, 'close');
+      component.selectObject(item)
+    });
+    it('should call the close and navigate method on the component with the given DSO', () => {
+      expect(component.close).toHaveBeenCalled();
+      expect(component.navigate).toHaveBeenCalledWith(item);
+    });
+  });
+
+  describe('close', () => {
+    beforeEach(() => {
+      component.close();
+    });
+    it('should call the close method on the æctive modal', () => {
+      expect(modalStub.close).toHaveBeenCalled();
+    });
+  });
+
+
+  describe('when the onSelect method emits on the child component', () => {
+    beforeEach(() => {
+      spyOn(component, 'selectObject');
+      debugElement.query(By.css('ds-dso-selector')).componentInstance.onSelect.emit(item);
+      fixture.detectChanges();
+    });
+    it('should call the selectObject method on the component with the correct object', () => {
+      expect(component.selectObject).toHaveBeenCalledWith(item);
+    });
+  });
+
+  describe('when the click method emits on close button', () => {
+    beforeEach(() => {
+      spyOn(component, 'close');
+      debugElement.query(By.css('button.close')).triggerEventHandler('click', {});
+      fixture.detectChanges();
+    });
+    it('should call the close method on the component', () => {
+      expect(component.close).toHaveBeenCalled();
+    });
+  });
+});
+
+@Component({
+  selector: 'ds-test-cmp',
+  templateUrl: './dso-selector-modal-wrapper.component.html'
+})
+class TestComponent extends DSOSelectorModalWrapperComponent implements OnInit {
+  objectType = DSpaceObjectType.ITEM;
+  selectorType = DSpaceObjectType.ITEM;
+  action = SelectorActionType.EDIT;
+
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute) {
+    super(activeModal, route);
+  }
+
+  navigate(dso: DSpaceObject) {
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
index 3d053e9dcb..7e6ee889c0 100644
--- a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Injectable, Input, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { Observable } from 'rxjs';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
@@ -10,33 +10,59 @@ import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model'
 export enum SelectorActionType {
   CREATE = 'create',
   EDIT = 'edit'
-};
+}
 
-@Component({
-  selector: 'ds-dso-selector-modal-wrapper',
-  templateUrl: './dso-selector-modal-wrapper.component.html',
-})
+@Injectable()
 export abstract class DSOSelectorModalWrapperComponent implements OnInit {
+  /**
+   * The current page's DSO
+   */
   @Input() dsoRD$: Observable<RemoteData<DSpaceObject>>;
+
+  /**
+   * The type of the DSO that's being edited or created
+   */
   objectType: DSpaceObjectType;
+
+  /**
+   * The type of DSO that can be selected from this list
+   */
   selectorType: DSpaceObjectType;
+
+  /**
+   * The type of action to perform
+   */
   action: SelectorActionType;
 
   constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute) {
   }
 
+  /**
+   * Get de current page's DSO based on the selectorType
+   */
   ngOnInit(): void {
     const typeString = this.selectorType.toString().toLowerCase();
     this.dsoRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data[typeString]));
   }
 
+  /**
+   * Method called when an object has been selected
+   * @param dso The selected DSpaceObject
+   */
   selectObject(dso: DSpaceObject) {
     this.close();
     this.navigate(dso);
   }
 
+  /**
+   * Navigate to a page based on the DSpaceObject provided
+   * @param dso The DSpaceObject which can be used to calculate the page to navigate to
+   */
   abstract navigate(dso: DSpaceObject);
 
+  /**
+   * Close the modal
+   */
   close() {
     this.activeModal.close();
   }
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.spec.ts
new file mode 100644
index 0000000000..6e4cd7b3b6
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.spec.ts
@@ -0,0 +1,65 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { of as observableOf } from 'rxjs';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ActivatedRoute, Router } from '@angular/router';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { RouterStub } from '../../../testing/router-stub';
+import * as collectionRouter from '../../../../+collection-page/collection-page-routing.module';
+import { EditCollectionSelectorComponent } from './edit-collection-selector.component';
+import { Collection } from '../../../../core/shared/collection.model';
+
+describe('EditCollectionSelectorComponent', () => {
+  let component: EditCollectionSelectorComponent;
+  let fixture: ComponentFixture<EditCollectionSelectorComponent>;
+  let debugElement: DebugElement;
+
+  const collection = new Collection();
+  collection.uuid = '1234-1234-1234-1234';
+  collection.metadata = { 'dc.title': [{ value: 'Collection title', language: undefined }] };
+  const router = new RouterStub();
+  const collectionRD = new RemoteData(false, false, true, undefined, collection);
+  const modalStub = jasmine.createSpyObj('modalStub', ['close']);
+  const editPath = 'testEditPath';
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [EditCollectionSelectorComponent],
+      providers: [
+        { provide: NgbActiveModal, useValue: modalStub },
+        {
+          provide: ActivatedRoute,
+          useValue: { root: { firstChild: { firstChild: { data: observableOf({ collection: collectionRD }) } } } }
+        },
+        {
+          provide: Router, useValue: router
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    spyOnProperty(collectionRouter, 'getCollectionEditPath').and.callFake(() => {
+      return () => editPath;
+    });
+
+    fixture = TestBed.createComponent(EditCollectionSelectorComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should call navigate on the router with the correct edit path when navigate is called', () => {
+    component.navigate(collection);
+    expect(router.navigate).toHaveBeenCalledWith([editPath]);
+  });
+
+});
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts
similarity index 100%
rename from src/app/shared/dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component.ts
rename to src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.spec.ts
new file mode 100644
index 0000000000..e66554d1c3
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.spec.ts
@@ -0,0 +1,65 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { of as observableOf } from 'rxjs';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ActivatedRoute, Router } from '@angular/router';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { RouterStub } from '../../../testing/router-stub';
+import * as communityRouter from '../../../../+community-page/community-page-routing.module';
+import { EditCommunitySelectorComponent } from './edit-community-selector.component';
+import { Community } from '../../../../core/shared/community.model';
+
+describe('EditCommunitySelectorComponent', () => {
+  let component: EditCommunitySelectorComponent;
+  let fixture: ComponentFixture<EditCommunitySelectorComponent>;
+  let debugElement: DebugElement;
+
+  const community = new Community();
+  community.uuid = '1234-1234-1234-1234';
+  community.metadata = { 'dc.title': [{ value: 'Community title', language: undefined }] };
+  const router = new RouterStub();
+  const communityRD = new RemoteData(false, false, true, undefined, community);
+  const modalStub = jasmine.createSpyObj('modalStub', ['close']);
+  const editPath = 'testEditPath';
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [EditCommunitySelectorComponent],
+      providers: [
+        { provide: NgbActiveModal, useValue: modalStub },
+        {
+          provide: ActivatedRoute,
+          useValue: { root: { firstChild: { firstChild: { data: observableOf({ community: communityRD }) } } } }
+        },
+        {
+          provide: Router, useValue: router
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    spyOnProperty(communityRouter, 'getCommunityEditPath').and.callFake(() => {
+        return () => editPath;
+    });
+
+    fixture = TestBed.createComponent(EditCommunitySelectorComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should call navigate on the router with the correct edit path when navigate is called', () => {
+    component.navigate(community);
+    expect(router.navigate).toHaveBeenCalledWith([editPath]);
+  });
+
+});
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts
similarity index 100%
rename from src/app/shared/dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component.ts
rename to src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts
new file mode 100644
index 0000000000..01de6b2de6
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts
@@ -0,0 +1,65 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { of as observableOf } from 'rxjs';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ActivatedRoute, Router } from '@angular/router';
+import { EditItemSelectorComponent } from './edit-item-selector.component';
+import { Item } from '../../../../core/shared/item.model';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { RouterStub } from '../../../testing/router-stub';
+import * as itemRouter from '../../../../+item-page/item-page-routing.module';
+
+describe('EditItemSelectorComponent', () => {
+  let component: EditItemSelectorComponent;
+  let fixture: ComponentFixture<EditItemSelectorComponent>;
+  let debugElement: DebugElement;
+
+  const item = new Item();
+  item.uuid = '1234-1234-1234-1234';
+  item.metadata = { 'dc.title': [{ value: 'Item title', language: undefined }] };
+  const router = new RouterStub();
+  const itemRD = new RemoteData(false, false, true, undefined, item);
+  const modalStub = jasmine.createSpyObj('modalStub', ['close']);
+  const editPath = 'testEditPath';
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [EditItemSelectorComponent],
+      providers: [
+        { provide: NgbActiveModal, useValue: modalStub },
+        {
+          provide: ActivatedRoute,
+          useValue: { root: { firstChild: { firstChild: { data: observableOf({ item: itemRD }) } } } }
+        },
+        {
+          provide: Router, useValue: router
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    spyOnProperty(itemRouter, 'getItemEditPath').and.callFake(() => {
+        return () => editPath;
+    });
+
+    fixture = TestBed.createComponent(EditItemSelectorComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should call navigate on the router with the correct edit path when navigate is called', () => {
+    component.navigate(item);
+    expect(router.navigate).toHaveBeenCalledWith([editPath]);
+  });
+
+});
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts
similarity index 100%
rename from src/app/shared/dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-selector.component.ts
rename to src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.spec.ts b/src/app/shared/menu/menu-item/onclick-menu-item.component.spec.ts
new file mode 100644
index 0000000000..5b085b28e4
--- /dev/null
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.spec.ts
@@ -0,0 +1,51 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TextMenuItemComponent } from './text-menu-item.component';
+import { TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { By } from '@angular/platform-browser';
+import { OnClickMenuItemComponent } from './onclick-menu-item.component';
+import { OnClickMenuItemModel } from './models/onclick.model';
+
+describe('OnClickMenuItemComponent', () => {
+  let component: OnClickMenuItemComponent;
+  let fixture: ComponentFixture<OnClickMenuItemComponent>;
+  let debugElement: DebugElement;
+  const text = 'HELLO';
+  const func = () => {
+  };
+  const item = Object.assign(new OnClickMenuItemModel(), { text, function: func });
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [OnClickMenuItemComponent],
+      providers: [
+        { provide: 'itemModelProvider', useValue: item },
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    })
+      .compileComponents();
+  }));
+
+  beforeEach(() => {
+    spyOn(item, 'function');
+    fixture = TestBed.createComponent(OnClickMenuItemComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+  });
+
+  it('should contain the correct text', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should contain the text element', () => {
+    const textContent = debugElement.query(By.css('a')).nativeElement.textContent;
+    expect(textContent).toEqual(text);
+  });
+
+  it('should contain call the function on the item when clicked', () => {
+    debugElement.query(By.css('a.nav-link')).triggerEventHandler('click', {});
+    expect(item.function).toHaveBeenCalled();
+  });
+});
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.ts b/src/app/shared/menu/menu-item/onclick-menu-item.component.ts
index 14fd5d8ffd..b981f08764 100644
--- a/src/app/shared/menu/menu-item/onclick-menu-item.component.ts
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.ts
@@ -1,11 +1,10 @@
 import { Component, Inject } from '@angular/core';
 import { MenuItemType } from '../initial-menus-state';
 import { rendersMenuItemForType } from '../menu-item.decorator';
-import { GLOBAL_CONFIG, GlobalConfig } from '../../../../config';
 import { OnClickMenuItemModel } from './models/onclick.model';
 
 /**
- * Component that renders a menu section of type LINK
+ * Component that renders a menu section of type ONCLICK
  */
 @Component({
   selector: 'ds-onclick-menu-item',
@@ -14,7 +13,7 @@ import { OnClickMenuItemModel } from './models/onclick.model';
 @rendersMenuItemForType(MenuItemType.ONCLICK)
 export class OnClickMenuItemComponent {
   item: OnClickMenuItemModel;
-  constructor(@Inject('itemModelProvider') item: OnClickMenuItemModel, @Inject(GLOBAL_CONFIG) private EnvConfig: GlobalConfig) {
+  constructor(@Inject('itemModelProvider') item: OnClickMenuItemModel) {
     this.item = item;
   }
 }
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 5d87148a73..e98da96e53 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -102,9 +102,10 @@ import { CreateCollectionParentSelectorComponent } from './dso-selector/modal-wr
 import { CommunitySearchResultListElementComponent } from './object-list/search-result-list-element/community-search-result/community-search-result-list-element.component';
 import { CollectionSearchResultListElementComponent } from './object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component';
 import { ItemSearchResultListElementComponent } from './object-list/search-result-list-element/item-search-result/item-search-result-list-element.component';
-import { EditItemSelectorComponent } from './dso-selector/modal-wrappers/edit-item-parent-selector/edit-item-selector.component';
-import { EditCommunitySelectorComponent } from './dso-selector/modal-wrappers/edit-community-parent-selector/edit-community-selector.component';
-import { EditCollectionSelectorComponent } from './dso-selector/modal-wrappers/edit-collection-parent-selector/edit-collection-selector.component';
+import { EditItemSelectorComponent } from './dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component';
+import { EditCommunitySelectorComponent } from './dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component';
+import { EditCollectionSelectorComponent } from './dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component';
+import { DSOSelectorModalWrapperComponent } from './dso-selector/modal-wrappers/dso-selector-modal-wrapper.component';
 
 const MODULES = [
   // Do NOT include UniversalModule, HttpModule, or JsonpModule here

From c60175ac80140114944d14e729a37c5eb8ec0376 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Thu, 7 Mar 2019 15:00:30 +0100
Subject: [PATCH 08/24] fixed metadata value issues

---
 resources/i18n/en.json                              |  4 +++-
 .../dso-selector/dso-selector.component.html        |  7 ++++---
 .../dso-selector/dso-selector.component.spec.ts     |  3 ++-
 ...ate-collection-parent-selector.component.spec.ts | 13 ++++++++++---
 ...eate-community-parent-selector.component.spec.ts |  3 ++-
 .../create-item-parent-selector.component.spec.ts   |  3 ++-
 .../dso-selector-modal-wrapper.component.spec.ts    |  8 +++++++-
 .../edit-collection-selector.component.spec.ts      |  3 ++-
 .../edit-community-selector.component.spec.ts       |  3 ++-
 .../edit-item-selector.component.spec.ts            |  3 ++-
 10 files changed, 36 insertions(+), 14 deletions(-)

diff --git a/resources/i18n/en.json b/resources/i18n/en.json
index 38d90e67ea..f563411231 100644
--- a/resources/i18n/en.json
+++ b/resources/i18n/en.json
@@ -667,6 +667,8 @@
       "item": {
         "head": "Edit item"
       }
-    }
+    },
+    "placeholder": "Search for a {{ type }}",
+    "no-results": "No {{ type }} found"
   }
 }
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
index bc520bfe3b..e9555a6191 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
@@ -2,13 +2,14 @@
     <input type="search"
            class="form-control"
            (click)="$event.stopPropagation();"
-           placeholder="{{ 'submission.sections.general.search-collection' | translate }}"
+           placeholder="{{'dso-selector.placeholder' | translate: { type: type.toString().toLowerCase() } }}"
            [formControl]="input">
 </div>
 <div class="dropdown-divider"></div>
 <div class="scrollable-menu list-group">
-    <button class="list-group-item list-group-item-action border-0 disabled" *ngIf="(listEntries$ | async)?.length == 0">
-        {{'submission.sections.general.no-collection' | translate}}
+    <button class="list-group-item list-group-item-action border-0 disabled"
+            *ngIf="(listEntries$ | async)?.payload.page.length == 0">
+        {{'dso-selector.no-results' | translate: { type: type.toString().toLowerCase() } }}
     </button>
     <button *ngFor="let listEntry of (listEntries$ | async)?.payload.page"
             class="list-group-item list-group-item-action border-0 list-entry"
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
index b7fa0c420e..0386276be7 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
@@ -10,6 +10,7 @@ import { ItemSearchResult } from '../../object-collection/shared/item-search-res
 import { Item } from '../../../core/shared/item.model';
 import { of as observableOf } from 'rxjs';
 import { PaginatedList } from '../../../core/data/paginated-list';
+import { MetadataValue } from '../../../core/shared/metadata.models';
 
 describe('DSOSelectorComponent', () => {
   let component: DSOSelectorComponent;
@@ -20,7 +21,7 @@ describe('DSOSelectorComponent', () => {
   const type = DSpaceObjectType.ITEM;
   const searchResult = new ItemSearchResult();
   const item = new Item();
-  item.metadata = { 'dc.title': [{ value: 'Item title', language: undefined }] };
+  item.metadata = { 'dc.title': [Object.assign(new MetadataValue(), { value: 'Item title', language: undefined })] };
   searchResult.dspaceObject = item;
   searchResult.hitHighlights = {};
   const searchService = jasmine.createSpyObj('searchService', {
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.spec.ts
index 5ffbae79be..9efeddeeab 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.spec.ts
@@ -9,6 +9,7 @@ import { RouterStub } from '../../../testing/router-stub';
 import * as collectionRouter from '../../../../+collection-page/collection-page-routing.module';
 import { Community } from '../../../../core/shared/community.model';
 import { CreateCollectionParentSelectorComponent } from './create-collection-parent-selector.component';
+import { MetadataValue } from '../../../../core/shared/metadata.models';
 
 describe('CreateCollectionParentSelectorComponent', () => {
   let component: CreateCollectionParentSelectorComponent;
@@ -17,7 +18,13 @@ describe('CreateCollectionParentSelectorComponent', () => {
 
   const community = new Community();
   community.uuid = '1234-1234-1234-1234';
-  community.metadata = { 'dc.title': [{ value: 'Community title', language: undefined }] };
+  community.metadata = {
+    'dc.title': [
+      Object.assign(new MetadataValue(), {
+      value: 'Community title',
+      language: undefined
+    })]
+  };
   const router = new RouterStub();
   const communityRD = new RemoteData(false, false, true, undefined, community);
   const modalStub = jasmine.createSpyObj('modalStub', ['close']);
@@ -44,7 +51,7 @@ describe('CreateCollectionParentSelectorComponent', () => {
 
   beforeEach(() => {
     spyOnProperty(collectionRouter, 'getCollectionCreatePath').and.callFake(() => {
-        return () => createPath;
+      return () => createPath;
     });
 
     fixture = TestBed.createComponent(CreateCollectionParentSelectorComponent);
@@ -59,7 +66,7 @@ describe('CreateCollectionParentSelectorComponent', () => {
 
   it('should call navigate on the router with the correct edit path when navigate is called', () => {
     component.navigate(community);
-    expect(router.navigate).toHaveBeenCalledWith([createPath], { queryParams: { parent: community.uuid } } );
+    expect(router.navigate).toHaveBeenCalledWith([createPath], { queryParams: { parent: community.uuid } });
   });
 
 });
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.spec.ts
index 156e8924c8..e1bb9c7997 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.spec.ts
@@ -9,6 +9,7 @@ import { RouterStub } from '../../../testing/router-stub';
 import * as communityRouter from '../../../../+community-page/community-page-routing.module';
 import { Community } from '../../../../core/shared/community.model';
 import { CreateCommunityParentSelectorComponent } from './create-community-parent-selector.component';
+import { MetadataValue } from '../../../../core/shared/metadata.models';
 
 describe('CreateCommunityParentSelectorComponent', () => {
   let component: CreateCommunityParentSelectorComponent;
@@ -17,7 +18,7 @@ describe('CreateCommunityParentSelectorComponent', () => {
 
   const community = new Community();
   community.uuid = '1234-1234-1234-1234';
-  community.metadata = { 'dc.title': [{ value: 'Community title', language: undefined }] };
+  community.metadata = { 'dc.title': [Object.assign(new MetadataValue(), { value: 'Community title', language: undefined })] };
   const router = new RouterStub();
   const communityRD = new RemoteData(false, false, true, undefined, community);
   const modalStub = jasmine.createSpyObj('modalStub', ['close']);
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.spec.ts
index 89204ff2b3..19bb58eb5a 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.spec.ts
@@ -8,6 +8,7 @@ import { RemoteData } from '../../../../core/data/remote-data';
 import { RouterStub } from '../../../testing/router-stub';
 import { Collection } from '../../../../core/shared/collection.model';
 import { CreateItemParentSelectorComponent } from './create-item-parent-selector.component';
+import { MetadataValue } from '../../../../core/shared/metadata.models';
 
 describe('CreateItemParentSelectorComponent', () => {
   let component: CreateItemParentSelectorComponent;
@@ -16,7 +17,7 @@ describe('CreateItemParentSelectorComponent', () => {
 
   const collection = new Collection();
   collection.uuid = '1234-1234-1234-1234';
-  collection.metadata = { 'dc.title': [{ value: 'Collection title', language: undefined }] };
+  collection.metadata = { 'dc.title': [Object.assign(new MetadataValue(), { value: 'Collection title', language: undefined })] };
   const router = new RouterStub();
   const collectionRD = new RemoteData(false, false, true, undefined, collection);
   const modalStub = jasmine.createSpyObj('modalStub', ['close']);
diff --git a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts
index edc6a512a5..2c7ddeb265 100644
--- a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts
@@ -16,6 +16,7 @@ import { first } from 'rxjs/operators';
 import { By } from '@angular/platform-browser';
 import { DSOSelectorComponent } from '../dso-selector/dso-selector.component';
 import { MockComponent } from 'ng-mocks';
+import { MetadataMap, MetadataValue } from '../../../core/shared/metadata.models';
 
 describe('DSOSelectorModalWrapperComponent', () => {
   let component: DSOSelectorModalWrapperComponent;
@@ -24,7 +25,12 @@ describe('DSOSelectorModalWrapperComponent', () => {
 
   const item = new Item();
   item.uuid = '1234-1234-1234-1234';
-  item.metadata = { 'dc.title': [{ value: 'Item title', language: undefined }] };
+  item.metadata = {
+    'dc.title': [Object.assign(new MetadataValue(), {
+      value: 'Item title',
+      language: undefined
+    })]
+  };
 
   const itemRD = new RemoteData(false, false, true, undefined, item);
   const modalStub = jasmine.createSpyObj('modalStub', ['close']);
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.spec.ts
index 6e4cd7b3b6..5e60348527 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.spec.ts
@@ -9,6 +9,7 @@ import { RouterStub } from '../../../testing/router-stub';
 import * as collectionRouter from '../../../../+collection-page/collection-page-routing.module';
 import { EditCollectionSelectorComponent } from './edit-collection-selector.component';
 import { Collection } from '../../../../core/shared/collection.model';
+import { MetadataValue } from '../../../../core/shared/metadata.models';
 
 describe('EditCollectionSelectorComponent', () => {
   let component: EditCollectionSelectorComponent;
@@ -17,7 +18,7 @@ describe('EditCollectionSelectorComponent', () => {
 
   const collection = new Collection();
   collection.uuid = '1234-1234-1234-1234';
-  collection.metadata = { 'dc.title': [{ value: 'Collection title', language: undefined }] };
+  collection.metadata = { 'dc.title': [Object.assign(new MetadataValue(), { value: 'Collection title', language: undefined })] };
   const router = new RouterStub();
   const collectionRD = new RemoteData(false, false, true, undefined, collection);
   const modalStub = jasmine.createSpyObj('modalStub', ['close']);
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.spec.ts
index e66554d1c3..ac558a074a 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.spec.ts
@@ -9,6 +9,7 @@ import { RouterStub } from '../../../testing/router-stub';
 import * as communityRouter from '../../../../+community-page/community-page-routing.module';
 import { EditCommunitySelectorComponent } from './edit-community-selector.component';
 import { Community } from '../../../../core/shared/community.model';
+import { MetadataValue } from '../../../../core/shared/metadata.models';
 
 describe('EditCommunitySelectorComponent', () => {
   let component: EditCommunitySelectorComponent;
@@ -17,7 +18,7 @@ describe('EditCommunitySelectorComponent', () => {
 
   const community = new Community();
   community.uuid = '1234-1234-1234-1234';
-  community.metadata = { 'dc.title': [{ value: 'Community title', language: undefined }] };
+  community.metadata = { 'dc.title': [Object.assign(new MetadataValue(), { value: 'Community title', language: undefined })] };
   const router = new RouterStub();
   const communityRD = new RemoteData(false, false, true, undefined, community);
   const modalStub = jasmine.createSpyObj('modalStub', ['close']);
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts
index 01de6b2de6..8ac04bb335 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts
@@ -9,6 +9,7 @@ import { Item } from '../../../../core/shared/item.model';
 import { RemoteData } from '../../../../core/data/remote-data';
 import { RouterStub } from '../../../testing/router-stub';
 import * as itemRouter from '../../../../+item-page/item-page-routing.module';
+import { MetadataValue } from '../../../../core/shared/metadata.models';
 
 describe('EditItemSelectorComponent', () => {
   let component: EditItemSelectorComponent;
@@ -17,7 +18,7 @@ describe('EditItemSelectorComponent', () => {
 
   const item = new Item();
   item.uuid = '1234-1234-1234-1234';
-  item.metadata = { 'dc.title': [{ value: 'Item title', language: undefined }] };
+  item.metadata = { 'dc.title': [Object.assign(new MetadataValue(), { value: 'Item title', language: undefined })] };
   const router = new RouterStub();
   const itemRD = new RemoteData(false, false, true, undefined, item);
   const modalStub = jasmine.createSpyObj('modalStub', ['close']);

From 56271c35142aaeb45aca4d6ef4ba2efb29493665 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Thu, 7 Mar 2019 15:31:57 +0100
Subject: [PATCH 09/24] fixed focus for first list result

---
 .../dso-selector/dso-selector.component.html    |  2 +-
 .../dso-selector/dso-selector.component.ts      | 17 +++++++----------
 ...eate-collection-parent-selector.component.ts |  3 +++
 ...reate-community-parent-selector.component.ts |  3 +++
 .../create-item-parent-selector.component.ts    |  3 +++
 .../edit-collection-selector.component.ts       |  3 +++
 .../edit-community-selector.component.ts        |  3 +++
 .../edit-item-selector.component.ts             |  3 +++
 .../menu-item/onclick-menu-item.component.scss  |  3 +++
 .../menu-item/onclick-menu-item.component.ts    |  1 +
 10 files changed, 30 insertions(+), 11 deletions(-)
 create mode 100644 src/app/shared/menu/menu-item/onclick-menu-item.component.scss

diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
index e9555a6191..1e0deed4b9 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
@@ -3,7 +3,7 @@
            class="form-control"
            (click)="$event.stopPropagation();"
            placeholder="{{'dso-selector.placeholder' | translate: { type: type.toString().toLowerCase() } }}"
-           [formControl]="input">
+           [formControl]="input" dsAutoFocus (keyup.enter)="selectSingleResult()">
 </div>
 <div class="dropdown-divider"></div>
 <div class="scrollable-menu list-group">
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
index f3164a37e2..7bb9bfac28 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
@@ -31,7 +31,7 @@ import { DSpaceObject } from '../../../core/shared/dspace-object.model';
  * Component to render a list of DSO's of which one can be selected
  * The user can search the list by using the input field
  */
-export class DSOSelectorComponent implements OnInit, AfterViewInit {
+export class DSOSelectorComponent implements OnInit {
 
   /**
    * The initially selected DSO's uuid
@@ -76,6 +76,7 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
    * The search will always start with the initial currentDSOId value
    */
   ngOnInit(): void {
+    this.input.setValue(this.currentDSOId);
     this.listEntries$ = this.input.valueChanges
       .pipe(
         startWith(this.currentDSOId),
@@ -93,15 +94,11 @@ export class DSOSelectorComponent implements OnInit, AfterViewInit {
   }
 
   /**
-   * Make sure to set focus on the first list element when the initial search (with currentDSOId) emits a single value
+   * Set focus on the first list element when there is only one result
    */
-  ngAfterViewInit(): void {
-    this.listElements.changes.pipe(
-      take(1)
-    ).subscribe((changes) => {
-      if (changes.length === 1) {
-        this.listElements.first.nativeElement.focus();
-      }
-    });
+  selectSingleResult(): void {
+    if (this.listElements.length > 0) {
+      this.listElements.first.nativeElement.click();
+    }
   }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
index 631480c04d..ea2da41849 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
@@ -27,6 +27,9 @@ export class CreateCollectionParentSelectorComponent extends DSOSelectorModalWra
     super(activeModal, route);
   }
 
+  /**
+   * Navigate to the collection create page
+   */
   navigate(dso: DSpaceObject) {
     let navigationExtras: NavigationExtras = {
       queryParams: {
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
index c8c98503d0..b8cc28b9fc 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
@@ -27,6 +27,9 @@ export class CreateCommunityParentSelectorComponent extends DSOSelectorModalWrap
     super(activeModal, route);
   }
 
+  /**
+   * Navigate to the community create page
+   */
   navigate(dso: DSpaceObject) {
     let navigationExtras: NavigationExtras = {};
     if (hasValue(dso)) {
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
index 27610304e5..dad0a2eb41 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
@@ -28,6 +28,9 @@ export class CreateItemParentSelectorComponent extends DSOSelectorModalWrapperCo
     super(activeModal, route);
   }
 
+  /**
+   * Navigate to the item create page
+   */
   navigate(dso: DSpaceObject) {
    //There's no submit path per collection yet...
   }
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts
index edf3f37f6e..dab5b8eea3 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts
@@ -22,6 +22,9 @@ export class EditCollectionSelectorComponent extends DSOSelectorModalWrapperComp
     super(activeModal, route);
   }
 
+  /**
+   * Navigate to the collection edit page
+   */
   navigate(dso: DSpaceObject) {
     this.router.navigate([getCollectionEditPath(dso.uuid)]);
   }
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts
index 9af974782a..ce688d17ae 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts
@@ -23,6 +23,9 @@ export class EditCommunitySelectorComponent extends DSOSelectorModalWrapperCompo
     super(activeModal, route);
   }
 
+  /**
+   * Navigate to the community edit page
+   */
   navigate(dso: DSpaceObject) {
     this.router.navigate([getCommunityEditPath(dso.uuid)]);
   }
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts
index ff6ab35bf3..e14be10435 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts
@@ -28,6 +28,9 @@ export class EditItemSelectorComponent extends DSOSelectorModalWrapperComponent
     super(activeModal, route);
   }
 
+  /**
+   * Navigate to the item edit page
+   */
   navigate(dso: DSpaceObject) {
     this.router.navigate([getItemEditPath(dso.uuid)]);
   }
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.scss b/src/app/shared/menu/menu-item/onclick-menu-item.component.scss
new file mode 100644
index 0000000000..adb670aa6f
--- /dev/null
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.scss
@@ -0,0 +1,3 @@
+a {
+    cursor: pointer;
+}
\ No newline at end of file
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.ts b/src/app/shared/menu/menu-item/onclick-menu-item.component.ts
index b981f08764..95b896ed64 100644
--- a/src/app/shared/menu/menu-item/onclick-menu-item.component.ts
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.ts
@@ -8,6 +8,7 @@ import { OnClickMenuItemModel } from './models/onclick.model';
  */
 @Component({
   selector: 'ds-onclick-menu-item',
+  styleUrls: ['./onclick-menu-item.component.scss'],
   templateUrl: './onclick-menu-item.component.html'
 })
 @rendersMenuItemForType(MenuItemType.ONCLICK)

From ede9f05e92c17d10e0265d696669f655f53ef0ea Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Fri, 8 Mar 2019 08:51:33 +0100
Subject: [PATCH 10/24] fixed documentation

---
 src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts   | 3 +--
 .../create-collection-parent-selector.component.ts             | 2 +-
 .../create-item-parent-selector.component.ts                   | 2 +-
 .../dso-selector-modal-wrapper.component.spec.ts               | 2 +-
 .../modal-wrappers/dso-selector-modal-wrapper.component.ts     | 2 +-
 .../shared/menu/menu-item/onclick-menu-item.component.spec.ts  | 1 +
 6 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
index e95949dd94..590caaaccf 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
@@ -30,8 +30,7 @@ describe('AdminSidebarComponent', () => {
         { provide: AuthService, useClass: AuthServiceStub },
         {
           provide: NgbModal, useValue: {
-            open: () => {
-            }
+            open: () => {/*comment*/}
           }
         }
       ],
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
index ea2da41849..20968456b3 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
@@ -31,7 +31,7 @@ export class CreateCollectionParentSelectorComponent extends DSOSelectorModalWra
    * Navigate to the collection create page
    */
   navigate(dso: DSpaceObject) {
-    let navigationExtras: NavigationExtras = {
+    const navigationExtras: NavigationExtras = {
       queryParams: {
         [COLLECTION_PARENT_PARAMETER]: dso.uuid,
       }
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
index dad0a2eb41..5dc6e4fe78 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
@@ -32,6 +32,6 @@ export class CreateItemParentSelectorComponent extends DSOSelectorModalWrapperCo
    * Navigate to the item create page
    */
   navigate(dso: DSpaceObject) {
-   //There's no submit path per collection yet...
+   // There's no submit path per collection yet...
   }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts
index 2c7ddeb265..ea857f7d62 100644
--- a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.spec.ts
@@ -93,7 +93,6 @@ describe('DSOSelectorModalWrapperComponent', () => {
     });
   });
 
-
   describe('when the onSelect method emits on the child component', () => {
     beforeEach(() => {
       spyOn(component, 'selectObject');
@@ -131,5 +130,6 @@ class TestComponent extends DSOSelectorModalWrapperComponent implements OnInit {
   }
 
   navigate(dso: DSpaceObject) {
+    /* comment */
   }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
index 7e6ee889c0..8414f00830 100644
--- a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
@@ -42,7 +42,7 @@ export abstract class DSOSelectorModalWrapperComponent implements OnInit {
    */
   ngOnInit(): void {
     const typeString = this.selectorType.toString().toLowerCase();
-    this.dsoRD$ = this.route.root.firstChild.firstChild.data.pipe(map(data => data[typeString]));
+    this.dsoRD$ = this.route.root.firstChild.firstChild.data.pipe(map((data) => data[typeString]));
   }
 
   /**
diff --git a/src/app/shared/menu/menu-item/onclick-menu-item.component.spec.ts b/src/app/shared/menu/menu-item/onclick-menu-item.component.spec.ts
index 5b085b28e4..dd031a96e0 100644
--- a/src/app/shared/menu/menu-item/onclick-menu-item.component.spec.ts
+++ b/src/app/shared/menu/menu-item/onclick-menu-item.component.spec.ts
@@ -12,6 +12,7 @@ describe('OnClickMenuItemComponent', () => {
   let debugElement: DebugElement;
   const text = 'HELLO';
   const func = () => {
+    /* comment */
   };
   const item = Object.assign(new OnClickMenuItemModel(), { text, function: func });
 

From f1686f3de1b7c8f853a5509573fbd5ab61540ea8 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Mon, 11 Mar 2019 12:40:29 +0100
Subject: [PATCH 11/24] applied feedback

---
 src/app/+search-page/search-page.module.ts               | 9 +++------
 .../create-collection-parent-selector.component.ts       | 5 +++++
 .../create-community-parent-selector.component.ts        | 7 +++++++
 .../create-item-parent-selector.component.ts             | 5 +++++
 .../dso-selector-modal-wrapper.component.ts              | 4 ++++
 .../edit-collection-selector.component.ts                | 5 +++++
 .../edit-community-selector.component.ts                 | 5 +++++
 .../edit-item-selector/edit-item-selector.component.ts   | 5 +++++
 8 files changed, 39 insertions(+), 6 deletions(-)

diff --git a/src/app/+search-page/search-page.module.ts b/src/app/+search-page/search-page.module.ts
index 4cd0c9428b..505065e44c 100644
--- a/src/app/+search-page/search-page.module.ts
+++ b/src/app/+search-page/search-page.module.ts
@@ -45,9 +45,6 @@ const effects = [
     SearchResultsComponent,
     SearchSidebarComponent,
     SearchSettingsComponent,
-    // ItemSearchResultListElementComponent,
-    // CollectionSearchResultListElementComponent,
-    // CommunitySearchResultListElementComponent,
     ItemSearchResultGridElementComponent,
     CollectionSearchResultGridElementComponent,
     CommunitySearchResultGridElementComponent,
@@ -68,9 +65,9 @@ const effects = [
     SearchConfigurationService
   ],
   entryComponents: [
-    // ItemSearchResultListElementComponent,
-    // CollectionSearchResultListElementComponent,
-    // CommunitySearchResultListElementComponent,
+    ItemSearchResultListElementComponent,
+    CollectionSearchResultListElementComponent,
+    CommunitySearchResultListElementComponent,
     ItemSearchResultGridElementComponent,
     CollectionSearchResultGridElementComponent,
     CommunitySearchResultGridElementComponent,
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
index 20968456b3..1e129c0dbe 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component.ts
@@ -14,6 +14,11 @@ import {
   SelectorActionType
 } from '../dso-selector-modal-wrapper.component';
 
+/**
+ * Component to wrap a list of existing communities inside a modal
+ * Used to choose a community from to create a new collection in
+ */
+
 @Component({
   selector: 'ds-create-collection-parent-selector',
   templateUrl: '../dso-selector-modal-wrapper.component.html',
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
index b8cc28b9fc..914dc7582f 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component.ts
@@ -13,6 +13,13 @@ import {
   SelectorActionType
 } from '../dso-selector-modal-wrapper.component';
 
+/**
+ * Component to wrap a button - for top communities -
+ * and a list of parent communities - for sub communities
+ * inside a modal
+ * Used to create a new community
+ */
+
 @Component({
   selector: 'ds-create-community-parent-selector',
   styleUrls: ['./create-community-parent-selector.component.scss'],
diff --git a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
index 5dc6e4fe78..dac5888bf7 100644
--- a/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/create-item-parent-selector/create-item-parent-selector.component.ts
@@ -14,6 +14,11 @@ import {
   SelectorActionType
 } from '../dso-selector-modal-wrapper.component';
 
+/**
+ * Component to wrap a list of existing collections inside a modal
+ * Used to choose a collection from to create a new item in
+ */
+
 @Component({
   selector: 'ds-create-item-parent-selector',
   // styleUrls: ['./create-item-parent-selector.component.scss'],
diff --git a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
index 8414f00830..351a92302c 100644
--- a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
@@ -12,6 +12,10 @@ export enum SelectorActionType {
   EDIT = 'edit'
 }
 
+/**
+ * Abstract base class that represents a wrapper for modal content used to select a DSpace Object
+ */
+
 @Injectable()
 export abstract class DSOSelectorModalWrapperComponent implements OnInit {
   /**
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts
index dab5b8eea3..79660b9589 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component.ts
@@ -9,6 +9,11 @@ import {
   SelectorActionType
 } from '../dso-selector-modal-wrapper.component';
 
+/**
+ * Component to wrap a list of existing collections inside a modal
+ * Used to choose a collection from to edit
+ */
+
 @Component({
   selector: 'ds-edit-collection-selector',
   templateUrl: '../dso-selector-modal-wrapper.component.html',
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts
index ce688d17ae..6b9efc1ff4 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component.ts
@@ -9,6 +9,11 @@ import {
   SelectorActionType
 } from '../dso-selector-modal-wrapper.component';
 
+/**
+ * Component to wrap a list of existing communities inside a modal
+ * Used to choose a community from to edit
+ */
+
 @Component({
   selector: 'ds-edit-community-selector',
   templateUrl: '../dso-selector-modal-wrapper.component.html',
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts
index e14be10435..9182df8045 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.ts
@@ -15,6 +15,11 @@ import {
   SelectorActionType
 } from '../dso-selector-modal-wrapper.component';
 
+/**
+ * Component to wrap a list of existing items inside a modal
+ * Used to choose an item from to edit
+ */
+
 @Component({
   selector: 'ds-edit-item-selector',
   templateUrl: '../dso-selector-modal-wrapper.component.html',

From db9861b4951a76b6277e62028ecbcfa6c56ffff6 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Mon, 11 Mar 2019 16:28:42 +0100
Subject: [PATCH 12/24] Added search filter optimalisations

---
 .../search-boolean-filter.component.html         |  2 +-
 .../search-facet-filter.component.ts             |  8 ++++++++
 .../search-filter/search-filter.service.ts       | 14 +++++++++-----
 .../search-hierarchy-filter.component.html       |  2 +-
 .../search-range-filter.component.html           |  2 +-
 .../search-text-filter.component.html            |  2 +-
 .../search-filters/search-filters.component.html |  2 +-
 .../search-filters/search-filters.component.ts   | 16 +++++++++++++---
 src/app/shared/services/route.service.ts         |  2 +-
 9 files changed, 36 insertions(+), 14 deletions(-)

diff --git a/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
index 32d9ea6e77..216683c122 100644
--- a/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
@@ -8,7 +8,7 @@
         </a>
       <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
         <div [@facetLoad]="animationState">
-          <ng-container *ngFor="let value of page.page; let i=index">
+          <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
                 <a *ngIf="!(selectedValues | async).includes(value.value)" class="d-flex flex-row"
                    [routerLink]="[getSearchLink()]"
                    [queryParams]="getAddParams(value.value) | async" queryParamsHandling="merge">
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
index 1675dd051a..f4f835c152 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
@@ -290,6 +290,14 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
   getDisplayValue(facet: FacetValue, query: string): string {
     return new EmphasizePipe().transform(facet.value, query) + ' (' + facet.count + ')';
   }
+
+
+  /**
+   * Prevent unnecessary rerendering
+   */
+  trackUpdate(index, value: FacetValue) {
+    return value ? value.search : undefined;
+  }
 }
 
 export const facetLoad = trigger('facetLoad', [
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.service.ts b/src/app/+search-page/search-filters/search-filter/search-filter.service.ts
index bf21eab367..34c34ee4cc 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.service.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.service.ts
@@ -1,6 +1,6 @@
 import { combineLatest as observableCombineLatest, Observable } from 'rxjs';
 import { Injectable, InjectionToken } from '@angular/core';
-import { map } from 'rxjs/operators';
+import { distinctUntilChanged, map } from 'rxjs/operators';
 import { SearchFiltersState, SearchFilterState } from './search-filter.reducer';
 import { createSelector, MemoizedSelector, select, Store } from '@ngrx/store';
 import {
@@ -65,7 +65,9 @@ export class SearchFilterService {
 
     return observableCombineLatest(values$, prefixValues$).pipe(
       map(([values, prefixValues]) => {
-          if (isNotEmpty(values)) {
+        console.log('getSelectedValuesForFilter ', values, prefixValues);
+
+        if (isNotEmpty(values)) {
             return values;
           }
           return prefixValues;
@@ -88,13 +90,14 @@ export class SearchFilterService {
         } else {
           return false;
         }
-      })
+      }),
+      distinctUntilChanged()
     );
   }
 
   /**
    * Request the current page of a given filter
-   * @param {string} filterName The filtername for which the page state is checked
+   * @param {string} filterName The filter name for which the page state is checked
    * @returns {Observable<boolean>} Emits the current page state of the given filter, if it's unavailable, return 1
    */
   getPage(filterName: string): Observable<number> {
@@ -106,7 +109,8 @@ export class SearchFilterService {
         } else {
           return 1;
         }
-      }));
+      }),
+      distinctUntilChanged());
   }
 
   /**
diff --git a/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
index 812f543716..5434f0e0f4 100644
--- a/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
@@ -8,7 +8,7 @@
         </a>
         <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
           <div [@facetLoad]="animationState">
-            <ng-container *ngFor="let value of page.page; let i=index">
+            <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
                 <a *ngIf="!(selectedValues | async).includes(value.value)" class="d-flex flex-row"
                    [routerLink]="[getSearchLink()]"
                    [queryParams]="getAddParams(value.value) | async" queryParamsHandling="merge" >
diff --git a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
index 352c1710c0..1cc0556ed5 100644
--- a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
@@ -24,7 +24,7 @@
         </ng-container>
       <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
         <div [@facetLoad]="animationState">
-          <ng-container *ngFor="let value of page.page; let i=index">
+          <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
                 <a *ngIf="!(selectedValues | async).includes(value.value)" class="d-flex flex-row"
                    [routerLink]="[getSearchLink()]"
                    [queryParams]="getChangeParams(value.value) | async" queryParamsHandling="merge">
diff --git a/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
index fcc2393b93..32f6fe2153 100644
--- a/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
@@ -9,7 +9,7 @@
         <ng-container *ngVar="(filterValues$ | async) as filterValuesRD">
           <div [@facetLoad]="animationState">
             <ng-container *ngFor="let page of filterValuesRD?.payload">
-              <ng-container *ngFor="let value of page.page; let i=index">
+              <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
                 <a *ngIf="!(selectedValues | async).includes(value.value)" class="d-flex flex-row"
                    [routerLink]="[getSearchLink()]"
                    [queryParams]="getAddParams(value.value) | async" queryParamsHandling="merge" >
diff --git a/src/app/+search-page/search-filters/search-filters.component.html b/src/app/+search-page/search-filters/search-filters.component.html
index 0522c1fba0..de725f0958 100644
--- a/src/app/+search-page/search-filters/search-filters.component.html
+++ b/src/app/+search-page/search-filters/search-filters.component.html
@@ -1,6 +1,6 @@
 <h3>{{"search.filters.head" | translate}}</h3>
 <div *ngIf="(filters | async)?.hasSucceeded">
-    <div *ngFor="let filter of (filters | async)?.payload">
+    <div *ngFor="let filter of (filters | async)?.payload; trackBy: trackUpdate">
         <ds-search-filter *ngIf="isActive(filter) | async" class="d-block mb-3 p-3" [filter]="filter"></ds-search-filter>
     </div>
 </div>
diff --git a/src/app/+search-page/search-filters/search-filters.component.ts b/src/app/+search-page/search-filters/search-filters.component.ts
index f16faff1f3..0d32df4867 100644
--- a/src/app/+search-page/search-filters/search-filters.component.ts
+++ b/src/app/+search-page/search-filters/search-filters.component.ts
@@ -1,6 +1,6 @@
 import { Observable, of as observableOf } from 'rxjs';
 
-import { filter, map, mergeMap, startWith, switchMap } from 'rxjs/operators';
+import { filter, first, map, mergeMap, startWith, switchMap, tap } from 'rxjs/operators';
 import { Component } from '@angular/core';
 import { SearchService } from '../search-service/search.service';
 import { RemoteData } from '../../core/data/remote-data';
@@ -9,6 +9,7 @@ import { SearchConfigurationService } from '../search-service/search-configurati
 import { isNotEmpty } from '../../shared/empty.util';
 import { SearchFilterService } from './search-filter/search-filter.service';
 import { getSucceededRemoteData } from '../../core/shared/operators';
+import { FieldUpdate } from '../../core/data/object-updates/object-updates.reducer';
 
 @Component({
   selector: 'ds-search-filters',
@@ -59,11 +60,13 @@ export class SearchFiltersComponent {
    */
   isActive(filterConfig: SearchFilterConfig): Observable<boolean> {
     return this.filterService.getSelectedValuesForFilter(filterConfig).pipe(
-      mergeMap((isActive) => {
+      switchMap((isActive) => {
+        console.log('selected fires');
         if (isNotEmpty(isActive)) {
           return observableOf(true);
         } else {
           return this.searchConfigService.searchOptions.pipe(
+            first(),
             switchMap((options) => {
                 return this.searchService.getFacetValuesFor(filterConfig, 1, options).pipe(
                   filter((RD) => !RD.isLoading),
@@ -73,6 +76,13 @@ export class SearchFiltersComponent {
               }
             ))
         }
-      }),startWith(true),);
+      }), tap(t => console.log(t)), startWith(true));
+  }
+
+  /**
+   * Prevent unnecessary rerendering
+   */
+  trackUpdate(index, config: SearchFilterConfig) {
+    return config ? config.name : undefined;
   }
 }
diff --git a/src/app/shared/services/route.service.ts b/src/app/shared/services/route.service.ts
index 9dd9a0f164..478d92c21e 100644
--- a/src/app/shared/services/route.service.ts
+++ b/src/app/shared/services/route.service.ts
@@ -16,7 +16,7 @@ export class RouteService {
   getQueryParameterValues(paramName: string): Observable<string[]> {
     return this.route.queryParamMap.pipe(
       map((params) => [...params.getAll(paramName)]),
-      distinctUntilChanged()
+      distinctUntilChanged((a, b) => JSON.stringify(a) === JSON.stringify(b))
     );
   }
 

From 88ae626736d00226413e679a5caf04eaaa16942b Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Wed, 13 Mar 2019 15:51:04 +0100
Subject: [PATCH 13/24] fixed caching

---
 .../builders/remote-data-build.service.ts     |   4 +-
 .../core/cache/object-cache.service.spec.ts   |   6 +-
 src/app/core/cache/object-cache.service.ts    |  14 +--
 .../core/cache/server-sync-buffer.effects.ts  |   2 +-
 src/app/core/data/comcol-data.service.spec.ts |   4 +-
 src/app/core/data/comcol-data.service.ts      |   2 +-
 src/app/core/data/data.service.ts             |   2 +-
 src/app/core/data/request.service.spec.ts     | 106 +++++------------
 src/app/core/data/request.service.ts          | 111 +++++++-----------
 9 files changed, 91 insertions(+), 160 deletions(-)

diff --git a/src/app/core/cache/builders/remote-data-build.service.ts b/src/app/core/cache/builders/remote-data-build.service.ts
index a59039c226..8d40741dc0 100644
--- a/src/app/core/cache/builders/remote-data-build.service.ts
+++ b/src/app/core/cache/builders/remote-data-build.service.ts
@@ -56,13 +56,13 @@ export class RemoteDataBuildService {
     const payload$ =
       observableCombineLatest(
         href$.pipe(
-          switchMap((href: string) => this.objectCache.getBySelfLink<T>(href)),
+          switchMap((href: string) => this.objectCache.getObjectBySelfLink<T>(href)),
           startWith(undefined)),
         requestEntry$.pipe(
           getResourceLinksFromResponse(),
           switchMap((resourceSelfLinks: string[]) => {
             if (isNotEmpty(resourceSelfLinks)) {
-              return this.objectCache.getBySelfLink<T>(resourceSelfLinks[0]);
+              return this.objectCache.getObjectBySelfLink<T>(resourceSelfLinks[0]);
             } else {
               return observableOf(undefined);
             }
diff --git a/src/app/core/cache/object-cache.service.spec.ts b/src/app/core/cache/object-cache.service.spec.ts
index af353a38c1..eae7c06be7 100644
--- a/src/app/core/cache/object-cache.service.spec.ts
+++ b/src/app/core/cache/object-cache.service.spec.ts
@@ -80,7 +80,7 @@ describe('ObjectCacheService', () => {
       });
 
       // due to the implementation of spyOn above, this subscribe will be synchronous
-      service.getBySelfLink(selfLink).pipe(first()).subscribe((o) => {
+      service.getObjectBySelfLink(selfLink).pipe(first()).subscribe((o) => {
           expect(o.self).toBe(selfLink);
           // this only works if testObj is an instance of TestClass
           expect(o instanceof NormalizedItem).toBeTruthy();
@@ -96,7 +96,7 @@ describe('ObjectCacheService', () => {
       });
 
       let getObsHasFired = false;
-      const subscription = service.getBySelfLink(selfLink).subscribe((o) => getObsHasFired = true);
+      const subscription = service.getObjectBySelfLink(selfLink).subscribe((o) => getObsHasFired = true);
       expect(getObsHasFired).toBe(false);
       subscription.unsubscribe();
     });
@@ -106,7 +106,7 @@ describe('ObjectCacheService', () => {
     it('should return an observable of the array of cached objects with the specified self link and type', () => {
       const item = new NormalizedItem();
       item.self = selfLink;
-      spyOn(service, 'getBySelfLink').and.returnValue(observableOf(item));
+      spyOn(service, 'getObjectBySelfLink').and.returnValue(observableOf(item));
 
       service.getList([selfLink, selfLink]).pipe(first()).subscribe((arr) => {
         expect(arr[0].self).toBe(selfLink);
diff --git a/src/app/core/cache/object-cache.service.ts b/src/app/core/cache/object-cache.service.ts
index d4d52b404f..384df23c22 100644
--- a/src/app/core/cache/object-cache.service.ts
+++ b/src/app/core/cache/object-cache.service.ts
@@ -78,16 +78,16 @@ export class ObjectCacheService {
    * @return Observable<T>
    *    An observable of the requested object
    */
-  getByUUID<T extends CacheableObject>(uuid: string): Observable<NormalizedObject<T>> {
+  getObjectByUUID<T extends CacheableObject>(uuid: string): Observable<NormalizedObject<T>> {
     return this.store.pipe(
       select(selfLinkFromUuidSelector(uuid)),
-      mergeMap((selfLink: string) => this.getBySelfLink(selfLink)
+      mergeMap((selfLink: string) => this.getObjectBySelfLink(selfLink)
       )
     )
   }
 
-  getBySelfLink<T extends CacheableObject>(selfLink: string): Observable<NormalizedObject<T>> {
-    return this.getEntry(selfLink).pipe(
+  getObjectBySelfLink<T extends CacheableObject>(selfLink: string): Observable<NormalizedObject<T>> {
+    return this.getBySelfLink(selfLink).pipe(
       map((entry: ObjectCacheEntry) => {
           if (isNotEmpty(entry.patches)) {
             const flatPatch: Operation[] = [].concat(...entry.patches.map((patch) => patch.operations));
@@ -105,7 +105,7 @@ export class ObjectCacheService {
     );
   }
 
-  private getEntry(selfLink: string): Observable<ObjectCacheEntry> {
+  getBySelfLink(selfLink: string): Observable<ObjectCacheEntry> {
     return this.store.pipe(
       select(entryFromSelfLinkSelector(selfLink)),
       filter((entry) => this.isValid(entry)),
@@ -114,7 +114,7 @@ export class ObjectCacheService {
   }
 
   getRequestUUIDBySelfLink(selfLink: string): Observable<string> {
-    return this.getEntry(selfLink).pipe(
+    return this.getBySelfLink(selfLink).pipe(
       map((entry: ObjectCacheEntry) => entry.requestUUID),
       distinctUntilChanged());
   }
@@ -147,7 +147,7 @@ export class ObjectCacheService {
    */
   getList<T extends CacheableObject>(selfLinks: string[]): Observable<Array<NormalizedObject<T>>> {
     return observableCombineLatest(
-      selfLinks.map((selfLink: string) => this.getBySelfLink<T>(selfLink))
+      selfLinks.map((selfLink: string) => this.getObjectBySelfLink<T>(selfLink))
     );
   }
 
diff --git a/src/app/core/cache/server-sync-buffer.effects.ts b/src/app/core/cache/server-sync-buffer.effects.ts
index 0d7392e555..2e11f15540 100644
--- a/src/app/core/cache/server-sync-buffer.effects.ts
+++ b/src/app/core/cache/server-sync-buffer.effects.ts
@@ -95,7 +95,7 @@ export class ServerSyncBufferEffects {
    * @returns {Observable<Action>} ApplyPatchObjectCacheAction to be dispatched
    */
   private applyPatch(href: string): Observable<Action> {
-    const patchObject = this.objectCache.getBySelfLink(href).pipe(take(1));
+    const patchObject = this.objectCache.getObjectBySelfLink(href).pipe(take(1));
 
     return patchObject.pipe(
       map((object) => {
diff --git a/src/app/core/data/comcol-data.service.spec.ts b/src/app/core/data/comcol-data.service.spec.ts
index 784075c855..d93600a06a 100644
--- a/src/app/core/data/comcol-data.service.spec.ts
+++ b/src/app/core/data/comcol-data.service.spec.ts
@@ -94,7 +94,7 @@ describe('ComColDataService', () => {
 
   function initMockObjectCacheService(): ObjectCacheService {
     return jasmine.createSpyObj('objectCache', {
-      getByUUID: cold('d-', {
+      getObjectByUUID: cold('d-', {
         d: {
           _links: {
             [LINK_NAME]: scopedEndpoint
@@ -159,7 +159,7 @@ describe('ComColDataService', () => {
       it('should fetch the scope Community from the cache', () => {
         scheduler.schedule(() => service.getBrowseEndpoint(options).subscribe());
         scheduler.flush();
-        expect(objectCache.getByUUID).toHaveBeenCalledWith(scopeID);
+        expect(objectCache.getObjectByUUID).toHaveBeenCalledWith(scopeID);
       });
 
       it('should return the endpoint to fetch resources within the given scope', () => {
diff --git a/src/app/core/data/comcol-data.service.ts b/src/app/core/data/comcol-data.service.ts
index 693b8af58b..9d82cc5047 100644
--- a/src/app/core/data/comcol-data.service.ts
+++ b/src/app/core/data/comcol-data.service.ts
@@ -49,7 +49,7 @@ export abstract class ComColDataService<T extends CacheableObject> extends DataS
       );
       const successResponses = responses.pipe(
         filter((response) => response.isSuccessful),
-        mergeMap(() => this.objectCache.getByUUID(options.scopeID)),
+        mergeMap(() => this.objectCache.getObjectByUUID(options.scopeID)),
         map((nc: NormalizedCommunity) => nc._links[linkPath]),
         filter((href) => isNotEmpty(href))
       );
diff --git a/src/app/core/data/data.service.ts b/src/app/core/data/data.service.ts
index 42115b6b6c..72af52c4c8 100644
--- a/src/app/core/data/data.service.ts
+++ b/src/app/core/data/data.service.ts
@@ -139,7 +139,7 @@ export abstract class DataService<T extends CacheableObject> {
    * @param {DSpaceObject} object The given object
    */
   update(object: T): Observable<RemoteData<T>> {
-    const oldVersion$ = this.objectCache.getBySelfLink(object.self);
+    const oldVersion$ = this.objectCache.getObjectBySelfLink(object.self);
     return oldVersion$.pipe(take(1), mergeMap((oldVersion: T) => {
         const operations = this.comparator.diff(oldVersion, object);
         if (isNotEmpty(operations)) {
diff --git a/src/app/core/data/request.service.spec.ts b/src/app/core/data/request.service.spec.ts
index b28436f3a8..69d64cf470 100644
--- a/src/app/core/data/request.service.spec.ts
+++ b/src/app/core/data/request.service.spec.ts
@@ -24,7 +24,7 @@ import { BehaviorSubject } from 'rxjs/internal/BehaviorSubject';
 import { MockStore } from '../../shared/testing/mock-store';
 import { IndexState } from '../index/index.reducer';
 
-describe('RequestService', () => {
+fdescribe('RequestService', () => {
   let scheduler: TestScheduler;
   let service: RequestService;
   let serviceAsAny: any;
@@ -323,6 +323,7 @@ describe('RequestService', () => {
       describe('in the ObjectCache', () => {
         beforeEach(() => {
           (objectCache.hasBySelfLink as any).and.returnValue(true);
+          spyOn(serviceAsAny, 'hasByHref').and.returnValue(false);
         });
 
         it('should return true', () => {
@@ -332,63 +333,16 @@ describe('RequestService', () => {
           expect(result).toEqual(expected);
         });
       });
-      describe('in the responseCache', () => {
+      describe('in the request cache', () => {
         beforeEach(() => {
-          spyOn(serviceAsAny, 'isReusable').and.returnValue(observableOf(true));
-          spyOn(serviceAsAny, 'getByHref').and.returnValue(observableOf(undefined));
+          (objectCache.hasBySelfLink as any).and.returnValue(false);
+          spyOn(serviceAsAny, 'hasByHref').and.returnValue(true);
         });
+        it('should return true', () => {
+          const result = serviceAsAny.isCachedOrPending(testGetRequest);
+          const expected = true;
 
-        describe('and it\'s a DSOSuccessResponse', () => {
-          beforeEach(() => {
-            (serviceAsAny.getByHref as any).and.returnValue(observableOf({
-                response: {
-                  isSuccessful: true,
-                  resourceSelfLinks: [
-                    'https://rest.api/endpoint/selfLink1',
-                    'https://rest.api/endpoint/selfLink2'
-                  ]
-                }
-              }
-            ));
-          });
-
-          it('should return true if all top level links in the response are cached in the object cache', () => {
-            (objectCache.hasBySelfLink as any).and.returnValues(false, true, true);
-
-            const result = serviceAsAny.isCachedOrPending(testGetRequest);
-            const expected = true;
-
-            expect(result).toEqual(expected);
-          });
-          it('should return false if not all top level links in the response are cached in the object cache', () => {
-            (objectCache.hasBySelfLink as any).and.returnValues(false, true, false);
-            spyOn(service, 'isPending').and.returnValue(false);
-
-            const result = serviceAsAny.isCachedOrPending(testGetRequest);
-            const expected = false;
-
-            expect(result).toEqual(expected);
-          });
-        });
-
-        describe('and it isn\'t a DSOSuccessResponse', () => {
-          beforeEach(() => {
-            (objectCache.hasBySelfLink as any).and.returnValue(false);
-            (service as any).isReusable.and.returnValue(observableOf(true));
-            (serviceAsAny.getByHref as any).and.returnValue(observableOf({
-                response: {
-                  isSuccessful: true
-                }
-              }
-            ));
-          });
-
-          it('should return true', () => {
-            const result = serviceAsAny.isCachedOrPending(testGetRequest);
-            const expected = true;
-
-            expect(result).toEqual(expected);
-          });
+          expect(result).toEqual(expected);
         });
       });
     });
@@ -462,56 +416,56 @@ describe('RequestService', () => {
     });
   });
 
-  describe('isReusable', () => {
-    describe('when the given UUID is has no value', () => {
-      let reusable;
+  describe('isValid', () => {
+    describe('when the given UUID has no value', () => {
+      let valid;
       beforeEach(() => {
         const uuid = undefined;
-        reusable = serviceAsAny.isReusable(uuid);
+        valid = serviceAsAny.isValid(uuid);
       });
       it('return an observable emitting false', () => {
-        reusable.subscribe((isReusable) => expect(isReusable).toBe(false));
+        valid.subscribe((isValid) => expect(isValid).toBe(false));
       })
     });
 
     describe('when the given UUID has a value, but no cached entry is found', () => {
-      let reusable;
+      let valid;
       beforeEach(() => {
         spyOn(service, 'getByUUID').and.returnValue(observableOf(undefined));
         const uuid = 'a45bb291-1adb-40d9-b2fc-7ad9080607be';
-        reusable = serviceAsAny.isReusable(uuid);
+        valid = serviceAsAny.isValid(uuid);
       });
       it('return an observable emitting false', () => {
-        reusable.subscribe((isReusable) => expect(isReusable).toBe(false));
+        valid.subscribe((isValid) => expect(isValid).toBe(false));
       })
     });
 
     describe('when the given UUID has a value, a cached entry is found, but it has no response', () => {
-      let reusable;
+      let valid;
       beforeEach(() => {
         spyOn(service, 'getByUUID').and.returnValue(observableOf({ response: undefined }));
         const uuid = '53c9b814-ad8b-4567-9bc1-d9bb6cfba6c8';
-        reusable = serviceAsAny.isReusable(uuid);
+        valid = serviceAsAny.isValid(uuid);
       });
       it('return an observable emitting false', () => {
-        reusable.subscribe((isReusable) => expect(isReusable).toBe(false));
+        valid.subscribe((isValid) => expect(isValid).toBe(false));
       })
     });
 
     describe('when the given UUID has a value, a cached entry is found, but its response was not successful', () => {
-      let reusable;
+      let valid;
       beforeEach(() => {
         spyOn(service, 'getByUUID').and.returnValue(observableOf({ response: { isSuccessful: false } }));
         const uuid = '694c9b32-7b2e-4788-835b-ef3fc2252e6c';
-        reusable = serviceAsAny.isReusable(uuid);
+        valid = serviceAsAny.isValid(uuid);
       });
       it('return an observable emitting false', () => {
-        reusable.subscribe((isReusable) => expect(isReusable).toBe(false));
+        valid.subscribe((isValid) => expect(isValid).toBe(false));
       })
     });
 
-    describe('when the given UUID has a value, a cached entry is found, its response was successful, but the response is outdated', () => {
-      let reusable;
+    fdescribe('when the given UUID has a value, a cached entry is found, its response was successful, but the response is outdated', () => {
+      let valid;
       const now = 100000;
       const timeAdded = 99899;
       const msToLive = 100;
@@ -528,16 +482,16 @@ describe('RequestService', () => {
           }
         }));
         const uuid = 'f9b85788-881c-4994-86b6-bae8dad024d2';
-        reusable = serviceAsAny.isReusable(uuid);
+        valid = serviceAsAny.isValid(uuid);
       });
 
       it('return an observable emitting false', () => {
-        reusable.subscribe((isReusable) => expect(isReusable).toBe(false));
+        valid.subscribe((isValid) => expect(isValid).toBe(false));
       })
     });
 
     describe('when the given UUID has a value, a cached entry is found, its response was successful, and the response is not outdated', () => {
-      let reusable;
+      let valid;
       const now = 100000;
       const timeAdded = 99999;
       const msToLive = 100;
@@ -554,11 +508,11 @@ describe('RequestService', () => {
           }
         }));
         const uuid = 'f9b85788-881c-4994-86b6-bae8dad024d2';
-        reusable = serviceAsAny.isReusable(uuid);
+        valid = serviceAsAny.isValid(uuid);
       });
 
       it('return an observable emitting true', () => {
-        reusable.subscribe((isReusable) => expect(isReusable).toBe(true));
+        valid.subscribe((isValid) => expect(isValid).toBe(true));
       })
     })
   })
diff --git a/src/app/core/data/request.service.ts b/src/app/core/data/request.service.ts
index 93a7a10506..4fd7b84196 100644
--- a/src/app/core/data/request.service.ts
+++ b/src/app/core/data/request.service.ts
@@ -1,36 +1,25 @@
-import { merge as observableMerge, Observable, of as observableOf } from 'rxjs';
-import {
-  distinctUntilChanged,
-  filter,
-  find,
-  first,
-  map,
-  mergeMap,
-  reduce,
-  startWith,
-  switchMap,
-  take,
-  tap
-} from 'rxjs/operators';
-import { race as observableRace } from 'rxjs';
+import { Observable, race as observableRace } from 'rxjs';
+import { filter, mergeMap, take } from 'rxjs/operators';
 import { Injectable } from '@angular/core';
 
 import { createSelector, MemoizedSelector, select, Store } from '@ngrx/store';
-import { hasNoValue, hasValue, isNotEmpty, isNotUndefined } from '../../shared/empty.util';
+import { hasValue, isNotEmpty } from '../../shared/empty.util';
 import { CacheableObject } from '../cache/object-cache.reducer';
 import { ObjectCacheService } from '../cache/object-cache.service';
-import { DSOSuccessResponse, RestResponse } from '../cache/response.models';
 import { coreSelector, CoreState } from '../core.reducers';
 import { IndexName, IndexState } from '../index/index.reducer';
 import { pathSelector } from '../shared/selectors';
 import { UUIDService } from '../shared/uuid.service';
-import { RequestConfigureAction, RequestExecuteAction, RequestRemoveAction } from './request.actions';
-import { GetRequest, RestRequest } from './request.models';
+import {
+  RequestConfigureAction,
+  RequestExecuteAction,
+  RequestRemoveAction
+} from './request.actions';
+import { EndpointMapRequest, GetRequest, RestRequest } from './request.models';
 
 import { RequestEntry } from './request.reducer';
 import { CommitSSBAction } from '../cache/server-sync-buffer.actions';
 import { RestRequestMethod } from './rest-request-method';
-import { getResponseFromEntry } from '../shared/operators';
 import { AddToIndexAction, RemoveFromIndexBySubstringAction } from '../index/index.actions';
 
 @Injectable()
@@ -104,7 +93,6 @@ export class RequestService {
       .subscribe((re: RequestEntry) => {
         isPending = (hasValue(re) && !re.completed)
       });
-
     return isPending;
   }
 
@@ -183,31 +171,11 @@ export class RequestService {
    * @param {GetRequest} request The request to check
    * @returns {boolean} True if the request is cached or still pending
    */
-  private isCachedOrPending(request: GetRequest) {
-    let isCached = this.objectCache.hasBySelfLink(request.href);
-    if (isCached) {
-      const responses: Observable<RestResponse> = this.isReusable(request.uuid).pipe(
-        filter((reusable: boolean) => reusable),
-        switchMap(() => {
-            return this.getByHref(request.href).pipe(
-              getResponseFromEntry(),
-              take(1)
-            );
-          }
-        ));
+  private isCachedOrPending(request: GetRequest): boolean {
+    const inReqCache = this.hasByHref(request.href);
+    const inObjCache = this.objectCache.hasBySelfLink(request.href);
+    const isCached = inReqCache || inObjCache;
 
-      const errorResponses = responses.pipe(filter((response) => !response.isSuccessful), map(() => true)); // TODO add a configurable number of retries in case of an error.
-      const dsoSuccessResponses = responses.pipe(
-        filter((response) => response.isSuccessful && hasValue((response as DSOSuccessResponse).resourceSelfLinks)),
-        map((response: DSOSuccessResponse) => response.resourceSelfLinks),
-        map((resourceSelfLinks: string[]) => resourceSelfLinks
-          .every((selfLink) => this.objectCache.hasBySelfLink(selfLink))
-        ));
-
-      const otherSuccessResponses = responses.pipe(filter((response) => response.isSuccessful && !hasValue((response as DSOSuccessResponse).resourceSelfLinks)), map(() => true));
-
-      observableMerge(errorResponses, otherSuccessResponses, dsoSuccessResponses).subscribe((c) => isCached = c);
-    }
     const isPending = this.isPending(request);
     return isCached || isPending;
   }
@@ -230,7 +198,7 @@ export class RequestService {
    */
   private trackRequestsOnTheirWayToTheStore(request: GetRequest) {
     this.requestsOnTheirWayToTheStore = [...this.requestsOnTheirWayToTheStore, request.href];
-    this.store.pipe(select(this.entryFromUUIDSelector(request.href)),
+    this.getByHref(request.href).pipe(
       filter((re: RequestEntry) => hasValue(re)),
       take(1)
     ).subscribe((re: RequestEntry) => {
@@ -247,31 +215,40 @@ export class RequestService {
   }
 
   /**
-   * Check whether a Response should still be cached
+   * Check whether a cached response should still be valid
    *
-   * @param uuid
-   *    the uuid of the entry to check
+   * @param entry
+   *    the entry to check
    * @return boolean
-   *    false if the uuid has no value, no entry could be found, the response was nog successful or its time to
-   *    live has exceeded, true otherwise
+   *    false if the uuid has no value, the response was not successful or its time to
+   *    live was exceeded, true otherwise
    */
-  private isReusable(uuid: string): Observable<boolean> {
-    if (hasNoValue(uuid)) {
-      return observableOf(false);
+  private isValid(entry: RequestEntry): boolean {
+    if (hasValue(entry) && entry.completed && entry.response.isSuccessful) {
+      const timeOutdated = entry.response.timeAdded + entry.request.responseMsToLive;
+      const isOutDated = new Date().getTime() > timeOutdated;
+      return !isOutDated;
     } else {
-      const requestEntry$ = this.getByUUID(uuid);
-      return requestEntry$.pipe(
-        filter((entry: RequestEntry) => hasValue(entry) && hasValue(entry.response)),
-        map((entry: RequestEntry) => {
-          if (hasValue(entry) && entry.response.isSuccessful) {
-            const timeOutdated = entry.response.timeAdded + entry.request.responseMsToLive;
-            const isOutDated = new Date().getTime() > timeOutdated;
-            return !isOutDated;
-          } else {
-            return false;
-          }
-        })
-      );
+      return false;
     }
   }
+
+  /**
+   * Check whether the request with the specified href is cached
+   *
+   * @param href
+   *    The link of the request to check
+   * @return boolean
+   *    true if the request with the specified href is cached,
+   *    false otherwise
+   */
+  hasByHref(href: string): boolean {
+    let result = false;
+    this.getByHref(href).pipe(
+      take(1)
+    ).subscribe((requestEntry: RequestEntry) => result = this.isValid(requestEntry));
+
+    return result;
+  }
+
 }

From 4c150988e26ce985378c32b55f785a8812da5f25 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Wed, 13 Mar 2019 16:28:46 +0100
Subject: [PATCH 14/24] fixed tests after changes to request caching

---
 .../cache/server-sync-buffer.effects.spec.ts  |  2 +-
 src/app/core/data/data.service.spec.ts        |  4 +-
 src/app/core/data/request.service.spec.ts     | 95 +++++++++----------
 3 files changed, 46 insertions(+), 55 deletions(-)

diff --git a/src/app/core/cache/server-sync-buffer.effects.spec.ts b/src/app/core/cache/server-sync-buffer.effects.spec.ts
index 0a8d50107e..87d8804e9c 100644
--- a/src/app/core/cache/server-sync-buffer.effects.spec.ts
+++ b/src/app/core/cache/server-sync-buffer.effects.spec.ts
@@ -47,7 +47,7 @@ describe('ServerSyncBufferEffects', () => {
         { provide: RequestService, useValue: getMockRequestService() },
         {
           provide: ObjectCacheService, useValue: {
-            getBySelfLink: (link) => {
+            getObjectBySelfLink: (link) => {
               const object = new DSpaceObject();
               object.self = link;
               return observableOf(object);
diff --git a/src/app/core/data/data.service.spec.ts b/src/app/core/data/data.service.spec.ts
index 178a16d4c1..51474f6740 100644
--- a/src/app/core/data/data.service.spec.ts
+++ b/src/app/core/data/data.service.spec.ts
@@ -67,7 +67,7 @@ describe('DataService', () => {
     addPatch: () => {
       /* empty */
     },
-    getBySelfLink: () => {
+    getObjectBySelfLink: () => {
       /* empty */
     }
   } as any;
@@ -189,7 +189,7 @@ describe('DataService', () => {
       dso2.metadata = [{ key: 'dc.title', value: name2 }];
 
       spyOn(service, 'findById').and.returnValues(observableOf(dso));
-      spyOn(objectCache, 'getBySelfLink').and.returnValues(observableOf(dso));
+      spyOn(objectCache, 'getObjectBySelfLink').and.returnValues(observableOf(dso));
       spyOn(objectCache, 'addPatch');
     });
 
diff --git a/src/app/core/data/request.service.spec.ts b/src/app/core/data/request.service.spec.ts
index 69d64cf470..1ff55f9871 100644
--- a/src/app/core/data/request.service.spec.ts
+++ b/src/app/core/data/request.service.spec.ts
@@ -24,7 +24,7 @@ import { BehaviorSubject } from 'rxjs/internal/BehaviorSubject';
 import { MockStore } from '../../shared/testing/mock-store';
 import { IndexState } from '../index/index.reducer';
 
-fdescribe('RequestService', () => {
+describe('RequestService', () => {
   let scheduler: TestScheduler;
   let service: RequestService;
   let serviceAsAny: any;
@@ -42,6 +42,7 @@ fdescribe('RequestService', () => {
   const testHeadRequest = new HeadRequest(testUUID, testHref);
   const testPatchRequest = new PatchRequest(testUUID, testHref);
   let selectSpy;
+
   beforeEach(() => {
     scheduler = getTestScheduler();
 
@@ -417,76 +418,65 @@ fdescribe('RequestService', () => {
   });
 
   describe('isValid', () => {
-    describe('when the given UUID has no value', () => {
+    describe('when the given entry has no value', () => {
       let valid;
       beforeEach(() => {
-        const uuid = undefined;
-        valid = serviceAsAny.isValid(uuid);
+        const entry = undefined;
+        valid = serviceAsAny.isValid(entry);
       });
       it('return an observable emitting false', () => {
-        valid.subscribe((isValid) => expect(isValid).toBe(false));
+        expect(valid).toBe(false);
       })
     });
 
-    describe('when the given UUID has a value, but no cached entry is found', () => {
+    describe('when the given entry has a value, but the request is not completed', () => {
       let valid;
+      const requestEntry = { completed: false } ;
       beforeEach(() => {
-        spyOn(service, 'getByUUID').and.returnValue(observableOf(undefined));
-        const uuid = 'a45bb291-1adb-40d9-b2fc-7ad9080607be';
-        valid = serviceAsAny.isValid(uuid);
+        spyOn(service, 'getByUUID').and.returnValue(observableOf(requestEntry));
+        valid = serviceAsAny.isValid(requestEntry);
       });
       it('return an observable emitting false', () => {
-        valid.subscribe((isValid) => expect(isValid).toBe(false));
+        expect(valid).toBe(false);
       })
     });
 
-    describe('when the given UUID has a value, a cached entry is found, but it has no response', () => {
+    describe('when the given entry has a value, but the response is not successful', () => {
       let valid;
+      const requestEntry = { completed: true, response: { isSuccessful: false } };
       beforeEach(() => {
-        spyOn(service, 'getByUUID').and.returnValue(observableOf({ response: undefined }));
-        const uuid = '53c9b814-ad8b-4567-9bc1-d9bb6cfba6c8';
-        valid = serviceAsAny.isValid(uuid);
+        spyOn(service, 'getByUUID').and.returnValue(observableOf(requestEntry));
+        valid = serviceAsAny.isValid(requestEntry);
       });
       it('return an observable emitting false', () => {
-        valid.subscribe((isValid) => expect(isValid).toBe(false));
+        expect(valid).toBe(false);
       })
     });
 
-    describe('when the given UUID has a value, a cached entry is found, but its response was not successful', () => {
-      let valid;
-      beforeEach(() => {
-        spyOn(service, 'getByUUID').and.returnValue(observableOf({ response: { isSuccessful: false } }));
-        const uuid = '694c9b32-7b2e-4788-835b-ef3fc2252e6c';
-        valid = serviceAsAny.isValid(uuid);
-      });
-      it('return an observable emitting false', () => {
-        valid.subscribe((isValid) => expect(isValid).toBe(false));
-      })
-    });
-
-    fdescribe('when the given UUID has a value, a cached entry is found, its response was successful, but the response is outdated', () => {
+    describe('when the given UUID has a value, its response was successful, but the response is outdated', () => {
       let valid;
       const now = 100000;
       const timeAdded = 99899;
       const msToLive = 100;
+      const requestEntry = {
+        completed: true,
+        response: {
+          isSuccessful: true,
+          timeAdded: timeAdded
+        },
+        request: {
+          responseMsToLive: msToLive,
+        }
+      };
 
       beforeEach(() => {
         spyOn(Date.prototype, 'getTime').and.returnValue(now);
-        spyOn(service, 'getByUUID').and.returnValue(observableOf({
-          response: {
-            isSuccessful: true,
-            timeAdded: timeAdded
-          },
-          request: {
-            responseMsToLive: msToLive
-          }
-        }));
-        const uuid = 'f9b85788-881c-4994-86b6-bae8dad024d2';
-        valid = serviceAsAny.isValid(uuid);
+        spyOn(service, 'getByUUID').and.returnValue(observableOf(requestEntry));
+        valid = serviceAsAny.isValid(requestEntry);
       });
 
       it('return an observable emitting false', () => {
-        valid.subscribe((isValid) => expect(isValid).toBe(false));
+        expect(valid).toBe(false);
       })
     });
 
@@ -496,23 +486,24 @@ fdescribe('RequestService', () => {
       const timeAdded = 99999;
       const msToLive = 100;
 
+      const requestEntry = {
+        completed: true,
+        response: {
+          isSuccessful: true,
+          timeAdded: timeAdded
+        },
+        request: {
+          responseMsToLive: msToLive
+        }
+      };
       beforeEach(() => {
         spyOn(Date.prototype, 'getTime').and.returnValue(now);
-        spyOn(service, 'getByUUID').and.returnValue(observableOf({
-          response: {
-            isSuccessful: true,
-            timeAdded: timeAdded
-          },
-          request: {
-            responseMsToLive: msToLive
-          }
-        }));
-        const uuid = 'f9b85788-881c-4994-86b6-bae8dad024d2';
-        valid = serviceAsAny.isValid(uuid);
+        spyOn(service, 'getByUUID').and.returnValue(observableOf(requestEntry));
+        valid = serviceAsAny.isValid(requestEntry);
       });
 
       it('return an observable emitting true', () => {
-        valid.subscribe((isValid) => expect(isValid).toBe(true));
+       expect(valid).toBe(true);
       })
     })
   })

From 917c00f8fbca40b97840e35fbc42e0c5609ef16a Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Thu, 14 Mar 2019 11:14:59 +0100
Subject: [PATCH 15/24] added missing tests and docs

---
 src/app/core/cache/object-cache.service.ts | 44 ++++++++++++++++-----
 src/app/core/data/request.models.ts        |  2 +-
 src/app/core/data/request.service.spec.ts  | 46 ++++++++++++++++++----
 src/app/core/data/request.service.ts       | 10 ++++-
 4 files changed, 83 insertions(+), 19 deletions(-)

diff --git a/src/app/core/cache/object-cache.service.ts b/src/app/core/cache/object-cache.service.ts
index 384df23c22..b4c37df736 100644
--- a/src/app/core/cache/object-cache.service.ts
+++ b/src/app/core/cache/object-cache.service.ts
@@ -65,18 +65,10 @@ export class ObjectCacheService {
   /**
    * Get an observable of the object with the specified UUID
    *
-   * The type needs to be specified as well, in order to turn
-   * the cached plain javascript object in to an instance of
-   * a class.
-   *
-   * e.g. getByUUID('c96588c6-72d3-425d-9d47-fa896255a695', Item)
-   *
    * @param uuid
    *    The UUID of the object to get
-   * @param type
-   *    The type of the object to get
-   * @return Observable<T>
-   *    An observable of the requested object
+   * @return Observable<NormalizedObject<T>>
+   *    An observable of the requested object in normalized form
    */
   getObjectByUUID<T extends CacheableObject>(uuid: string): Observable<NormalizedObject<T>> {
     return this.store.pipe(
@@ -86,6 +78,14 @@ export class ObjectCacheService {
     )
   }
 
+  /**
+   * Get an observable of the object with the specified selfLink
+   *
+   * @param selfLink
+   *    The selfLink of the object to get
+   * @return Observable<NormalizedObject<T>>
+   *    An observable of the requested object in normalized form
+   */
   getObjectBySelfLink<T extends CacheableObject>(selfLink: string): Observable<NormalizedObject<T>> {
     return this.getBySelfLink(selfLink).pipe(
       map((entry: ObjectCacheEntry) => {
@@ -105,6 +105,14 @@ export class ObjectCacheService {
     );
   }
 
+  /**
+   * Get an observable of the object cache entry with the specified selfLink
+   *
+   * @param selfLink
+   *    The selfLink of the object to get
+   * @return Observable<ObjectCacheEntry>
+   *    An observable of the requested object cache entry
+   */
   getBySelfLink(selfLink: string): Observable<ObjectCacheEntry> {
     return this.store.pipe(
       select(entryFromSelfLinkSelector(selfLink)),
@@ -113,12 +121,28 @@ export class ObjectCacheService {
     );
   }
 
+  /**
+   * Get an observable of the request's uuid with the specified selfLink
+   *
+   * @param selfLink
+   *    The selfLink of the object to get
+   * @return Observable<string>
+   *    An observable of the request's uuid
+   */
   getRequestUUIDBySelfLink(selfLink: string): Observable<string> {
     return this.getBySelfLink(selfLink).pipe(
       map((entry: ObjectCacheEntry) => entry.requestUUID),
       distinctUntilChanged());
   }
 
+  /**
+   * Get an observable of the request's uuid with the specified uuid
+   *
+   * @param uuid
+   *    The uuid of the object to get
+   * @return Observable<string>
+   *    An observable of the request's uuid
+   */
   getRequestUUIDByObjectUUID(uuid: string): Observable<string> {
     return this.store.pipe(
       select(selfLinkFromUuidSelector(uuid)),
diff --git a/src/app/core/data/request.models.ts b/src/app/core/data/request.models.ts
index 951dbacff6..11ead7b53c 100644
--- a/src/app/core/data/request.models.ts
+++ b/src/app/core/data/request.models.ts
@@ -39,7 +39,7 @@ export abstract class RestRequest {
 }
 
 export class GetRequest extends RestRequest {
-  public responseMsToLive = 60 * 15 * 1000;
+  public responseMsToLive = 10000;
 
   constructor(
     public uuid: string,
diff --git a/src/app/core/data/request.service.spec.ts b/src/app/core/data/request.service.spec.ts
index 1ff55f9871..b3d9436d30 100644
--- a/src/app/core/data/request.service.spec.ts
+++ b/src/app/core/data/request.service.spec.ts
@@ -1,5 +1,5 @@
 import { cold, getTestScheduler, hot } from 'jasmine-marbles';
-import { of as observableOf } from 'rxjs';
+import { of as observableOf, EMPTY } from 'rxjs';
 import { getMockObjectCacheService } from '../../shared/mocks/mock-object-cache.service';
 import { defaultUUID, getMockUUIDService } from '../../shared/mocks/mock-uuid.service';
 import { ObjectCacheService } from '../cache/object-cache.service';
@@ -7,6 +7,7 @@ import { CoreState } from '../core.reducers';
 import { UUIDService } from '../shared/uuid.service';
 import { RequestConfigureAction, RequestExecuteAction } from './request.actions';
 import * as ngrx from '@ngrx/store';
+import { ActionsSubject, Store } from '@ngrx/store';
 import {
   DeleteRequest,
   GetRequest,
@@ -18,11 +19,8 @@ import {
   RestRequest
 } from './request.models';
 import { RequestService } from './request.service';
-import { ActionsSubject, Store } from '@ngrx/store';
 import { TestScheduler } from 'rxjs/testing';
 import { BehaviorSubject } from 'rxjs/internal/BehaviorSubject';
-import { MockStore } from '../../shared/testing/mock-store';
-import { IndexState } from '../index/index.reducer';
 
 describe('RequestService', () => {
   let scheduler: TestScheduler;
@@ -431,7 +429,7 @@ describe('RequestService', () => {
 
     describe('when the given entry has a value, but the request is not completed', () => {
       let valid;
-      const requestEntry = { completed: false } ;
+      const requestEntry = { completed: false };
       beforeEach(() => {
         spyOn(service, 'getByUUID').and.returnValue(observableOf(requestEntry));
         valid = serviceAsAny.isValid(requestEntry);
@@ -503,8 +501,42 @@ describe('RequestService', () => {
       });
 
       it('return an observable emitting true', () => {
-       expect(valid).toBe(true);
+        expect(valid).toBe(true);
       })
     })
-  })
+  });
+
+  describe('hasByHref', () => {
+    describe('when nothing is returned by getByHref', () => {
+      beforeEach(() => {
+        spyOn(service, 'getByHref').and.returnValue(EMPTY);
+      });
+      it('hasByHref should return false', () => {
+        const result = service.hasByHref('');
+        expect(result).toBe(false);
+      });
+    });
+
+    describe('when isValid returns false', () => {
+      beforeEach(() => {
+        spyOn(service, 'getByHref').and.returnValue(observableOf(undefined));
+        spyOn(service as any, 'isValid').and.returnValue(false);
+      });
+      it('hasByHref should return false', () => {
+        const result = service.hasByHref('');
+        expect(result).toBe(false);
+      });
+    });
+
+    describe('when isValid returns true', () => {
+      beforeEach(() => {
+        spyOn(service, 'getByHref').and.returnValue(observableOf(undefined));
+        spyOn(service as any, 'isValid').and.returnValue(true);
+      });
+      it('hasByHref should return true', () => {
+        const result = service.hasByHref('');
+        expect(result).toBe(true);
+      });
+    });
+  });
 });
diff --git a/src/app/core/data/request.service.ts b/src/app/core/data/request.service.ts
index 4fd7b84196..f129f8becd 100644
--- a/src/app/core/data/request.service.ts
+++ b/src/app/core/data/request.service.ts
@@ -80,6 +80,9 @@ export class RequestService {
     return `client/${this.uuidService.generate()}`;
   }
 
+  /**
+   * Check if a request is currently pending
+   */
   isPending(request: GetRequest): boolean {
     // first check requests that haven't made it to the store yet
     if (this.requestsOnTheirWayToTheStore.includes(request.href)) {
@@ -96,6 +99,9 @@ export class RequestService {
     return isPending;
   }
 
+  /**
+   * Retrieve a RequestEntry based on their uuid
+   */
   getByUUID(uuid: string): Observable<RequestEntry> {
     return observableRace(
       this.store.pipe(select(this.entryFromUUIDSelector(uuid))),
@@ -108,6 +114,9 @@ export class RequestService {
     );
   }
 
+  /**
+   * Retrieve a RequestEntry based on their href
+   */
   getByHref(href: string): Observable<RequestEntry> {
     return this.store.pipe(
       select(this.uuidFromHrefSelector(href)),
@@ -247,7 +256,6 @@ export class RequestService {
     this.getByHref(href).pipe(
       take(1)
     ).subscribe((requestEntry: RequestEntry) => result = this.isValid(requestEntry));
-
     return result;
   }
 

From f160196cf3ae8c7b8095310d17bafa793e15abf1 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Thu, 14 Mar 2019 11:35:00 +0100
Subject: [PATCH 16/24] reinstated responseMsToLive for get requests

---
 src/app/core/data/request.models.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/core/data/request.models.ts b/src/app/core/data/request.models.ts
index 11ead7b53c..951dbacff6 100644
--- a/src/app/core/data/request.models.ts
+++ b/src/app/core/data/request.models.ts
@@ -39,7 +39,7 @@ export abstract class RestRequest {
 }
 
 export class GetRequest extends RestRequest {
-  public responseMsToLive = 10000;
+  public responseMsToLive = 60 * 15 * 1000;
 
   constructor(
     public uuid: string,

From 6d64326238745cd43677d445934daf3d8424ba8d Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Tue, 19 Mar 2019 16:22:16 +0100
Subject: [PATCH 17/24] Added debounce, fixed error handling for search
 results, fixed bug in paginated lists

---
 .../+search-page/search-service/search.service.ts  |  4 ++--
 src/app/core/data/paginated-list.ts                |  5 ++++-
 .../dso-selector/dso-selector.component.spec.ts    | 14 +++++++++++---
 .../dso-selector/dso-selector.component.ts         |  9 +++++++--
 4 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/src/app/+search-page/search-service/search.service.ts b/src/app/+search-page/search-service/search.service.ts
index 275b0b3340..2c0f1f4e55 100644
--- a/src/app/+search-page/search-service/search.service.ts
+++ b/src/app/+search-page/search-service/search.service.ts
@@ -23,7 +23,7 @@ import { DSpaceObject } from '../../core/shared/dspace-object.model';
 import { GenericConstructor } from '../../core/shared/generic-constructor';
 import { HALEndpointService } from '../../core/shared/hal-endpoint.service';
 import {
-  configureRequest,
+  configureRequest, filterSuccessfulResponses,
   getResponseFromEntry,
   getSucceededRemoteData
 } from '../../core/shared/operators';
@@ -104,7 +104,7 @@ export class SearchService implements OnDestroy {
 
     // get search results from response cache
     const sqrObs: Observable<SearchQueryResponse> = requestEntryObs.pipe(
-      getResponseFromEntry(),
+      filterSuccessfulResponses(),
       map((response: SearchSuccessResponse) => response.results)
     );
 
diff --git a/src/app/core/data/paginated-list.ts b/src/app/core/data/paginated-list.ts
index 8efdccd75d..faecd231bc 100644
--- a/src/app/core/data/paginated-list.ts
+++ b/src/app/core/data/paginated-list.ts
@@ -1,5 +1,5 @@
 import { PageInfo } from '../shared/page-info.model';
-import { hasValue } from '../../shared/empty.util';
+import { hasNoValue, hasValue } from '../../shared/empty.util';
 
 export class PaginatedList<T> {
 
@@ -22,6 +22,9 @@ export class PaginatedList<T> {
     if (hasValue(this.pageInfo) && hasValue(this.pageInfo.totalElements)) {
       return this.pageInfo.totalElements;
     }
+    if (hasNoValue(this.page)) {
+      return 0;
+    }
     return this.page.length;
   }
 
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
index 0386276be7..04111a4ea6 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.spec.ts
@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
 import { TranslateModule } from '@ngx-translate/core';
 import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
 import { DSOSelectorComponent } from './dso-selector.component';
@@ -21,7 +21,12 @@ describe('DSOSelectorComponent', () => {
   const type = DSpaceObjectType.ITEM;
   const searchResult = new ItemSearchResult();
   const item = new Item();
-  item.metadata = { 'dc.title': [Object.assign(new MetadataValue(), { value: 'Item title', language: undefined })] };
+  item.metadata = {
+    'dc.title': [Object.assign(new MetadataValue(), {
+      value: 'Item title',
+      language: undefined
+    })]
+  };
   searchResult.dspaceObject = item;
   searchResult.hitHighlights = {};
   const searchService = jasmine.createSpyObj('searchService', {
@@ -46,6 +51,7 @@ describe('DSOSelectorComponent', () => {
     debugElement = fixture.debugElement;
     component.currentDSOId = currentDSOId;
     component.type = type;
+
     fixture.detectChanges();
   });
 
@@ -59,7 +65,9 @@ describe('DSOSelectorComponent', () => {
       dsoType: type,
       pagination: (component as any).defaultPagination
     });
+
     expect(searchService.search).toHaveBeenCalledWith(searchOptions);
   });
 
-});
+})
+;
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
index 7bb9bfac28..04501e4923 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
@@ -1,5 +1,4 @@
 import {
-  AfterViewInit,
   Component,
   ElementRef,
   EventEmitter,
@@ -12,7 +11,7 @@ import {
 import { FormControl } from '@angular/forms';
 
 import { Observable } from 'rxjs';
-import { map, startWith, switchMap, take } from 'rxjs/operators';
+import { debounceTime, startWith, switchMap } from 'rxjs/operators';
 import { SearchService } from '../../../+search-page/search-service/search.service';
 import { PaginatedSearchOptions } from '../../../+search-page/paginated-search-options.model';
 import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model';
@@ -68,6 +67,11 @@ export class DSOSelectorComponent implements OnInit {
    */
   @ViewChildren('listEntryElement') listElements: QueryList<ElementRef>;
 
+  /**
+   * Time to wait before sending a search request to the server when a user types something
+   */
+  debounceTime = 500;
+
   constructor(private searchService: SearchService) {
   }
 
@@ -79,6 +83,7 @@ export class DSOSelectorComponent implements OnInit {
     this.input.setValue(this.currentDSOId);
     this.listEntries$ = this.input.valueChanges
       .pipe(
+        debounceTime(this.debounceTime),
         startWith(this.currentDSOId),
         switchMap((query) => {
             return this.searchService.search(

From fc73fc1d3ea8b497390aafe7a7e55a61e5c6eef0 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Wed, 20 Mar 2019 16:57:55 +0100
Subject: [PATCH 18/24] optimizations links in facets

---
 package.json                                  |  1 +
 .../search-boolean-filter.component.html      | 20 +----
 .../search-facet-option.component.html        |  9 ++
 .../search-facet-option.component.ts          | 78 ++++++++++++++++
 .../search-facet-range-option.component.html  |  8 ++
 .../search-facet-range-option.component.ts    | 88 +++++++++++++++++++
 ...earch-facet-selected-option.component.html |  6 ++
 .../search-facet-selected-option.component.ts | 67 ++++++++++++++
 ...search-facet-filter-wrapper.component.html |  2 +-
 .../search-facet-filter-wrapper.component.ts  |  6 +-
 .../search-facet-filter.component.ts          |  4 +
 .../search-filter/search-filter.actions.ts    | 20 ++---
 .../search-filter.component.html              |  6 +-
 .../search-filter/search-filter.component.ts  | 75 ++++++++++------
 .../search-filter/search-filter.reducer.ts    | 37 +++-----
 .../search-filter.service.spec.ts             | 20 ++---
 .../search-filter/search-filter.service.ts    | 42 +++++----
 .../search-hierarchy-filter.component.html    | 13 +--
 .../search-range-filter.component.html        |  9 +-
 .../search-range-filter.component.ts          | 30 ++-----
 .../search-text-filter.component.html         | 14 +--
 .../search-filters.component.html             |  2 +-
 .../search-filters.component.ts               | 32 +------
 src/app/+search-page/search-page.component.ts |  1 -
 src/app/+search-page/search-page.module.ts    |  9 ++
 src/app/shared/services/route.service.ts      |  9 +-
 src/main.browser.ts                           |  1 +
 yarn.lock                                     | 43 +++++++++
 28 files changed, 446 insertions(+), 206 deletions(-)
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.html
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts

diff --git a/package.json b/package.json
index fd037de3f7..7f319d9716 100644
--- a/package.json
+++ b/package.json
@@ -119,6 +119,7 @@
     "pem": "1.12.3",
     "reflect-metadata": "0.1.12",
     "rxjs": "6.2.2",
+    "rxjs-spy": "^7.5.1",
     "sortablejs": "1.7.0",
     "text-mask-core": "5.0.1",
     "ts-loader": "^5.2.1",
diff --git a/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
index 216683c122..06154916b2 100644
--- a/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
@@ -1,24 +1,10 @@
 <div>
     <div class="filters py-2">
-        <a *ngFor="let value of (selectedValues | async)" class="d-flex flex-row"
-           [routerLink]="[getSearchLink()]"
-           [queryParams]="getRemoveParams(value) | async" queryParamsHandling="merge">
-            <input type="checkbox" [checked]="true" class="my-1 align-self-stretch"/>
-            <span class="filter-value pl-1">{{value}}</span>
-        </a>
+        <ds-search-facet-selected-option *ngFor="let value of (selectedValues | async)" [selectedValue]="value" [filterConfig]="filterConfig"></ds-search-facet-selected-option>
       <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
         <div [@facetLoad]="animationState">
-          <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
-                <a *ngIf="!(selectedValues | async).includes(value.value)" class="d-flex flex-row"
-                   [routerLink]="[getSearchLink()]"
-                   [queryParams]="getAddParams(value.value) | async" queryParamsHandling="merge">
-                    <input type="checkbox" [checked]="false" class="my-1 align-self-stretch"/>
-                    <span class="filter-value px-1">{{value.value}}</span>
-                    <span class="float-right filter-value-count ml-auto">
-                        <span class="badge badge-secondary badge-pill">{{value.count}}</span>
-                    </span>
-                </a>
-            </ng-container>
+            <ds-search-facet-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value">
+            </ds-search-facet-option>
         </div>
         </ng-container>
         <div class="clearfix toggle-more-filters">
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
new file mode 100644
index 0000000000..881fb98dcb
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
@@ -0,0 +1,9 @@
+<a *ngIf="isVisible" class="d-flex flex-row"
+   [routerLink]="[getSearchLink()]"
+   [queryParams]="addQueryParams | async" queryParamsHandling="merge">
+    <input type="checkbox" [checked]="false" class="my-1 align-self-stretch"/>
+    <span class="filter-value px-1">{{filterValue.value}}</span>
+    <span class="float-right filter-value-count ml-auto">
+                        <span class="badge badge-secondary badge-pill">{{filterValue.count}}</span>
+                    </span>
+</a>
\ No newline at end of file
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
new file mode 100644
index 0000000000..c5896f92b6
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
@@ -0,0 +1,78 @@
+import { Observable, of as observableOf } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { Component, Input, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { FacetValue } from '../../../../search-service/facet-value.model';
+import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
+import { SearchService } from '../../../../search-service/search.service';
+import { SearchFilterService } from '../../search-filter.service';
+
+@Component({
+  selector: 'ds-search-facet-option',
+  templateUrl: './search-facet-option.component.html',
+})
+
+/**
+ * Represents a single option in a filter facet
+ */
+export class SearchFacetOptionComponent implements OnInit {
+  /**
+   * A single value for this component
+   */
+  @Input() filterValue: FacetValue;
+  @Input() filterConfig: SearchFilterConfig;
+
+  /**
+   * Emits the active values for this filter
+   */
+  selectedValues$: Observable<string[]>;
+
+  isVisible: Observable<boolean>;
+
+  addQueryParams;
+
+  constructor(protected searchService: SearchService,
+              protected filterService: SearchFilterService,
+              protected router: Router
+  ) {
+  }
+
+  /**
+   * Initializes all observable instance variables and starts listening to them
+   */
+  ngOnInit(): void {
+    this.selectedValues$ = this.filterService.getSelectedValuesForFilter(this.filterConfig);
+    this.isVisible = this.isChecked().pipe(map((checked: boolean) => !checked));
+    this.addQueryParams = this.getAddParams();
+  }
+
+  /**
+   * Checks if a value for this filter is currently active
+   */
+  private isChecked(): Observable<boolean> {
+    return this.filterService.isFilterActiveWithValue(this.filterConfig.paramName, this.filterValue.value);
+  }
+
+  /**
+   * @returns {string} The base path to the search page
+   */
+  getSearchLink() {
+    return this.searchService.getSearchLink();
+  }
+
+  /**
+   * Calculates the parameters that should change if a given value for this filter would be added to the active filters
+   * @param {string} value The value that is added for this filter
+   * @returns {Observable<any>} The changed filter parameters
+   */
+  private getAddParams(): Observable<any> {
+    return this.selectedValues$.pipe(map((selectedValues) => {
+      return {
+        [this.filterConfig.paramName]: [...selectedValues, this.filterValue.value],
+        page: 1
+      };
+    }));
+  }
+
+}
+
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html
new file mode 100644
index 0000000000..92e90a00cc
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html
@@ -0,0 +1,8 @@
+<a *ngIf="isVisible" class="d-flex flex-row"
+   [routerLink]="[getSearchLink()]"
+   [queryParams]="changeQueryParams | async" queryParamsHandling="merge">
+    <span class="filter-value px-1">{{filterValue.value}}</span>
+    <span class="float-right filter-value-count ml-auto">
+                        <span class="badge badge-secondary badge-pill">{{filterValue.count}}</span>
+                    </span>
+</a>
\ No newline at end of file
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
new file mode 100644
index 0000000000..0b38ca1845
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
@@ -0,0 +1,88 @@
+import { Observable, of as observableOf } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { Component, Input, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { FacetValue } from '../../../../search-service/facet-value.model';
+import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
+import { SearchService } from '../../../../search-service/search.service';
+import { SearchFilterService } from '../../search-filter.service';
+import {
+  RANGE_FILTER_MAX_SUFFIX,
+  RANGE_FILTER_MIN_SUFFIX
+} from '../../search-range-filter/search-range-filter.component';
+
+const rangeDelimiter = '-';
+
+@Component({
+  selector: 'ds-search-facet-range-option',
+  templateUrl: './search-facet-range-option.component.html',
+})
+
+/**
+ * Represents a single option in a filter facet
+ */
+export class SearchFacetRangeOptionComponent implements OnInit {
+  /**
+   * A single value for this component
+   */
+  @Input() filterValue: FacetValue;
+  @Input() filterConfig: SearchFilterConfig;
+
+  /**
+   * Emits the active values for this filter
+   */
+  selectedValues$: Observable<string[]>;
+
+  isVisible: Observable<boolean>;
+
+  changeQueryParams;
+
+  constructor(protected searchService: SearchService,
+              protected filterService: SearchFilterService,
+              protected router: Router
+  ) {
+  }
+
+  /**
+   * Initializes all observable instance variables and starts listening to them
+   */
+  ngOnInit(): void {
+    this.selectedValues$ = this.filterService.getSelectedValuesForFilter(this.filterConfig);
+    this.isVisible = this.isChecked().pipe(map((checked: boolean) => !checked));
+    this.changeQueryParams = this.getChangeParams();
+  }
+
+  /**
+   * Checks if a value for this filter is currently active
+   */
+  private isChecked(): Observable<boolean> {
+    return this.filterService.isFilterActiveWithValue(this.filterConfig.paramName, this.filterValue.value);
+  }
+
+  /**
+   * @returns {string} The base path to the search page
+   */
+  getSearchLink() {
+    return this.searchService.getSearchLink();
+  }
+
+
+  /**
+   * Calculates the parameters that should change if a given values for this range filter would be changed
+   * @param {string} value The values that are changed for this filter
+   * @returns {Observable<any>} The changed filter parameters
+   */
+  getChangeParams() {
+    const parts = this.filterValue.value.split(rangeDelimiter);
+    const min = parts.length > 1 ? parts[0].trim() : this.filterValue.value;
+    const max = parts.length > 1 ? parts[1].trim() : this.filterValue.value;
+    return observableOf(
+      {
+        [this.filterConfig.paramName + RANGE_FILTER_MIN_SUFFIX]: [min],
+        [this.filterConfig.paramName + RANGE_FILTER_MAX_SUFFIX]: [max],
+        page: 1
+      });
+  }
+
+}
+
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.html
new file mode 100644
index 0000000000..7bed620770
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.html
@@ -0,0 +1,6 @@
+<a class="d-flex flex-row"
+   [routerLink]="[getSearchLink()]"
+   [queryParams]="removeQueryParams | async" queryParamsHandling="merge">
+    <input type="checkbox" [checked]="true" class="my-1 align-self-stretch"/>
+    <span class="filter-value pl-1">{{selectedValue}}</span>
+</a>
\ No newline at end of file
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
new file mode 100644
index 0000000000..2fdc490d68
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
@@ -0,0 +1,67 @@
+import { Observable, of as observableOf } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { Component, Input, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { FacetValue } from '../../../../search-service/facet-value.model';
+import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
+import { SearchService } from '../../../../search-service/search.service';
+import { SearchFilterService } from '../../search-filter.service';
+
+@Component({
+  selector: 'ds-search-facet-selected-option',
+  templateUrl: './search-facet-selected-option.component.html',
+})
+
+/**
+ * Represents a single option in a filter facet
+ */
+export class SearchFacetSelectedOptionComponent implements OnInit {
+  /**
+   * A single value for this component
+   */
+  @Input() selectedValue: string;
+  @Input() filterConfig: SearchFilterConfig;
+
+  /**
+   * Emits the active values for this filter
+   */
+  selectedValues$: Observable<string[]>;
+
+  removeQueryParams;
+
+  constructor(protected searchService: SearchService,
+              protected filterService: SearchFilterService,
+              protected router: Router
+  ) {
+  }
+
+  /**
+   * Initializes all observable instance variables and starts listening to them
+   */
+  ngOnInit(): void {
+    this.selectedValues$ = this.filterService.getSelectedValuesForFilter(this.filterConfig);
+    this.removeQueryParams = this.getRemoveParams();
+  }
+
+  /**
+   * @returns {string} The base path to the search page
+   */
+  getSearchLink() {
+    return this.searchService.getSearchLink();
+  }
+
+  /**
+   * Calculates the parameters that should change if a given value for this filter would be removed from the active filters
+   * @param {string} value The value that is removed for this filter
+   * @returns {Observable<any>} The changed filter parameters
+   */
+  private getRemoveParams(): Observable<any> {
+    return this.selectedValues$.pipe(map((selectedValues) => {
+      return {
+        [this.filterConfig.paramName]: selectedValues.filter((v) => v !== this.selectedValue),
+        page: 1
+      };
+    }));
+  }
+}
+
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.html
index b7e03af473..4a325d9b3c 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.html
@@ -1 +1 @@
-<ng-container *ngComponentOutlet="getSearchFilter(); injector: objectInjector;"></ng-container>
+<ng-container *ngComponentOutlet="searchFilter injector: objectInjector;"></ng-container>
\ No newline at end of file
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
index bc088777fa..5b733b52cb 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
@@ -3,6 +3,8 @@ import { renderFilterType } from '../search-filter-type-decorator';
 import { FilterType } from '../../../search-service/filter-type.model';
 import { SearchFilterConfig } from '../../../search-service/search-filter-config.model';
 import { FILTER_CONFIG } from '../search-filter.service';
+import { GenericConstructor } from '../../../../core/shared/generic-constructor';
+import { SearchFacetFilterComponent } from '../search-facet-filter/search-facet-filter.component';
 
 @Component({
   selector: 'ds-search-facet-filter-wrapper',
@@ -18,6 +20,7 @@ export class SearchFacetFilterWrapperComponent implements OnInit {
    */
   @Input() filterConfig: SearchFilterConfig;
 
+  searchFilter: GenericConstructor<SearchFacetFilterComponent>;
   /**
    * Injector to inject a child component with the @Input parameters
    */
@@ -30,6 +33,7 @@ export class SearchFacetFilterWrapperComponent implements OnInit {
    * Initialize and add the filter config to the injector
    */
   ngOnInit(): void {
+    this.searchFilter = this.getSearchFilter();
     this.objectInjector = Injector.create({
       providers: [
         { provide: FILTER_CONFIG, useFactory: () => (this.filterConfig), deps: [] }
@@ -41,7 +45,7 @@ export class SearchFacetFilterWrapperComponent implements OnInit {
   /**
    * Find the correct component based on the filter config's type
    */
-  getSearchFilter() {
+  private getSearchFilter() {
     const type: FilterType = this.filterConfig.type;
     return renderFilterType(type);
   }
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
index f4f835c152..74c2794313 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
@@ -85,8 +85,11 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
    * Initializes all observable instance variables and starts listening to them
    */
   ngOnInit(): void {
+    console.log('renderSearchFacetFilterComponent')
+
     this.filterValues$ = new BehaviorSubject(new RemoteData(true, false, undefined, undefined, undefined));
     this.currentPage = this.getCurrentPage().pipe(distinctUntilChanged());
+
     this.selectedValues = this.filterService.getSelectedValuesForFilter(this.filterConfig);
     const searchOptions = this.searchConfigService.searchOptions;
     this.subs.push(this.searchConfigService.searchOptions.subscribe(() => this.updateFilterValueList()));
@@ -190,6 +193,7 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
    * @param data The string from the input field
    */
   onSubmit(data: any) {
+    console.log('onsubmit');
     this.selectedValues.pipe(take(1)).subscribe((selectedValues) => {
         if (isNotEmpty(data)) {
           this.router.navigate([this.getSearchLink()], {
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.actions.ts b/src/app/+search-page/search-filters/search-filter/search-filter.actions.ts
index 2e556b32d6..838597e03d 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.actions.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.actions.ts
@@ -1,6 +1,7 @@
 import { Action } from '@ngrx/store';
 
 import { type } from '../../../shared/ngrx/type';
+import { SearchFilterConfig } from '../../search-service/search-filter-config.model';
 
 /**
  * For each action type in an action group, make a simple
@@ -12,9 +13,8 @@ import { type } from '../../../shared/ngrx/type';
  */
 export const SearchFilterActionTypes = {
   COLLAPSE: type('dspace/search-filter/COLLAPSE'),
-  INITIAL_COLLAPSE: type('dspace/search-filter/INITIAL_COLLAPSE'),
+  INITIALIZE: type('dspace/search-filter/INITIALIZE'),
   EXPAND: type('dspace/search-filter/EXPAND'),
-  INITIAL_EXPAND: type('dspace/search-filter/INITIAL_EXPAND'),
   TOGGLE: type('dspace/search-filter/TOGGLE'),
   DECREMENT_PAGE: type('dspace/search-filter/DECREMENT_PAGE'),
   INCREMENT_PAGE: type('dspace/search-filter/INCREMENT_PAGE'),
@@ -66,15 +66,13 @@ export class SearchFilterToggleAction extends SearchFilterAction {
 /**
  * Used to set the initial state of a filter to collapsed
  */
-export class SearchFilterInitialCollapseAction extends SearchFilterAction {
-  type = SearchFilterActionTypes.INITIAL_COLLAPSE;
-}
-
-/**
- * Used to set the initial state of a filter to expanded
- */
-export class SearchFilterInitialExpandAction extends SearchFilterAction {
-  type = SearchFilterActionTypes.INITIAL_EXPAND;
+export class SearchFilterInitializeAction extends SearchFilterAction {
+  type = SearchFilterActionTypes.INITIALIZE;
+  initiallyExpanded;
+  constructor(filter: SearchFilterConfig) {
+    super(filter.name);
+    this.initiallyExpanded = filter.isOpenByDefault;
+  }
 }
 
 /**
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-filter.component.html
index 1013bf7e28..e2c128593f 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.component.html
@@ -1,7 +1,7 @@
-<div>
+<div *ngIf="active$ | async">
     <div (click)="toggle()" class="filter-name"><h5 class="d-inline-block mb-0">{{'search.filters.filter.' + filter.name + '.head'| translate}}</h5> <span class="filter-toggle fas float-right"
-                                                                      [ngClass]="(isCollapsed() | async) ? 'fa-plus' : 'fa-minus'"></span></div>
-    <div [@slide]="(isCollapsed() | async) ? 'collapsed' : 'expanded'"  (@slide.start)="startSlide($event)" (@slide.done)="finishSlide($event)" class="search-filter-wrapper" [ngClass]="{'closed' : collapsed}">
+                                                                      [ngClass]="(collapsed$ | async) ? 'fa-plus' : 'fa-minus'"></span></div>
+    <div [@slide]="(collapsed$ | async) ? 'collapsed' : 'expanded'"  (@slide.start)="startSlide($event)" (@slide.done)="finishSlide($event)" class="search-filter-wrapper" [ngClass]="{'closed' : closed}">
         <ds-search-facet-filter-wrapper [filterConfig]="filter"></ds-search-facet-filter-wrapper>
     </div>
 </div>
\ No newline at end of file
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-filter.component.ts
index dcc01f2b46..eaf318655f 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.component.ts
@@ -1,11 +1,12 @@
-
-import { take } from 'rxjs/operators';
+import { filter, first, map, startWith, switchMap, take } from 'rxjs/operators';
 import { Component, Input, OnInit } from '@angular/core';
 import { SearchFilterConfig } from '../../search-service/search-filter-config.model';
 import { SearchFilterService } from './search-filter.service';
-import { Observable } from 'rxjs';
+import { BehaviorSubject, Observable, of as observableOf } from 'rxjs';
 import { slide } from '../../../shared/animations/slide';
 import { isNotEmpty } from '../../../shared/empty.util';
+import { SearchService } from '../../search-service/search.service';
+import { SearchConfigurationService } from '../../search-service/search-configuration.service';
 
 @Component({
   selector: 'ds-search-filter',
@@ -26,9 +27,13 @@ export class SearchFilterComponent implements OnInit {
   /**
    * True when the filter is 100% collapsed in the UI
    */
-  collapsed;
+  closed = true;
+  collapsed$: Observable<boolean>;
 
-  constructor(private filterService: SearchFilterService) {
+  selectedValues$: Observable<string[]>;
+  active$: Observable<boolean>;
+
+  constructor(private filterService: SearchFilterService, private searchService: SearchService, private searchConfigService: SearchConfigurationService) {
   }
 
   /**
@@ -37,11 +42,13 @@ export class SearchFilterComponent implements OnInit {
    * Else, the filter should initially be collapsed
    */
   ngOnInit() {
-    this.getSelectedValues().pipe(take(1)).subscribe((isActive) => {
-      if (this.filter.isOpenByDefault || isNotEmpty(isActive)) {
-        this.initialExpand();
-      } else {
-        this.initialCollapse();
+    this.selectedValues$ = this.getSelectedValues();
+    this.active$ = this.isActive();
+    this.collapsed$ = this.isCollapsed();
+    this.initializeFilter();
+    this.selectedValues$.pipe(take(1)).subscribe((selectedValues) => {
+      if (isNotEmpty(selectedValues)) {
+        this.filterService.expand(this.filter.name);
       }
     });
   }
@@ -57,30 +64,21 @@ export class SearchFilterComponent implements OnInit {
    * Checks if the filter is currently collapsed
    * @returns {Observable<boolean>} Emits true when the current state of the filter is collapsed, false when it's expanded
    */
-  isCollapsed(): Observable<boolean> {
+  private isCollapsed(): Observable<boolean> {
     return this.filterService.isCollapsed(this.filter.name);
   }
 
   /**
-   *  Changes the initial state to collapsed
+   *  Sets the initial state of the filter
    */
-  initialCollapse() {
-    this.filterService.initialCollapse(this.filter.name);
-    this.collapsed = true;
-  }
-
-  /**
-   *  Changes the initial state to expanded
-   */
-  initialExpand() {
-    this.filterService.initialExpand(this.filter.name);
-    this.collapsed = false;
+  initializeFilter() {
+    this.filterService.initializeFilter(this.filter);
   }
 
   /**
    * @returns {Observable<string[]>} Emits a list of all values that are currently active for this filter
    */
-  getSelectedValues(): Observable<string[]> {
+  private getSelectedValues(): Observable<string[]> {
     return this.filterService.getSelectedValuesForFilter(this.filter);
   }
 
@@ -90,7 +88,7 @@ export class SearchFilterComponent implements OnInit {
    */
   finishSlide(event: any): void {
     if (event.fromState === 'collapsed') {
-      this.collapsed = false;
+      this.closed = false;
     }
   }
 
@@ -100,7 +98,32 @@ export class SearchFilterComponent implements OnInit {
    */
   startSlide(event: any): void {
     if (event.toState === 'collapsed') {
-      this.collapsed = true;
+      this.closed = true;
     }
   }
+
+  /**
+   * Check if a given filter is supposed to be shown or not
+   * @returns {Observable<boolean>} Emits true whenever a given filter config should be shown
+   */
+  private isActive(): Observable<boolean> {
+    return this.selectedValues$.pipe(
+      switchMap((isActive) => {
+        if (isNotEmpty(isActive)) {
+          return observableOf(true);
+        } else {
+          return this.searchConfigService.searchOptions.pipe(
+            first(),
+            switchMap((options) => {
+                return this.searchService.getFacetValuesFor(this.filter, 1, options).pipe(
+                  filter((RD) => !RD.isLoading),
+                  map((valuesRD) => {
+                    return valuesRD.payload.totalElements > 0
+                  }),)
+              }
+            ))
+        }
+      }),
+      startWith(true));
+  }
 }
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.reducer.ts b/src/app/+search-page/search-filters/search-filter/search-filter.reducer.ts
index f7e064fcc7..187bcd50d0 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.reducer.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.reducer.ts
@@ -1,5 +1,9 @@
-import { SearchFilterAction, SearchFilterActionTypes } from './search-filter.actions';
-import { isEmpty } from '../../../shared/empty.util';
+import {
+  SearchFilterAction,
+  SearchFilterActionTypes,
+  SearchFilterInitializeAction
+} from './search-filter.actions';
+import { isEmpty, isNotUndefined } from '../../../shared/empty.util';
 
 /**
  * Interface that represents the state for a single filters
@@ -28,27 +32,14 @@ export function filterReducer(state = initialState, action: SearchFilterAction):
 
   switch (action.type) {
 
-    case SearchFilterActionTypes.INITIAL_COLLAPSE: {
-      if (isEmpty(state) || isEmpty(state[action.filterName])) {
-        return Object.assign({}, state, {
-          [action.filterName]: {
-            filterCollapsed: true,
-            page: 1
-          }
-        });
-      }
-      return state;
-    }
-
-    case SearchFilterActionTypes.INITIAL_EXPAND: {
-      if (isEmpty(state) || isEmpty(state[action.filterName])) {
-        return Object.assign({}, state, {
-          [action.filterName]: {
-            filterCollapsed: false,
-            page: 1
-          }
-        });
-      }
+    case SearchFilterActionTypes.INITIALIZE: {
+      const initAction = (action as SearchFilterInitializeAction);
+      return Object.assign({}, state, {
+        [action.filterName]: {
+          filterCollapsed: !initAction.initiallyExpanded,
+          page: 1
+        }
+      });
       return state;
     }
 
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.service.spec.ts b/src/app/+search-page/search-filters/search-filter/search-filter.service.spec.ts
index 156e8d47ea..306f8cdb96 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.service.spec.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.service.spec.ts
@@ -5,8 +5,7 @@ import {
   SearchFilterDecrementPageAction,
   SearchFilterExpandAction,
   SearchFilterIncrementPageAction,
-  SearchFilterInitialCollapseAction,
-  SearchFilterInitialExpandAction,
+  SearchFilterInitializeAction,
   SearchFilterResetPageAction,
   SearchFilterToggleAction
 } from './search-filter.actions';
@@ -62,25 +61,16 @@ describe('SearchFilterService', () => {
     service = new SearchFilterService(store, routeServiceStub);
   });
 
-  describe('when the initialCollapse method is triggered', () => {
+  describe('when the initializeFilter method is triggered', () => {
     beforeEach(() => {
-      service.initialCollapse(mockFilterConfig.name);
+      service.initializeFilter(mockFilterConfig);
     });
 
-    it('SearchFilterInitialCollapseAction should be dispatched to the store', () => {
-      expect(store.dispatch).toHaveBeenCalledWith(new SearchFilterInitialCollapseAction(mockFilterConfig.name));
+    it('SearchFilterInitializeAction should be dispatched to the store', () => {
+      expect(store.dispatch).toHaveBeenCalledWith(new SearchFilterInitializeAction(mockFilterConfig));
     });
   });
 
-  describe('when the initialExpand method is triggered', () => {
-    beforeEach(() => {
-      service.initialExpand(mockFilterConfig.name);
-    });
-
-    it('SearchFilterInitialExpandAction should be dispatched to the store', () => {
-      expect(store.dispatch).toHaveBeenCalledWith(new SearchFilterInitialExpandAction(mockFilterConfig.name));
-    });
-  });
 
   describe('when the collapse method is triggered', () => {
     beforeEach(() => {
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.service.ts b/src/app/+search-page/search-filters/search-filter/search-filter.service.ts
index 34c34ee4cc..5ce1e8e647 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.service.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.service.ts
@@ -1,6 +1,6 @@
 import { combineLatest as observableCombineLatest, Observable } from 'rxjs';
 import { Injectable, InjectionToken } from '@angular/core';
-import { distinctUntilChanged, map } from 'rxjs/operators';
+import { distinctUntilChanged, map, tap } from 'rxjs/operators';
 import { SearchFiltersState, SearchFilterState } from './search-filter.reducer';
 import { createSelector, MemoizedSelector, select, Store } from '@ngrx/store';
 import {
@@ -8,8 +8,7 @@ import {
   SearchFilterDecrementPageAction,
   SearchFilterExpandAction,
   SearchFilterIncrementPageAction,
-  SearchFilterInitialCollapseAction,
-  SearchFilterInitialExpandAction,
+  SearchFilterInitializeAction,
   SearchFilterResetPageAction,
   SearchFilterToggleAction
 } from './search-filter.actions';
@@ -17,7 +16,9 @@ import { hasValue, isNotEmpty, } from '../../../shared/empty.util';
 import { SearchFilterConfig } from '../../search-service/search-filter-config.model';
 import { RouteService } from '../../../shared/services/route.service';
 import { Params } from '@angular/router';
-
+import { tag } from 'rxjs-spy/operators';
+import { create, detect } from "rxjs-spy";
+const spy = create();
 const filterStateSelector = (state: SearchFiltersState) => state.searchFilter;
 
 export const FILTER_CONFIG: InjectionToken<SearchFilterConfig> = new InjectionToken<SearchFilterConfig>('filterConfig');
@@ -58,16 +59,21 @@ export class SearchFilterService {
    * @returns {Observable<string[]>} Emits the active filters for the given filter configuration
    */
   getSelectedValuesForFilter(filterConfig: SearchFilterConfig): Observable<string[]> {
-    const values$ = this.routeService.getQueryParameterValues(filterConfig.paramName);
-    const prefixValues$ = this.routeService.getQueryParamsWithPrefix(filterConfig.paramName + '.').pipe(
-      map((params: Params) => [].concat(...Object.values(params)))
+    const values$ = this.routeService.getQueryParameterValues(filterConfig.paramName).pipe(
+      tag("parameter")
     );
+    const prefixValues$ = this.routeService.getQueryParamsWithPrefix(filterConfig.paramName + '.').pipe(
+      map((params: Params) => [].concat(...Object.values(params))),
+      tag("prefix-tag")
+
+
+    );
+    spy.log();
+    detect('prefix-tag');
 
     return observableCombineLatest(values$, prefixValues$).pipe(
       map(([values, prefixValues]) => {
-        console.log('getSelectedValuesForFilter ', values, prefixValues);
-
-        if (isNotEmpty(values)) {
+          if (isNotEmpty(values)) {
             return values;
           }
           return prefixValues;
@@ -138,19 +144,11 @@ export class SearchFilterService {
   }
 
   /**
-   * Dispatches an initial collapse action to the store for a given filter
-   * @param {string} filterName The filter for which the action is dispatched
+   * Dispatches an initialize action to the store for a given filter
+   * @param {SearchFilterConfig} filter The filter for which the action is dispatched
    */
-  public initialCollapse(filterName: string): void {
-    this.store.dispatch(new SearchFilterInitialCollapseAction(filterName));
-  }
-
-  /**
-   * Dispatches an initial expand action to the store for a given filter
-   * @param {string} filterName The filter for which the action is dispatched
-   */
-  public initialExpand(filterName: string): void {
-    this.store.dispatch(new SearchFilterInitialExpandAction(filterName));
+  public initializeFilter(filter: SearchFilterConfig): void {
+    this.store.dispatch(new SearchFilterInitializeAction(filter));
   }
 
   /**
diff --git a/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
index 5434f0e0f4..3acc868a17 100644
--- a/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
@@ -8,17 +8,8 @@
         </a>
         <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
           <div [@facetLoad]="animationState">
-            <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
-                <a *ngIf="!(selectedValues | async).includes(value.value)" class="d-flex flex-row"
-                   [routerLink]="[getSearchLink()]"
-                   [queryParams]="getAddParams(value.value) | async" queryParamsHandling="merge" >
-                    <input type="checkbox" [checked]="false" class="my-1 align-self-stretch"/>
-                    <span class="filter-value px-1">{{value.value}}</span>
-                    <span class="float-right filter-value-count ml-auto">
-                        <span class="badge badge-secondary badge-pill">{{value.count}}</span>
-                    </span>
-                </a>
-            </ng-container>
+            <ds-search-facet-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value">
+            </ds-search-facet-option>
           </div>
         </ng-container>
         <div class="clearfix toggle-more-filters">
diff --git a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
index 1cc0556ed5..a30233ece3 100644
--- a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
@@ -25,14 +25,7 @@
       <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
         <div [@facetLoad]="animationState">
           <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
-                <a *ngIf="!(selectedValues | async).includes(value.value)" class="d-flex flex-row"
-                   [routerLink]="[getSearchLink()]"
-                   [queryParams]="getChangeParams(value.value) | async" queryParamsHandling="merge">
-                    <span class="filter-value px-1">{{value.value}}</span>
-                    <span class="float-right filter-value-count ml-auto">
-                        <span class="badge badge-secondary badge-pill">{{value.count}}</span>
-                    </span>
-                </a>
+
             </ng-container>
           </div>
         </ng-container>
diff --git a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
index 6cb04c6c1f..2b6797f5a1 100644
--- a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
@@ -28,10 +28,9 @@ import { SearchConfigurationService } from '../../../search-service/search-confi
  * The route parameter 'id' is used to request the item it represents.
  * All fields of the item that should be displayed, are defined in its template.
  */
-const minSuffix = '.min';
-const maxSuffix = '.max';
+export const RANGE_FILTER_MIN_SUFFIX = '.min';
+export const RANGE_FILTER_MAX_SUFFIX = '.max';
 const dateFormats = ['YYYY', 'YYYY-MM', 'YYYY-MM-DD'];
-const rangeDelimiter = '-';
 
 @Component({
   selector: 'ds-search-range-filter',
@@ -85,8 +84,8 @@ export class SearchRangeFilterComponent extends SearchFacetFilterComponent imple
     super.ngOnInit();
     this.min = moment(this.filterConfig.minValue, dateFormats).year() || this.min;
     this.max = moment(this.filterConfig.maxValue, dateFormats).year() || this.max;
-    const iniMin = this.route.getQueryParameterValue(this.filterConfig.paramName + minSuffix).pipe(startWith(undefined));
-    const iniMax = this.route.getQueryParameterValue(this.filterConfig.paramName + maxSuffix).pipe(startWith(undefined));
+    const iniMin = this.route.getQueryParameterValue(this.filterConfig.paramName + RANGE_FILTER_MIN_SUFFIX).pipe(startWith(undefined));
+    const iniMax = this.route.getQueryParameterValue(this.filterConfig.paramName + RANGE_FILTER_MAX_SUFFIX).pipe(startWith(undefined));
     this.sub = observableCombineLatest(iniMin, iniMax).pipe(
       map(([min, max]) => {
         const minimum = hasValue(min) ? min : this.min;
@@ -96,22 +95,7 @@ export class SearchRangeFilterComponent extends SearchFacetFilterComponent imple
     ).subscribe((minmax) => this.range = minmax);
   }
 
-  /**
-   * Calculates the parameters that should change if a given values for this range filter would be changed
-   * @param {string} value The values that are changed for this filter
-   * @returns {Observable<any>} The changed filter parameters
-   */
-  getChangeParams(value: string) {
-    const parts = value.split(rangeDelimiter);
-    const min = parts.length > 1 ? parts[0].trim() : value;
-    const max = parts.length > 1 ? parts[1].trim() : value;
-    return observableOf(
-      {
-        [this.filterConfig.paramName + minSuffix]: [min],
-        [this.filterConfig.paramName + maxSuffix]: [max],
-        page: 1
-      });
-  }
+
 
   /**
    * Submits new custom range values to the range filter from the widget
@@ -122,8 +106,8 @@ export class SearchRangeFilterComponent extends SearchFacetFilterComponent imple
     this.router.navigate([this.getSearchLink()], {
       queryParams:
         {
-          [this.filterConfig.paramName + minSuffix]: newMin,
-          [this.filterConfig.paramName + maxSuffix]: newMax
+          [this.filterConfig.paramName + RANGE_FILTER_MIN_SUFFIX]: newMin,
+          [this.filterConfig.paramName + RANGE_FILTER_MAX_SUFFIX]: newMax
         },
       queryParamsHandling: 'merge'
     });
diff --git a/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
index 32f6fe2153..45034507a2 100644
--- a/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
@@ -10,15 +10,8 @@
           <div [@facetLoad]="animationState">
             <ng-container *ngFor="let page of filterValuesRD?.payload">
               <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
-                <a *ngIf="!(selectedValues | async).includes(value.value)" class="d-flex flex-row"
-                   [routerLink]="[getSearchLink()]"
-                   [queryParams]="getAddParams(value.value) | async" queryParamsHandling="merge" >
-                  <input type="checkbox" [checked]="false" class="my-1 align-self-stretch"/>
-                  <span class="filter-value px-1">{{value.value}}</span>
-                  <span class="float-right filter-value-count ml-auto">
-                          <span class="badge badge-secondary badge-pill">{{value.count}}</span>
-                      </span>
-                </a>
+                  <ds-search-facet-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value">
+                  </ds-search-facet-option>
               </ng-container>
             </ng-container>
           </div>
@@ -40,6 +33,5 @@
                           (submitSuggestion)="onSubmit($event)"
                           (clickSuggestion)="onClick($event)"
                           (findSuggestions)="findSuggestions($event)"
-                          ngDefaultControl
-    ></ds-input-suggestions>
+                          ngDefaultControl></ds-input-suggestions>
 </div>
diff --git a/src/app/+search-page/search-filters/search-filters.component.html b/src/app/+search-page/search-filters/search-filters.component.html
index de725f0958..ab2a96d752 100644
--- a/src/app/+search-page/search-filters/search-filters.component.html
+++ b/src/app/+search-page/search-filters/search-filters.component.html
@@ -1,7 +1,7 @@
 <h3>{{"search.filters.head" | translate}}</h3>
 <div *ngIf="(filters | async)?.hasSucceeded">
     <div *ngFor="let filter of (filters | async)?.payload; trackBy: trackUpdate">
-        <ds-search-filter *ngIf="isActive(filter) | async" class="d-block mb-3 p-3" [filter]="filter"></ds-search-filter>
+        <ds-search-filter class="d-block mb-3 p-3" [filter]="filter"></ds-search-filter>
     </div>
 </div>
 <a class="btn btn-primary" [routerLink]="[getSearchLink()]" [queryParams]="clearParams | async" queryParamsHandling="merge" role="button">{{"search.filters.reset" | translate}}</a>
\ No newline at end of file
diff --git a/src/app/+search-page/search-filters/search-filters.component.ts b/src/app/+search-page/search-filters/search-filters.component.ts
index 0d32df4867..1dd747e908 100644
--- a/src/app/+search-page/search-filters/search-filters.component.ts
+++ b/src/app/+search-page/search-filters/search-filters.component.ts
@@ -1,15 +1,13 @@
-import { Observable, of as observableOf } from 'rxjs';
+import { Observable } from 'rxjs';
 
-import { filter, first, map, mergeMap, startWith, switchMap, tap } from 'rxjs/operators';
+import { map } from 'rxjs/operators';
 import { Component } from '@angular/core';
 import { SearchService } from '../search-service/search.service';
 import { RemoteData } from '../../core/data/remote-data';
 import { SearchFilterConfig } from '../search-service/search-filter-config.model';
 import { SearchConfigurationService } from '../search-service/search-configuration.service';
-import { isNotEmpty } from '../../shared/empty.util';
 import { SearchFilterService } from './search-filter/search-filter.service';
 import { getSucceededRemoteData } from '../../core/shared/operators';
-import { FieldUpdate } from '../../core/data/object-updates/object-updates.reducer';
 
 @Component({
   selector: 'ds-search-filters',
@@ -53,32 +51,6 @@ export class SearchFiltersComponent {
     return this.searchService.getSearchLink();
   }
 
-  /**
-   * Check if a given filter is supposed to be shown or not
-   * @param {SearchFilterConfig} filter The filter to check for
-   * @returns {Observable<boolean>} Emits true whenever a given filter config should be shown
-   */
-  isActive(filterConfig: SearchFilterConfig): Observable<boolean> {
-    return this.filterService.getSelectedValuesForFilter(filterConfig).pipe(
-      switchMap((isActive) => {
-        console.log('selected fires');
-        if (isNotEmpty(isActive)) {
-          return observableOf(true);
-        } else {
-          return this.searchConfigService.searchOptions.pipe(
-            first(),
-            switchMap((options) => {
-                return this.searchService.getFacetValuesFor(filterConfig, 1, options).pipe(
-                  filter((RD) => !RD.isLoading),
-                  map((valuesRD) => {
-                    return valuesRD.payload.totalElements > 0
-                  }),)
-              }
-            ))
-        }
-      }), tap(t => console.log(t)), startWith(true));
-  }
-
   /**
    * Prevent unnecessary rerendering
    */
diff --git a/src/app/+search-page/search-page.component.ts b/src/app/+search-page/search-page.component.ts
index 816e3d67bf..0c572a3a84 100644
--- a/src/app/+search-page/search-page.component.ts
+++ b/src/app/+search-page/search-page.component.ts
@@ -62,7 +62,6 @@ export class SearchPageComponent implements OnInit {
   constructor(private service: SearchService,
               private sidebarService: SearchSidebarService,
               private windowService: HostWindowService,
-              private filterService: SearchFilterService,
               private searchConfigService: SearchConfigurationService) {
     this.isXsOrSm$ = this.windowService.isXsOrSm();
   }
diff --git a/src/app/+search-page/search-page.module.ts b/src/app/+search-page/search-page.module.ts
index 0c8a4ee306..b441367f1b 100644
--- a/src/app/+search-page/search-page.module.ts
+++ b/src/app/+search-page/search-page.module.ts
@@ -28,6 +28,9 @@ import { SearchFacetFilterWrapperComponent } from './search-filters/search-filte
 import { SearchBooleanFilterComponent } from './search-filters/search-filter/search-boolean-filter/search-boolean-filter.component';
 import { SearchHierarchyFilterComponent } from './search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component';
 import { SearchConfigurationService } from './search-service/search-configuration.service';
+import { SearchFacetOptionComponent } from './search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component';
+import { SearchFacetSelectedOptionComponent } from './search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component';
+import { SearchFacetRangeOptionComponent } from './search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component';
 
 const effects = [
   SearchSidebarEffects
@@ -63,6 +66,9 @@ const effects = [
     SearchTextFilterComponent,
     SearchHierarchyFilterComponent,
     SearchBooleanFilterComponent,
+    SearchFacetOptionComponent,
+    SearchFacetSelectedOptionComponent,
+    SearchFacetRangeOptionComponent
   ],
   providers: [
     SearchService,
@@ -82,6 +88,9 @@ const effects = [
     SearchTextFilterComponent,
     SearchHierarchyFilterComponent,
     SearchBooleanFilterComponent,
+    SearchFacetOptionComponent,
+    SearchFacetSelectedOptionComponent,
+    SearchFacetRangeOptionComponent
   ]
 })
 
diff --git a/src/app/shared/services/route.service.ts b/src/app/shared/services/route.service.ts
index 478d92c21e..b6c7747cfb 100644
--- a/src/app/shared/services/route.service.ts
+++ b/src/app/shared/services/route.service.ts
@@ -1,4 +1,4 @@
-import { distinctUntilChanged, map } from 'rxjs/operators';
+import { distinctUntilChanged, map, tap } from 'rxjs/operators';
 import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
 import {
@@ -6,6 +6,7 @@ import {
   Router,
 } from '@angular/router';
 import { isNotEmpty } from '../empty.util';
+import { detect } from 'rxjs-spy';
 
 @Injectable()
 export class RouteService {
@@ -14,6 +15,7 @@ export class RouteService {
   }
 
   getQueryParameterValues(paramName: string): Observable<string[]> {
+    console.log('called');
     return this.route.queryParamMap.pipe(
       map((params) => [...params.getAll(paramName)]),
       distinctUntilChanged((a, b) => JSON.stringify(a) === JSON.stringify(b))
@@ -44,6 +46,7 @@ export class RouteService {
   getQueryParamsWithPrefix(prefix: string): Observable<Params> {
     return this.route.queryParamMap.pipe(
       map((qparams) => {
+        console.log('map');
         const params = {};
         qparams.keys
           .filter((key) => key.startsWith(prefix))
@@ -52,6 +55,8 @@ export class RouteService {
           });
         return params;
       }),
-      distinctUntilChanged((a, b) => JSON.stringify(a) === JSON.stringify(b)));
+      distinctUntilChanged((a, b) => { console.log('changed?', a, b, JSON.stringify(a) === JSON.stringify(b)); return JSON.stringify(a) === JSON.stringify(b)}),
+      tap((t) => console.log('changed'))
+    );
   }
 }
diff --git a/src/main.browser.ts b/src/main.browser.ts
index 8409a96485..7b0fbf9d65 100644
--- a/src/main.browser.ts
+++ b/src/main.browser.ts
@@ -12,6 +12,7 @@ import { BrowserAppModule } from './modules/app/browser-app.module';
 
 import { ENV_CONFIG } from './config';
 
+
 if (ENV_CONFIG.production) {
   enableProdMode();
 }
diff --git a/yarn.lock b/yarn.lock
index d71d9b9186..208ed60c2f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -243,6 +243,10 @@
     "@types/connect" "*"
     "@types/node" "*"
 
+"@types/circular-json@^0.4.0":
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/@types/circular-json/-/circular-json-0.4.0.tgz#7401f7e218cfe87ad4c43690da5658b9acaf51be"
+
 "@types/connect@*":
   version "3.4.32"
   resolved "https://registry.yarnpkg.com/@types/connect/-/connect-3.4.32.tgz#aa0e9616b9435ccad02bc52b5b454ffc2c70ba28"
@@ -370,6 +374,10 @@
   dependencies:
     "@types/node" "*"
 
+"@types/stacktrace-js@^0.0.32":
+  version "0.0.32"
+  resolved "https://registry.yarnpkg.com/@types/stacktrace-js/-/stacktrace-js-0.0.32.tgz#d23e4a36a5073d39487fbea8234cc6186862d389"
+
 "@types/strip-bom@^3.0.0":
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/@types/strip-bom/-/strip-bom-3.0.0.tgz#14a8ec3956c2e81edb7520790aecf21c290aebd2"
@@ -1600,6 +1608,10 @@ cipher-base@^1.0.0, cipher-base@^1.0.1, cipher-base@^1.0.3:
     inherits "^2.0.1"
     safe-buffer "^5.0.1"
 
+circular-json@^0.5.0:
+  version "0.5.9"
+  resolved "https://registry.yarnpkg.com/circular-json/-/circular-json-0.5.9.tgz#932763ae88f4f7dead7a0d09c8a51a4743a53b1d"
+
 circular-json@^0.5.5:
   version "0.5.5"
   resolved "https://registry.yarnpkg.com/circular-json/-/circular-json-0.5.5.tgz#64182ef359042d37cd8e767fc9de878b1e9447d3"
@@ -2605,6 +2617,12 @@ error-ex@^1.2.0, error-ex@^1.3.1:
   dependencies:
     is-arrayish "^0.2.1"
 
+error-stack-parser@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/error-stack-parser/-/error-stack-parser-2.0.2.tgz#4ae8dbaa2bf90a8b450707b9149dcabca135520d"
+  dependencies:
+    stackframe "^1.0.4"
+
 es-abstract@^1.4.3, es-abstract@^1.5.1:
   version "1.12.0"
   resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.12.0.tgz#9dbbdd27c6856f0001421ca18782d786bf8a6165"
@@ -7237,6 +7255,16 @@ rx@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/rx/-/rx-4.1.0.tgz#a5f13ff79ef3b740fe30aa803fb09f98805d4782"
 
+rxjs-spy@^7.5.1:
+  version "7.5.1"
+  resolved "https://registry.yarnpkg.com/rxjs-spy/-/rxjs-spy-7.5.1.tgz#1a9ef50bc8d7dd00d9ecf3c54c00929231eaf319"
+  dependencies:
+    "@types/circular-json" "^0.4.0"
+    "@types/stacktrace-js" "^0.0.32"
+    circular-json "^0.5.0"
+    error-stack-parser "^2.0.1"
+    stacktrace-gps "^3.0.2"
+
 rxjs@6.2.2, rxjs@^6.0.0, rxjs@^6.1.0:
   version "6.2.2"
   resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-6.2.2.tgz#eb75fa3c186ff5289907d06483a77884586e1cf9"
@@ -7681,6 +7709,10 @@ source-map@0.5.0:
   version "0.5.0"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.0.tgz#0fe96503ac86a5adb5de63f4e412ae4872cdbe86"
 
+source-map@0.5.6:
+  version "0.5.6"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.6.tgz#75ce38f52bf0733c5a7f0c118d81334a2bb5f412"
+
 source-map@0.7.3:
   version "0.7.3"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383"
@@ -7801,6 +7833,17 @@ ssri@^5.2.4:
   dependencies:
     safe-buffer "^5.1.1"
 
+stackframe@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.0.4.tgz#357b24a992f9427cba6b545d96a14ed2cbca187b"
+
+stacktrace-gps@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/stacktrace-gps/-/stacktrace-gps-3.0.2.tgz#33f8baa4467323ab2bd1816efa279942ba431ccc"
+  dependencies:
+    source-map "0.5.6"
+    stackframe "^1.0.4"
+
 static-extend@^0.1.1:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/static-extend/-/static-extend-0.1.2.tgz#60809c39cbff55337226fd5e0b520f341f1fb5c6"

From 037063ea63b007c2bf6e2d06b0e373eb9379d8dd Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Thu, 21 Mar 2019 15:52:34 +0100
Subject: [PATCH 19/24] Added more optimalisations and fixed tests

---
 .../search-boolean-filter.component.html      |  5 +-
 .../search-facet-option.component.html        |  6 +--
 .../search-facet-option.component.ts          | 43 +++++++++--------
 .../search-facet-range-option.component.html  |  4 +-
 .../search-facet-range-option.component.ts    | 41 ++++++++--------
 ...earch-facet-selected-option.component.html |  2 +-
 .../search-facet-selected-option.component.ts | 45 +++++++++++------
 .../search-facet-filter.component.spec.ts     | 14 ------
 .../search-facet-filter.component.ts          | 48 ++++---------------
 .../search-filter.component.spec.ts           | 33 +++++--------
 .../search-filter.reducer.spec.ts             | 24 +++++-----
 .../search-filter.service.spec.ts             |  1 -
 .../search-filter/search-filter.service.ts    | 16 ++-----
 .../search-hierarchy-filter.component.html    | 10 +---
 .../search-range-filter.component.html        |  4 +-
 .../search-range-filter.component.spec.ts     | 10 ----
 .../search-range-filter.component.ts          |  2 -
 .../search-text-filter.component.html         | 16 ++-----
 .../search-configuration.service.spec.ts      |  4 +-
 .../search-configuration.service.ts           |  4 +-
 src/app/core/cache/object-cache.service.ts    |  2 +-
 src/app/shared/services/route.service.ts      |  5 +-
 src/main.browser.ts                           |  1 -
 23 files changed, 132 insertions(+), 208 deletions(-)

diff --git a/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
index 06154916b2..968bf9e420 100644
--- a/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
@@ -1,10 +1,9 @@
 <div>
     <div class="filters py-2">
-        <ds-search-facet-selected-option *ngFor="let value of (selectedValues | async)" [selectedValue]="value" [filterConfig]="filterConfig"></ds-search-facet-selected-option>
+        <ds-search-facet-selected-option *ngFor="let value of (selectedValues$ | async)" [selectedValue]="value" [filterConfig]="filterConfig" [selectedValues$]="selectedValues$"></ds-search-facet-selected-option>
       <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
         <div [@facetLoad]="animationState">
-            <ds-search-facet-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value">
-            </ds-search-facet-option>
+            <ds-search-facet-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value" [selectedValues$]="selectedValues$"></ds-search-facet-option>
         </div>
         </ng-container>
         <div class="clearfix toggle-more-filters">
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
index 881fb98dcb..9f5a88b71b 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
@@ -1,6 +1,6 @@
-<a *ngIf="isVisible" class="d-flex flex-row"
-   [routerLink]="[getSearchLink()]"
-   [queryParams]="addQueryParams | async" queryParamsHandling="merge">
+<script src="search-facet-option.component.ts"></script><a *ngIf="isVisible | async" class="d-flex flex-row"
+                                                           [routerLink]="[getSearchLink()]"
+                                                           [queryParams]="addQueryParams" queryParamsHandling="merge">
     <input type="checkbox" [checked]="false" class="my-1 align-self-stretch"/>
     <span class="filter-value px-1">{{filterValue.value}}</span>
     <span class="float-right filter-value-count ml-auto">
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
index c5896f92b6..9fa59a0c1e 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
@@ -1,11 +1,13 @@
-import { Observable, of as observableOf } from 'rxjs';
-import { map } from 'rxjs/operators';
-import { Component, Input, OnInit } from '@angular/core';
+import { combineLatest as observableCombineLatest, Observable, Subscription } from 'rxjs';
+import { map, take } from 'rxjs/operators';
+import { Component, Input, OnDestroy, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
 import { FacetValue } from '../../../../search-service/facet-value.model';
 import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
 import { SearchService } from '../../../../search-service/search.service';
 import { SearchFilterService } from '../../search-filter.service';
+import { SearchConfigurationService } from '../../../../search-service/search-configuration.service';
+import { hasValue } from '../../../../../shared/empty.util';
 
 @Component({
   selector: 'ds-search-facet-option',
@@ -15,24 +17,22 @@ import { SearchFilterService } from '../../search-filter.service';
 /**
  * Represents a single option in a filter facet
  */
-export class SearchFacetOptionComponent implements OnInit {
+export class SearchFacetOptionComponent implements OnInit, OnDestroy {
   /**
    * A single value for this component
    */
   @Input() filterValue: FacetValue;
   @Input() filterConfig: SearchFilterConfig;
-
-  /**
-   * Emits the active values for this filter
-   */
-  selectedValues$: Observable<string[]>;
+  @Input() selectedValues$: Observable<string[]>;
 
   isVisible: Observable<boolean>;
 
   addQueryParams;
+  sub: Subscription;
 
   constructor(protected searchService: SearchService,
               protected filterService: SearchFilterService,
+              protected searchConfigService: SearchConfigurationService,
               protected router: Router
   ) {
   }
@@ -41,9 +41,11 @@ export class SearchFacetOptionComponent implements OnInit {
    * Initializes all observable instance variables and starts listening to them
    */
   ngOnInit(): void {
-    this.selectedValues$ = this.filterService.getSelectedValuesForFilter(this.filterConfig);
     this.isVisible = this.isChecked().pipe(map((checked: boolean) => !checked));
-    this.addQueryParams = this.getAddParams();
+    this.sub = observableCombineLatest(this.selectedValues$, this.searchConfigService.searchOptions)
+      .subscribe(([selectedValues, searchOptions]) => {
+        this.updateAddParams(selectedValues)
+      });
   }
 
   /**
@@ -63,16 +65,17 @@ export class SearchFacetOptionComponent implements OnInit {
   /**
    * Calculates the parameters that should change if a given value for this filter would be added to the active filters
    * @param {string} value The value that is added for this filter
-   * @returns {Observable<any>} The changed filter parameters
    */
-  private getAddParams(): Observable<any> {
-    return this.selectedValues$.pipe(map((selectedValues) => {
-      return {
-        [this.filterConfig.paramName]: [...selectedValues, this.filterValue.value],
-        page: 1
-      };
-    }));
+  private updateAddParams(selectedValues: string[]): void {
+    this.addQueryParams = {
+      [this.filterConfig.paramName]: [...selectedValues, this.filterValue.value],
+      page: 1
+    };
   }
 
+  ngOnDestroy(): void {
+    if (hasValue(this.sub)) {
+      this.sub.unsubscribe();
+    }
+  }
 }
-
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html
index 92e90a00cc..b485fe0fd0 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.html
@@ -1,6 +1,6 @@
-<a *ngIf="isVisible" class="d-flex flex-row"
+<a *ngIf="isVisible | async" class="d-flex flex-row"
    [routerLink]="[getSearchLink()]"
-   [queryParams]="changeQueryParams | async" queryParamsHandling="merge">
+   [queryParams]="changeQueryParams" queryParamsHandling="merge">
     <span class="filter-value px-1">{{filterValue.value}}</span>
     <span class="float-right filter-value-count ml-auto">
                         <span class="badge badge-secondary badge-pill">{{filterValue.count}}</span>
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
index 0b38ca1845..2f6a49f8b9 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
@@ -1,6 +1,6 @@
-import { Observable, of as observableOf } from 'rxjs';
+import { Observable, Subscription } from 'rxjs';
 import { map } from 'rxjs/operators';
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnDestroy, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
 import { FacetValue } from '../../../../search-service/facet-value.model';
 import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
@@ -10,6 +10,8 @@ import {
   RANGE_FILTER_MAX_SUFFIX,
   RANGE_FILTER_MIN_SUFFIX
 } from '../../search-range-filter/search-range-filter.component';
+import { SearchConfigurationService } from '../../../../search-service/search-configuration.service';
+import { hasValue } from '../../../../../shared/empty.util';
 
 const rangeDelimiter = '-';
 
@@ -21,24 +23,21 @@ const rangeDelimiter = '-';
 /**
  * Represents a single option in a filter facet
  */
-export class SearchFacetRangeOptionComponent implements OnInit {
+export class SearchFacetRangeOptionComponent implements OnInit, OnDestroy {
   /**
    * A single value for this component
    */
   @Input() filterValue: FacetValue;
   @Input() filterConfig: SearchFilterConfig;
 
-  /**
-   * Emits the active values for this filter
-   */
-  selectedValues$: Observable<string[]>;
-
   isVisible: Observable<boolean>;
 
   changeQueryParams;
+  sub: Subscription;
 
   constructor(protected searchService: SearchService,
               protected filterService: SearchFilterService,
+              protected searchConfigService: SearchConfigurationService,
               protected router: Router
   ) {
   }
@@ -47,9 +46,10 @@ export class SearchFacetRangeOptionComponent implements OnInit {
    * Initializes all observable instance variables and starts listening to them
    */
   ngOnInit(): void {
-    this.selectedValues$ = this.filterService.getSelectedValuesForFilter(this.filterConfig);
     this.isVisible = this.isChecked().pipe(map((checked: boolean) => !checked));
-    this.changeQueryParams = this.getChangeParams();
+    this.sub = this.searchConfigService.searchOptions.subscribe(() => {
+      this.updateChangeParams()
+    });
   }
 
   /**
@@ -66,23 +66,24 @@ export class SearchFacetRangeOptionComponent implements OnInit {
     return this.searchService.getSearchLink();
   }
 
-
   /**
    * Calculates the parameters that should change if a given values for this range filter would be changed
    * @param {string} value The values that are changed for this filter
-   * @returns {Observable<any>} The changed filter parameters
    */
-  getChangeParams() {
+  updateChangeParams(): void {
     const parts = this.filterValue.value.split(rangeDelimiter);
     const min = parts.length > 1 ? parts[0].trim() : this.filterValue.value;
     const max = parts.length > 1 ? parts[1].trim() : this.filterValue.value;
-    return observableOf(
-      {
-        [this.filterConfig.paramName + RANGE_FILTER_MIN_SUFFIX]: [min],
-        [this.filterConfig.paramName + RANGE_FILTER_MAX_SUFFIX]: [max],
-        page: 1
-      });
+    this.changeQueryParams = {
+      [this.filterConfig.paramName + RANGE_FILTER_MIN_SUFFIX]: [min],
+      [this.filterConfig.paramName + RANGE_FILTER_MAX_SUFFIX]: [max],
+      page: 1
+    };
   }
 
+  ngOnDestroy(): void {
+    if (hasValue(this.sub)) {
+      this.sub.unsubscribe();
+    }
+  }
 }
-
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.html
index 7bed620770..ba43bae100 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.html
@@ -1,6 +1,6 @@
 <a class="d-flex flex-row"
    [routerLink]="[getSearchLink()]"
-   [queryParams]="removeQueryParams | async" queryParamsHandling="merge">
+   [queryParams]="removeQueryParams" queryParamsHandling="merge">
     <input type="checkbox" [checked]="true" class="my-1 align-self-stretch"/>
     <span class="filter-value pl-1">{{selectedValue}}</span>
 </a>
\ No newline at end of file
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
index 2fdc490d68..55030a4a84 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
@@ -1,11 +1,19 @@
-import { Observable, of as observableOf } from 'rxjs';
-import { map } from 'rxjs/operators';
-import { Component, Input, OnInit } from '@angular/core';
+import {
+  combineLatest as observableCombineLatest,
+  Observable,
+  of as observableOf,
+  Subscription
+} from 'rxjs';
+import { delay, map } from 'rxjs/operators';
+import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
 import { Router } from '@angular/router';
 import { FacetValue } from '../../../../search-service/facet-value.model';
 import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
 import { SearchService } from '../../../../search-service/search.service';
 import { SearchFilterService } from '../../search-filter.service';
+import { hasValue } from '../../../../../shared/empty.util';
+import { SearchOptions } from '../../../../search-options.model';
+import { SearchConfigurationService } from '../../../../search-service/search-configuration.service';
 
 @Component({
   selector: 'ds-search-facet-selected-option',
@@ -15,7 +23,7 @@ import { SearchFilterService } from '../../search-filter.service';
 /**
  * Represents a single option in a filter facet
  */
-export class SearchFacetSelectedOptionComponent implements OnInit {
+export class SearchFacetSelectedOptionComponent implements OnInit, OnDestroy {
   /**
    * A single value for this component
    */
@@ -25,12 +33,14 @@ export class SearchFacetSelectedOptionComponent implements OnInit {
   /**
    * Emits the active values for this filter
    */
-  selectedValues$: Observable<string[]>;
+  @Input() selectedValues$: Observable<string[]>;
 
   removeQueryParams;
+  sub: Subscription;
 
   constructor(protected searchService: SearchService,
               protected filterService: SearchFilterService,
+              protected searchConfigService: SearchConfigurationService,
               protected router: Router
   ) {
   }
@@ -39,8 +49,10 @@ export class SearchFacetSelectedOptionComponent implements OnInit {
    * Initializes all observable instance variables and starts listening to them
    */
   ngOnInit(): void {
-    this.selectedValues$ = this.filterService.getSelectedValuesForFilter(this.filterConfig);
-    this.removeQueryParams = this.getRemoveParams();
+    this.sub = observableCombineLatest(this.selectedValues$, this.searchConfigService.searchOptions)
+      .subscribe(([selectedValues, searchOptions]) => {
+        this.updateRemoveParams(selectedValues)
+      });
   }
 
   /**
@@ -55,13 +67,16 @@ export class SearchFacetSelectedOptionComponent implements OnInit {
    * @param {string} value The value that is removed for this filter
    * @returns {Observable<any>} The changed filter parameters
    */
-  private getRemoveParams(): Observable<any> {
-    return this.selectedValues$.pipe(map((selectedValues) => {
-      return {
-        [this.filterConfig.paramName]: selectedValues.filter((v) => v !== this.selectedValue),
-        page: 1
-      };
-    }));
+  private updateRemoveParams(selectedValues: string[]): void {
+    this.removeQueryParams = {
+      [this.filterConfig.paramName]: selectedValues.filter((v) => v !== this.selectedValue),
+      page: 1
+    };
+  }
+
+  ngOnDestroy(): void {
+    if (hasValue(this.sub)) {
+      this.sub.unsubscribe();
+    }
   }
 }
-
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.spec.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.spec.ts
index 498c41dd6c..cb3d4730b4 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.spec.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.spec.ts
@@ -120,20 +120,6 @@ describe('SearchFacetFilterComponent', () => {
     });
   });
 
-  describe('when the getAddParams method is called wih a value', () => {
-    it('should return the selectedValue list with the new parameter value', () => {
-      const result = comp.getAddParams(value3);
-      result.subscribe((r) => expect(r[mockFilterConfig.paramName]).toEqual([value1, value2, value3]));
-    });
-  });
-
-  describe('when the getRemoveParams method is called wih a value', () => {
-    it('should return the selectedValue list with the parameter value left out', () => {
-      const result = comp.getRemoveParams(value1);
-      result.subscribe((r) => expect(r[mockFilterConfig.paramName]).toEqual([value2]));
-    });
-  });
-
   describe('when the showMore method is called', () => {
     beforeEach(() => {
       spyOn(filterService, 'incrementPage');
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
index 74c2794313..62275ee3c4 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
@@ -22,6 +22,7 @@ import { FILTER_CONFIG, SearchFilterService } from '../search-filter.service';
 import { SearchConfigurationService } from '../../../search-service/search-configuration.service';
 import { getSucceededRemoteData } from '../../../../core/shared/operators';
 import { InputSuggestion } from '../../../../shared/input-suggestions/input-suggestions.model';
+import { SearchOptions } from '../../../search-options.model';
 
 @Component({
   selector: 'ds-search-facet-filter',
@@ -65,13 +66,14 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
   /**
    * Emits the active values for this filter
    */
-  selectedValues: Observable<string[]>;
+  selectedValues$: Observable<string[]>;
   private collapseNextUpdate = true;
 
   /**
    * State of the requested facets used to time the animation
    */
   animationState = 'loading';
+  searchOptions$: Observable<SearchOptions>;
 
   constructor(protected searchService: SearchService,
               protected filterService: SearchFilterService,
@@ -85,15 +87,13 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
    * Initializes all observable instance variables and starts listening to them
    */
   ngOnInit(): void {
-    console.log('renderSearchFacetFilterComponent')
-
     this.filterValues$ = new BehaviorSubject(new RemoteData(true, false, undefined, undefined, undefined));
     this.currentPage = this.getCurrentPage().pipe(distinctUntilChanged());
 
-    this.selectedValues = this.filterService.getSelectedValuesForFilter(this.filterConfig);
-    const searchOptions = this.searchConfigService.searchOptions;
-    this.subs.push(this.searchConfigService.searchOptions.subscribe(() => this.updateFilterValueList()));
-    const facetValues = observableCombineLatest(searchOptions, this.currentPage).pipe(
+    this.selectedValues$ = this.filterService.getSelectedValuesForFilter(this.filterConfig);
+    this.searchOptions$ = this.searchConfigService.searchOptions;
+    this.subs.push(this.searchOptions$.subscribe(() => this.updateFilterValueList()));
+    const facetValues = observableCombineLatest(this.searchOptions$, this.currentPage).pipe(
       map(([options, page]) => {
         return { options, page }
       }),
@@ -193,8 +193,7 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
    * @param data The string from the input field
    */
   onSubmit(data: any) {
-    console.log('onsubmit');
-    this.selectedValues.pipe(take(1)).subscribe((selectedValues) => {
+    this.selectedValues$.pipe(take(1)).subscribe((selectedValues) => {
         if (isNotEmpty(data)) {
           this.router.navigate([this.getSearchLink()], {
             queryParams:
@@ -219,34 +218,6 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
     return hasValue(o);
   }
 
-  /**
-   * Calculates the parameters that should change if a given value for this filter would be removed from the active filters
-   * @param {string} value The value that is removed for this filter
-   * @returns {Observable<any>} The changed filter parameters
-   */
-  getRemoveParams(value: string): Observable<any> {
-    return this.selectedValues.pipe(map((selectedValues) => {
-      return {
-        [this.filterConfig.paramName]: selectedValues.filter((v) => v !== value),
-        page: 1
-      };
-    }));
-  }
-
-  /**
-   * Calculates the parameters that should change if a given value for this filter would be added to the active filters
-   * @param {string} value The value that is added for this filter
-   * @returns {Observable<any>} The changed filter parameters
-   */
-  getAddParams(value: string): Observable<any> {
-    return this.selectedValues.pipe(map((selectedValues) => {
-      return {
-        [this.filterConfig.paramName]: [...selectedValues, value],
-        page: 1
-      };
-    }));
-  }
-
   /**
    * Unsubscribe from all subscriptions
    */
@@ -263,7 +234,7 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
    */
   findSuggestions(data): void {
     if (isNotEmpty(data)) {
-      this.searchConfigService.searchOptions.pipe(take(1)).subscribe(
+      this.searchOptions$.pipe(take(1)).subscribe(
         (options) => {
           this.filterSearchResults = this.searchService.getFacetValuesFor(this.filterConfig, 1, options, data.toLowerCase())
             .pipe(
@@ -295,7 +266,6 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
     return new EmphasizePipe().transform(facet.value, query) + ' (' + facet.count + ')';
   }
 
-
   /**
    * Prevent unnecessary rerendering
    */
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.component.spec.ts b/src/app/+search-page/search-filters/search-filter/search-filter.component.spec.ts
index caa5a6febc..30ef349675 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.component.spec.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.component.spec.ts
@@ -10,6 +10,7 @@ import { SearchService } from '../../search-service/search.service';
 import { SearchFilterComponent } from './search-filter.component';
 import { SearchFilterConfig } from '../../search-service/search-filter-config.model';
 import { FilterType } from '../../search-service/filter-type.model';
+import { SearchConfigurationService } from '../../search-service/search-configuration.service';
 
 describe('SearchFilterComponent', () => {
   let comp: SearchFilterComponent;
@@ -33,9 +34,7 @@ describe('SearchFilterComponent', () => {
     },
     expand: (filter) => {
     },
-    initialCollapse: (filter) => {
-    },
-    initialExpand: (filter) => {
+    initializeFilter: (filter) => {
     },
     getSelectedValuesForFilter: (filter) => {
       return observableOf([filterName1, filterName2, filterName3])
@@ -55,6 +54,8 @@ describe('SearchFilterComponent', () => {
     getFacetValuesFor: (filter) => mockResults
   };
 
+  const searchConfigServiceStub = {};
+
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       imports: [TranslateModule.forRoot(), RouterTestingModule.withRoutes([]), NoopAnimationsModule],
@@ -65,6 +66,7 @@ describe('SearchFilterComponent', () => {
           provide: SearchFilterService,
           useValue: mockFilterService
         },
+        { provide: SearchConfigurationService, useValue: searchConfigServiceStub },
       ],
       schemas: [NO_ERRORS_SCHEMA]
     }).overrideComponent(SearchFilterComponent, {
@@ -91,32 +93,21 @@ describe('SearchFilterComponent', () => {
     });
   });
 
-  describe('when the initialCollapse method is triggered', () => {
+  describe('when the initializeFilter method is triggered', () => {
     beforeEach(() => {
-      spyOn(filterService, 'initialCollapse');
-      comp.initialCollapse();
+      spyOn(filterService, 'initializeFilter');
+      comp.initializeFilter();
     });
 
     it('should call initialCollapse with the correct filter configuration name', () => {
-      expect(filterService.initialCollapse).toHaveBeenCalledWith(mockFilterConfig.name)
-    });
-  });
-
-  describe('when the initialExpand method is triggered', () => {
-    beforeEach(() => {
-      spyOn(filterService, 'initialExpand');
-      comp.initialExpand();
-    });
-
-    it('should call initialCollapse with the correct filter configuration name', () => {
-      expect(filterService.initialExpand).toHaveBeenCalledWith(mockFilterConfig.name)
+      expect(filterService.initializeFilter).toHaveBeenCalledWith(mockFilterConfig)
     });
   });
 
   describe('when getSelectedValues is called', () => {
     let valuesObservable: Observable<string[]>;
     beforeEach(() => {
-      valuesObservable = comp.getSelectedValues();
+      valuesObservable = (comp as any).getSelectedValues();
     });
 
     it('should return an observable containing the existing filters', () => {
@@ -141,7 +132,7 @@ describe('SearchFilterComponent', () => {
     let isActive: Observable<boolean>;
     beforeEach(() => {
       filterService.isCollapsed = () => observableOf(true);
-      isActive = comp.isCollapsed();
+      isActive = (comp as any).isCollapsed();
     });
 
     it('should return an observable containing true', () => {
@@ -156,7 +147,7 @@ describe('SearchFilterComponent', () => {
     let isActive: Observable<boolean>;
     beforeEach(() => {
       filterService.isCollapsed = () => observableOf(false);
-      isActive = comp.isCollapsed();
+      isActive = (comp as any).isCollapsed();
     });
 
     it('should return an observable containing false', () => {
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.reducer.spec.ts b/src/app/+search-page/search-filters/search-filter/search-filter.reducer.spec.ts
index 8fbfbf2e65..2f3268fba5 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.reducer.spec.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.reducer.spec.ts
@@ -1,10 +1,8 @@
 import * as deepFreeze from 'deep-freeze';
 import {
   SearchFilterCollapseAction, SearchFilterExpandAction, SearchFilterIncrementPageAction,
-  SearchFilterInitialCollapseAction,
-  SearchFilterInitialExpandAction,
   SearchFilterToggleAction,
-  SearchFilterDecrementPageAction, SearchFilterResetPageAction
+  SearchFilterDecrementPageAction, SearchFilterResetPageAction, SearchFilterInitializeAction
 } from './search-filter.actions';
 import { filterReducer } from './search-filter.reducer';
 
@@ -98,35 +96,39 @@ describe('filterReducer', () => {
     filterReducer(state, action);
   });
 
-  it('should set filterCollapsed to true in response to the INITIAL_COLLAPSE action when no state has been set for this filter', () => {
+  it('should set filterCollapsed to true in response to the INITIALIZE action with isOpenByDefault to false when no state has been set for this filter', () => {
     const state = {};
     state[filterName2] = { filterCollapsed: false, page: 1 };
-    const action = new SearchFilterInitialCollapseAction(filterName1);
+    const filterConfig = {isOpenByDefault: false, name: filterName1} as any;
+    const action = new SearchFilterInitializeAction(filterConfig);
     const newState = filterReducer(state, action);
 
     expect(newState[filterName1].filterCollapsed).toEqual(true);
   });
 
-  it('should set filterCollapsed to true in response to the INITIAL_EXPAND action when no state has been set for this filter', () => {
+  it('should set filterCollapsed to false in response to the INITIALIZE action with isOpenByDefault to true when no state has been set for this filter', () => {
     const state = {};
     state[filterName2] = { filterCollapsed: true, page: 1 };
-    const action = new SearchFilterInitialExpandAction(filterName1);
+    const filterConfig = {isOpenByDefault: true, name: filterName1} as any;
+    const action = new SearchFilterInitializeAction(filterConfig);
     const newState = filterReducer(state, action);
     expect(newState[filterName1].filterCollapsed).toEqual(false);
   });
 
-  it('should not change the state in response to the INITIAL_COLLAPSE action when the state has already been set for this filter', () => {
+  it('should not change the state in response to  the INITIALIZE action with isOpenByDefault to false when the state has already been set for this filter', () => {
     const state = {};
     state[filterName1] = { filterCollapsed: false, page: 1 };
-    const action = new SearchFilterInitialCollapseAction(filterName1);
+    const filterConfig = { isOpenByDefault: true, name: filterName1 } as any;
+    const action = new SearchFilterInitializeAction(filterConfig);
     const newState = filterReducer(state, action);
     expect(newState).toEqual(state);
   });
 
-  it('should not change the state in response to the INITIAL_EXPAND action when the state has already been set for this filter', () => {
+  it('should not change the state in response to  the INITIALIZE action with isOpenByDefault to true when the state has already been set for this filter', () => {
     const state = {};
     state[filterName1] = { filterCollapsed: true, page: 1 };
-    const action = new SearchFilterInitialExpandAction(filterName1);
+    const filterConfig = { isOpenByDefault: false, name: filterName1 } as any;
+    const action = new SearchFilterInitializeAction(filterConfig);
     const newState = filterReducer(state, action);
     expect(newState).toEqual(state);
   });
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.service.spec.ts b/src/app/+search-page/search-filters/search-filter/search-filter.service.spec.ts
index 306f8cdb96..19239d899c 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.service.spec.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.service.spec.ts
@@ -71,7 +71,6 @@ describe('SearchFilterService', () => {
     });
   });
 
-
   describe('when the collapse method is triggered', () => {
     beforeEach(() => {
       service.collapse(mockFilterConfig.name);
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.service.ts b/src/app/+search-page/search-filters/search-filter/search-filter.service.ts
index 5ce1e8e647..bed4b1777f 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.service.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.service.ts
@@ -1,6 +1,6 @@
 import { combineLatest as observableCombineLatest, Observable } from 'rxjs';
 import { Injectable, InjectionToken } from '@angular/core';
-import { distinctUntilChanged, map, tap } from 'rxjs/operators';
+import { distinctUntilChanged, map } from 'rxjs/operators';
 import { SearchFiltersState, SearchFilterState } from './search-filter.reducer';
 import { createSelector, MemoizedSelector, select, Store } from '@ngrx/store';
 import {
@@ -16,9 +16,8 @@ import { hasValue, isNotEmpty, } from '../../../shared/empty.util';
 import { SearchFilterConfig } from '../../search-service/search-filter-config.model';
 import { RouteService } from '../../../shared/services/route.service';
 import { Params } from '@angular/router';
-import { tag } from 'rxjs-spy/operators';
-import { create, detect } from "rxjs-spy";
-const spy = create();
+import { SearchOptions } from '../../search-options.model';
+// const spy = create();
 const filterStateSelector = (state: SearchFiltersState) => state.searchFilter;
 
 export const FILTER_CONFIG: InjectionToken<SearchFilterConfig> = new InjectionToken<SearchFilterConfig>('filterConfig');
@@ -59,17 +58,10 @@ export class SearchFilterService {
    * @returns {Observable<string[]>} Emits the active filters for the given filter configuration
    */
   getSelectedValuesForFilter(filterConfig: SearchFilterConfig): Observable<string[]> {
-    const values$ = this.routeService.getQueryParameterValues(filterConfig.paramName).pipe(
-      tag("parameter")
-    );
+    const values$ = this.routeService.getQueryParameterValues(filterConfig.paramName);
     const prefixValues$ = this.routeService.getQueryParamsWithPrefix(filterConfig.paramName + '.').pipe(
       map((params: Params) => [].concat(...Object.values(params))),
-      tag("prefix-tag")
-
-
     );
-    spy.log();
-    detect('prefix-tag');
 
     return observableCombineLatest(values$, prefixValues$).pipe(
       map(([values, prefixValues]) => {
diff --git a/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
index 3acc868a17..b6ae0ada63 100644
--- a/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
@@ -1,15 +1,9 @@
 <div>
     <div class="filters py-2">
-        <a *ngFor="let value of (selectedValues | async)" class="d-flex flex-row"
-           [routerLink]="[getSearchLink()]"
-           [queryParams]="getRemoveParams(value) | async" queryParamsHandling="merge">
-            <input type="checkbox" [checked]="true" class="my-1 align-self-stretch"/>
-            <span class="filter-value pl-1">{{value}}</span>
-        </a>
+        <ds-search-facet-selected-option *ngFor="let value of (selectedValues$ | async)" [selectedValue]="value" [filterConfig]="filterConfig" [selectedValues$]="selectedValues$"></ds-search-facet-selected-option>
         <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
           <div [@facetLoad]="animationState">
-            <ds-search-facet-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value">
-            </ds-search-facet-option>
+            <ds-search-facet-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value" [selectedValues$]="selectedValues$"></ds-search-facet-option>
           </div>
         </ng-container>
         <div class="clearfix toggle-more-filters">
diff --git a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
index a30233ece3..9d35cc518a 100644
--- a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
@@ -24,9 +24,7 @@
         </ng-container>
       <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
         <div [@facetLoad]="animationState">
-          <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
-
-            </ng-container>
+          <ds-search-facet-range-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value"></ds-search-facet-range-option>
           </div>
         </ng-container>
     </div>
diff --git a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.spec.ts b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.spec.ts
index 6f3450e18e..930ea8c9fb 100644
--- a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.spec.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.spec.ts
@@ -106,16 +106,6 @@ describe('SearchRangeFilterComponent', () => {
     fixture.detectChanges();
   });
 
-  describe('when the getChangeParams method is called wih a value', () => {
-    it('should return the selectedValue list with the new parameter value', () => {
-      const result$ = comp.getChangeParams(value3);
-      result$.subscribe((result) => {
-        expect(result[mockFilterConfig.paramName + minSuffix]).toEqual(['1990']);
-        expect(result[mockFilterConfig.paramName + maxSuffix]).toEqual(['1992']);
-      });
-    });
-  });
-
   describe('when the onSubmit method is called with data', () => {
     const searchUrl = '/search/path';
     // const data = { [mockFilterConfig.paramName + minSuffix]: '1900', [mockFilterConfig.paramName + maxSuffix]: '1950' };
diff --git a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
index 2b6797f5a1..0bc30676c1 100644
--- a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
@@ -95,8 +95,6 @@ export class SearchRangeFilterComponent extends SearchFacetFilterComponent imple
     ).subscribe((minmax) => this.range = minmax);
   }
 
-
-
   /**
    * Submits new custom range values to the range filter from the widget
    */
diff --git a/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
index 45034507a2..25ff8e46d3 100644
--- a/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
@@ -1,19 +1,9 @@
 <div>
     <div class="filters py-2">
-        <a *ngFor="let value of (selectedValues | async)" class="d-flex flex-row"
-           [routerLink]="[getSearchLink()]"
-           [queryParams]="getRemoveParams(value) | async" queryParamsHandling="merge">
-            <input type="checkbox" [checked]="true" class="my-1 align-self-stretch"/>
-            <span class="filter-value pl-1">{{value}}</span>
-        </a>
-        <ng-container *ngVar="(filterValues$ | async) as filterValuesRD">
+        <ds-search-facet-selected-option *ngFor="let value of (selectedValues$ | async)" [selectedValue]="value" [filterConfig]="filterConfig" [selectedValues$]="selectedValues$"></ds-search-facet-selected-option>
+        <ng-container *ngFor="let page of (filterValues$ | async)?.payload">
           <div [@facetLoad]="animationState">
-            <ng-container *ngFor="let page of filterValuesRD?.payload">
-              <ng-container *ngFor="let value of page.page; trackBy: trackUpdate">
-                  <ds-search-facet-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value">
-                  </ds-search-facet-option>
-              </ng-container>
-            </ng-container>
+                  <ds-search-facet-option *ngFor="let value of page.page; trackBy: trackUpdate" [filterConfig]="filterConfig" [filterValue]="value" [selectedValues$]="selectedValues$"></ds-search-facet-option>
           </div>
         </ng-container>
         <div class="clearfix toggle-more-filters">
diff --git a/src/app/+search-page/search-service/search-configuration.service.spec.ts b/src/app/+search-page/search-service/search-configuration.service.spec.ts
index af8897c93b..f1f4ef8bdc 100644
--- a/src/app/+search-page/search-service/search-configuration.service.spec.ts
+++ b/src/app/+search-page/search-service/search-configuration.service.spec.ts
@@ -117,7 +117,7 @@ describe('SearchConfigurationService', () => {
 
     describe('when subscribeToSearchOptions is called', () => {
       beforeEach(() => {
-        service.subscribeToSearchOptions(defaults)
+        (service as any).subscribeToSearchOptions(defaults)
       });
       it('should call all getters it needs, but not call any others', () => {
         expect(service.getCurrentPagination).not.toHaveBeenCalled();
@@ -131,7 +131,7 @@ describe('SearchConfigurationService', () => {
 
     describe('when subscribeToPaginatedSearchOptions is called', () => {
       beforeEach(() => {
-        service.subscribeToPaginatedSearchOptions(defaults);
+        (service as any).subscribeToPaginatedSearchOptions(defaults);
       });
       it('should call all getters it needs', () => {
         expect(service.getCurrentPagination).toHaveBeenCalled();
diff --git a/src/app/+search-page/search-service/search-configuration.service.ts b/src/app/+search-page/search-service/search-configuration.service.ts
index 292f26724d..7ba1ebd75f 100644
--- a/src/app/+search-page/search-service/search-configuration.service.ts
+++ b/src/app/+search-page/search-service/search-configuration.service.ts
@@ -186,7 +186,7 @@ export class SearchConfigurationService implements OnDestroy {
    * @param {SearchOptions} defaults Default values for when no parameters are available
    * @returns {Subscription} The subscription to unsubscribe from
    */
-  subscribeToSearchOptions(defaults: SearchOptions): Subscription {
+  private subscribeToSearchOptions(defaults: SearchOptions): Subscription {
     return observableMerge(
       this.getScopePart(defaults.scope),
       this.getQueryPart(defaults.query),
@@ -204,7 +204,7 @@ export class SearchConfigurationService implements OnDestroy {
    * @param {PaginatedSearchOptions} defaults Default values for when no parameters are available
    * @returns {Subscription} The subscription to unsubscribe from
    */
-  subscribeToPaginatedSearchOptions(defaults: PaginatedSearchOptions): Subscription {
+  private subscribeToPaginatedSearchOptions(defaults: PaginatedSearchOptions): Subscription {
     return observableMerge(
       this.getPaginationPart(defaults.pagination),
       this.getSortPart(defaults.sort),
diff --git a/src/app/core/cache/object-cache.service.ts b/src/app/core/cache/object-cache.service.ts
index 9be895c41a..ec91d0f37e 100644
--- a/src/app/core/cache/object-cache.service.ts
+++ b/src/app/core/cache/object-cache.service.ts
@@ -33,7 +33,7 @@ const entryFromSelfLinkSelector =
     (state: ObjectCacheState) => state[selfLink],
   );
 
-  /**
+/**
  * A service to interact with the object cache
  */
 @Injectable()
diff --git a/src/app/shared/services/route.service.ts b/src/app/shared/services/route.service.ts
index b6c7747cfb..6350605bce 100644
--- a/src/app/shared/services/route.service.ts
+++ b/src/app/shared/services/route.service.ts
@@ -15,7 +15,6 @@ export class RouteService {
   }
 
   getQueryParameterValues(paramName: string): Observable<string[]> {
-    console.log('called');
     return this.route.queryParamMap.pipe(
       map((params) => [...params.getAll(paramName)]),
       distinctUntilChanged((a, b) => JSON.stringify(a) === JSON.stringify(b))
@@ -46,7 +45,6 @@ export class RouteService {
   getQueryParamsWithPrefix(prefix: string): Observable<Params> {
     return this.route.queryParamMap.pipe(
       map((qparams) => {
-        console.log('map');
         const params = {};
         qparams.keys
           .filter((key) => key.startsWith(prefix))
@@ -55,8 +53,7 @@ export class RouteService {
           });
         return params;
       }),
-      distinctUntilChanged((a, b) => { console.log('changed?', a, b, JSON.stringify(a) === JSON.stringify(b)); return JSON.stringify(a) === JSON.stringify(b)}),
-      tap((t) => console.log('changed'))
+      distinctUntilChanged((a, b) => JSON.stringify(a) === JSON.stringify(b)),
     );
   }
 }
diff --git a/src/main.browser.ts b/src/main.browser.ts
index 7b0fbf9d65..8409a96485 100644
--- a/src/main.browser.ts
+++ b/src/main.browser.ts
@@ -12,7 +12,6 @@ import { BrowserAppModule } from './modules/app/browser-app.module';
 
 import { ENV_CONFIG } from './config';
 
-
 if (ENV_CONFIG.production) {
   enableProdMode();
 }

From d820991bebe041cc81516b16f16960ed207be3a5 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Thu, 21 Mar 2019 16:16:24 +0100
Subject: [PATCH 20/24] solved conflicts with master

---
 src/app/core/data/request.service.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/core/data/request.service.ts b/src/app/core/data/request.service.ts
index 46ef4daad3..c85a0ff423 100644
--- a/src/app/core/data/request.service.ts
+++ b/src/app/core/data/request.service.ts
@@ -7,9 +7,8 @@ import { AppState } from '../../app.reducer';
 import { hasValue, isNotEmpty } from '../../shared/empty.util';
 import { CacheableObject } from '../cache/object-cache.reducer';
 import { ObjectCacheService } from '../cache/object-cache.service';
-import { coreSelector, CoreState } from '../core.reducers';
+import { CoreState } from '../core.reducers';
 import { IndexName, IndexState, MetaIndexState } from '../index/index.reducer';
-import { pathSelector } from '../shared/selectors';
 import {
   originalRequestUUIDFromRequestUUIDSelector,
   requestIndexSelector,
@@ -27,6 +26,7 @@ import { RequestEntry, RequestState } from './request.reducer';
 import { CommitSSBAction } from '../cache/server-sync-buffer.actions';
 import { RestRequestMethod } from './rest-request-method';
 import { AddToIndexAction, RemoveFromIndexBySubstringAction } from '../index/index.actions';
+import { coreSelector } from '../core.selectors';
 
 const requestCacheSelector = createSelector(
   coreSelector,

From b62e5786ab7f9bc7b1936e8e90ad4c6f9f5078c3 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Thu, 21 Mar 2019 17:20:33 +0100
Subject: [PATCH 21/24] added typedoc

---
 .../search-facet-option.component.ts          | 23 +++++++++++++-
 .../search-facet-range-option.component.ts    | 20 +++++++++++--
 .../search-facet-selected-option.component.ts | 21 ++++++++++---
 .../search-facet-filter-wrapper.component.ts  |  3 ++
 .../search-facet-filter.component.ts          |  8 +++++
 .../search-filter/search-filter.actions.ts    |  2 +-
 .../search-filter/search-filter.component.ts  | 11 +++++++
 .../search-range-filter.component.ts          | 30 ++++++++++---------
 src/app/core/cache/object-cache.service.ts    |  7 +++++
 src/app/core/core.selectors.ts                |  3 ++
 src/app/core/data/request.service.ts          | 10 +++++++
 src/app/shared/services/route.service.ts      | 24 +++++++++++++++
 12 files changed, 140 insertions(+), 22 deletions(-)

diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
index 9fa59a0c1e..7a6a51e99d 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.ts
@@ -22,12 +22,30 @@ export class SearchFacetOptionComponent implements OnInit, OnDestroy {
    * A single value for this component
    */
   @Input() filterValue: FacetValue;
+
+  /**
+   * The filter configuration for this facet option
+   */
   @Input() filterConfig: SearchFilterConfig;
+
+  /**
+   * Emits the active values for this filter
+   */
   @Input() selectedValues$: Observable<string[]>;
 
+  /**
+   * Emits true when this option should be visible and false when it should be invisible
+   */
   isVisible: Observable<boolean>;
 
+  /**
+   * UI parameters when this filter is added
+   */
   addQueryParams;
+
+  /**
+   * Subscription to unsubscribe from on destroy
+   */
   sub: Subscription;
 
   constructor(protected searchService: SearchService,
@@ -64,7 +82,7 @@ export class SearchFacetOptionComponent implements OnInit, OnDestroy {
 
   /**
    * Calculates the parameters that should change if a given value for this filter would be added to the active filters
-   * @param {string} value The value that is added for this filter
+   * @param {string[]} selectedValues The values that are currently selected for this filter
    */
   private updateAddParams(selectedValues: string[]): void {
     this.addQueryParams = {
@@ -73,6 +91,9 @@ export class SearchFacetOptionComponent implements OnInit, OnDestroy {
     };
   }
 
+  /**
+   * Make sure the subscription is unsubscribed from when this component is destroyed
+   */
   ngOnDestroy(): void {
     if (hasValue(this.sub)) {
       this.sub.unsubscribe();
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
index 2f6a49f8b9..22e6f04d9a 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
@@ -21,18 +21,32 @@ const rangeDelimiter = '-';
 })
 
 /**
- * Represents a single option in a filter facet
+ * Represents a single option in a range filter facet
  */
 export class SearchFacetRangeOptionComponent implements OnInit, OnDestroy {
   /**
    * A single value for this component
    */
   @Input() filterValue: FacetValue;
+
+  /**
+   * The filter configuration for this facet option
+   */
   @Input() filterConfig: SearchFilterConfig;
 
+  /**
+   * Emits true when this option should be visible and false when it should be invisible
+   */
   isVisible: Observable<boolean>;
 
+  /**
+   * UI parameters when this filter is changed
+   */
   changeQueryParams;
+
+  /**
+   * Subscription to unsubscribe from on destroy
+   */
   sub: Subscription;
 
   constructor(protected searchService: SearchService,
@@ -68,7 +82,6 @@ export class SearchFacetRangeOptionComponent implements OnInit, OnDestroy {
 
   /**
    * Calculates the parameters that should change if a given values for this range filter would be changed
-   * @param {string} value The values that are changed for this filter
    */
   updateChangeParams(): void {
     const parts = this.filterValue.value.split(rangeDelimiter);
@@ -81,6 +94,9 @@ export class SearchFacetRangeOptionComponent implements OnInit, OnDestroy {
     };
   }
 
+  /**
+   * Make sure the subscription is unsubscribed from when this component is destroyed
+   */
   ngOnDestroy(): void {
     if (hasValue(this.sub)) {
       this.sub.unsubscribe();
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
index 55030a4a84..2eb17681df 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
@@ -21,13 +21,17 @@ import { SearchConfigurationService } from '../../../../search-service/search-co
 })
 
 /**
- * Represents a single option in a filter facet
+ * Represents a single selected option in a filter facet
  */
 export class SearchFacetSelectedOptionComponent implements OnInit, OnDestroy {
   /**
-   * A single value for this component
+   * The value for this component
    */
   @Input() selectedValue: string;
+
+  /**
+   * The filter configuration for this facet option
+   */
   @Input() filterConfig: SearchFilterConfig;
 
   /**
@@ -35,7 +39,14 @@ export class SearchFacetSelectedOptionComponent implements OnInit, OnDestroy {
    */
   @Input() selectedValues$: Observable<string[]>;
 
+  /**
+   * UI parameters when this filter is removed
+   */
   removeQueryParams;
+
+  /**
+   * Subscription to unsubscribe from on destroy
+   */
   sub: Subscription;
 
   constructor(protected searchService: SearchService,
@@ -64,8 +75,7 @@ export class SearchFacetSelectedOptionComponent implements OnInit, OnDestroy {
 
   /**
    * Calculates the parameters that should change if a given value for this filter would be removed from the active filters
-   * @param {string} value The value that is removed for this filter
-   * @returns {Observable<any>} The changed filter parameters
+   * @param {string[]} selectedValues The values that are currently selected for this filter
    */
   private updateRemoveParams(selectedValues: string[]): void {
     this.removeQueryParams = {
@@ -74,6 +84,9 @@ export class SearchFacetSelectedOptionComponent implements OnInit, OnDestroy {
     };
   }
 
+  /**
+   * Make sure the subscription is unsubscribed from when this component is destroyed
+   */
   ngOnDestroy(): void {
     if (hasValue(this.sub)) {
       this.sub.unsubscribe();
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
index 5b733b52cb..6369a7691e 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
@@ -20,6 +20,9 @@ export class SearchFacetFilterWrapperComponent implements OnInit {
    */
   @Input() filterConfig: SearchFilterConfig;
 
+  /**
+   * The constructor of the search facet filter that should be rendered, based on the filter config's type
+   */
   searchFilter: GenericConstructor<SearchFacetFilterComponent>;
   /**
    * Injector to inject a child component with the @Input parameters
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
index 62275ee3c4..367947a377 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.ts
@@ -73,6 +73,10 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
    * State of the requested facets used to time the animation
    */
   animationState = 'loading';
+
+  /**
+   * Emits all current search options available in the search URL
+   */
   searchOptions$: Observable<SearchOptions>;
 
   constructor(protected searchService: SearchService,
@@ -207,6 +211,10 @@ export class SearchFacetFilterComponent implements OnInit, OnDestroy {
     )
   }
 
+  /**
+   * On click, set the input's value to the clicked data
+   * @param data The value of the option that was clicked
+   */
   onClick(data: any) {
     this.filter = data;
   }
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.actions.ts b/src/app/+search-page/search-filters/search-filter/search-filter.actions.ts
index 838597e03d..f7f80eefff 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.actions.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.actions.ts
@@ -64,7 +64,7 @@ export class SearchFilterToggleAction extends SearchFilterAction {
 }
 
 /**
- * Used to set the initial state of a filter to collapsed
+ * Used to set the initial state of a filter
  */
 export class SearchFilterInitializeAction extends SearchFilterAction {
   type = SearchFilterActionTypes.INITIALIZE;
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-filter.component.ts
index eaf318655f..3a5e4bfc55 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.component.ts
@@ -28,9 +28,20 @@ export class SearchFilterComponent implements OnInit {
    * True when the filter is 100% collapsed in the UI
    */
   closed = true;
+
+  /**
+   * Emits true when the filter is currently collapsed in the store
+   */
   collapsed$: Observable<boolean>;
 
+  /**
+   * Emits all currently selected values for this filter
+   */
   selectedValues$: Observable<string[]>;
+
+  /**
+   * Emits true when the current filter is supposed to be shown
+   */
   active$: Observable<boolean>;
 
   constructor(private filterService: SearchFilterService, private searchService: SearchService, private searchConfigService: SearchConfigurationService) {
diff --git a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
index 0bc30676c1..ebdb797500 100644
--- a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
@@ -1,9 +1,4 @@
-import {
-  of as observableOf,
-  combineLatest as observableCombineLatest,
-  Observable,
-  Subscription
-} from 'rxjs';
+import { combineLatest as observableCombineLatest, Subscription } from 'rxjs';
 import { map, startWith } from 'rxjs/operators';
 import { isPlatformBrowser } from '@angular/common';
 import { Component, Inject, OnDestroy, OnInit, PLATFORM_ID } from '@angular/core';
@@ -23,15 +18,26 @@ import { RouteService } from '../../../../shared/services/route.service';
 import { hasValue } from '../../../../shared/empty.util';
 import { SearchConfigurationService } from '../../../search-service/search-configuration.service';
 
+/**
+ * The suffix for a range filters' minimum in the frontend URL
+ */
+export const RANGE_FILTER_MIN_SUFFIX = '.min';
+
+/**
+ * The suffix for a range filters' maximum in the frontend URL
+ */
+export const RANGE_FILTER_MAX_SUFFIX = '.max';
+
+/**
+ * The date formats that are possible to appear in a date filter
+ */
+const dateFormats = ['YYYY', 'YYYY-MM', 'YYYY-MM-DD'];
+
 /**
  * This component renders a simple item page.
  * The route parameter 'id' is used to request the item it represents.
  * All fields of the item that should be displayed, are defined in its template.
  */
-export const RANGE_FILTER_MIN_SUFFIX = '.min';
-export const RANGE_FILTER_MAX_SUFFIX = '.max';
-const dateFormats = ['YYYY', 'YYYY-MM', 'YYYY-MM-DD'];
-
 @Component({
   selector: 'ds-search-range-filter',
   styleUrls: ['./search-range-filter.component.scss'],
@@ -130,8 +136,4 @@ export class SearchRangeFilterComponent extends SearchFacetFilterComponent imple
       this.sub.unsubscribe();
     }
   }
-
-  out(call) {
-    console.log(call);
-  }
 }
diff --git a/src/app/core/cache/object-cache.service.ts b/src/app/core/cache/object-cache.service.ts
index 1fdc2eaaf8..483de65b98 100644
--- a/src/app/core/cache/object-cache.service.ts
+++ b/src/app/core/cache/object-cache.service.ts
@@ -22,11 +22,18 @@ import {
 import { CacheableObject, ObjectCacheEntry, ObjectCacheState } from './object-cache.reducer';
 import { AddToSSBAction } from './server-sync-buffer.actions';
 
+/**
+ * The base selector function to select the object cache in the store
+ */
 const objectCacheSelector = createSelector(
   coreSelector,
   (state: CoreState) => state['cache/object']
 );
 
+/**
+ * Selector function to select an object entry by self link from the cache
+ * @param selfLink The self link of the object
+ */
 const entryFromSelfLinkSelector =
   (selfLink: string): MemoizedSelector<CoreState, ObjectCacheEntry> => createSelector(
     objectCacheSelector,
diff --git a/src/app/core/core.selectors.ts b/src/app/core/core.selectors.ts
index 2ad701eba1..60365be7c2 100644
--- a/src/app/core/core.selectors.ts
+++ b/src/app/core/core.selectors.ts
@@ -1,4 +1,7 @@
 import { createFeatureSelector } from '@ngrx/store';
 import { CoreState } from './core.reducers';
 
+/**
+ * Base selector to select the core state from the store
+ */
 export const coreSelector = createFeatureSelector<CoreState>('core');
diff --git a/src/app/core/data/request.service.ts b/src/app/core/data/request.service.ts
index c85a0ff423..97bc4ea1a2 100644
--- a/src/app/core/data/request.service.ts
+++ b/src/app/core/data/request.service.ts
@@ -28,11 +28,18 @@ import { RestRequestMethod } from './rest-request-method';
 import { AddToIndexAction, RemoveFromIndexBySubstringAction } from '../index/index.actions';
 import { coreSelector } from '../core.selectors';
 
+/**
+ * The base selector function to select the request state in the store
+ */
 const requestCacheSelector = createSelector(
   coreSelector,
   (state: CoreState) => state['data/request']
 );
 
+/**
+ * Selector function to select a request entry by uuid from the cache
+ * @param uuid The uuid of the request
+ */
 const entryFromUUIDSelector = (uuid: string): MemoizedSelector<CoreState, RequestEntry> => createSelector(
   requestCacheSelector,
   (state: RequestState) => {
@@ -67,6 +74,9 @@ const getUuidsFromHrefSubstring = (state: IndexState, href: string): string[] =>
   return result;
 };
 
+/**
+ * A service to interact with the request state in the store
+ */
 @Injectable()
 export class RequestService {
   private requestsOnTheirWayToTheStore: string[] = [];
diff --git a/src/app/shared/services/route.service.ts b/src/app/shared/services/route.service.ts
index 6350605bce..3e62064d91 100644
--- a/src/app/shared/services/route.service.ts
+++ b/src/app/shared/services/route.service.ts
@@ -8,12 +8,19 @@ import {
 import { isNotEmpty } from '../empty.util';
 import { detect } from 'rxjs-spy';
 
+/**
+ * Service to keep track of the current query parameters
+ */
 @Injectable()
 export class RouteService {
 
   constructor(private route: ActivatedRoute) {
   }
 
+  /**
+   * Retrieves all query parameter values based on a parameter name
+   * @param paramName The name of the parameter to look for
+   */
   getQueryParameterValues(paramName: string): Observable<string[]> {
     return this.route.queryParamMap.pipe(
       map((params) => [...params.getAll(paramName)]),
@@ -21,6 +28,10 @@ export class RouteService {
     );
   }
 
+  /**
+   * Retrieves a single query parameter values based on a parameter name
+   * @param paramName The name of the parameter to look for
+   */
   getQueryParameterValue(paramName: string): Observable<string> {
     return this.route.queryParamMap.pipe(
       map((params) => params.get(paramName)),
@@ -28,6 +39,10 @@ export class RouteService {
     );
   }
 
+  /**
+   * Checks if the query parameter currently exists in the route
+   * @param paramName The name of the parameter to look for
+   */
   hasQueryParam(paramName: string): Observable<boolean> {
     return this.route.queryParamMap.pipe(
       map((params) => params.has(paramName)),
@@ -35,6 +50,11 @@ export class RouteService {
     );
   }
 
+  /**
+   * Checks if the query parameter with a specific value currently exists in the route
+   * @param paramName The name of the parameter to look for
+   * @param paramValue The value of the parameter to look for
+   */
   hasQueryParamWithValue(paramName: string, paramValue: string): Observable<boolean> {
     return this.route.queryParamMap.pipe(
       map((params) => params.getAll(paramName).indexOf(paramValue) > -1),
@@ -42,6 +62,10 @@ export class RouteService {
     );
   }
 
+  /**
+   * Retrieves all query parameters of which the parameter name starts with the given prefix
+   * @param prefix The prefix of the parameter name to look for
+   */
   getQueryParamsWithPrefix(prefix: string): Observable<Params> {
     return this.route.queryParamMap.pipe(
       map((qparams) => {

From bbf181e522466b744fd1b2369e711e13ace9bb46 Mon Sep 17 00:00:00 2001
From: Art Lowel <art.lowel@atmire.com>
Date: Thu, 21 Mar 2019 18:49:58 +0100
Subject: [PATCH 22/24] add TypeDocs about the IndexReducer and its selectors

---
 src/app/core/index/index.reducer.ts   | 59 +++++++++++++++++++++++++--
 src/app/core/index/index.selectors.ts | 57 ++++++++++++++++++++++++--
 2 files changed, 109 insertions(+), 7 deletions(-)

diff --git a/src/app/core/index/index.reducer.ts b/src/app/core/index/index.reducer.ts
index d95748ef8a..b4cd8aa84b 100644
--- a/src/app/core/index/index.reducer.ts
+++ b/src/app/core/index/index.reducer.ts
@@ -6,16 +6,34 @@ import {
   RemoveFromIndexByValueAction
 } from './index.actions';
 
+/**
+ * An enum containing all index names
+ */
 export enum IndexName {
+  // Contains all objects in the object cache indexed by UUID
   OBJECT = 'object/uuid-to-self-link',
+
+  // contains all requests in the request cache indexed by UUID
   REQUEST = 'get-request/href-to-uuid',
+
+  /**
+   * Contains the UUIDs of requests that were sent to the server and
+   * have their responses cached, indexed by the UUIDs of requests that
+   * weren't sent because the response they requested was already cached
+   */
   UUID_MAPPING = 'get-request/configured-to-cache-uuid'
 }
 
+/**
+ * The state of a single index
+ */
 export interface IndexState {
   [key: string]: string
 }
 
+/**
+ * The state that contains all indices
+ */
 export type MetaIndexState = {
   [name in IndexName]: IndexState
 }
@@ -23,6 +41,16 @@ export type MetaIndexState = {
 // Object.create(null) ensures the object has no default js properties (e.g. `__proto__`)
 const initialState: MetaIndexState = Object.create(null);
 
+/**
+ * The Index Reducer
+ *
+ * @param state
+ *    the current state
+ * @param action
+ *    the action to perform on the state
+ * @return MetaIndexState
+ *    the new state
+ */
 export function indexReducer(state = initialState, action: IndexAction): MetaIndexState {
   switch (action.type) {
 
@@ -44,6 +72,16 @@ export function indexReducer(state = initialState, action: IndexAction): MetaInd
   }
 }
 
+/**
+ * Add an entry to a given index
+ *
+ * @param state
+ *    The MetaIndexState that contains all indices
+ * @param action
+ *    The AddToIndexAction containing the value to add, and the index to add it to
+ * @return MetaIndexState
+ *    the new state
+ */
 function addToIndex(state: MetaIndexState, action: AddToIndexAction): MetaIndexState {
   const subState = state[action.payload.name];
   const newSubState = Object.assign({}, subState, {
@@ -55,6 +93,16 @@ function addToIndex(state: MetaIndexState, action: AddToIndexAction): MetaIndexS
   return obs;
 }
 
+/**
+ * Remove a entries that contain a given value from a given index
+ *
+ * @param state
+ *    The MetaIndexState that contains all indices
+ * @param action
+ *    The RemoveFromIndexByValueAction containing the value to remove, and the index to remove it from
+ * @return MetaIndexState
+ *    the new state
+ */
 function removeFromIndexByValue(state: MetaIndexState, action: RemoveFromIndexByValueAction): MetaIndexState {
   const subState = state[action.payload.name];
   const newSubState = Object.create(null);
@@ -69,9 +117,14 @@ function removeFromIndexByValue(state: MetaIndexState, action: RemoveFromIndexBy
 }
 
 /**
- * Remove values from the IndexState's substate that contain a given substring
- * @param state     The IndexState to remove values from
- * @param action    The RemoveFromIndexByValueAction containing the necessary information to remove the values
+ * Remove entries that contain a given substring from a given index
+ *
+ * @param state
+ *    The MetaIndexState that contains all indices
+ * @param action
+ *    The RemoveFromIndexByValueAction the substring to remove, and the index to remove it from
+ * @return MetaIndexState
+ *    the new state
  */
 function removeFromIndexBySubstring(state: MetaIndexState, action: RemoveFromIndexByValueAction): MetaIndexState {
   const subState = state[action.payload.name];
diff --git a/src/app/core/index/index.selectors.ts b/src/app/core/index/index.selectors.ts
index 51821120ca..3c7b331a92 100644
--- a/src/app/core/index/index.selectors.ts
+++ b/src/app/core/index/index.selectors.ts
@@ -5,38 +5,87 @@ import { CoreState } from '../core.reducers';
 import { coreSelector } from '../core.selectors';
 import { IndexName, IndexState, MetaIndexState } from './index.reducer';
 
+/**
+ * Return the MetaIndexState based on the CoreSate
+ *
+ * @returns
+ *    a MemoizedSelector to select the MetaIndexState
+ */
 export const metaIndexSelector: MemoizedSelector<AppState, MetaIndexState> = createSelector(
   coreSelector,
   (state: CoreState) => state.index
 );
+
+/**
+ * Return the object index based on the MetaIndexState
+ * It contains all objects in the object cache indexed by UUID
+ *
+ * @returns
+ *    a MemoizedSelector to select the object index
+ */
 export const objectIndexSelector: MemoizedSelector<AppState, IndexState> = createSelector(
   metaIndexSelector,
   (state: MetaIndexState) => state[IndexName.OBJECT]
 );
+
+/**
+ * Return the request index based on the MetaIndexState
+ *
+ * @returns
+ *    a MemoizedSelector to select the request index
+ */
 export const requestIndexSelector: MemoizedSelector<AppState, IndexState> = createSelector(
   metaIndexSelector,
   (state: MetaIndexState) => state[IndexName.REQUEST]
 );
+
+/**
+ * Return the request UUID mapping index based on the MetaIndexState
+ *
+ * @returns
+ *    a MemoizedSelector to select the request UUID mapping
+ */
 export const requestUUIDIndexSelector: MemoizedSelector<AppState, IndexState> = createSelector(
   metaIndexSelector,
   (state: MetaIndexState) => state[IndexName.UUID_MAPPING]
 );
+
+/**
+ * Return the self link of an object in the object-cache based on its UUID
+ *
+ * @param uuid
+ *    the UUID for which you want to find the matching self link
+ * @returns
+ *    a MemoizedSelector to select the self link
+ */
 export const selfLinkFromUuidSelector =
   (uuid: string): MemoizedSelector<AppState, string> => createSelector(
     objectIndexSelector,
     (state: IndexState) => hasValue(state) ? state[uuid] : undefined
   );
+
+/**
+ * Return the UUID of a GET request based on its href
+ *
+ * @param href
+ *    the href of the GET request
+ * @returns
+ *    a MemoizedSelector to select the UUID
+ */
 export const uuidFromHrefSelector =
   (href: string): MemoizedSelector<AppState, string> => createSelector(
     requestIndexSelector,
     (state: IndexState) => hasValue(state) ? state[href] : undefined
   );
+
 /**
- * If a request wasn't sent to the server because the result was already cached,
- * this selector allows you to find the UUID of the cached request based on the
- * UUID of the new request
+ * Return the UUID of a cached request based on the UUID of a request
+ * that wasn't sent because the response was already cached
  *
- * @param uuid    The uuid of the new request
+ * @param uuid
+ *    The UUID of the new request
+ * @returns
+ *    a MemoizedSelector to select the UUID of the cached request
  */
 export const originalRequestUUIDFromRequestUUIDSelector =
   (uuid: string): MemoizedSelector<AppState, string> => createSelector(

From a788999c75981e9cf974d965e8adf422ccf37e5f Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Fri, 22 Mar 2019 11:40:07 +0100
Subject: [PATCH 23/24] Added tests for new components

---
 .../search-facet-option.component.html               |  2 +-
 .../search-facet-range-option.component.ts           |  2 +-
 .../search-facet-selected-option.component.ts        | 12 ++----------
 3 files changed, 4 insertions(+), 12 deletions(-)

diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
index 9f5a88b71b..7ab7ffd0ca 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.html
@@ -1,4 +1,4 @@
-<script src="search-facet-option.component.ts"></script><a *ngIf="isVisible | async" class="d-flex flex-row"
+<a *ngIf="isVisible | async" class="d-flex flex-row"
                                                            [routerLink]="[getSearchLink()]"
                                                            [queryParams]="addQueryParams" queryParamsHandling="merge">
     <input type="checkbox" [checked]="false" class="my-1 align-self-stretch"/>
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
index 22e6f04d9a..b7f02ad18b 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.ts
@@ -83,7 +83,7 @@ export class SearchFacetRangeOptionComponent implements OnInit, OnDestroy {
   /**
    * Calculates the parameters that should change if a given values for this range filter would be changed
    */
-  updateChangeParams(): void {
+  private updateChangeParams(): void {
     const parts = this.filterValue.value.split(rangeDelimiter);
     const min = parts.length > 1 ? parts[0].trim() : this.filterValue.value;
     const max = parts.length > 1 ? parts[1].trim() : this.filterValue.value;
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
index 2eb17681df..5137bf8ffc 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.ts
@@ -1,18 +1,10 @@
-import {
-  combineLatest as observableCombineLatest,
-  Observable,
-  of as observableOf,
-  Subscription
-} from 'rxjs';
-import { delay, map } from 'rxjs/operators';
-import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
+import { combineLatest as observableCombineLatest, Observable, Subscription } from 'rxjs';
+import { Component, Input, OnDestroy, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
-import { FacetValue } from '../../../../search-service/facet-value.model';
 import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
 import { SearchService } from '../../../../search-service/search.service';
 import { SearchFilterService } from '../../search-filter.service';
 import { hasValue } from '../../../../../shared/empty.util';
-import { SearchOptions } from '../../../../search-options.model';
 import { SearchConfigurationService } from '../../../../search-service/search-configuration.service';
 
 @Component({

From c07766f5be75df01502aabf5ff4b7253ffa48933 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Fri, 22 Mar 2019 11:41:42 +0100
Subject: [PATCH 24/24] Added missing test files

---
 .../search-facet-option.component.spec.ts     | 121 +++++++++++++++++
 ...earch-facet-range-option.component.spec.ts | 125 ++++++++++++++++++
 ...ch-facet-selected-option.component.spec.ts |  95 +++++++++++++
 3 files changed, 341 insertions(+)
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.spec.ts
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.spec.ts
 create mode 100644 src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.spec.ts

diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.spec.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.spec.ts
new file mode 100644
index 0000000000..f1dbedfb40
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-option/search-facet-option.component.spec.ts
@@ -0,0 +1,121 @@
+import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { SearchFacetOptionComponent } from './search-facet-option.component';
+import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
+import { FilterType } from '../../../../search-service/filter-type.model';
+import { FacetValue } from '../../../../search-service/facet-value.model';
+import { FormsModule } from '@angular/forms';
+import { of as observableOf } from 'rxjs';
+import { SearchService } from '../../../../search-service/search.service';
+import { SearchServiceStub } from '../../../../../shared/testing/search-service-stub';
+import { Router } from '@angular/router';
+import { RouterStub } from '../../../../../shared/testing/router-stub';
+import { SearchConfigurationService } from '../../../../search-service/search-configuration.service';
+import { SearchFilterService } from '../../search-filter.service';
+import { By } from '@angular/platform-browser';
+
+describe('SearchFacetOptionComponent', () => {
+  let comp: SearchFacetOptionComponent;
+  let fixture: ComponentFixture<SearchFacetOptionComponent>;
+  const filterName1 = 'test name';
+  const value1 = 'testvalue1';
+  const value2 = 'test2';
+  const value3 = 'another value3';
+  const mockFilterConfig = Object.assign(new SearchFilterConfig(), {
+    name: filterName1,
+    type: FilterType.range,
+    hasFacets: false,
+    isOpenByDefault: false,
+    pageSize: 2,
+    minValue: 200,
+    maxValue: 3000,
+  });
+  const value: FacetValue = {
+      value: value2,
+      count: 20,
+      search: ''
+    };
+
+  const searchLink = '/search';
+  const selectedValues = [value1];
+  const selectedValues$ = observableOf(selectedValues);
+  let filterService;
+  let searchService;
+  let router;
+  const page = observableOf(0);
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot(), NoopAnimationsModule, FormsModule],
+      declarations: [SearchFacetOptionComponent],
+      providers: [
+        { provide: SearchService, useValue: new SearchServiceStub(searchLink) },
+        { provide: Router, useValue: new RouterStub() },
+        {
+          provide: SearchConfigurationService, useValue: {
+            searchOptions: observableOf({})
+          }
+        },
+        {
+          provide: SearchFilterService, useValue: {
+            getSelectedValuesForFilter: () => selectedValues,
+            isFilterActiveWithValue: (paramName: string, filterValue: string) => observableOf(true),
+            getPage: (paramName: string) => page,
+            /* tslint:disable:no-empty */
+            incrementPage: (filterName: string) => {
+            },
+            resetPage: (filterName: string) => {
+            }
+            /* tslint:enable:no-empty */
+          }
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).overrideComponent(SearchFacetOptionComponent, {
+      set: { changeDetection: ChangeDetectionStrategy.Default }
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SearchFacetOptionComponent);
+    comp = fixture.componentInstance; // SearchPageComponent test instance
+    filterService = (comp as any).filterService;
+    searchService = (comp as any).searchService;
+    router = (comp as any).router;
+    comp.filterValue = value;
+    comp.selectedValues$ = selectedValues$;
+    comp.filterConfig = mockFilterConfig;
+    fixture.detectChanges();
+  });
+
+  describe('when the updateAddParams method is called wih a value', () => {
+    it('should update the addQueryParams with the new parameter values', () => {
+      comp.addQueryParams = {};
+      (comp as any).updateAddParams(selectedValues);
+      expect(comp.addQueryParams).toEqual({
+        [mockFilterConfig.paramName]: [value1, value.value],
+        page: 1
+      });
+    });
+  });
+
+  describe('when isVisible emits true', () => {
+    it('the facet option should be visible', () => {
+      comp.isVisible = observableOf(true);
+      fixture.detectChanges();
+      const linkEl = fixture.debugElement.query(By.css('a'));
+      expect(linkEl).not.toBeNull();
+    });
+  });
+
+  describe('when isVisible emits false', () => {
+    it('the facet option should not be visible', () => {
+      comp.isVisible = observableOf(false);
+      fixture.detectChanges();
+      const linkEl = fixture.debugElement.query(By.css('a'));
+      expect(linkEl).toBeNull();
+    });
+  });
+});
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.spec.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.spec.ts
new file mode 100644
index 0000000000..218730263b
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-range-option/search-facet-range-option.component.spec.ts
@@ -0,0 +1,125 @@
+import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
+import { FilterType } from '../../../../search-service/filter-type.model';
+import { FacetValue } from '../../../../search-service/facet-value.model';
+import { FormsModule } from '@angular/forms';
+import { of as observableOf } from 'rxjs';
+import { SearchService } from '../../../../search-service/search.service';
+import { SearchServiceStub } from '../../../../../shared/testing/search-service-stub';
+import { Router } from '@angular/router';
+import { RouterStub } from '../../../../../shared/testing/router-stub';
+import { SearchConfigurationService } from '../../../../search-service/search-configuration.service';
+import { SearchFilterService } from '../../search-filter.service';
+import { By } from '@angular/platform-browser';
+import { SearchFacetRangeOptionComponent } from './search-facet-range-option.component';
+import {
+  RANGE_FILTER_MAX_SUFFIX,
+  RANGE_FILTER_MIN_SUFFIX
+} from '../../search-range-filter/search-range-filter.component';
+
+describe('SearchFacetRangeOptionComponent', () => {
+  let comp: SearchFacetRangeOptionComponent;
+  let fixture: ComponentFixture<SearchFacetRangeOptionComponent>;
+  const filterName1 = 'test name';
+  const value2 = '20 - 30';
+  const mockFilterConfig = Object.assign(new SearchFilterConfig(), {
+    name: filterName1,
+    type: FilterType.range,
+    hasFacets: false,
+    isOpenByDefault: false,
+    pageSize: 2,
+    minValue: 200,
+    maxValue: 3000,
+  });
+  const value: FacetValue = {
+      value: value2,
+      count: 20,
+      search: ''
+    };
+
+  const searchLink = '/search';
+  let filterService;
+  let searchService;
+  let router;
+  const page = observableOf(0);
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot(), NoopAnimationsModule, FormsModule],
+      declarations: [SearchFacetRangeOptionComponent],
+      providers: [
+        { provide: SearchService, useValue: new SearchServiceStub(searchLink) },
+        { provide: Router, useValue: new RouterStub() },
+        {
+          provide: SearchConfigurationService, useValue: {
+            searchOptions: observableOf({})
+          }
+        },
+        {
+          provide: SearchFilterService, useValue: {
+            isFilterActiveWithValue: (paramName: string, filterValue: string) => observableOf(true),
+            getPage: (paramName: string) => page,
+            /* tslint:disable:no-empty */
+            incrementPage: (filterName: string) => {
+            },
+            resetPage: (filterName: string) => {
+            }
+            /* tslint:enable:no-empty */
+          }
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).overrideComponent(SearchFacetRangeOptionComponent, {
+      set: { changeDetection: ChangeDetectionStrategy.Default }
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SearchFacetRangeOptionComponent);
+    comp = fixture.componentInstance; // SearchFacetRangeOptionComponent test instance
+    filterService = (comp as any).filterService;
+    searchService = (comp as any).searchService;
+    router = (comp as any).router;
+    comp.filterValue = value;
+    comp.filterConfig = mockFilterConfig;
+    fixture.detectChanges();
+  });
+
+  describe('when the updateChangeParams method is called wih a value', () => {
+    it('should update the changeQueryParams with the new parameter values', () => {
+      comp.changeQueryParams = {};
+      comp.filterValue = {
+          value: '50-60',
+          count: 20,
+          search: ''
+        };
+      (comp as any).updateChangeParams();
+      expect(comp.changeQueryParams).toEqual({
+        [mockFilterConfig.paramName + RANGE_FILTER_MIN_SUFFIX]: ['50'],
+        [mockFilterConfig.paramName + RANGE_FILTER_MAX_SUFFIX]: ['60'],
+        page: 1
+      });
+    });
+  });
+
+  describe('when isVisible emits true', () => {
+    it('the facet option should be visible', () => {
+      comp.isVisible = observableOf(true);
+      fixture.detectChanges();
+      const linkEl = fixture.debugElement.query(By.css('a'));
+      expect(linkEl).not.toBeNull();
+    });
+  });
+
+  describe('when isVisible emits false', () => {
+    it('the facet option should not be visible', () => {
+      comp.isVisible = observableOf(false);
+      fixture.detectChanges();
+      const linkEl = fixture.debugElement.query(By.css('a'));
+      expect(linkEl).toBeNull();
+    });
+  });
+});
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.spec.ts b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.spec.ts
new file mode 100644
index 0000000000..545ba1d66b
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-options/search-facet-selected-option/search-facet-selected-option.component.spec.ts
@@ -0,0 +1,95 @@
+import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { SearchFilterConfig } from '../../../../search-service/search-filter-config.model';
+import { FilterType } from '../../../../search-service/filter-type.model';
+import { FormsModule } from '@angular/forms';
+import { of as observableOf } from 'rxjs';
+import { SearchService } from '../../../../search-service/search.service';
+import { SearchServiceStub } from '../../../../../shared/testing/search-service-stub';
+import { Router } from '@angular/router';
+import { RouterStub } from '../../../../../shared/testing/router-stub';
+import { SearchConfigurationService } from '../../../../search-service/search-configuration.service';
+import { SearchFilterService } from '../../search-filter.service';
+import { SearchFacetSelectedOptionComponent } from './search-facet-selected-option.component';
+
+describe('SearchFacetSelectedOptionComponent', () => {
+  let comp: SearchFacetSelectedOptionComponent;
+  let fixture: ComponentFixture<SearchFacetSelectedOptionComponent>;
+  const filterName1 = 'test name';
+  const value1 = 'testvalue1';
+  const value2 = 'test2';
+  const mockFilterConfig = Object.assign(new SearchFilterConfig(), {
+    name: filterName1,
+    type: FilterType.range,
+    hasFacets: false,
+    isOpenByDefault: false,
+    pageSize: 2,
+    minValue: 200,
+    maxValue: 3000,
+  });
+
+  const searchLink = '/search';
+  const selectedValues = [value1, value2];
+  const selectedValues$ = observableOf(selectedValues);
+  let filterService;
+  let searchService;
+  let router;
+  const page = observableOf(0);
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot(), NoopAnimationsModule, FormsModule],
+      declarations: [SearchFacetSelectedOptionComponent],
+      providers: [
+        { provide: SearchService, useValue: new SearchServiceStub(searchLink) },
+        { provide: Router, useValue: new RouterStub() },
+        {
+          provide: SearchConfigurationService, useValue: {
+            searchOptions: observableOf({})
+          }
+        },
+        {
+          provide: SearchFilterService, useValue: {
+            getSelectedValuesForFilter: () => selectedValues,
+            isFilterActiveWithValue: (paramName: string, filterValue: string) => observableOf(true),
+            getPage: (paramName: string) => page,
+            /* tslint:disable:no-empty */
+            incrementPage: (filterName: string) => {
+            },
+            resetPage: (filterName: string) => {
+            }
+            /* tslint:enable:no-empty */
+          }
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).overrideComponent(SearchFacetSelectedOptionComponent, {
+      set: { changeDetection: ChangeDetectionStrategy.Default }
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SearchFacetSelectedOptionComponent);
+    comp = fixture.componentInstance; // SearchFacetSelectedOptionComponent test instance
+    filterService = (comp as any).filterService;
+    searchService = (comp as any).searchService;
+    router = (comp as any).router;
+    comp.selectedValue = value2;
+    comp.selectedValues$ = selectedValues$;
+    comp.filterConfig = mockFilterConfig;
+    fixture.detectChanges();
+  });
+
+  describe('when the updateRemoveParams method is called wih a value', () => {
+    it('should update the removeQueryParams with the new parameter values', () => {
+      comp.removeQueryParams = {};
+      (comp as any).updateRemoveParams(selectedValues);
+      expect(comp.removeQueryParams).toEqual({
+        [mockFilterConfig.paramName]: [value1],
+        page: 1
+      });
+    });
+  });
+});