diff --git a/.dockerignore b/.dockerignore
new file mode 100644
index 0000000000..5889e7a85c
--- /dev/null
+++ b/.dockerignore
@@ -0,0 +1,21 @@
+.git
+node-modules
+__build__
+__server_build__
+typings
+tsd_typings
+npm-debug.log
+dist
+coverage
+.idea
+*.iml
+*.ngfactory.ts
+*.css.shim.ts
+*.scss.shim.ts
+.DS_Store
+webpack.records.json
+npm-debug.log.*
+morgan.log
+yarn-error.log
+*.css
+package-lock.json
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 0000000000..f10164ebd0
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,10 @@
+# This image will be published as dspace/dspace-angular
+# See https://dspace-labs.github.io/DSpace-Docker-Images/ for usage details
+
+FROM node:8-alpine
+WORKDIR /app
+ADD . /app/
+EXPOSE 3000
+
+RUN yarn install
+CMD yarn run watch
diff --git a/package.json b/package.json
index 7ded007e83..0936b27ea4 100644
--- a/package.json
+++ b/package.json
@@ -90,11 +90,12 @@
     "@ngx-translate/http-loader": "2.0.1",
     "@nicky-lenaers/ngx-scroll-to": "^0.6.0",
     "angular-idle-preload": "2.0.4",
+    "angular2-moment": "^1.9.0",
     "angular-sortablejs": "^2.5.0",
     "angular2-text-mask": "8.0.4",
     "angulartics2": "^5.2.0",
     "body-parser": "1.18.2",
-    "bootstrap": "^4.0.0",
+    "bootstrap": "4.1.1",
     "cerialize": "0.1.18",
     "compression": "1.7.1",
     "cookie-parser": "1.4.3",
@@ -109,10 +110,13 @@
     "jsonschema": "1.2.2",
     "jwt-decode": "^2.2.0",
     "methods": "1.1.2",
+    "moment": "^2.22.1",
     "morgan": "1.9.0",
+    "ng2-nouislider": "^1.7.11",
     "ng2-file-upload": "1.2.1",
     "ngx-infinite-scroll": "0.8.2",
     "ngx-pagination": "3.0.3",
+    "nouislider": "^11.0.0",
     "pem": "1.12.3",
     "reflect-metadata": "0.1.12",
     "rxjs": "5.5.6",
diff --git a/resources/i18n/en.json b/resources/i18n/en.json
index f08213df06..c7cb9a5ba7 100644
--- a/resources/i18n/en.json
+++ b/resources/i18n/en.json
@@ -59,8 +59,13 @@
     }
   },
   "sorting": {
-    "ASC": "Ascending",
-    "DESC": "Descending"
+    "score": {
+      "DESC": "Relevance"
+    },
+    "dc.title": {
+      "ASC": "Title Ascending",
+      "DESC": "Title Descending"
+    }
   },
   "title": "DSpace",
   "404": {
@@ -93,13 +98,13 @@
       "close": "Back to results",
       "open": "Search Tools",
       "results": "results",
-      "filters":{
-        "title":"Filters"
+      "filters": {
+        "title": "Filters"
       },
-      "settings":{
-        "title":"Settings",
-        "sort-by":"Sort By",
-        "rpp":"Results per page"
+      "settings": {
+        "title": "Settings",
+        "sort-by": "Sort By",
+        "rpp": "Results per page"
       }
     },
     "view-switch": {
@@ -109,6 +114,13 @@
     "filters": {
       "head": "Filters",
       "reset": "Reset filters",
+      "applied": {
+        "f.author": "Author",
+        "f.dateIssued.min": "Start date",
+        "f.dateIssued.max": "End date",
+        "f.subject": "Subject",
+        "f.has_content_in_original_bundle": "Has files"
+      },
       "filter": {
         "show-more": "Show more",
         "show-less": "Collapse",
@@ -125,11 +137,15 @@
           "head": "Subject"
         },
         "dateIssued": {
-          "placeholder": "Date",
+          "max": {
+            "placeholder": "Minimum Date"
+          },
+          "min": {
+            "placeholder": "Maximum Date"
+          },
           "head": "Date"
         },
         "has_content_in_original_bundle": {
-          "placeholder": "Has files",
           "head": "Has files"
         }
       }
diff --git a/src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.html b/src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.html
index b04e93ff71..12c2578d9c 100644
--- a/src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.html
+++ b/src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.html
@@ -2,7 +2,7 @@
   <div *ngIf="subCollectionsRD?.hasSucceeded" @fadeIn>
     <h2>{{'community.sub-collection-list.head' | translate}}</h2>
     <ul>
-      <li *ngFor="let collection of subCollectionsRD?.payload">
+      <li *ngFor="let collection of subCollectionsRD?.payload.page">
         <p>
           <span class="lead"><a [routerLink]="['/collections', collection.id]">{{collection.name}}</a></span><br>
           <span class="text-muted">{{collection.shortDescription}}</span>
diff --git a/src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.ts b/src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.ts
index fc69719896..aed2b69a30 100644
--- a/src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.ts
+++ b/src/app/+community-page/sub-collection-list/community-page-sub-collection-list.component.ts
@@ -6,6 +6,7 @@ import { Collection } from '../../core/shared/collection.model';
 import { Community } from '../../core/shared/community.model';
 
 import { fadeIn } from '../../shared/animations/fade';
+import { PaginatedList } from '../../core/data/paginated-list';
 
 @Component({
   selector: 'ds-community-page-sub-collection-list',
@@ -15,7 +16,7 @@ import { fadeIn } from '../../shared/animations/fade';
 })
 export class CommunityPageSubCollectionListComponent implements OnInit {
   @Input() community: Community;
-  subCollectionsRDObs: Observable<RemoteData<Collection[]>>;
+  subCollectionsRDObs: Observable<RemoteData<PaginatedList<Collection>>>;
 
   ngOnInit(): void {
     this.subCollectionsRDObs = this.community.collections;
diff --git a/src/app/+home-page/top-level-community-list/top-level-community-list.component.ts b/src/app/+home-page/top-level-community-list/top-level-community-list.component.ts
index 8fca66ea79..1915a8ce64 100644
--- a/src/app/+home-page/top-level-community-list/top-level-community-list.component.ts
+++ b/src/app/+home-page/top-level-community-list/top-level-community-list.component.ts
@@ -38,7 +38,7 @@ export class TopLevelCommunityListComponent {
   }
 
   updatePage(data) {
-    this.communitiesRDObs = this.cds.findAll({
+    this.communitiesRDObs = this.cds.findTop({
       currentPage: data.page,
       elementsPerPage: data.pageSize,
       sort: { field: data.sortField, direction: data.sortDirection }
diff --git a/src/app/+item-page/field-components/collections/collections.component.html b/src/app/+item-page/field-components/collections/collections.component.html
index bb7ab63341..6e5f9a350c 100644
--- a/src/app/+item-page/field-components/collections/collections.component.html
+++ b/src/app/+item-page/field-components/collections/collections.component.html
@@ -1,4 +1,4 @@
-<ds-metadata-field-wrapper [label]="label | translate">
+<ds-metadata-field-wrapper *ngIf="hasSucceeded() | async" [label]="label | translate">
     <div class="collections">
         <a *ngFor="let collection of (collections | async); let last=last;" [routerLink]="['/collections', collection.id]">
             <span>{{collection?.name}}</span><span *ngIf="!last" [innerHTML]="separator"></span>
diff --git a/src/app/+item-page/field-components/collections/collections.component.spec.ts b/src/app/+item-page/field-components/collections/collections.component.spec.ts
new file mode 100644
index 0000000000..871018a9d8
--- /dev/null
+++ b/src/app/+item-page/field-components/collections/collections.component.spec.ts
@@ -0,0 +1,74 @@
+import { CollectionsComponent } from './collections.component';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
+import { By } from '@angular/platform-browser';
+import { Collection } from '../../../core/shared/collection.model';
+import { RemoteDataBuildService } from '../../../core/cache/builders/remote-data-build.service';
+import { getMockRemoteDataBuildService } from '../../../shared/mocks/mock-remote-data-build.service';
+import { Item } from '../../../core/shared/item.model';
+import { Observable } from 'rxjs/Observable';
+import { RemoteData } from '../../../core/data/remote-data';
+import { TranslateModule } from '@ngx-translate/core';
+
+let collectionsComponent: CollectionsComponent;
+let fixture: ComponentFixture<CollectionsComponent>;
+
+const mockCollection1: Collection = Object.assign(new Collection(), {
+  metadata: [
+    {
+      key: 'dc.description.abstract',
+      language: 'en_US',
+      value: 'Short description'
+    }]
+});
+
+const succeededMockItem: Item = Object.assign(new Item(), {owningCollection: Observable.of(new RemoteData(false, false, true, null, mockCollection1))});
+const failedMockItem: Item = Object.assign(new Item(), {owningCollection: Observable.of(new RemoteData(false, false, false, null, mockCollection1))});
+
+describe('CollectionsComponent', () => {
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [ CollectionsComponent ],
+      providers: [
+        { provide: RemoteDataBuildService, useValue: getMockRemoteDataBuildService()}
+      ],
+
+      schemas: [ NO_ERRORS_SCHEMA ]
+    }).overrideComponent(CollectionsComponent, {
+      set: { changeDetection: ChangeDetectionStrategy.Default }
+    }).compileComponents();
+  }));
+
+  beforeEach(async(() => {
+    fixture = TestBed.createComponent(CollectionsComponent);
+    collectionsComponent = fixture.componentInstance;
+    collectionsComponent.label = 'test.test';
+    collectionsComponent.separator = '<br/>';
+
+  }));
+
+  describe('When the requested item request has succeeded', () => {
+    beforeEach(() => {
+      collectionsComponent.item = succeededMockItem;
+      fixture.detectChanges();
+    });
+
+    it('should show the collection', () => {
+      const collectionField = fixture.debugElement.query(By.css('ds-metadata-field-wrapper div.collections'));
+      expect(collectionField).not.toBeNull();
+    });
+  });
+
+  describe('When the requested item request has failed', () => {
+    beforeEach(() => {
+      collectionsComponent.item = failedMockItem;
+      fixture.detectChanges();
+    });
+
+    it('should not show the collection', () => {
+      const collectionField = fixture.debugElement.query(By.css('ds-metadata-field-wrapper div.collections'));
+      expect(collectionField).toBeNull();
+    });
+  });
+});
diff --git a/src/app/+item-page/field-components/collections/collections.component.ts b/src/app/+item-page/field-components/collections/collections.component.ts
index 8b7b5d7f58..83bb0d464d 100644
--- a/src/app/+item-page/field-components/collections/collections.component.ts
+++ b/src/app/+item-page/field-components/collections/collections.component.ts
@@ -38,4 +38,8 @@ export class CollectionsComponent implements OnInit {
     this.collections = this.item.owner.map((rd: RemoteData<Collection>) => [rd.payload]);
   }
 
+  hasSucceeded() {
+    return this.item.owner.map((rd: RemoteData<Collection>) => rd.hasSucceeded);
+  }
+
 }
diff --git a/src/app/+search-page/normalized-search-result.model.ts b/src/app/+search-page/normalized-search-result.model.ts
index 2e9a4a8b8e..0683c74aed 100644
--- a/src/app/+search-page/normalized-search-result.model.ts
+++ b/src/app/+search-page/normalized-search-result.model.ts
@@ -2,11 +2,19 @@ import { autoserialize } from 'cerialize';
 import { Metadatum } from '../core/shared/metadatum.model';
 import { ListableObject } from '../shared/object-collection/shared/listable-object.model';
 
+/**
+ * Represents a normalized version of a search result object of a certain DSpaceObject
+ */
 export class NormalizedSearchResult implements ListableObject {
-
+  /**
+   * The UUID of the DSpaceObject that was found
+   */
   @autoserialize
   dspaceObject: string;
 
+  /**
+   * The metadata that was used to find this item, hithighlighted
+   */
   @autoserialize
   hitHighlights: Metadatum[];
 
diff --git a/src/app/+search-page/paginated-search-options.model.spec.ts b/src/app/+search-page/paginated-search-options.model.spec.ts
new file mode 100644
index 0000000000..312e170f1b
--- /dev/null
+++ b/src/app/+search-page/paginated-search-options.model.spec.ts
@@ -0,0 +1,40 @@
+import 'rxjs/add/observable/of';
+import { SortDirection, SortOptions } from '../core/cache/models/sort-options.model';
+import { PaginationComponentOptions } from '../shared/pagination/pagination-component-options.model';
+import { PaginatedSearchOptions } from './paginated-search-options.model';
+
+describe('PaginatedSearchOptions', () => {
+  let options: PaginatedSearchOptions;
+  const sortOptions = new SortOptions('test.field', SortDirection.DESC);
+  const pageOptions = Object.assign(new PaginationComponentOptions(), { pageSize: 40, page: 1 });
+  const filters = { 'f.test': ['value'], 'f.example': ['another value', 'second value'] };
+  const query = 'search query';
+  const scope = '0fde1ecb-82cc-425a-b600-ac3576d76b47';
+  const baseUrl = 'www.rest.com';
+  beforeEach(() => {
+    options = new PaginatedSearchOptions();
+    options.sort = sortOptions;
+    options.pagination = pageOptions;
+    options.filters = filters;
+    options.query = query;
+    options.scope = scope;
+  });
+
+  describe('when toRestUrl is called', () => {
+
+    it('should generate a string with all parameters that are present', () => {
+      const outcome = options.toRestUrl(baseUrl);
+      expect(outcome).toEqual('www.rest.com?' +
+        'sort=test.field,DESC&' +
+        'page=0&' +
+        'size=40&' +
+        'query=search query&' +
+        'scope=0fde1ecb-82cc-425a-b600-ac3576d76b47&' +
+        'f.test=value,query&' +
+        'f.example=another value,query&' +
+        'f.example=second value,query'
+      );
+    });
+
+  });
+});
diff --git a/src/app/+search-page/paginated-search-options.model.ts b/src/app/+search-page/paginated-search-options.model.ts
index 0c403af827..a1d147fb9d 100644
--- a/src/app/+search-page/paginated-search-options.model.ts
+++ b/src/app/+search-page/paginated-search-options.model.ts
@@ -1,12 +1,21 @@
 import { SortOptions } from '../core/cache/models/sort-options.model';
 import { PaginationComponentOptions } from '../shared/pagination/pagination-component-options.model';
 import { isNotEmpty } from '../shared/empty.util';
-import { URLCombiner } from '../core/url-combiner/url-combiner';
 import { SearchOptions } from './search-options.model';
 
+/**
+ * This model class represents all parameters needed to request information about a certain page of a search request, in a certain order
+ */
 export class PaginatedSearchOptions extends SearchOptions {
   pagination?: PaginationComponentOptions;
   sort?: SortOptions;
+
+  /**
+   * Method to generate the URL that can be used to request a certain page with specific sort options
+   * @param {string} url The URL to the REST endpoint
+   * @param {string[]} args A list of query arguments that should be included in the URL
+   * @returns {string} URL with all paginated search options and passed arguments as query parameters
+   */
   toRestUrl(url: string, args: string[] = []): string {
     if (isNotEmpty(this.sort)) {
       args.push(`sort=${this.sort.field},${this.sort.direction}`);
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
new file mode 100644
index 0000000000..32d9ea6e77
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.html
@@ -0,0 +1,34 @@
+<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 *ngFor="let page of (filterValues$ | async)?.payload">
+        <div [@facetLoad]="animationState">
+          <ng-container *ngFor="let value of page.page; let i=index">
+                <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>
+        </div>
+        </ng-container>
+        <div class="clearfix toggle-more-filters">
+            <a class="float-left" *ngIf="!(isLastPage$ | async)"
+               (click)="showMore()">{{"search.filters.filter.show-more"
+                | translate}}</a>
+            <a class="float-right" *ngIf="(currentPage | async) > 1"
+               (click)="showFirstPageOnly()">{{"search.filters.filter.show-less"
+                | translate}}</a>
+        </div>
+    </div>
+
+</div>
diff --git a/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.scss b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.scss
new file mode 100644
index 0000000000..030184640e
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.scss
@@ -0,0 +1,25 @@
+@import '../../../../../styles/variables.scss';
+@import '../../../../../styles/mixins.scss';
+
+.filters {
+    a {
+        color: $body-color;
+        &:hover, &focus {
+          text-decoration: none;
+        }
+        span.badge {
+            vertical-align: text-top;
+        }
+    }
+    .toggle-more-filters a {
+        color: $link-color;
+        text-decoration: underline;
+        cursor: pointer;
+    }
+}
+::ng-deep em {
+    font-weight: bold;
+    font-style: normal;
+}
+
+
diff --git a/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.ts
new file mode 100644
index 0000000000..5deaa34d29
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-boolean-filter/search-boolean-filter.component.ts
@@ -0,0 +1,21 @@
+import { Component, OnInit } from '@angular/core';
+import { FilterType } from '../../../search-service/filter-type.model';
+import { renderFacetFor } from '../search-filter-type-decorator';
+import {
+  facetLoad,
+  SearchFacetFilterComponent
+} from '../search-facet-filter/search-facet-filter.component';
+
+@Component({
+  selector: 'ds-search-boolean-filter',
+  styleUrls: ['./search-boolean-filter.component.scss'],
+  templateUrl: './search-boolean-filter.component.html',
+  animations: [facetLoad]
+})
+
+/**
+ * Component that represents a boolean facet for a specific filter configuration
+ */
+@renderFacetFor(FilterType.boolean)
+export class SearchBooleanFilterComponent extends SearchFacetFilterComponent implements OnInit {
+}
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
new file mode 100644
index 0000000000..b7e03af473
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.html
@@ -0,0 +1 @@
+<ng-container *ngComponentOutlet="getSearchFilter(); injector: objectInjector;"></ng-container>
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
new file mode 100644
index 0000000000..bc088777fa
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component.ts
@@ -0,0 +1,48 @@
+import { Component, Injector, Input, OnInit } from '@angular/core';
+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';
+
+@Component({
+  selector: 'ds-search-facet-filter-wrapper',
+  templateUrl: './search-facet-filter-wrapper.component.html'
+})
+
+/**
+ * Wrapper component that renders a specific facet filter based on the filter config's type
+ */
+export class SearchFacetFilterWrapperComponent implements OnInit {
+  /**
+   * Configuration for the filter of this wrapper component
+   */
+  @Input() filterConfig: SearchFilterConfig;
+
+  /**
+   * Injector to inject a child component with the @Input parameters
+   */
+  objectInjector: Injector;
+
+  constructor(private injector: Injector) {
+  }
+
+  /**
+   * Initialize and add the filter config to the injector
+   */
+  ngOnInit(): void {
+    this.objectInjector = Injector.create({
+      providers: [
+        { provide: FILTER_CONFIG, useFactory: () => (this.filterConfig), deps: [] }
+      ],
+      parent: this.injector
+    });
+  }
+
+  /**
+   * Find the correct component based on the filter config's type
+   */
+  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.html b/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.html
deleted file mode 100644
index 074c5700d7..0000000000
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.html
+++ /dev/null
@@ -1,38 +0,0 @@
-<div>
-    <div class="filters">
-        <a *ngFor="let value of selectedValues" class="d-block"
-           [routerLink]="[getSearchLink()]"
-           [queryParams]="getRemoveParams(value)" queryParamsHandling="merge">
-            <input type="checkbox" [checked]="true"/>
-            <span class="filter-value">{{value}}</span>
-        </a>
-        <ng-container *ngFor="let page of (filterValues$ | async)">
-            <ng-container *ngFor="let value of (page | async)?.payload.page; let i=index">
-                <a *ngIf="!selectedValues.includes(value.value)" class="d-block clearfix"
-                   [routerLink]="[getSearchLink()]"
-                   [queryParams]="getAddParams(value.value)" queryParamsHandling="merge" >
-                    <input type="checkbox" [checked]="false"/>
-                        <span class="filter-value">{{value.value}}</span>
-                        <span class="float-right filter-value-count">
-                        <span class="badge badge-secondary badge-pill">{{value.count}}</span>
-                    </span>
-                </a>
-            </ng-container>
-        </ng-container>
-        <div class="clearfix toggle-more-filters">
-            <a class="float-left" *ngIf="!(isLastPage$ | async)"
-               (click)="showMore()">{{"search.filters.filter.show-more"
-                | translate}}</a>
-            <a class="float-right" *ngIf="(currentPage | async) > 1"
-               (click)="showFirstPageOnly()">{{"search.filters.filter.show-less"
-                | translate}}</a>
-        </div>
-    </div>
-    <form #form="ngForm" (ngSubmit)="onSubmit(form.value)" class="add-filter"
-          [action]="getCurrentUrl()">
-        <input type="text" [(ngModel)]="filter" [name]="filterConfig.paramName" class="form-control"
-               aria-label="New filter input"
-               [placeholder]="'search.filters.filter.' + filterConfig.name + '.placeholder'| translate"  [ngModelOptions]="{standalone: true}"/>
-        <input type="submit" class="d-none"/>
-    </form>
-</div>
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 03b760318f..49141c2b68 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
@@ -1,10 +1,8 @@
 import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { RouterTestingModule } from '@angular/router/testing';
 import { TranslateModule } from '@ngx-translate/core';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { SearchFacetFilterComponent } from './search-facet-filter.component';
-import { SearchFilterService } from '../search-filter.service';
+import { FILTER_CONFIG, SearchFilterService } from '../search-filter.service';
 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';
@@ -14,11 +12,12 @@ import { SearchService } from '../../../search-service/search.service';
 import { SearchServiceStub } from '../../../../shared/testing/search-service-stub';
 import { RemoteData } from '../../../../core/data/remote-data';
 import { PaginatedList } from '../../../../core/data/paginated-list';
-import { SearchOptions } from '../../../search-options.model';
 import { RouterStub } from '../../../../shared/testing/router-stub';
 import { Router } from '@angular/router';
-import { BehaviorSubject } from 'rxjs/BehaviorSubject';
 import { PageInfo } from '../../../../core/shared/page-info.model';
+import { SearchFacetFilterComponent } from './search-facet-filter.component';
+import { RemoteDataBuildService } from '../../../../core/cache/builders/remote-data-build.service';
+import { SearchConfigurationService } from '../../../search-service/search-configuration.service';
 
 describe('SearchFacetFilterComponent', () => {
   let comp: SearchFacetFilterComponent;
@@ -65,18 +64,21 @@ describe('SearchFacetFilterComponent', () => {
       providers: [
         { provide: SearchService, useValue: new SearchServiceStub(searchLink) },
         { provide: Router, useValue: new RouterStub() },
+        { provide: FILTER_CONFIG, useValue: new SearchFilterConfig() },
+        { provide: RemoteDataBuildService, useValue: {aggregate: () => Observable.of({})} },
+        { provide: SearchConfigurationService, useValue: {searchOptions: Observable.of({})} },
         {
           provide: SearchFilterService, useValue: {
-          isFilterActiveWithValue: (paramName: string, filterValue: string) => true,
-          getPage: (paramName: string) => page,
-          /* tslint:disable:no-empty */
-          incrementPage: (filterName: string) => {
-          },
-          resetPage: (filterName: string) => {
-          },
-          getSearchOptions: () => Observable.of({}),
-          /* tslint:enable:no-empty */
-        }
+            getSelectedValuesForFilter: () => Observable.of(selectedValues),
+            isFilterActiveWithValue: (paramName: string, filterValue: string) => true,
+            getPage: (paramName: string) => page,
+            /* tslint:disable:no-empty */
+            incrementPage: (filterName: string) => {
+            },
+            resetPage: (filterName: string) => {
+            }
+            /* tslint:enable:no-empty */
+          }
         }
       ],
       schemas: [NO_ERRORS_SCHEMA]
@@ -89,9 +91,6 @@ describe('SearchFacetFilterComponent', () => {
     fixture = TestBed.createComponent(SearchFacetFilterComponent);
     comp = fixture.componentInstance; // SearchPageComponent test instance
     comp.filterConfig = mockFilterConfig;
-    comp.filterValues = [mockValues];
-    comp.filterValues$ = new BehaviorSubject(comp.filterValues);
-    comp.selectedValues = selectedValues;
     filterService = (comp as any).filterService;
     searchService = (comp as any).searchService;
     spyOn(searchService, 'getFacetValuesFor').and.returnValue(mockValues);
@@ -124,14 +123,14 @@ 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);
-      expect(result[mockFilterConfig.paramName]).toEqual([value1, value2, 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);
-      expect(result[mockFilterConfig.paramName]).toEqual([value2]);
+      result.subscribe((r) => expect(r[mockFilterConfig.paramName]).toEqual([value2]));
     });
   });
 
@@ -169,7 +168,7 @@ describe('SearchFacetFilterComponent', () => {
   });
 
   describe('when the getCurrentUrl method is called', () => {
-    const url = 'test.url/test'
+    const url = 'test.url/test';
     beforeEach(() => {
       router.navigateByUrl(url);
     });
@@ -182,7 +181,7 @@ describe('SearchFacetFilterComponent', () => {
   describe('when the onSubmit method is called with data', () => {
     const searchUrl = '/search/path';
     const testValue = 'test';
-    const data = { [mockFilterConfig.paramName]: testValue };
+    const data = testValue;
     beforeEach(() => {
       spyOn(comp, 'getSearchLink').and.returnValue(searchUrl);
       comp.onSubmit(data);
@@ -197,46 +196,26 @@ describe('SearchFacetFilterComponent', () => {
   });
 
   describe('when updateFilterValueList is called', () => {
-    const cPage = 10;
-    const searchOptions = new SearchOptions();
     beforeEach(() => {
-      // spyOn(searchService, 'getFacetValuesFor'); Already spied upon
-      comp.currentPage = Observable.of(cPage);
-      comp.updateFilterValueList(searchOptions);
+      spyOn(comp, 'showFirstPageOnly');
+      comp.updateFilterValueList()
     });
 
-    it('should call getFacetValuesFor on the searchService with the correct parameters', () => {
-      expect(searchService.getFacetValuesFor).toHaveBeenCalledWith(mockFilterConfig, cPage, searchOptions);
+    it('should call showFirstPageOnly and empty the filter', () => {
+        expect(comp.animationState).toEqual('loading');
+        expect((comp as any).collapseNextUpdate).toBeTruthy();
+        expect(comp.filter).toEqual('');
     });
   });
 
-  describe('when updateFilterValueList is called and pageChange is set to true', () => {
-    const searchOptions = new SearchOptions();
+  describe('when findSuggestions is called with query \'test\'', () => {
+    const query = 'test';
     beforeEach(() => {
-      comp.pageChange = true;
-      spyOn(comp, 'showFirstPageOnly');
-      comp.updateFilterValueList(searchOptions);
+      comp.findSuggestions(query);
     });
 
-    it('should not call showFirstPageOnly on the component', () => {
-      expect(comp.showFirstPageOnly).not.toHaveBeenCalled();
-    });
-
-    it('should set pageChange to false', () => {
-      expect(comp.pageChange).toBeFalsy();
-    });
-  });
-
-  describe('when updateFilterValueList is called and pageChange is set to false', () => {
-    const searchOptions = new SearchOptions();
-    beforeEach(() => {
-      comp.pageChange = false;
-      spyOn(comp, 'showFirstPageOnly');
-      comp.updateFilterValueList(searchOptions);
-    });
-
-    it('should call showFirstPageOnly on the component', () => {
-      expect(comp.showFirstPageOnly).toHaveBeenCalled();
+    it('should call getFacetValuesFor on the component\'s SearchService with the right query', () => {
+      expect((comp as any).searchService.getFacetValuesFor).toHaveBeenCalledWith(comp.filterConfig, 1, {}, query);
     });
   });
 });
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 5f8111c87b..c87f96ffba 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
@@ -1,125 +1,283 @@
-import { Component, Input, OnDestroy, OnInit } from '@angular/core';
+import { animate, state, style, transition, trigger } from '@angular/animations';
+import { Component, Inject, OnDestroy, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { Observable } from 'rxjs/Observable';
+import { Subject } from 'rxjs/Subject';
+import { Subscription } from 'rxjs/Subscription';
+import { RemoteDataBuildService } from '../../../../core/cache/builders/remote-data-build.service';
+import { PaginatedList } from '../../../../core/data/paginated-list';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { hasNoValue, hasValue, isNotEmpty } from '../../../../shared/empty.util';
+import { EmphasizePipe } from '../../../../shared/utils/emphasize.pipe';
+import { SearchOptions } from '../../../search-options.model';
 import { FacetValue } from '../../../search-service/facet-value.model';
 import { SearchFilterConfig } from '../../../search-service/search-filter-config.model';
-import { Router } from '@angular/router';
-import { Observable } from 'rxjs/Observable';
-import { SearchFilterService } from '../search-filter.service';
-import { hasNoValue, hasValue, isNotEmpty } from '../../../../shared/empty.util';
-import { RemoteData } from '../../../../core/data/remote-data';
-import { PaginatedList } from '../../../../core/data/paginated-list';
 import { SearchService } from '../../../search-service/search.service';
-import { SearchOptions } from '../../../search-options.model';
-import { BehaviorSubject } from 'rxjs/BehaviorSubject';
-import { Subscription } from 'rxjs/Subscription';
-
-/**
- * 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.
- */
+import { FILTER_CONFIG, SearchFilterService } from '../search-filter.service';
+import { SearchConfigurationService } from '../../../search-service/search-configuration.service';
 
 @Component({
   selector: 'ds-search-facet-filter',
-  styleUrls: ['./search-facet-filter.component.scss'],
-  templateUrl: './search-facet-filter.component.html'
+  template: ``,
 })
 
+/**
+ * Super class for all different representations of facets
+ */
 export class SearchFacetFilterComponent implements OnInit, OnDestroy {
-  @Input() filterConfig: SearchFilterConfig;
-  @Input() selectedValues: string[];
-  filterValues: Array<Observable<RemoteData<PaginatedList<FacetValue>>>> = [];
-  filterValues$: BehaviorSubject<any> = new BehaviorSubject(this.filterValues);
+  /**
+   * Emits an array of pages with values found for this facet
+   */
+  filterValues$: Subject<RemoteData<Array<PaginatedList<FacetValue>>>>;
+
+  /**
+   * Emits the current last shown page of this facet's values
+   */
   currentPage: Observable<number>;
+
+  /**
+   * Emits true if the current page is also the last page available
+   */
   isLastPage$: BehaviorSubject<boolean> = new BehaviorSubject(false);
+
+  /**
+   * The value of the input field that is used to query for possible values for this filter
+   */
   filter: string;
-  pageChange = false;
-  sub: Subscription;
 
-  constructor(private searchService: SearchService, private filterService: SearchFilterService, private router: Router) {
+  /**
+   * List of subscriptions to unsubscribe from
+   */
+  private subs: Subscription[] = [];
+
+  /**
+   * Emits the result values for this filter found by the current filter query
+   */
+  filterSearchResults: Observable<any[]> = Observable.of([]);
+
+  /**
+   * Emits the active values for this filter
+   */
+  selectedValues: Observable<string[]>;
+  private collapseNextUpdate = true;
+
+  /**
+   * State of the requested facets used to time the animation
+   */
+  animationState = 'loading';
+
+  constructor(protected searchService: SearchService,
+              protected filterService: SearchFilterService,
+              protected searchConfigService: SearchConfigurationService,
+              protected rdbs: RemoteDataBuildService,
+              protected router: Router,
+              @Inject(FILTER_CONFIG) public filterConfig: SearchFilterConfig) {
   }
 
+  /**
+   * Initializes all observable instance variables and starts listening to them
+   */
   ngOnInit(): void {
-    this.currentPage = this.getCurrentPage();
-    this.currentPage.distinctUntilChanged().subscribe((page) => this.pageChange = true);
-    this.filterService.getSearchOptions().distinctUntilChanged().subscribe((options) => this.updateFilterValueList(options));
-  }
-
-  updateFilterValueList(options: SearchOptions) {
-    if (!this.pageChange) {
-      this.showFirstPageOnly();
-    }
-    this.pageChange = false;
-
-    this.unsubscribe();
-    this.sub = this.currentPage.distinctUntilChanged().map((page) => {
-      return this.searchService.getFacetValuesFor(this.filterConfig, page, options);
-    }).subscribe((newValues$) => {
-      this.filterValues = [...this.filterValues, newValues$];
-      this.filterValues$.next(this.filterValues);
-      newValues$.first().subscribe((rd) => this.isLastPage$.next(hasNoValue(rd.payload.next)));
+    this.filterValues$ = new BehaviorSubject(new RemoteData(true, false, undefined, undefined, undefined));
+    this.currentPage = this.getCurrentPage().distinctUntilChanged();
+    this.selectedValues = this.filterService.getSelectedValuesForFilter(this.filterConfig);
+    const searchOptions = this.searchConfigService.searchOptions;
+    this.subs.push(this.searchConfigService.searchOptions.subscribe(() => this.updateFilterValueList()));
+    const facetValues = Observable.combineLatest(searchOptions, this.currentPage, (options, page) => {
+      return { options, page }
+    }).switchMap(({ options, page }) => {
+      return this.searchService.getFacetValuesFor(this.filterConfig, page, options)
+        .first((RD) => !RD.isLoading).map((results) => {
+          return {
+            values: Observable.of(results),
+            page: page
+          };
+        }
+      );
     });
+    let filterValues = [];
+    this.subs.push(facetValues.subscribe((facetOutcome) => {
+      const newValues$ = facetOutcome.values;
+
+      if (this.collapseNextUpdate) {
+        this.showFirstPageOnly();
+        facetOutcome.page = 1;
+        this.collapseNextUpdate = false;
+      }
+      if (facetOutcome.page === 1) {
+        filterValues = [];
+      }
+
+      filterValues = [...filterValues, newValues$];
+
+      this.subs.push(this.rdbs.aggregate(filterValues).subscribe((rd: RemoteData<Array<PaginatedList<FacetValue>>>) => {
+        this.animationState = 'ready';
+        this.filterValues$.next(rd);
+      }));
+      this.subs.push(newValues$.first().subscribe((rd) => {
+        this.isLastPage$.next(hasNoValue(rd.payload.next))
+      }));
+    }));
+
   }
 
+  /**
+   * Prepare for refreshing the values of this filter
+   */
+  updateFilterValueList() {
+    this.animationState = 'loading';
+    this.collapseNextUpdate = true;
+    this.filter = '';
+  }
+
+  /**
+   * Checks if a value for this filter is currently active
+   */
   isChecked(value: FacetValue): Observable<boolean> {
     return this.filterService.isFilterActiveWithValue(this.filterConfig.paramName, value.value);
   }
 
+  /**
+   * @returns {string} The base path to the search page
+   */
   getSearchLink() {
     return this.searchService.getSearchLink();
   }
 
+  /**
+   * Show the next page as well
+   */
   showMore() {
     this.filterService.incrementPage(this.filterConfig.name);
   }
 
+  /**
+   * Make sure only the first page is shown
+   */
   showFirstPageOnly() {
-    this.filterValues = [];
     this.filterService.resetPage(this.filterConfig.name);
   }
 
+  /**
+   * @returns {Observable<number>} The current page of this filter
+   */
   getCurrentPage(): Observable<number> {
     return this.filterService.getPage(this.filterConfig.name);
   }
 
+  /**
+   * @returns {string} the current URL
+   */
   getCurrentUrl() {
     return this.router.url;
   }
 
+  /**
+   * Submits a new active custom value to the filter from the input field
+   * @param data The string from the input field
+   */
   onSubmit(data: any) {
-    if (isNotEmpty(data)) {
-      this.router.navigate([this.getSearchLink()], {
-        queryParams:
-          { [this.filterConfig.paramName]: [...this.selectedValues, data[this.filterConfig.paramName]] },
-        queryParamsHandling: 'merge'
-      });
-      this.filter = '';
-    }
+    this.selectedValues.first().subscribe((selectedValues) => {
+        if (isNotEmpty(data)) {
+          this.router.navigate([this.getSearchLink()], {
+            queryParams:
+              { [this.filterConfig.paramName]: [...selectedValues, data] },
+            queryParamsHandling: 'merge'
+          });
+          this.filter = '';
+        }
+        this.filterSearchResults = Observable.of([]);
+      }
+    )
   }
 
+  onClick(data: any) {
+    this.filter = data;
+  }
+
+  /**
+   * For usage of the hasValue function in the template
+   */
   hasValue(o: any): boolean {
     return hasValue(o);
   }
-  getRemoveParams(value: string) {
-    return {
-      [this.filterConfig.paramName]: this.selectedValues.filter((v) => v !== value),
-      page: 1
-    };
+
+  /**
+   * 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.map((selectedValues) => {
+      return {
+        [this.filterConfig.paramName]: selectedValues.filter((v) => v !== value),
+        page: 1
+      };
+    });
   }
 
-  getAddParams(value: string) {
-    return {
-      [this.filterConfig.paramName]: [...this.selectedValues, 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.map((selectedValues) => {
+      return {
+        [this.filterConfig.paramName]: [...selectedValues, value],
+        page: 1
+      };
+    });
   }
 
+  /**
+   * Unsubscribe from all subscriptions
+   */
   ngOnDestroy(): void {
-    this.unsubscribe();
+    this.subs
+      .filter((sub) => hasValue(sub))
+      .forEach((sub) => sub.unsubscribe());
   }
 
-  unsubscribe(): void {
-    if (hasValue(this.sub)) {
-      this.sub.unsubscribe();
+  /**
+   * Updates the found facet value suggestions for a given query
+   * Transforms the found values into display values
+   * @param data The query for which is being searched
+   */
+  findSuggestions(data): void {
+    if (isNotEmpty(data)) {
+      this.searchConfigService.searchOptions.first().subscribe(
+        (options) => {
+          this.filterSearchResults = this.searchService.getFacetValuesFor(this.filterConfig, 1, options, data.toLowerCase())
+            .first()
+            .map(
+              (rd: RemoteData<PaginatedList<FacetValue>>) => {
+                return rd.payload.page.map((facet) => {
+                  return { displayValue: this.getDisplayValue(facet, data), value: facet.value }
+                })
+              }
+            );
+        }
+      )
+    } else {
+      this.filterSearchResults = Observable.of([]);
     }
   }
+
+  /**
+   * Transforms the facet value string, so if the query matches part of the value, it's emphasized in the value
+   * @param {FacetValue} facet The value of the facet as returned by the server
+   * @param {string} query The query that was used to search facet values
+   * @returns {string} The facet value with the query part emphasized
+   */
+  getDisplayValue(facet: FacetValue, query: string): string {
+    return new EmphasizePipe().transform(facet.value, query) + ' (' + facet.count + ')';
+  }
 }
+
+export const facetLoad = trigger('facetLoad', [
+  state('ready', style({ opacity: 1 })),
+  state('loading', style({ opacity: 0 })),
+  transition('loading <=> ready', animate(100)),
+]);
diff --git a/src/app/+search-page/search-filters/search-filter/search-filter-type-decorator.ts b/src/app/+search-page/search-filters/search-filter/search-filter-type-decorator.ts
new file mode 100644
index 0000000000..bcc22be82c
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-filter-type-decorator.ts
@@ -0,0 +1,30 @@
+
+import { FilterType } from '../../search-service/filter-type.model';
+
+/**
+ * Contains the mapping between a facet component and a FilterType
+ */
+const filterTypeMap = new Map();
+
+/**
+ * Sets the mapping for a facet component in relation to a filter type
+ * @param {FilterType} type The type for which the matching component is mapped
+ * @returns Decorator function that performs the actual mapping on initialization of the facet component
+ */
+export function renderFacetFor(type: FilterType) {
+  return function decorator(objectElement: any) {
+    if (!objectElement) {
+      return;
+    }
+    filterTypeMap.set(type, objectElement);
+  };
+}
+
+/**
+ * Requests the matching facet component based on a given filter type
+ * @param {FilterType} type The filter type for which the facet component is requested
+ * @returns The facet component's constructor that matches the given filter type
+ */
+export function renderFilterType(type: FilterType) {
+  return filterTypeMap.get(type);
+}
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 5c9803c7a9..2e556b32d6 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
@@ -22,41 +22,78 @@ export const SearchFilterActionTypes = {
 };
 
 export class SearchFilterAction implements Action {
+  /**
+   * Name of the filter the action is performed on, used to identify the filter
+   */
   filterName: string;
+
+  /**
+   * Type of action that will be performed
+   */
   type;
+
+  /**
+   * Initialize with the filter's name
+   * @param {string} name of the filter
+   */
   constructor(name: string) {
     this.filterName = name;
   }
 }
 
 /* tslint:disable:max-classes-per-file */
+/**
+ * Used to collapse a filter
+ */
 export class SearchFilterCollapseAction extends SearchFilterAction {
   type = SearchFilterActionTypes.COLLAPSE;
 }
 
+/**
+ * Used to expand a filter
+ */
 export class SearchFilterExpandAction extends SearchFilterAction {
   type = SearchFilterActionTypes.EXPAND;
 }
 
+/**
+ * Used to collapse a filter when it's expanded and expand it when it's collapsed
+ */
 export class SearchFilterToggleAction extends SearchFilterAction {
   type = SearchFilterActionTypes.TOGGLE;
 }
 
+/**
+ * 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;
 }
+
+/**
+ * Used to set the state of a filter to the previous page
+ */
 export class SearchFilterDecrementPageAction extends SearchFilterAction {
   type = SearchFilterActionTypes.DECREMENT_PAGE;
 }
 
+/**
+ * Used to set the state of a filter to the next page
+ */
 export class SearchFilterIncrementPageAction extends SearchFilterAction {
   type = SearchFilterActionTypes.INCREMENT_PAGE;
 }
 
+/**
+ * Used to set the state of a filter to the first page
+ */
 export class SearchFilterResetPageAction extends SearchFilterAction {
   type = SearchFilterActionTypes.RESET_PAGE;
 }
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 6cf9df9b05..f5dc5fff38 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 (click)="toggle()" class="filter-name"><h5 class="d-inline-block mb-0">{{'search.filters.filter.' + filter.name + '.head'| translate}}</h5> <span class="filter-toggle fa float-right"
                                                                       [ngClass]="(isCollapsed() | async) ? 'fa-plus' : 'fa-minus'"></span></div>
-    <div [@slide]="(isCollapsed() | async) ? 'collapsed' : 'expanded'" class="search-filter-wrapper">
-        <ds-search-facet-filter [filterConfig]="filter" [selectedValues]="getSelectedValues() | async"></ds-search-facet-filter>
+    <div [@slide]="(isCollapsed() | async) ? 'collapsed' : 'expanded'"  (@slide.start)="startSlide($event)" (@slide.done)="finishSlide($event)" class="search-filter-wrapper" [ngClass]="{'closed' : collapsed}">
+        <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.scss b/src/app/+search-page/search-filters/search-filter/search-filter.component.scss
index f694e9e167..6e49172a48 100644
--- a/src/app/+search-page/search-filters/search-filter/search-filter.component.scss
+++ b/src/app/+search-page/search-filters/search-filter/search-filter.component.scss
@@ -3,7 +3,7 @@
 
 :host {
     border: 1px solid map-get($theme-colors, light);
-    .search-filter-wrapper {
+    .search-filter-wrapper.closed {
         overflow: hidden;
     }
     .filter-toggle {
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 be26075d25..bd3c9f7a0c 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,18 +1,9 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { SearchFilterConfig } from '../../search-service/search-filter-config.model';
-import { SearchService } from '../../search-service/search.service';
-import { RemoteData } from '../../../core/data/remote-data';
-import { FacetValue } from '../../search-service/facet-value.model';
 import { SearchFilterService } from './search-filter.service';
 import { Observable } from 'rxjs/Observable';
 import { slide } from '../../../shared/animations/slide';
-import { PaginatedList } from '../../../core/data/paginated-list';
-
-/**
- * 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.
- */
+import { isNotEmpty } from '../../../shared/empty.util';
 
 @Component({
   selector: 'ds-search-filter',
@@ -21,15 +12,31 @@ import { PaginatedList } from '../../../core/data/paginated-list';
   animations: [slide],
 })
 
+/**
+ * Represents a part of the filter section for a single type of filter
+ */
 export class SearchFilterComponent implements OnInit {
+  /**
+   * The filter config for this component
+   */
   @Input() filter: SearchFilterConfig;
 
+  /**
+   * True when the filter is 100% collapsed in the UI
+   */
+  collapsed;
+
   constructor(private filterService: SearchFilterService) {
   }
 
+  /**
+   * Requests the current set values for this filter
+   * If the filter config is open by default OR the filter has at least one value, the filter should be initially expanded
+   * Else, the filter should initially be collapsed
+   */
   ngOnInit() {
-    this.filterService.isFilterActive(this.filter.paramName).first().subscribe((isActive) => {
-      if (this.filter.isOpenByDefault || isActive) {
+    this.getSelectedValues().first().subscribe((isActive) => {
+      if (this.filter.isOpenByDefault || isNotEmpty(isActive)) {
         this.initialExpand();
       } else {
         this.initialCollapse();
@@ -37,23 +44,61 @@ export class SearchFilterComponent implements OnInit {
     });
   }
 
+  /**
+   *  Changes the state for this filter to collapsed when it's expanded and to expanded it when it's collapsed
+   */
   toggle() {
     this.filterService.toggle(this.filter.name);
   }
 
+  /**
+   * 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> {
     return this.filterService.isCollapsed(this.filter.name);
   }
 
+  /**
+   *  Changes the initial state to collapsed
+   */
   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;
   }
 
+  /**
+   * @returns {Observable<string[]>} Emits a list of all values that are currently active for this filter
+   */
   getSelectedValues(): Observable<string[]> {
     return this.filterService.getSelectedValuesForFilter(this.filter);
   }
+
+  /**
+   * Method to change this.collapsed to false when the slide animation ends and is sliding open
+   * @param event The animation event
+   */
+  finishSlide(event: any): void {
+    if (event.fromState === 'collapsed') {
+      this.collapsed = false;
+    }
+  }
+
+  /**
+   * Method to change this.collapsed to true when the slide animation starts and is sliding closed
+   * @param event The animation event
+   */
+  startSlide(event: any): void {
+    if (event.toState === 'collapsed') {
+      this.collapsed = 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 9b1a084462..f7e064fcc7 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,17 +1,29 @@
 import { SearchFilterAction, SearchFilterActionTypes } from './search-filter.actions';
 import { isEmpty } from '../../../shared/empty.util';
 
+/**
+ * Interface that represents the state for a single filters
+ */
 export interface SearchFilterState {
   filterCollapsed: boolean,
   page: number
 }
 
+/**
+ * Interface that represents the state for all available filters
+ */
 export interface SearchFiltersState {
   [name: string]: SearchFilterState
 }
 
 const initialState: SearchFiltersState = Object.create(null);
 
+/**
+ * Performs a search filter action on the current state
+ * @param {SearchFiltersState} state The state before the action is performed
+ * @param {SearchFilterAction} action The action that should be performed
+ * @returns {SearchFiltersState} The state after the action is performed
+ */
 export function filterReducer(state = initialState, action: SearchFilterAction): SearchFiltersState {
 
   switch (action.type) {
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 26eb961c53..6d250f6869 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
@@ -10,6 +10,7 @@ import {
 import { SearchFiltersState } from './search-filter.reducer';
 import { SearchFilterConfig } from '../../search-service/search-filter-config.model';
 import { FilterType } from '../../search-service/filter-type.model';
+import { ActivatedRouteStub } from '../../../shared/testing/active-router-stub';
 
 describe('SearchFilterService', () => {
   let service: SearchFilterService;
@@ -41,10 +42,14 @@ describe('SearchFilterService', () => {
     addQueryParameterValue: (param: string, value: string) => {
     },
     getQueryParameterValues: (param: string) => {
+      return Observable.of({});
+    },
+    getQueryParamsWithPrefix: (param: string) => {
+      return Observable.of({});
     }
     /* tslint:enable:no-empty */
   };
-
+  const activatedRoute: any = new ActivatedRouteStub();
   const searchServiceStub: any = {
     uiSearchRoute: '/search'
   };
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 695e0204f2..3b7c7b8e86 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,128 +1,82 @@
-import { Injectable } from '@angular/core';
-import { debounceTime, distinctUntilChanged, map } from 'rxjs/operators';
+import { Injectable, InjectionToken } from '@angular/core';
+import { distinctUntilChanged, map } from 'rxjs/operators';
 import { SearchFiltersState, SearchFilterState } from './search-filter.reducer';
 import { createSelector, MemoizedSelector, Store } from '@ngrx/store';
 import { Observable } from 'rxjs/Observable';
 import {
   SearchFilterCollapseAction,
-  SearchFilterDecrementPageAction, SearchFilterExpandAction,
+  SearchFilterDecrementPageAction,
+  SearchFilterExpandAction,
   SearchFilterIncrementPageAction,
   SearchFilterInitialCollapseAction,
-  SearchFilterInitialExpandAction, SearchFilterResetPageAction,
+  SearchFilterInitialExpandAction,
+  SearchFilterResetPageAction,
   SearchFilterToggleAction
 } from './search-filter.actions';
 import { hasValue, isEmpty, isNotEmpty, } from '../../../shared/empty.util';
 import { SearchFilterConfig } from '../../search-service/search-filter-config.model';
-import { SearchService } from '../../search-service/search.service';
 import { RouteService } from '../../../shared/services/route.service';
-import ObjectExpression from 'rollup/dist/typings/ast/nodes/ObjectExpression';
 import { SortDirection, SortOptions } from '../../../core/cache/models/sort-options.model';
 import { PaginationComponentOptions } from '../../../shared/pagination/pagination-component-options.model';
 import { SearchOptions } from '../../search-options.model';
 import { PaginatedSearchOptions } from '../../paginated-search-options.model';
+import { ActivatedRoute, Params } from '@angular/router';
 
 const filterStateSelector = (state: SearchFiltersState) => state.searchFilter;
 
+export const FILTER_CONFIG: InjectionToken<SearchFilterConfig> = new InjectionToken<SearchFilterConfig>('filterConfig');
+
+/**
+ * Service that performs all actions that have to do with search filters and facets
+ */
 @Injectable()
 export class SearchFilterService {
 
   constructor(private store: Store<SearchFiltersState>,
-              private routeService: RouteService) {
+              private routeService: RouteService
+  ) {
   }
 
+  /**
+   * Checks if a given filter is active with a given value
+   * @param {string} paramName The parameter name of the filter's configuration for which to search
+   * @param {string} filterValue The value for which to search
+   * @returns {Observable<boolean>} Emit true when the filter is active with the given value
+   */
   isFilterActiveWithValue(paramName: string, filterValue: string): Observable<boolean> {
     return this.routeService.hasQueryParamWithValue(paramName, filterValue);
   }
 
+  /**
+   * Checks if a given filter is active with any value
+   * @param {string} paramName The parameter name of the filter's configuration for which to search
+   * @returns {Observable<boolean>} Emit true when the filter is active with any value
+   */
   isFilterActive(paramName: string): Observable<boolean> {
     return this.routeService.hasQueryParam(paramName);
   }
 
-  getCurrentScope() {
-    return this.routeService.getQueryParameterValue('scope');
-  }
-
-  getCurrentQuery() {
-    return this.routeService.getQueryParameterValue('query');
-  }
-
-  getCurrentPagination(pagination: any = {}): Observable<PaginationComponentOptions> {
-    const page$ = this.routeService.getQueryParameterValue('page');
-    const size$ = this.routeService.getQueryParameterValue('pageSize');
-    return Observable.combineLatest(page$, size$, (page, size) => {
-      return Object.assign(new PaginationComponentOptions(), pagination, {
-        currentPage: page || 1,
-        pageSize: size || pagination.pageSize
-      });
-    });
-  }
-
-  getCurrentSort(defaultSort: SortOptions): Observable<SortOptions> {
-    const sortDirection$ = this.routeService.getQueryParameterValue('sortDirection');
-    const sortField$ = this.routeService.getQueryParameterValue('sortField');
-    return Observable.combineLatest(sortDirection$, sortField$, (sortDirection, sortField) => {
-        const field = sortField || defaultSort.field;
-        const direction = SortDirection[sortDirection] || defaultSort.direction;
-        return new SortOptions(field, direction)
-      }
-    );
-  }
-
-  getCurrentFilters() {
-    return this.routeService.getQueryParamsWithPrefix('f.');
-  }
-
-  getCurrentView() {
-    return this.routeService.getQueryParameterValue('view');
-  }
-
-  getPaginatedSearchOptions(defaults: any = {}): Observable<PaginatedSearchOptions> {
-    return Observable.combineLatest(
-      this.getCurrentPagination(defaults.pagination),
-      this.getCurrentSort(defaults.sort),
-      this.getCurrentView(),
-      this.getCurrentScope(),
-      this.getCurrentQuery(),
-      this.getCurrentFilters()).pipe(
-      distinctUntilChanged((a, b) => JSON.stringify(a) === JSON.stringify(b)),
-      map(([pagination, sort, view, scope, query, filters]) => {
-        return Object.assign(new PaginatedSearchOptions(),
-          defaults,
-          {
-            pagination: pagination,
-            sort: sort,
-            view: view,
-            scope: scope || defaults.scope,
-            query: query,
-            filters: filters
-          })
-      })
-    )
-  }
-
-  getSearchOptions(defaults: any = {}): Observable<SearchOptions> {
-    return Observable.combineLatest(
-      this.getCurrentView(),
-      this.getCurrentScope(),
-      this.getCurrentQuery(),
-      this.getCurrentFilters(),
-      (view, scope, query, filters) => {
-        return Object.assign(new SearchOptions(),
-          defaults,
-          {
-            view: view,
-            scope: scope || defaults.scope,
-            query: query,
-            filters: filters
-          })
-      }
-    )
-  }
-
+  /**
+   * Requests the active filter values set for a given filter
+   * @param {SearchFilterConfig} filterConfig The configuration for which the filters are active
+   * @returns {Observable<string[]>} Emits the active filters for the given filter configuration
+   */
   getSelectedValuesForFilter(filterConfig: SearchFilterConfig): Observable<string[]> {
-    return this.routeService.getQueryParameterValues(filterConfig.paramName);
+    const values$ = this.routeService.getQueryParameterValues(filterConfig.paramName);
+    const prefixValues$ = this.routeService.getQueryParamsWithPrefix(filterConfig.paramName + '.').map((params: Params) => [].concat(...Object.values(params)));
+    return Observable.combineLatest(values$, prefixValues$, (values, prefixValues) => {
+      if (isNotEmpty(values)) {
+        return values;
+      }
+      return prefixValues;
+    })
   }
 
+  /**
+   * Checks if the state of a given filter is currently collapsed or not
+   * @param {string} filterName The filtername for which the collapsed state is checked
+   * @returns {Observable<boolean>} Emits the current collapsed state of the given filter, if it's unavailable, return false
+   */
   isCollapsed(filterName: string): Observable<boolean> {
     return this.store.select(filterByNameSelector(filterName))
       .map((object: SearchFilterState) => {
@@ -134,6 +88,11 @@ export class SearchFilterService {
       });
   }
 
+  /**
+   * Request the current page of a given filter
+   * @param {string} filterName The filtername 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> {
     return this.store.select(filterByNameSelector(filterName))
       .map((object: SearchFilterState) => {
@@ -145,34 +104,65 @@ export class SearchFilterService {
       });
   }
 
+  /**
+   * Dispatches a collapse action to the store for a given filter
+   * @param {string} filterName The filter for which the action is dispatched
+   */
   public collapse(filterName: string): void {
     this.store.dispatch(new SearchFilterCollapseAction(filterName));
   }
 
+  /**
+   * Dispatches an expand action to the store for a given filter
+   * @param {string} filterName The filter for which the action is dispatched
+   */
   public expand(filterName: string): void {
     this.store.dispatch(new SearchFilterExpandAction(filterName));
   }
 
+  /**
+   * Dispatches a toggle action to the store for a given filter
+   * @param {string} filterName The filter for which the action is dispatched
+   */
   public toggle(filterName: string): void {
     this.store.dispatch(new SearchFilterToggleAction(filterName));
   }
 
+  /**
+   * Dispatches an initial collapse action to the store for a given filter
+   * @param {string} filterName 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));
   }
 
+  /**
+   * Dispatches a decrement action to the store for a given filter
+   * @param {string} filterName The filter for which the action is dispatched
+   */
   public decrementPage(filterName: string): void {
     this.store.dispatch(new SearchFilterDecrementPageAction(filterName));
   }
 
+  /**
+   * Dispatches an increment page action to the store for a given filter
+   * @param {string} filterName The filter for which the action is dispatched
+   */
   public incrementPage(filterName: string): void {
     this.store.dispatch(new SearchFilterIncrementPageAction(filterName));
   }
-
+  /**
+   * Dispatches a reset page action to the store for a given filter
+   * @param {string} filterName The filter for which the action is dispatched
+   */
   public resetPage(filterName: string): void {
     this.store.dispatch(new SearchFilterResetPageAction(filterName));
   }
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
new file mode 100644
index 0000000000..812f543716
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.html
@@ -0,0 +1,43 @@
+<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 *ngFor="let page of (filterValues$ | async)?.payload">
+          <div [@facetLoad]="animationState">
+            <ng-container *ngFor="let value of page.page; let i=index">
+                <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>
+          </div>
+        </ng-container>
+        <div class="clearfix toggle-more-filters">
+            <a class="float-left" *ngIf="!(isLastPage$ | async)"
+               (click)="showMore()">{{"search.filters.filter.show-more"
+                | translate}}</a>
+            <a class="float-right" *ngIf="(currentPage | async) > 1"
+               (click)="showFirstPageOnly()">{{"search.filters.filter.show-less"
+                | translate}}</a>
+        </div>
+    </div>
+    <ds-input-suggestions [suggestions]="(filterSearchResults | async)"
+                          [placeholder]="'search.filters.filter.' + filterConfig.name + '.placeholder'| translate"
+                          [action]="getCurrentUrl()"
+                          [name]="filterConfig.paramName"
+                          [(ngModel)]="filter"
+                          (submitSuggestion)="onSubmit($event)"
+                          (clickSuggestion)="onClick($event)"
+                          (findSuggestions)="findSuggestions($event)"
+                          ngDefaultControl
+    ></ds-input-suggestions>
+</div>
diff --git a/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.scss b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.scss
new file mode 100644
index 0000000000..9ec0f61541
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.scss
@@ -0,0 +1,23 @@
+@import '../../../../../styles/variables.scss';
+@import '../../../../../styles/mixins.scss';
+
+.filters {
+    a {
+        color: $body-color;
+        &:hover, &focus {
+            text-decoration: none;
+        }
+        span.badge {
+            vertical-align: text-top;
+        }
+    }
+    .toggle-more-filters a {
+        color: $link-color;
+        text-decoration: underline;
+        cursor: pointer;
+    }
+}
+::ng-deep em {
+    font-weight: bold;
+    font-style: normal;
+}
diff --git a/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.ts
new file mode 100644
index 0000000000..b048a9ccd0
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-hierarchy-filter/search-hierarchy-filter.component.ts
@@ -0,0 +1,21 @@
+import { Component, OnInit } from '@angular/core';
+import { FilterType } from '../../../search-service/filter-type.model';
+import { renderFacetFor } from '../search-filter-type-decorator';
+import {
+  facetLoad,
+  SearchFacetFilterComponent
+} from '../search-facet-filter/search-facet-filter.component';
+
+@Component({
+  selector: 'ds-search-hierarchy-filter',
+  styleUrls: ['./search-hierarchy-filter.component.scss'],
+  templateUrl: './search-hierarchy-filter.component.html',
+  animations: [facetLoad]
+})
+
+/**
+ * Component that represents a hierarchy facet for a specific filter configuration
+ */
+@renderFacetFor(FilterType.hierarchy)
+export class SearchHierarchyFilterComponent extends SearchFacetFilterComponent implements OnInit {
+}
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
new file mode 100644
index 0000000000..352c1710c0
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.html
@@ -0,0 +1,40 @@
+<div>
+    <div class="filters py-2">
+        <form #form="ngForm" (ngSubmit)="onSubmit()" class="add-filter row"
+              [action]="getCurrentUrl()">
+            <div class="col-6">
+                <input type="text" [(ngModel)]="range[0]" [name]="filterConfig.paramName + '.min'"
+                       class="form-control" (blur)="onSubmit()"
+                       aria-label="Mininum value"
+                       [placeholder]="'search.filters.filter.' + filterConfig.name + '.min.placeholder'| translate"/>
+            </div>
+            <div class="col-6">
+                <input type="text" [(ngModel)]="range[1]" [name]="filterConfig.paramName + '.max'"
+                       class="form-control" (blur)="onSubmit()"
+                       aria-label="Maximum value"
+                       [placeholder]="'search.filters.filter.' + filterConfig.name + '.max.placeholder'| translate"/>
+            </div>
+            <input type="submit" class="d-none"/>
+        </form>
+
+        <ng-container *ngIf="shouldShowSlider()">
+            <nouislider [connect]="true" [min]="min" [max]="max" [step]="1"
+                        [(ngModel)]="range" (change)="onSubmit()" ngDefaultControl></nouislider>
+
+        </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">
+                <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>
+    </div>
+</div>
diff --git a/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.scss b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.scss
new file mode 100644
index 0000000000..c45302b162
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.scss
@@ -0,0 +1,42 @@
+@import '../../../../../styles/variables.scss';
+@import '../../../../../styles/mixins.scss';
+
+
+.filters {
+     a {
+         color: $link-color;
+         &:hover {
+             text-decoration: underline;
+             color: $link-hover-color;
+
+         }
+         span.badge {
+             vertical-align: text-top;
+         }
+     }
+     .toggle-more-filters a {
+         color: $link-color;
+         text-decoration: underline;
+         cursor: pointer;
+     }
+ }
+
+$slider-handle-width: 18px;
+::ng-deep
+{
+    html:not([dir=rtl]) .noUi-horizontal .noUi-handle {
+        right: -$slider-handle-width/2;
+    }
+    .noUi-horizontal .noUi-handle {
+        width: $slider-handle-width;
+        &:before {
+            left: ($slider-handle-width - 2)/2 - 2;
+        }
+        &:after {
+            left: ($slider-handle-width - 2)/2 + 2;
+        }
+        &:focus {
+            outline: none;
+        }
+    }
+}
\ No newline at end of file
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
new file mode 100644
index 0000000000..4e555459d6
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.spec.ts
@@ -0,0 +1,138 @@
+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 { FILTER_CONFIG, SearchFilterService } from '../search-filter.service';
+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 { Observable } from 'rxjs/Observable';
+import { SearchService } from '../../../search-service/search.service';
+import { SearchServiceStub } from '../../../../shared/testing/search-service-stub';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { PaginatedList } from '../../../../core/data/paginated-list';
+import { RouterStub } from '../../../../shared/testing/router-stub';
+import { Router } from '@angular/router';
+import { PageInfo } from '../../../../core/shared/page-info.model';
+import { SearchRangeFilterComponent } from './search-range-filter.component';
+import { RouteService } from '../../../../shared/services/route.service';
+import { RemoteDataBuildService } from '../../../../core/cache/builders/remote-data-build.service';
+import { SearchConfigurationService } from '../../../search-service/search-configuration.service';
+
+describe('SearchRangeFilterComponent', () => {
+  let comp: SearchRangeFilterComponent;
+  let fixture: ComponentFixture<SearchRangeFilterComponent>;
+  const minSuffix = '.min';
+  const maxSuffix = '.max';
+  const dateFormats = ['YYYY', 'YYYY-MM', 'YYYY-MM-DD'];
+  const filterName1 = 'test name';
+  const value1 = '2000 - 2012';
+  const value2 = '1992 - 2000';
+  const value3 = '1990 - 1992';
+  const mockFilterConfig: SearchFilterConfig = Object.assign(new SearchFilterConfig(), {
+    name: filterName1,
+    type: FilterType.range,
+    hasFacets: false,
+    isOpenByDefault: false,
+    pageSize: 2,
+    minValue: 200,
+    maxValue: 3000,
+  });
+  const values: FacetValue[] = [
+    {
+      value: value1,
+      count: 52,
+      search: ''
+    }, {
+      value: value2,
+      count: 20,
+      search: ''
+    }, {
+      value: value3,
+      count: 5,
+      search: ''
+    }
+  ];
+
+  const searchLink = '/search';
+  const selectedValues = Observable.of([value1]);
+  let filterService;
+  let searchService;
+  let router;
+  const page = Observable.of(0);
+
+  const mockValues = Observable.of(new RemoteData(false, false, true, null, new PaginatedList(new PageInfo(), values)));
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot(), NoopAnimationsModule, FormsModule],
+      declarations: [SearchRangeFilterComponent],
+      providers: [
+        { provide: SearchService, useValue: new SearchServiceStub(searchLink) },
+        { provide: Router, useValue: new RouterStub() },
+        { provide: FILTER_CONFIG, useValue: mockFilterConfig },
+        { provide: RemoteDataBuildService, useValue: {aggregate: () => Observable.of({})} },
+        { provide: RouteService, useValue: {getQueryParameterValue: () => Observable.of({})} },
+        { provide: SearchConfigurationService, useValue: {
+            searchOptions: Observable.of({}) }
+        },
+        {
+          provide: SearchFilterService, useValue: {
+            getSelectedValuesForFilter: () => selectedValues,
+            isFilterActiveWithValue: (paramName: string, filterValue: string) => true,
+            getPage: (paramName: string) => page,
+            /* tslint:disable:no-empty */
+            incrementPage: (filterName: string) => {
+            },
+            resetPage: (filterName: string) => {
+            }
+            /* tslint:enable:no-empty */
+          }
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).overrideComponent(SearchRangeFilterComponent, {
+      set: { changeDetection: ChangeDetectionStrategy.Default }
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SearchRangeFilterComponent);
+    comp = fixture.componentInstance; // SearchPageComponent test instance
+    filterService = (comp as any).filterService;
+    searchService = (comp as any).searchService;
+    spyOn(searchService, 'getFacetValuesFor').and.returnValue(mockValues);
+    router = (comp as any).router;
+    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' };
+    beforeEach(() => {
+      comp.range = [1900, 1950];
+      spyOn(comp, 'getSearchLink').and.returnValue(searchUrl);
+      comp.onSubmit();
+    });
+
+    it('should call navigate on the router with the right searchlink and parameters', () => {
+      expect(router.navigate).toHaveBeenCalledWith([searchUrl], {
+        queryParams: {
+          [mockFilterConfig.paramName + minSuffix]: [1900],
+          [mockFilterConfig.paramName + maxSuffix]: [1950]
+        },
+        queryParamsHandling: 'merge'
+      });
+    });
+  });
+});
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
new file mode 100644
index 0000000000..61e07b9b53
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-range-filter/search-range-filter.component.ts
@@ -0,0 +1,148 @@
+import { isPlatformBrowser } from '@angular/common';
+import { Component, Inject, OnDestroy, OnInit, PLATFORM_ID } from '@angular/core';
+import { RemoteDataBuildService } from '../../../../core/cache/builders/remote-data-build.service';
+import { FilterType } from '../../../search-service/filter-type.model';
+import { renderFacetFor } from '../search-filter-type-decorator';
+import {
+  facetLoad,
+  SearchFacetFilterComponent
+} from '../search-facet-filter/search-facet-filter.component';
+import { SearchFilterConfig } from '../../../search-service/search-filter-config.model';
+import { FILTER_CONFIG, SearchFilterService } from '../search-filter.service';
+import { SearchService } from '../../../search-service/search.service';
+import { Router } from '@angular/router';
+import * as moment from 'moment';
+import { Observable } from 'rxjs/Observable';
+import { RouteService } from '../../../../shared/services/route.service';
+import { hasValue } from '../../../../shared/empty.util';
+import { Subscription } from 'rxjs/Subscription';
+import { SearchConfigurationService } from '../../../search-service/search-configuration.service';
+
+/**
+ * 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.
+ */
+const minSuffix = '.min';
+const maxSuffix = '.max';
+const dateFormats = ['YYYY', 'YYYY-MM', 'YYYY-MM-DD'];
+const rangeDelimiter = '-';
+
+@Component({
+  selector: 'ds-search-range-filter',
+  styleUrls: ['./search-range-filter.component.scss'],
+  templateUrl: './search-range-filter.component.html',
+  animations: [facetLoad]
+})
+
+/**
+ * Component that represents a range facet for a specific filter configuration
+ */
+@renderFacetFor(FilterType.range)
+export class SearchRangeFilterComponent extends SearchFacetFilterComponent implements OnInit, OnDestroy {
+  /**
+   * Fallback minimum for the range
+   */
+  min = 1950;
+
+  /**
+   * Fallback maximum for the range
+   */
+  max = 2018;
+
+  /**
+   * The current range of the filter
+   */
+  range;
+
+  /**
+   * Subscription to unsubscribe from
+   */
+  sub: Subscription;
+
+  constructor(protected searchService: SearchService,
+              protected filterService: SearchFilterService,
+              protected searchConfigService: SearchConfigurationService,
+              protected router: Router,
+              protected rdbs: RemoteDataBuildService,
+              @Inject(FILTER_CONFIG) public filterConfig: SearchFilterConfig,
+              @Inject(PLATFORM_ID) private platformId: any,
+              private route: RouteService) {
+    super(searchService, filterService, searchConfigService, rdbs, router, filterConfig);
+
+  }
+
+  /**
+   * Initialize with the min and max values as configured in the filter configuration
+   * Set the initial values of the range
+   */
+  ngOnInit(): void {
+    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).startWith(undefined);
+    const iniMax = this.route.getQueryParameterValue(this.filterConfig.paramName + maxSuffix).startWith(undefined);
+    this.sub = Observable.combineLatest(iniMin, iniMax, (min, max) => {
+      const minimum = hasValue(min) ? min : this.min;
+      const maximum = hasValue(max) ? max : this.max;
+      return [minimum, maximum]
+    }).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 Observable.of(
+      {
+        [this.filterConfig.paramName + minSuffix]: [min],
+        [this.filterConfig.paramName + maxSuffix]: [max],
+        page: 1
+      });
+  }
+
+  /**
+   * Submits new custom range values to the range filter from the widget
+   */
+  onSubmit() {
+    const newMin = this.range[0] !== this.min ? [this.range[0]] : null;
+    const newMax = this.range[1] !== this.max ? [this.range[1]] : null;
+    this.router.navigate([this.getSearchLink()], {
+      queryParams:
+        {
+          [this.filterConfig.paramName + minSuffix]: newMin,
+          [this.filterConfig.paramName + maxSuffix]: newMax
+        },
+      queryParamsHandling: 'merge'
+    });
+    this.filter = '';
+  }
+
+  /**
+   * TODO when upgrading nouislider, verify that this check is still needed.
+   * Prevents AoT bug
+   * @returns {boolean} True if the platformId is a platform browser
+   */
+  shouldShowSlider(): boolean {
+    return isPlatformBrowser(this.platformId);
+  }
+
+  /**
+   * Unsubscribe from all subscriptions
+   */
+  ngOnDestroy() {
+    super.ngOnDestroy();
+    if (hasValue(this.sub)) {
+      this.sub.unsubscribe();
+    }
+  }
+
+  out(call) {
+    console.log(call);
+  }
+}
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
new file mode 100644
index 0000000000..fcc2393b93
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.html
@@ -0,0 +1,45 @@
+<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">
+          <div [@facetLoad]="animationState">
+            <ng-container *ngFor="let page of filterValuesRD?.payload">
+              <ng-container *ngFor="let value of page.page; let i=index">
+                <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>
+            </ng-container>
+          </div>
+        </ng-container>
+        <div class="clearfix toggle-more-filters">
+            <a class="float-left" *ngIf="!(isLastPage$ | async)"
+               (click)="showMore()">{{"search.filters.filter.show-more"
+                | translate}}</a>
+            <a class="float-right" *ngIf="(currentPage | async) > 1"
+               (click)="showFirstPageOnly()">{{"search.filters.filter.show-less"
+                | translate}}</a>
+        </div>
+    </div>
+    <ds-input-suggestions [suggestions]="(filterSearchResults | async)"
+                          [placeholder]="'search.filters.filter.' + filterConfig.name + '.placeholder'| translate"
+                          [action]="getCurrentUrl()"
+                          [name]="filterConfig.paramName"
+                          [(ngModel)]="filter"
+                          (submitSuggestion)="onSubmit($event)"
+                          (clickSuggestion)="onClick($event)"
+                          (findSuggestions)="findSuggestions($event)"
+                          ngDefaultControl
+    ></ds-input-suggestions>
+</div>
diff --git a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.scss b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.scss
similarity index 66%
rename from src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.scss
rename to src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.scss
index 595b2aefb8..33e354f2d8 100644
--- a/src/app/+search-page/search-filters/search-filter/search-facet-filter/search-facet-filter.component.scss
+++ b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.scss
@@ -2,17 +2,22 @@
 @import '../../../../../styles/mixins.scss';
 
 .filters {
-    margin-top: $spacer/2;
-    margin-bottom: $spacer/2;
     a {
         color: $body-color;
-        &:hover {
+        &:hover, &focus {
           text-decoration: none;
         }
+        span.badge {
+            vertical-align: text-top;
+        }
     }
     .toggle-more-filters a {
         color: $link-color;
         text-decoration: underline;
         cursor: pointer;
     }
-}
\ No newline at end of file
+}
+::ng-deep em {
+    font-weight: bold;
+    font-style: normal;
+}
diff --git a/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.ts b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.ts
new file mode 100644
index 0000000000..9e603184e8
--- /dev/null
+++ b/src/app/+search-page/search-filters/search-filter/search-text-filter/search-text-filter.component.ts
@@ -0,0 +1,29 @@
+import { animate, state, style, transition, trigger } from '@angular/animations';
+import { Component, HostBinding, OnInit } from '@angular/core';
+import { Observable } from 'rxjs/Observable';
+import { FilterType } from '../../../search-service/filter-type.model';
+import {
+  facetLoad,
+  SearchFacetFilterComponent
+} from '../search-facet-filter/search-facet-filter.component';
+import { renderFacetFor } from '../search-filter-type-decorator';
+
+/**
+ * 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.
+ */
+
+@Component({
+  selector: 'ds-search-text-filter',
+  styleUrls: ['./search-text-filter.component.scss'],
+  templateUrl: './search-text-filter.component.html',
+  animations: [facetLoad]
+})
+
+/**
+ * Component that represents a text facet for a specific filter configuration
+ */
+@renderFacetFor(FilterType.text)
+export class SearchTextFilterComponent extends SearchFacetFilterComponent implements OnInit {
+}
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 566450b7f5..0522c1fba0 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">
-        <ds-search-filter class="d-block mb-3 p-3" [filter]="filter"></ds-search-filter>
+    <div *ngFor="let filter of (filters | async)?.payload">
+        <ds-search-filter *ngIf="isActive(filter) | async" 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.spec.ts b/src/app/+search-page/search-filters/search-filters.component.spec.ts
index 64c2ea5332..7f0d4ad748 100644
--- a/src/app/+search-page/search-filters/search-filters.component.spec.ts
+++ b/src/app/+search-page/search-filters/search-filters.component.spec.ts
@@ -8,6 +8,7 @@ import { SearchFilterService } from './search-filter/search-filter.service';
 import { SearchFiltersComponent } from './search-filters.component';
 import { SearchService } from '../search-service/search.service';
 import { Observable } from 'rxjs/Observable';
+import { SearchConfigurationService } from '../search-service/search-configuration.service';
 
 describe('SearchFiltersComponent', () => {
   let comp: SearchFiltersComponent;
@@ -23,8 +24,14 @@ describe('SearchFiltersComponent', () => {
     }
     /* tslint:enable:no-empty */
   };
-  const searchFilterServiceStub = jasmine.createSpyObj('SearchFilterService', {
-    getCurrentFilters: Observable.of({})
+
+  const searchFiltersStub = {
+    getSelectedValuesForFilter: (filter) =>
+      []
+  };
+
+  const searchConfigServiceStub = jasmine.createSpyObj('SearchConfigurationService', {
+    getCurrentFrontendFilters: Observable.of({})
   });
 
   beforeEach(async(() => {
@@ -33,7 +40,8 @@ describe('SearchFiltersComponent', () => {
       declarations: [SearchFiltersComponent],
       providers: [
         { provide: SearchService, useValue: searchServiceStub },
-        { provide: SearchFilterService, useValue: searchFilterServiceStub },
+        { provide: SearchConfigurationService, useValue: searchConfigServiceStub },
+        { provide: SearchFilterService, useValue: searchFiltersStub },
 
       ],
       schemas: [NO_ERRORS_SCHEMA]
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 517b2e1e59..684f4d94fe 100644
--- a/src/app/+search-page/search-filters/search-filters.component.ts
+++ b/src/app/+search-page/search-filters/search-filters.component.ts
@@ -3,29 +3,74 @@ import { SearchService } from '../search-service/search.service';
 import { RemoteData } from '../../core/data/remote-data';
 import { SearchFilterConfig } from '../search-service/search-filter-config.model';
 import { Observable } from 'rxjs/Observable';
+import { SearchConfigurationService } from '../search-service/search-configuration.service';
+import { isNotEmpty } from '../../shared/empty.util';
 import { SearchFilterService } from './search-filter/search-filter.service';
 
-/**
- * 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.
- */
-
 @Component({
   selector: 'ds-search-filters',
   styleUrls: ['./search-filters.component.scss'],
   templateUrl: './search-filters.component.html',
 })
 
+/**
+ * This component represents the part of the search sidebar that contains filters.
+ */
 export class SearchFiltersComponent {
+  /**
+   * An observable containing configuration about which filters are shown and how they are shown
+   */
   filters: Observable<RemoteData<SearchFilterConfig[]>>;
+
+  /**
+   * List of all filters that are currently active with their value set to null.
+   * Used to reset all filters at once
+   */
   clearParams;
-  constructor(private searchService: SearchService, private filterService: SearchFilterService) {
-    this.filters = searchService.getConfig();
-    this.clearParams = filterService.getCurrentFilters().map((filters) => {Object.keys(filters).forEach((f) => filters[f] = null); return filters;});
+
+  /**
+   * Initialize instance variables
+   * @param {SearchService} searchService
+   * @param {SearchConfigurationService} searchConfigService
+   * @param {SearchFilterService} filterService
+   */
+  constructor(private searchService: SearchService, private searchConfigService: SearchConfigurationService, private filterService: SearchFilterService) {
+    this.filters = searchService.getConfig().first((RD) => !RD.isLoading);
+    this.clearParams = searchConfigService.getCurrentFrontendFilters().map((filters) => {
+      Object.keys(filters).forEach((f) => filters[f] = null);
+      return filters;
+    });
   }
 
+  /**
+   * @returns {string} The base path to the search page
+   */
   getSearchLink() {
     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(filter: SearchFilterConfig): Observable<boolean> {
+    // console.log(filter.name);
+    return this.filterService.getSelectedValuesForFilter(filter)
+      .flatMap((isActive) => {
+        if (isNotEmpty(isActive)) {
+          return Observable.of(true);
+        } else {
+          return this.searchConfigService.searchOptions
+            .switchMap((options) => {
+                return this.searchService.getFacetValuesFor(filter, 1, options)
+                  .filter((RD) => !RD.isLoading)
+                  .map((valuesRD) => {
+                    return valuesRD.payload.totalElements > 0
+                  })
+              }
+            )
+        }
+      }).startWith(true);
+  }
 }
diff --git a/src/app/+search-page/search-labels/search-labels.component.html b/src/app/+search-page/search-labels/search-labels.component.html
new file mode 100644
index 0000000000..61a5618dad
--- /dev/null
+++ b/src/app/+search-page/search-labels/search-labels.component.html
@@ -0,0 +1,13 @@
+<div class="row mb-3 mb-md-1">
+    <div class="labels col-sm-9 offset-sm-3">
+        <ng-container *ngFor="let key of ((appliedFilters | async) | dsObjectKeys)"><!--Do not remove this to prevent uneven spacing
+        --><a *ngFor="let values of (appliedFilters | async)[key]"
+              class="badge badge-primary mr-1 mb-1"
+              [routerLink]="getSearchLink()"
+              [queryParams]="(getRemoveParams(key, values) | async)" queryParamsHandling="merge">
+            {{('search.filters.applied.' + key) | translate}}: {{values}}
+            <span> ×</span>
+        </a><!--Do not remove this to prevent uneven spacing
+        --></ng-container>
+    </div>
+</div>
diff --git a/src/app/+search-page/search-labels/search-labels.component.scss b/src/app/+search-page/search-labels/search-labels.component.scss
new file mode 100644
index 0000000000..c48cd57304
--- /dev/null
+++ b/src/app/+search-page/search-labels/search-labels.component.scss
@@ -0,0 +1,3 @@
+:host {
+    line-height: 1;
+}
\ No newline at end of file
diff --git a/src/app/+search-page/search-labels/search-labels.component.spec.ts b/src/app/+search-page/search-labels/search-labels.component.spec.ts
new file mode 100644
index 0000000000..bf512ed5db
--- /dev/null
+++ b/src/app/+search-page/search-labels/search-labels.component.spec.ts
@@ -0,0 +1,68 @@
+import { SearchLabelsComponent } from './search-labels.component';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { TranslateModule } from '@ngx-translate/core';
+import { SearchService } from '../search-service/search.service';
+import { ChangeDetectionStrategy, NO_ERRORS_SCHEMA } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { SearchServiceStub } from '../../shared/testing/search-service-stub';
+import { Observable } from 'rxjs/Observable';
+import { Params } from '@angular/router';
+import { ObjectKeysPipe } from '../../shared/utils/object-keys-pipe';
+import { SearchConfigurationService } from '../search-service/search-configuration.service';
+
+describe('SearchLabelsComponent', () => {
+  let comp: SearchLabelsComponent;
+  let fixture: ComponentFixture<SearchLabelsComponent>;
+
+  const searchLink = '/search';
+  let searchService;
+
+  const field1 = 'author';
+  const field2 = 'subject';
+  const value1 = 'TestAuthor';
+  const value2 = 'TestSubject';
+  const filter1 = [field1, value1];
+  const filter2 = [field2, value2];
+  const mockFilters = [
+    filter1,
+    filter2
+  ];
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot(), NoopAnimationsModule, FormsModule],
+      declarations: [SearchLabelsComponent, ObjectKeysPipe],
+      providers: [
+        { provide: SearchService, useValue: new SearchServiceStub(searchLink) },
+        { provide: SearchConfigurationService, useValue: {getCurrentFrontendFilters : () =>  Observable.of({})} }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).overrideComponent(SearchLabelsComponent, {
+      set: { changeDetection: ChangeDetectionStrategy.Default }
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SearchLabelsComponent);
+    comp = fixture.componentInstance;
+    searchService = (comp as any).searchService;
+    (comp as any).appliedFilters = Observable.of(mockFilters);
+    fixture.detectChanges();
+  });
+
+  describe('when getRemoveParams is called', () => {
+    let obs: Observable<Params>;
+
+    beforeEach(() => {
+      obs = comp.getRemoveParams(filter1[0], filter1[1]);
+    });
+
+    it('should return all params but the provided filter', () => {
+      obs.subscribe((params) => {
+        // Should contain only filter2 and page: length == 2
+        expect(Object.keys(params).length).toBe(2);
+      });
+    })
+  });
+});
diff --git a/src/app/+search-page/search-labels/search-labels.component.ts b/src/app/+search-page/search-labels/search-labels.component.ts
new file mode 100644
index 0000000000..61482f8d8a
--- /dev/null
+++ b/src/app/+search-page/search-labels/search-labels.component.ts
@@ -0,0 +1,56 @@
+import { Component } from '@angular/core';
+import { SearchService } from '../search-service/search.service';
+import { Observable } from 'rxjs/Observable';
+import { Params } from '@angular/router';
+import { map } from 'rxjs/operators';
+import { hasValue, isNotEmpty } from '../../shared/empty.util';
+import { SearchConfigurationService } from '../search-service/search-configuration.service';
+
+@Component({
+  selector: 'ds-search-labels',
+  styleUrls: ['./search-labels.component.scss'],
+  templateUrl: './search-labels.component.html',
+})
+
+/**
+ * Component that represents the labels containing the currently active filters
+ */
+export class SearchLabelsComponent {
+  /**
+   * Emits the currently active filters
+   */
+  appliedFilters: Observable<Params>;
+
+  /**
+   * Initialize the instance variable
+   */
+  constructor(private searchService: SearchService, private searchConfigService: SearchConfigurationService) {
+    this.appliedFilters = this.searchConfigService.getCurrentFrontendFilters();
+  }
+
+  /**
+   * Calculates the parameters that should change if a given value for the given filter would be removed from the active filters
+   * @param {string} filterField The filter field parameter name from which the value should be removed
+   * @param {string} filterValue The value that is removed for this given filter field
+   * @returns {Observable<Params>} The changed filter parameters
+   */
+  getRemoveParams(filterField: string, filterValue: string): Observable<Params> {
+    return this.appliedFilters.pipe(
+      map((filters) => {
+        const field: string = Object.keys(filters).find((f) => f === filterField);
+        const newValues = hasValue(filters[field]) ? filters[field].filter((v) => v !== filterValue) : null;
+        return {
+          [field]: isNotEmpty(newValues) ? newValues : null,
+          page: 1
+        };
+      })
+    )
+  }
+
+  /**
+   * @returns {string} The base path to the search page
+   */
+  getSearchLink() {
+    return this.searchService.getSearchLink();
+  }
+}
diff --git a/src/app/+search-page/search-options.model.spec.ts b/src/app/+search-page/search-options.model.spec.ts
new file mode 100644
index 0000000000..fc4c9278d8
--- /dev/null
+++ b/src/app/+search-page/search-options.model.spec.ts
@@ -0,0 +1,32 @@
+import 'rxjs/add/observable/of';
+import { PaginatedSearchOptions } from './paginated-search-options.model';
+import { SearchOptions } from './search-options.model';
+
+describe('SearchOptions', () => {
+  let options: PaginatedSearchOptions;
+  const filters = { 'f.test': ['value'], 'f.example': ['another value', 'second value'] };
+  const query = 'search query';
+  const scope = '0fde1ecb-82cc-425a-b600-ac3576d76b47';
+  const baseUrl = 'www.rest.com';
+  beforeEach(() => {
+    options = new SearchOptions();
+    options.filters = filters;
+    options.query = query;
+    options.scope = scope;
+  });
+
+  describe('when toRestUrl is called', () => {
+
+    it('should generate a string with all parameters that are present', () => {
+      const outcome = options.toRestUrl(baseUrl);
+      expect(outcome).toEqual('www.rest.com?' +
+        'query=search query&' +
+        'scope=0fde1ecb-82cc-425a-b600-ac3576d76b47&' +
+        'f.test=value,query&' +
+        'f.example=another value,query&' +
+        'f.example=second value,query'
+      );
+    });
+
+  });
+});
diff --git a/src/app/+search-page/search-options.model.ts b/src/app/+search-page/search-options.model.ts
index 4b4987a096..6ac606f5cc 100644
--- a/src/app/+search-page/search-options.model.ts
+++ b/src/app/+search-page/search-options.model.ts
@@ -2,17 +2,20 @@ import { isNotEmpty } from '../shared/empty.util';
 import { URLCombiner } from '../core/url-combiner/url-combiner';
 import 'core-js/library/fn/object/entries';
 
-export enum ViewMode {
-  List = 'list',
-  Grid = 'grid'
-}
-
+/**
+ * This model class represents all parameters needed to request information about a certain search request
+ */
 export class SearchOptions {
-  view?: ViewMode = ViewMode.List;
   scope?: string;
   query?: string;
   filters?: any;
 
+  /**
+   * Method to generate the URL that can be used request information about a search request
+   * @param {string} url The URL to the REST endpoint
+   * @param {string[]} args A list of query arguments that should be included in the URL
+   * @returns {string} URL with all search options and passed arguments as query parameters
+   */
   toRestUrl(url: string, args: string[] = []): string {
 
     if (isNotEmpty(this.query)) {
@@ -24,7 +27,7 @@ export class SearchOptions {
     }
     if (isNotEmpty(this.filters)) {
       Object.entries(this.filters).forEach(([key, values]) => {
-        values.forEach((value) => args.push(`${key}=${value},equals`));
+        values.forEach((value) => args.push(`${key}=${value},query`));
       });
     }
     if (isNotEmpty(args)) {
diff --git a/src/app/+search-page/search-page.component.html b/src/app/+search-page/search-page.component.html
index e8dee94139..653f5e8cd4 100644
--- a/src/app/+search-page/search-page.component.html
+++ b/src/app/+search-page/search-page.component.html
@@ -1,39 +1,40 @@
 <div class="container">
-  <div class="search-page row">
+    <div class="search-page row">
         <ds-search-sidebar *ngIf="!(isXsOrSm$ | async)" class="col-3 sidebar-md-sticky"
                            id="search-sidebar"
-                           [resultCount]="(resultsRD$ | async)?.pageInfo?.totalElements"></ds-search-sidebar>
+                           [resultCount]="(resultsRD$ | async)?.payload.totalElements"></ds-search-sidebar>
         <div class="col-12 col-md-9">
-        <ds-search-form id="search-form"
-                        [query]="(searchOptions$ | async)?.query"
-                        [scope]="(searchOptions$ | async)?.scope"
-                        [currentUrl]="getSearchLink()"
-                        [scopes]="(scopeListRD$ | async)?.payload?.page">
-        </ds-search-form>
-      <div class="row">
-        <div id="search-body"
-             class="row-offcanvas row-offcanvas-left"
-             [@pushInOut]="(isSidebarCollapsed() | async) ? 'collapsed' : 'expanded'">
-          <ds-search-sidebar *ngIf="(isXsOrSm$ | async)" class="col-12"
-                             id="search-sidebar-sm"
-                             [resultCount]="(resultsRD$ | async)?.pageInfo?.totalElements"
-                             (toggleSidebar)="closeSidebar()"
-                             [ngClass]="{'active': !(isSidebarCollapsed() | async)}">
-          </ds-search-sidebar>
-          <div id="search-content" class="col-12">
-            <div class="d-block d-md-none search-controls clearfix">
-              <ds-view-mode-switch></ds-view-mode-switch>
-              <button (click)="openSidebar()" aria-controls="#search-body"
-                      class="btn btn-outline-primary float-right open-sidebar"><i
-                class="fa fa-sliders"></i> {{"search.sidebar.open"
-                | translate}}
-              </button>
+            <ds-search-form id="search-form"
+                            [query]="(searchOptions$ | async)?.query"
+                            [scope]="(searchOptions$ | async)?.scope"
+                            [currentUrl]="getSearchLink()"
+                            [scopes]="(scopeListRD$ | async)">
+            </ds-search-form>
+            <ds-search-labels></ds-search-labels>
+            <div class="row">
+                <div id="search-body"
+                     class="row-offcanvas row-offcanvas-left"
+                     [@pushInOut]="(isSidebarCollapsed() | async) ? 'collapsed' : 'expanded'">
+                    <ds-search-sidebar *ngIf="(isXsOrSm$ | async)" class="col-12"
+                                       id="search-sidebar-sm"
+                                       [resultCount]="(resultsRD$ | async)?.payload.totalElements"
+                                       (toggleSidebar)="closeSidebar()"
+                                       [ngClass]="{'active': !(isSidebarCollapsed() | async)}">
+                    </ds-search-sidebar>
+                    <div id="search-content" class="col-12">
+                        <div class="d-block d-md-none search-controls clearfix">
+                            <ds-view-mode-switch></ds-view-mode-switch>
+                            <button (click)="openSidebar()" aria-controls="#search-body"
+                                    class="btn btn-outline-primary float-right open-sidebar"><i
+                                    class="fa fa-sliders"></i> {{"search.sidebar.open"
+                                | translate}}
+                            </button>
+                        </div>
+                        <ds-search-results [searchResults]="resultsRD$ | async"
+                                           [searchConfig]="searchOptions$ | async"></ds-search-results>
+                    </div>
+                </div>
             </div>
-            <ds-search-results [searchResults]="resultsRD$ | async"
-                               [searchConfig]="searchOptions$ | async" [sortConfig]="sortConfig"></ds-search-results>
-          </div>
         </div>
-      </div>
     </div>
-  </div>
 </div>
diff --git a/src/app/+search-page/search-page.component.spec.ts b/src/app/+search-page/search-page.component.spec.ts
index 96820e8a0b..57b8caaddc 100644
--- a/src/app/+search-page/search-page.component.spec.ts
+++ b/src/app/+search-page/search-page.component.spec.ts
@@ -19,6 +19,8 @@ import { By } from '@angular/platform-browser';
 import { NgbCollapseModule } from '@ng-bootstrap/ng-bootstrap';
 import { SearchSidebarService } from './search-sidebar/search-sidebar.service';
 import { SearchFilterService } from './search-filters/search-filter/search-filter.service';
+import { SearchConfigurationService } from './search-service/search-configuration.service';
+import { RemoteData } from '../core/data/remote-data';
 
 describe('SearchPageComponent', () => {
   let comp: SearchPageComponent;
@@ -35,19 +37,20 @@ describe('SearchPageComponent', () => {
   pagination.currentPage = 1;
   pagination.pageSize = 10;
   const sort: SortOptions = new SortOptions('score', SortDirection.DESC);
-  const mockResults = Observable.of(['test', 'data']);
+  const mockResults = Observable.of(new RemoteData(false, false, true, null,['test', 'data']));
   const searchServiceStub = jasmine.createSpyObj('SearchService', {
     search: mockResults,
-    getSearchLink: '/search'
+    getSearchLink: '/search',
+    getScopes: Observable.of(['test-scope'])
   });
   const queryParam = 'test query';
   const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
   const paginatedSearchOptions = {
-    query: queryParam,
-    scope: scopeParam,
-    pagination,
-    sort
-  };
+      query: queryParam,
+      scope: scopeParam,
+      pagination,
+      sort
+    };
   const activatedRouteStub = {
     queryParams: Observable.of({
       query: queryParam,
@@ -76,11 +79,11 @@ describe('SearchPageComponent', () => {
         },
         {
           provide: HostWindowService, useValue: jasmine.createSpyObj('hostWindowService',
-          {
-            isXs: Observable.of(true),
-            isSm: Observable.of(false),
-            isXsOrSm: Observable.of(true)
-          })
+            {
+              isXs: Observable.of(true),
+              isSm: Observable.of(false),
+              isXsOrSm: Observable.of(true)
+            })
         },
         {
           provide: SearchSidebarService,
@@ -88,16 +91,20 @@ describe('SearchPageComponent', () => {
         },
         {
           provide: SearchFilterService,
-          useValue: jasmine.createSpyObj('SearchFilterService', {
-            getPaginatedSearchOptions: hot('a', {
+          useValue: {}
+        }, {
+          provide: SearchConfigurationService,
+          useValue: {
+            paginatedSearchOptions: hot('a', {
               a: paginatedSearchOptions
-            })
-          })
+            }),
+            getCurrentScope: (a) => Observable.of('test-id')
+          }
         },
       ],
       schemas: [NO_ERRORS_SCHEMA]
     }).overrideComponent(SearchPageComponent, {
-      set: {  changeDetection: ChangeDetectionStrategy.Default  }
+      set: { changeDetection: ChangeDetectionStrategy.Default }
     }).compileComponents();
   }));
 
@@ -171,4 +178,5 @@ describe('SearchPageComponent', () => {
     });
 
   });
-});
+})
+;
diff --git a/src/app/+search-page/search-page.component.ts b/src/app/+search-page/search-page.component.ts
index 63e72960d8..893395719a 100644
--- a/src/app/+search-page/search-page.component.ts
+++ b/src/app/+search-page/search-page.component.ts
@@ -1,11 +1,8 @@
-import { ChangeDetectionStrategy, Component, OnDestroy, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
 import { Observable } from 'rxjs/Observable';
-import { flatMap, } from 'rxjs/operators';
-import { SortDirection, SortOptions } from '../core/cache/models/sort-options.model';
-import { CommunityDataService } from '../core/data/community-data.service';
+import { flatMap, switchMap, } from 'rxjs/operators';
 import { PaginatedList } from '../core/data/paginated-list';
 import { RemoteData } from '../core/data/remote-data';
-import { Community } from '../core/shared/community.model';
 import { DSpaceObject } from '../core/shared/dspace-object.model';
 import { pushInOut } from '../shared/animations/push';
 import { HostWindowService } from '../shared/host-window.service';
@@ -14,6 +11,10 @@ import { SearchFilterService } from './search-filters/search-filter/search-filte
 import { SearchResult } from './search-result.model';
 import { SearchService } from './search-service/search.service';
 import { SearchSidebarService } from './search-sidebar/search-sidebar.service';
+import { Subscription } from 'rxjs/Subscription';
+import { hasValue } from '../shared/empty.util';
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { SearchConfigurationService } from './search-service/search-configuration.service';
 
 /**
  * This component renders a simple item page.
@@ -28,54 +29,99 @@ import { SearchSidebarService } from './search-sidebar/search-sidebar.service';
   changeDetection: ChangeDetectionStrategy.OnPush,
   animations: [pushInOut]
 })
+
+/**
+ * This component represents the whole search page
+ */
 export class SearchPageComponent implements OnInit {
 
-  resultsRD$: Observable<RemoteData<PaginatedList<SearchResult<DSpaceObject>>>>;
+  /**
+   * The current search results
+   */
+  resultsRD$: BehaviorSubject<RemoteData<PaginatedList<SearchResult<DSpaceObject>>>> = new BehaviorSubject(null);
+
+  /**
+   * The current paginated search options
+   */
   searchOptions$: Observable<PaginatedSearchOptions>;
-  sortConfig: SortOptions;
-  scopeListRD$: Observable<RemoteData<PaginatedList<Community>>>;
+
+  /**
+   * The current relevant scopes
+   */
+  scopeListRD$: Observable<DSpaceObject[]>;
+
+  /**
+   * Emits true if were on a small screen
+   */
   isXsOrSm$: Observable<boolean>;
-  pageSize;
-  pageSizeOptions;
-  defaults = {
-    pagination: {
-      id: 'search-results-pagination',
-      pageSize: 10
-    },
-    sort: new SortOptions('score', SortDirection.DESC),
-    query: '',
-    scope: ''
-  };
+
+  /**
+   * Subscription to unsubscribe from
+   */
+  sub: Subscription;
 
   constructor(private service: SearchService,
-              private communityService: CommunityDataService,
               private sidebarService: SearchSidebarService,
               private windowService: HostWindowService,
-              private filterService: SearchFilterService) {
+              private filterService: SearchFilterService,
+              private searchConfigService: SearchConfigurationService) {
     this.isXsOrSm$ = this.windowService.isXsOrSm();
-    this.scopeListRD$ = communityService.findAll();
   }
 
+  /**
+   * Listening to changes in the paginated search options
+   * If something changes, update the search results
+   *
+   * Listen to changes in the scope
+   * If something changes, update the list of scopes for the dropdown
+   */
   ngOnInit(): void {
-    this.searchOptions$ = this.filterService.getPaginatedSearchOptions(this.defaults);
-    this.resultsRD$ = this.searchOptions$.pipe(
-      flatMap((searchOptions) => this.service.search(searchOptions))
+    this.searchOptions$ = this.searchConfigService.paginatedSearchOptions;
+    this.sub = this.searchOptions$
+      .switchMap((options) => this.service.search(options).filter((rd) => !rd.isLoading).first())
+      .subscribe((results) => {
+        this.resultsRD$.next(results);
+      });
+    this.scopeListRD$ = this.searchConfigService.getCurrentScope('').pipe(
+      switchMap((scopeId) => this.service.getScopes(scopeId))
     );
   }
 
+  /**
+   * Set the sidebar to a collapsed state
+   */
   public closeSidebar(): void {
     this.sidebarService.collapse()
   }
 
+  /**
+   * Set the sidebar to an expanded state
+   */
   public openSidebar(): void {
     this.sidebarService.expand();
   }
 
+  /**
+   * Check if the sidebar is collapsed
+   * @returns {Observable<boolean>} emits true if the sidebar is currently collapsed, false if it is expanded
+   */
   public isSidebarCollapsed(): Observable<boolean> {
     return this.sidebarService.isCollapsed;
   }
 
+  /**
+   * @returns {string} The base path to the search page
+   */
   public getSearchLink(): string {
     return this.service.getSearchLink();
   }
+
+  /**
+   * Unsubscribe from the subscription
+   */
+  ngOnDestroy(): void {
+    if (hasValue(this.sub)) {
+      this.sub.unsubscribe();
+    }
+  }
 }
diff --git a/src/app/+search-page/search-page.module.ts b/src/app/+search-page/search-page.module.ts
index 1468fe532e..0c8a4ee306 100644
--- a/src/app/+search-page/search-page.module.ts
+++ b/src/app/+search-page/search-page.module.ts
@@ -21,6 +21,13 @@ import { SearchFiltersComponent } from './search-filters/search-filters.componen
 import { SearchFilterComponent } from './search-filters/search-filter/search-filter.component';
 import { SearchFacetFilterComponent } from './search-filters/search-filter/search-facet-filter/search-facet-filter.component';
 import { SearchFilterService } from './search-filters/search-filter/search-filter.service';
+import { SearchLabelsComponent } from './search-labels/search-labels.component';
+import { SearchRangeFilterComponent } from './search-filters/search-filter/search-range-filter/search-range-filter.component';
+import { SearchTextFilterComponent } from './search-filters/search-filter/search-text-filter/search-text-filter.component';
+import { SearchFacetFilterWrapperComponent } from './search-filters/search-filter/search-facet-filter-wrapper/search-facet-filter-wrapper.component';
+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';
 
 const effects = [
   SearchSidebarEffects
@@ -48,12 +55,20 @@ const effects = [
     CommunitySearchResultListElementComponent,
     SearchFiltersComponent,
     SearchFilterComponent,
-    SearchFacetFilterComponent
+    SearchFacetFilterComponent,
+    SearchLabelsComponent,
+    SearchFacetFilterComponent,
+    SearchFacetFilterWrapperComponent,
+    SearchRangeFilterComponent,
+    SearchTextFilterComponent,
+    SearchHierarchyFilterComponent,
+    SearchBooleanFilterComponent,
   ],
   providers: [
     SearchService,
     SearchSidebarService,
-    SearchFilterService
+    SearchFilterService,
+    SearchConfigurationService
   ],
   entryComponents: [
     ItemSearchResultListElementComponent,
@@ -62,7 +77,16 @@ const effects = [
     ItemSearchResultGridElementComponent,
     CollectionSearchResultGridElementComponent,
     CommunitySearchResultGridElementComponent,
+    SearchFacetFilterComponent,
+    SearchRangeFilterComponent,
+    SearchTextFilterComponent,
+    SearchHierarchyFilterComponent,
+    SearchBooleanFilterComponent,
   ]
 })
+
+/**
+ * This module handles all components and pipes that are necessary for the search page
+ */
 export class SearchPageModule {
 }
diff --git a/src/app/+search-page/search-result.model.ts b/src/app/+search-page/search-result.model.ts
index cc2bd8cd58..00b1c62a99 100644
--- a/src/app/+search-page/search-result.model.ts
+++ b/src/app/+search-page/search-result.model.ts
@@ -2,9 +2,18 @@ import { DSpaceObject } from '../core/shared/dspace-object.model';
 import { Metadatum } from '../core/shared/metadatum.model';
 import { ListableObject } from '../shared/object-collection/shared/listable-object.model';
 
+/**
+ * Represents a search result object of a certain (<T>) DSpaceObject
+ */
 export class SearchResult<T extends DSpaceObject> implements ListableObject {
-
+  /**
+   * The DSpaceObject that was found
+   */
   dspaceObject: T;
+
+  /**
+   * The metadata that was used to find this item, hithighlighted
+   */
   hitHighlights: Metadatum[];
 
 }
diff --git a/src/app/+search-page/search-results/search-results.component.ts b/src/app/+search-page/search-results/search-results.component.ts
index 14ccb5d541..6399243f92 100644
--- a/src/app/+search-page/search-results/search-results.component.ts
+++ b/src/app/+search-page/search-results/search-results.component.ts
@@ -2,16 +2,11 @@ import { Component, Input } from '@angular/core';
 import { RemoteData } from '../../core/data/remote-data';
 import { DSpaceObject } from '../../core/shared/dspace-object.model';
 import { fadeIn, fadeInOut } from '../../shared/animations/fade';
-import { SearchOptions, ViewMode } from '../search-options.model';
-import { SortOptions } from '../../core/cache/models/sort-options.model';
+import { SearchOptions } from '../search-options.model';
 import { SearchResult } from '../search-result.model';
 import { PaginatedList } from '../../core/data/paginated-list';
+import { ViewMode } from '../../core/shared/view-mode.model';
 
-/**
- * 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.
- */
 @Component({
   selector: 'ds-search-results',
   templateUrl: './search-results.component.html',
@@ -20,9 +15,24 @@ import { PaginatedList } from '../../core/data/paginated-list';
     fadeInOut
   ]
 })
+
+/**
+ * Component that represents all results from a search
+ */
 export class SearchResultsComponent {
+  /**
+   * The actual search result objects
+   */
   @Input() searchResults: RemoteData<PaginatedList<SearchResult<DSpaceObject>>>;
+
+  /**
+   * The current configuration of the search
+   */
   @Input() searchConfig: SearchOptions;
-  @Input() sortConfig: SortOptions;
+
+  /**
+   * The current view mode for the search results
+   */
   @Input() viewMode: ViewMode;
+
 }
diff --git a/src/app/+search-page/search-service/facet-value.model.ts b/src/app/+search-page/search-service/facet-value.model.ts
index 06eb50bc6b..a597528d50 100644
--- a/src/app/+search-page/search-service/facet-value.model.ts
+++ b/src/app/+search-page/search-service/facet-value.model.ts
@@ -1,13 +1,25 @@
 
 import { autoserialize, autoserializeAs } from 'cerialize';
 
+/**
+ * Class representing possible values for a certain filter
+ */
 export class FacetValue {
+  /**
+   * The display value of the facet value
+   */
   @autoserializeAs(String, 'label')
   value: string;
 
+  /**
+   * The number of results this facet value would have if selected
+   */
   @autoserialize
   count: number;
 
+  /**
+   * The REST url to add this filter value
+   */
   @autoserialize
   search: string;
 }
diff --git a/src/app/+search-page/search-service/filter-type.model.ts b/src/app/+search-page/search-service/filter-type.model.ts
index 354ca87f98..d9b9629347 100644
--- a/src/app/+search-page/search-service/filter-type.model.ts
+++ b/src/app/+search-page/search-service/filter-type.model.ts
@@ -1,6 +1,24 @@
+/**
+ * Enumeration containing all possible types for filters
+ */
 export enum FilterType {
-  text,
-  date,
-  hierarchical,
-  standard
+  /**
+   * Represents simple text facets
+   */
+  text = 'text',
+
+  /**
+   * Represents date facets
+   */
+  range = 'date',
+
+  /**
+   * Represents hierarchically structured facets
+   */
+  hierarchy = 'hierarchical',
+
+  /**
+   * Represents binary facets
+   */
+  boolean = 'standard'
 }
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
new file mode 100644
index 0000000000..af1b19f06a
--- /dev/null
+++ b/src/app/+search-page/search-service/search-configuration.service.spec.ts
@@ -0,0 +1,133 @@
+import { SearchConfigurationService } from './search-configuration.service';
+import { ActivatedRouteStub } from '../../shared/testing/active-router-stub';
+import { PaginationComponentOptions } from '../../shared/pagination/pagination-component-options.model';
+import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
+import { PaginatedSearchOptions } from '../paginated-search-options.model';
+import { Observable } from 'rxjs/Observable';
+
+describe('SearchConfigurationService', () => {
+  let service: SearchConfigurationService;
+  const value1 = 'random value';
+  const value2 = 'another value';
+  const prefixFilter = {
+    'f.author': ['another value'],
+    'f.date.min': ['2013'],
+    'f.date.max': ['2018']
+  };
+  const defaults = Object.assign(new PaginatedSearchOptions(), {
+    pagination: Object.assign(new PaginationComponentOptions(), { currentPage: 1, pageSize: 20 }),
+    sort: new SortOptions('score', SortDirection.DESC),
+    query: '',
+    scope: ''
+  });
+  const backendFilters = { 'f.author': ['another value'], 'f.date': ['[2013 TO 2018]'] };
+
+  const spy = jasmine.createSpyObj('RouteService', {
+    getQueryParameterValue: Observable.of([value1, value2]),
+    getQueryParamsWithPrefix: Observable.of(prefixFilter)
+  });
+
+  const activatedRoute: any = new ActivatedRouteStub();
+
+  beforeEach(() => {
+    service = new SearchConfigurationService(spy, activatedRoute);
+  });
+
+  describe('when the scope is called', () => {
+    beforeEach(() => {
+      service.getCurrentScope('');
+    });
+    it('should call getQueryParameterValue on the routeService with parameter name \'scope\'', () => {
+      expect((service as any).routeService.getQueryParameterValue).toHaveBeenCalledWith('scope');
+    });
+  });
+
+  describe('when getCurrentQuery is called', () => {
+    beforeEach(() => {
+      service.getCurrentQuery('');
+    });
+    it('should call getQueryParameterValue on the routeService with parameter name \'query\'', () => {
+      expect((service as any).routeService.getQueryParameterValue).toHaveBeenCalledWith('query');
+    });
+  });
+
+  describe('when getCurrentFrontendFilters is called', () => {
+    beforeEach(() => {
+      service.getCurrentFrontendFilters();
+    });
+    it('should call getQueryParamsWithPrefix on the routeService with parameter prefix \'f.\'', () => {
+      expect((service as any).routeService.getQueryParamsWithPrefix).toHaveBeenCalledWith('f.');
+    });
+  });
+
+  describe('when getCurrentFilters is called', () => {
+    let parsedValues$;
+    beforeEach(() => {
+      parsedValues$ = service.getCurrentFilters();
+    });
+    it('should call getQueryParamsWithPrefix on the routeService with parameter prefix \'f.\'', () => {
+      expect((service as any).routeService.getQueryParamsWithPrefix).toHaveBeenCalledWith('f.');
+      parsedValues$.subscribe((values) => {
+        expect(values).toEqual(backendFilters);
+      });
+    });
+  });
+
+  describe('when getCurrentSort is called', () => {
+    beforeEach(() => {
+      service.getCurrentSort({} as any);
+    });
+    it('should call getQueryParameterValue on the routeService with parameter name \'sortDirection\'', () => {
+      expect((service as any).routeService.getQueryParameterValue).toHaveBeenCalledWith('sortDirection');
+    });
+    it('should call getQueryParameterValue on the routeService with parameter name \'sortField\'', () => {
+      expect((service as any).routeService.getQueryParameterValue).toHaveBeenCalledWith('sortField');
+    });
+  });
+  describe('when getCurrentPagination is called', () => {
+    beforeEach(() => {
+      service.getCurrentPagination({ currentPage: 1, pageSize: 10 } as any);
+    });
+    it('should call getQueryParameterValue on the routeService with parameter name \'page\'', () => {
+      expect((service as any).routeService.getQueryParameterValue).toHaveBeenCalledWith('page');
+    });
+    it('should call getQueryParameterValue on the routeService with parameter name \'pageSize\'', () => {
+      expect((service as any).routeService.getQueryParameterValue).toHaveBeenCalledWith('pageSize');
+    });
+  });
+  describe('when subscribeToSearchOptions or subscribeToPaginatedSearchOptions is called', () => {
+    beforeEach(() => {
+      spyOn(service, 'getCurrentPagination').and.callThrough();
+      spyOn(service, 'getCurrentSort').and.callThrough();
+      spyOn(service, 'getCurrentScope').and.callThrough();
+      spyOn(service, 'getCurrentQuery').and.callThrough();
+      spyOn(service, 'getCurrentFilters').and.callThrough();
+    });
+
+    describe('when subscribeToSearchOptions is called', () => {
+      beforeEach(() => {
+        service.subscribeToSearchOptions(defaults)
+      });
+      it('should call all getters it needs, but not call any others', () => {
+        expect(service.getCurrentPagination).not.toHaveBeenCalled();
+        expect(service.getCurrentSort).not.toHaveBeenCalled();
+        expect(service.getCurrentScope).toHaveBeenCalled();
+        expect(service.getCurrentQuery).toHaveBeenCalled();
+        expect(service.getCurrentFilters).toHaveBeenCalled();
+      });
+    });
+
+    describe('when subscribeToPaginatedSearchOptions is called', () => {
+      beforeEach(() => {
+        service.subscribeToPaginatedSearchOptions(defaults);
+      });
+      it('should call all getters it needs', () => {
+        expect(service.getCurrentPagination).toHaveBeenCalled();
+        expect(service.getCurrentSort).toHaveBeenCalled();
+        expect(service.getCurrentScope).toHaveBeenCalled();
+        expect(service.getCurrentQuery).toHaveBeenCalled();
+        expect(service.getCurrentFilters).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
new file mode 100644
index 0000000000..8ad0b684ad
--- /dev/null
+++ b/src/app/+search-page/search-service/search-configuration.service.ts
@@ -0,0 +1,267 @@
+import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
+import { PaginationComponentOptions } from '../../shared/pagination/pagination-component-options.model';
+import { SearchOptions } from '../search-options.model';
+import { Observable } from 'rxjs/Observable';
+import { ActivatedRoute, Params } from '@angular/router';
+import { PaginatedSearchOptions } from '../paginated-search-options.model';
+import { Injectable, OnDestroy } from '@angular/core';
+import { RouteService } from '../../shared/services/route.service';
+import { hasNoValue, isEmpty, isNotEmpty } from '../../shared/empty.util';
+import { RemoteData } from '../../core/data/remote-data';
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { Subscription } from 'rxjs/Subscription';
+
+/**
+ * Service that performs all actions that have to do with the current search configuration
+ */
+@Injectable()
+export class SearchConfigurationService implements OnDestroy {
+  /**
+   * Default pagination settings
+   */
+  private defaultPagination = Object.assign(new PaginationComponentOptions(), {
+    id: 'search-page-configuration',
+    pageSize: 10,
+    currentPage: 1
+  });
+
+  /**
+   * Default sort settings
+   */
+  private defaultSort = new SortOptions('score', SortDirection.DESC);
+
+  /**
+   * Default scope setting
+   */
+  private defaultScope = '';
+
+  /**
+   * Default query setting
+   */
+  private defaultQuery = '';
+
+  /**
+   * Emits the current default values
+   */
+  private _defaults: Observable<RemoteData<PaginatedSearchOptions>>;
+
+  /**
+   * Emits the current search options
+   */
+  public searchOptions: BehaviorSubject<SearchOptions>;
+
+  /**
+   * Emits the current search options including pagination and sort
+   */
+  public paginatedSearchOptions: BehaviorSubject<PaginatedSearchOptions>;
+
+  /**
+   * List of subscriptions to unsubscribe from on destroy
+   */
+  private subs: Subscription[] = new Array();
+
+  /**
+   * Initialize the search options
+   * @param {RouteService} routeService
+   * @param {ActivatedRoute} route
+   */
+  constructor(private routeService: RouteService,
+              private route: ActivatedRoute) {
+    this.defaults.first().subscribe((defRD) => {
+        const defs = defRD.payload;
+        this.paginatedSearchOptions = new BehaviorSubject<SearchOptions>(defs);
+        this.searchOptions = new BehaviorSubject<PaginatedSearchOptions>(defs);
+
+        this.subs.push(this.subscribeToSearchOptions(defs));
+        this.subs.push(this.subscribeToPaginatedSearchOptions(defs));
+      }
+    )
+  }
+
+  /**
+   * @returns {Observable<string>} Emits the current scope's identifier
+   */
+  getCurrentScope(defaultScope: string) {
+    return this.routeService.getQueryParameterValue('scope').map((scope) => {
+      return scope || defaultScope;
+    });
+  }
+
+  /**
+   * @returns {Observable<string>} Emits the current query string
+   */
+  getCurrentQuery(defaultQuery: string) {
+    return this.routeService.getQueryParameterValue('query').map((query) => {
+      return query || defaultQuery;
+    });
+  }
+
+  /**
+   * @returns {Observable<string>} Emits the current pagination settings
+   */
+  getCurrentPagination(defaultPagination: PaginationComponentOptions): Observable<PaginationComponentOptions> {
+    const page$ = this.routeService.getQueryParameterValue('page');
+    const size$ = this.routeService.getQueryParameterValue('pageSize');
+    return Observable.combineLatest(page$, size$, (page, size) => {
+      return Object.assign(new PaginationComponentOptions(), defaultPagination, {
+        currentPage: page || defaultPagination.currentPage,
+        pageSize: size || defaultPagination.pageSize
+      });
+    });
+  }
+
+  /**
+   * @returns {Observable<string>} Emits the current sorting settings
+   */
+  getCurrentSort(defaultSort: SortOptions): Observable<SortOptions> {
+    const sortDirection$ = this.routeService.getQueryParameterValue('sortDirection');
+    const sortField$ = this.routeService.getQueryParameterValue('sortField');
+    return Observable.combineLatest(sortDirection$, sortField$, (sortDirection, sortField) => {
+        // Dirty fix because sometimes the observable value is null somehow
+        sortField = this.route.snapshot.queryParamMap.get('sortField');
+
+        const field = sortField || defaultSort.field;
+        const direction = SortDirection[sortDirection] || defaultSort.direction;
+        return new SortOptions(field, direction)
+      }
+    )
+  }
+
+  /**
+   * @returns {Observable<Params>} Emits the current active filters with their values as they are sent to the backend
+   */
+  getCurrentFilters(): Observable<Params> {
+    return this.routeService.getQueryParamsWithPrefix('f.').map((filterParams) => {
+      if (isNotEmpty(filterParams)) {
+        const params = {};
+        Object.keys(filterParams).forEach((key) => {
+          if (key.endsWith('.min') || key.endsWith('.max')) {
+            const realKey = key.slice(0, -4);
+            if (isEmpty(params[realKey])) {
+              const min = filterParams[realKey + '.min'] ? filterParams[realKey + '.min'][0] : '*';
+              const max = filterParams[realKey + '.max'] ? filterParams[realKey + '.max'][0] : '*';
+              params[realKey] = ['[' + min + ' TO ' + max + ']'];
+            }
+          } else {
+            params[key] = filterParams[key];
+          }
+        });
+        return params;
+      }
+      return filterParams;
+    });
+  }
+
+  /**
+   * @returns {Observable<Params>} Emits the current active filters with their values as they are displayed in the frontend URL
+   */
+  getCurrentFrontendFilters(): Observable<Params> {
+    return this.routeService.getQueryParamsWithPrefix('f.');
+  }
+
+  /**
+   * Sets up a subscription to all necessary parameters to make sure the searchOptions emits a new value every time they update
+   * @param {SearchOptions} defaults Default values for when no parameters are available
+   * @returns {Subscription} The subscription to unsubscribe from
+   */
+  subscribeToSearchOptions(defaults: SearchOptions): Subscription {
+    return Observable.merge(
+      this.getScopePart(defaults.scope),
+      this.getQueryPart(defaults.query),
+      this.getFiltersPart()
+    ).subscribe((update) => {
+      const currentValue: SearchOptions = this.searchOptions.getValue();
+      const updatedValue: SearchOptions = Object.assign(new SearchOptions(), currentValue, update);
+      this.searchOptions.next(updatedValue);
+    });
+  }
+
+  /**
+   * Sets up a subscription to all necessary parameters to make sure the paginatedSearchOptions emits a new value every time they update
+   * @param {PaginatedSearchOptions} defaults Default values for when no parameters are available
+   * @returns {Subscription} The subscription to unsubscribe from
+   */
+  subscribeToPaginatedSearchOptions(defaults: PaginatedSearchOptions): Subscription {
+    return Observable.merge(
+      this.getPaginationPart(defaults.pagination),
+      this.getSortPart(defaults.sort),
+      this.getScopePart(defaults.scope),
+      this.getQueryPart(defaults.query),
+      this.getFiltersPart()
+    ).subscribe((update) => {
+      const currentValue: PaginatedSearchOptions = this.paginatedSearchOptions.getValue();
+      const updatedValue: PaginatedSearchOptions = Object.assign(new PaginatedSearchOptions(), currentValue, update);
+      this.paginatedSearchOptions.next(updatedValue);
+    });
+  }
+
+  /**
+   * Default values for the Search Options
+   */
+  get defaults(): Observable<RemoteData<PaginatedSearchOptions>> {
+    if (hasNoValue(this._defaults)) {
+      const options = Object.assign(new PaginatedSearchOptions(), {
+        pagination: this.defaultPagination,
+        sort: this.defaultSort,
+        scope: this.defaultScope,
+        query: this.defaultQuery
+      });
+      this._defaults = Observable.of(new RemoteData(false, false, true, null, options));
+    }
+    return this._defaults;
+  }
+
+  /**
+   * Make sure to unsubscribe from all existing subscription to prevent memory leaks
+   */
+  ngOnDestroy(): void {
+    this.subs.forEach((sub) => {
+      sub.unsubscribe();
+    });
+  }
+
+  /**
+   * @returns {Observable<string>} Emits the current scope's identifier
+   */
+  private getScopePart(defaultScope: string): Observable<any> {
+    return this.getCurrentScope(defaultScope).map((scope) => {
+      return { scope }
+    });
+  }
+
+  /**
+   * @returns {Observable<string>} Emits the current query string as a partial SearchOptions object
+   */
+  private getQueryPart(defaultQuery: string): Observable<any> {
+    return this.getCurrentQuery(defaultQuery).map((query) => {
+      return { query }
+    });
+  }
+
+  /**
+   * @returns {Observable<string>} Emits the current pagination settings as a partial SearchOptions object
+   */
+  private getPaginationPart(defaultPagination: PaginationComponentOptions): Observable<any> {
+    return this.getCurrentPagination(defaultPagination).map((pagination) => {
+      return { pagination }
+    });
+  }
+
+  /**
+   * @returns {Observable<string>} Emits the current sorting settings as a partial SearchOptions object
+   */
+  private getSortPart(defaultSort: SortOptions): Observable<any> {
+    return this.getCurrentSort(defaultSort).map((sort) => {
+      return { sort }
+    });
+  }
+
+  /**
+   * @returns {Observable<Params>} Emits the current active filters as a partial SearchOptions object
+   */
+  private getFiltersPart(): Observable<any> {
+    return this.getCurrentFilters().map((filters) => {
+      return { filters }
+    });
+  }
+}
diff --git a/src/app/+search-page/search-service/search-filter-config.model.ts b/src/app/+search-page/search-service/search-filter-config.model.ts
index 2b77ef6768..dc6fef1f87 100644
--- a/src/app/+search-page/search-service/search-filter-config.model.ts
+++ b/src/app/+search-page/search-service/search-filter-config.model.ts
@@ -1,22 +1,53 @@
   import { FilterType } from './filter-type.model';
   import { autoserialize, autoserializeAs } from 'cerialize';
 
+  /**
+   * The configuration for a search filter
+   */
   export class SearchFilterConfig {
 
+    /**
+     * The name of this filter
+     */
     @autoserialize
     name: string;
 
+    /**
+     * The FilterType of this filter
+     */
     @autoserializeAs(String, 'facetType')
     type: FilterType;
 
+    /**
+     * True if the filter has facets
+     */
     @autoserialize
     hasFacets: boolean;
 
-    // @autoserializeAs(String, 'facetLimit') - uncomment when fixed in rest
+    /**
+     * @type {number} The page size used for this facet
+     */
+    @autoserializeAs(String, 'facetLimit')
     pageSize = 5;
 
+    /**
+     * Defines if the item facet is collapsed by default or not on the search page
+     */
     @autoserialize
     isOpenByDefault: boolean;
+
+    /**
+     * Minimum value possible for this facet in the repository
+     */
+    @autoserialize
+    maxValue: string;
+
+    /**
+     * Maximum value possible for this facet in the repository
+     */
+    @autoserialize
+    minValue: string;
+
     /**
      * Name of this configuration that can be used in a url
      * @returns Parameter name
diff --git a/src/app/+search-page/search-service/search-query-response.model.ts b/src/app/+search-page/search-service/search-query-response.model.ts
index b8948d963f..ac1d8b7df3 100644
--- a/src/app/+search-page/search-service/search-query-response.model.ts
+++ b/src/app/+search-page/search-service/search-query-response.model.ts
@@ -2,46 +2,88 @@ import { autoserialize, autoserializeAs } from 'cerialize';
 import { PageInfo } from '../../core/shared/page-info.model';
 import { NormalizedSearchResult } from '../normalized-search-result.model';
 
+/**
+ * Class representing the response returned by the server when performing a search request
+ */
 export class SearchQueryResponse {
+  /**
+   * The scope used in the search request represented by the UUID of a DSpaceObject
+   */
   @autoserialize
   scope: string;
 
+  /**
+   * The search query used in the search request
+   */
   @autoserialize
   query: string;
 
+  /**
+   * The currently active filters used in the search request
+   */
   @autoserialize
   appliedFilters: any[]; // TODO
 
+  /**
+   * The sort parameters used in the search request
+   */
   @autoserialize
   sort: any; // TODO
 
+  /**
+   * The sort parameters used in the search request
+   */
   @autoserialize
   configurationName: string;
 
+  /**
+   * The sort parameters used in the search request
+   */
   @autoserialize
   public type: string;
 
+  /**
+   * Pagination configuration for this response
+   */
   @autoserialize
   page: PageInfo;
 
+  /**
+   * The results for this query
+   */
   @autoserializeAs(NormalizedSearchResult)
   objects: NormalizedSearchResult[];
 
   @autoserialize
   facets: any; // TODO
 
+  /**
+   * The REST url to retrieve the current response
+   */
   @autoserialize
   self: string;
 
+  /**
+   * The REST url to retrieve the next response
+   */
   @autoserialize
   next: string;
 
+  /**
+   * The REST url to retrieve the previous response
+   */
   @autoserialize
   previous: string;
 
+  /**
+   * The REST url to retrieve the first response
+   */
   @autoserialize
   first: string;
 
+  /**
+   * The REST url to retrieve the last response
+   */
   @autoserialize
   last: string;
 }
diff --git a/src/app/+search-page/search-service/search-result-element-decorator.ts b/src/app/+search-page/search-service/search-result-element-decorator.ts
index 545d1b20eb..348cf7f592 100644
--- a/src/app/+search-page/search-service/search-result-element-decorator.ts
+++ b/src/app/+search-page/search-service/search-result-element-decorator.ts
@@ -1,8 +1,16 @@
 import { GenericConstructor } from '../../core/shared/generic-constructor';
 import { ListableObject } from '../../shared/object-collection/shared/listable-object.model';
 
+/**
+ * Contains the mapping between a search result component and a DSpaceObject
+ */
 const searchResultMap = new Map();
 
+/**
+ * Used to map Search Result components to their matching DSpaceObject
+ * @param {GenericConstructor<ListableObject>} domainConstructor The constructor of the DSpaceObject
+ * @returns Decorator function that performs the actual mapping on initialization of the component
+ */
 export function searchResultFor(domainConstructor: GenericConstructor<ListableObject>) {
   return function decorator(searchResult: any) {
     if (!searchResult) {
@@ -12,6 +20,11 @@ export function searchResultFor(domainConstructor: GenericConstructor<ListableOb
   };
 }
 
+/**
+ * Requests the matching component based on a given DSpaceObject's constructor
+ * @param {GenericConstructor<ListableObject>} domainConstructor The DSpaceObject's constructor for which the search result component is requested
+ * @returns The component's constructor that matches the given DSpaceObject
+ */
 export function getSearchResultFor(domainConstructor: GenericConstructor<ListableObject>) {
   return searchResultMap.get(domainConstructor);
 }
diff --git a/src/app/+search-page/search-service/search.service.spec.ts b/src/app/+search-page/search-service/search.service.spec.ts
index 5cc71d9bbd..488996a3da 100644
--- a/src/app/+search-page/search-service/search.service.spec.ts
+++ b/src/app/+search-page/search-service/search.service.spec.ts
@@ -1,14 +1,10 @@
-import { TestBed, fakeAsync, tick } from '@angular/core/testing';
+import { TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
 
 import { CommonModule } from '@angular/common';
 import { Component } from '@angular/core';
 
 import { SearchService } from './search.service';
-import { ItemDataService } from './../../core/data/item-data.service';
-import { ViewMode } from '../../+search-page/search-options.model';
-import { RouteService } from '../../shared/services/route.service';
-import { GLOBAL_CONFIG } from '../../../config';
 import { RemoteDataBuildService } from '../../core/cache/builders/remote-data-build.service';
 import { ActivatedRoute, Router, UrlTree } from '@angular/router';
 import { RequestService } from '../../core/data/request.service';
@@ -19,19 +15,19 @@ import { HALEndpointService } from '../../core/shared/hal-endpoint.service';
 import { Observable } from 'rxjs/Observable';
 import { PaginatedSearchOptions } from '../paginated-search-options.model';
 import { RemoteData } from '../../core/data/remote-data';
-import { PaginatedList } from '../../core/data/paginated-list';
-import { SearchResult } from '../search-result.model';
-import { DSpaceObject } from '../../core/shared/dspace-object.model';
 import { ResponseCacheEntry } from '../../core/cache/response-cache.reducer';
 import { RequestEntry } from '../../core/data/request.reducer';
 import { getMockRequestService } from '../../shared/mocks/mock-request.service';
 import { getMockResponseCacheService } from '../../shared/mocks/mock-response-cache.service';
 import {
-  FacetConfigSuccessResponse, RestResponse,
+  FacetConfigSuccessResponse,
   SearchSuccessResponse
 } from '../../core/cache/response-cache.models';
 import { SearchQueryResponse } from './search-query-response.model';
 import { SearchFilterConfig } from './search-filter-config.model';
+import { CommunityDataService } from '../../core/data/community-data.service';
+import { ViewMode } from '../../core/shared/view-mode.model';
+import { DSpaceObjectDataService } from '../../core/data/dspace-object-data.service';
 
 @Component({ template: '' })
 class DummyComponent {
@@ -60,6 +56,8 @@ describe('SearchService', () => {
           { provide: RequestService, useValue: getMockRequestService() },
           { provide: RemoteDataBuildService, useValue: {} },
           { provide: HALEndpointService, useValue: {} },
+          { provide: CommunityDataService, useValue: {}},
+          { provide: DSpaceObjectDataService, useValue: {}},
           SearchService
         ],
       });
@@ -115,6 +113,8 @@ describe('SearchService', () => {
           { provide: RequestService, useValue: getMockRequestService() },
           { provide: RemoteDataBuildService, useValue: remoteDataBuildService },
           { provide: HALEndpointService, useValue: halService },
+          { provide: CommunityDataService, useValue: {}},
+          { provide: DSpaceObjectDataService, useValue: {}},
           SearchService
         ],
       });
diff --git a/src/app/+search-page/search-service/search.service.ts b/src/app/+search-page/search-service/search.service.ts
index b51a9c834d..ac5f7a6169 100644
--- a/src/app/+search-page/search-service/search.service.ts
+++ b/src/app/+search-page/search-service/search.service.ts
@@ -1,13 +1,14 @@
 import { Injectable, OnDestroy } from '@angular/core';
 import {
-  ActivatedRoute, NavigationExtras, PRIMARY_OUTLET, Router,
+  ActivatedRoute,
+  NavigationExtras,
+  PRIMARY_OUTLET,
+  Router,
   UrlSegmentGroup
 } from '@angular/router';
 import { Observable } from 'rxjs/Observable';
-import { flatMap, map, tap } from 'rxjs/operators';
-import { ViewMode } from '../../+search-page/search-options.model';
+import { flatMap, map, switchMap } from 'rxjs/operators';
 import { RemoteDataBuildService } from '../../core/cache/builders/remote-data-build.service';
-import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
 import {
   FacetConfigSuccessResponse,
   FacetValueSuccessResponse,
@@ -23,10 +24,9 @@ import { RequestService } from '../../core/data/request.service';
 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 } from '../../core/shared/operators';
+import { configureRequest, getSucceededRemoteData } from '../../core/shared/operators';
 import { URLCombiner } from '../../core/url-combiner/url-combiner';
 import { hasValue, isEmpty, isNotEmpty } from '../../shared/empty.util';
-import { PaginationComponentOptions } from '../../shared/pagination/pagination-component-options.model';
 import { NormalizedSearchResult } from '../normalized-search-result.model';
 import { SearchOptions } from '../search-options.model';
 import { SearchResult } from '../search-result.model';
@@ -40,32 +40,48 @@ import { ListableObject } from '../../shared/object-collection/shared/listable-o
 import { FacetValueResponseParsingService } from '../../core/data/facet-value-response-parsing.service';
 import { FacetConfigResponseParsingService } from '../../core/data/facet-config-response-parsing.service';
 import { PaginatedSearchOptions } from '../paginated-search-options.model';
-import { observable } from 'rxjs/symbol/observable';
+import { Community } from '../../core/shared/community.model';
+import { CommunityDataService } from '../../core/data/community-data.service';
+import { ViewMode } from '../../core/shared/view-mode.model';
+import { ResourceType } from '../../core/shared/resource-type';
+import { DSpaceObjectDataService } from '../../core/data/dspace-object-data.service';
 
+/**
+ * Service that performs all general actions that have to do with the search page
+ */
 @Injectable()
 export class SearchService implements OnDestroy {
+  /**
+   * Endpoint link path for retrieving general search results
+   */
   private searchLinkPath = 'discover/search/objects';
-  private facetValueLinkPathPrefix = 'discover/facets/';
-  private facetConfigLinkPath = 'discover/facets';
 
+  /**
+   * Endpoint link path for retrieving facet config incl values
+   */
+  private facetLinkPathPrefix = 'discover/facets/';
+
+  /**
+   * Subscription to unsubscribe from
+   */
   private sub;
 
-  searchOptions: SearchOptions;
-
   constructor(private router: Router,
               private route: ActivatedRoute,
               protected responseCache: ResponseCacheService,
               protected requestService: RequestService,
               private rdb: RemoteDataBuildService,
-              private halService: HALEndpointService) {
-    const pagination: PaginationComponentOptions = new PaginationComponentOptions();
-    pagination.id = 'search-results-pagination';
-    pagination.currentPage = 1;
-    pagination.pageSize = 10;
-    const sort: SortOptions = new SortOptions('score', SortDirection.DESC);
-    this.searchOptions = Object.assign(new SearchOptions(), { pagination: pagination, sort: sort });
+              private halService: HALEndpointService,
+              private communityService: CommunityDataService,
+              private dspaceObjectService: DSpaceObjectDataService
+  ) {
   }
 
+  /**
+   * Method to retrieve a paginated list of search results from the server
+   * @param {PaginatedSearchOptions} searchOptions The configuration necessary to perform this search
+   * @returns {Observable<RemoteData<PaginatedList<SearchResult<DSpaceObject>>>>} Emits a paginated list with all search results found
+   */
   search(searchOptions?: PaginatedSearchOptions): Observable<RemoteData<PaginatedList<SearchResult<DSpaceObject>>>> {
     const requestObs = this.halService.getEndpoint(this.searchLinkPath).pipe(
       map((url: string) => {
@@ -134,8 +150,13 @@ export class SearchService implements OnDestroy {
     return this.rdb.toRemoteDataObservable(requestEntryObs, responseCacheObs, payloadObs);
   }
 
+  /**
+   * Request the filter configuration for a given scope or the whole repository
+   * @param {string} scope UUID of the object for which config the filter config is requested, when no scope is provided the configuration for the whole repository is loaded
+   * @returns {Observable<RemoteData<SearchFilterConfig[]>>} The found filter configuration
+   */
   getConfig(scope?: string): Observable<RemoteData<SearchFilterConfig[]>> {
-    const requestObs = this.halService.getEndpoint(this.facetConfigLinkPath).pipe(
+    const requestObs = this.halService.getEndpoint(this.facetLinkPathPrefix).pipe(
       map((url: string) => {
         const args: string[] = [];
 
@@ -175,13 +196,25 @@ export class SearchService implements OnDestroy {
     return this.rdb.toRemoteDataObservable(requestEntryObs, responseCacheObs, facetConfigObs);
   }
 
-  getFacetValuesFor(filterConfig: SearchFilterConfig, valuePage: number, searchOptions?: SearchOptions): Observable<RemoteData<PaginatedList<FacetValue>>> {
-    const requestObs = this.halService.getEndpoint(this.facetValueLinkPathPrefix + filterConfig.name).pipe(
+  /**
+   * Method to request a single page of filter values for a given value
+   * @param {SearchFilterConfig} filterConfig The filter config for which we want to request filter values
+   * @param {number} valuePage The page number of the filter values
+   * @param {SearchOptions} searchOptions The search configuration for the current search
+   * @param {string} filterQuery The optional query used to filter out filter values
+   * @returns {Observable<RemoteData<PaginatedList<FacetValue>>>} Emits the given page of facet values
+   */
+  getFacetValuesFor(filterConfig: SearchFilterConfig, valuePage: number, searchOptions?: SearchOptions, filterQuery?: string): Observable<RemoteData<PaginatedList<FacetValue>>> {
+    const requestObs = this.halService.getEndpoint(this.facetLinkPathPrefix + filterConfig.name).pipe(
       map((url: string) => {
         const args: string[] = [`page=${valuePage - 1}`, `size=${filterConfig.pageSize}`];
+        if (hasValue(filterQuery)) {
+          args.push(`prefix=${filterQuery}`);
+        }
         if (hasValue(searchOptions)) {
           url = searchOptions.toRestUrl(url, args);
         }
+
         const request = new GetRequest(this.requestService.generateRequestId(), url);
         return Object.assign(request, {
           getResponseParser(): GenericConstructor<ResponseParsingService> {
@@ -218,6 +251,45 @@ export class SearchService implements OnDestroy {
     return this.rdb.toRemoteDataObservable(requestEntryObs, responseCacheObs, payloadObs);
   }
 
+  /**
+   * Request a list of DSpaceObjects that can be used as a scope, based on the current scope
+   * @param {string} scopeId UUID of the current scope, if the scope is empty, the repository wide scopes will be returned
+   * @returns {Observable<DSpaceObject[]>} Emits a list of DSpaceObjects which represent possible scopes
+   */
+  getScopes(scopeId?: string): Observable<DSpaceObject[]> {
+
+    if (isEmpty(scopeId)) {
+      const top: Observable<Community[]> = this.communityService.findTop({ elementsPerPage: 9999 }).pipe(
+        map(
+          (communities: RemoteData<PaginatedList<Community>>) => communities.payload.page
+        )
+      );
+      return top;
+    }
+
+    const scopeObject: Observable<RemoteData<DSpaceObject>> = this.dspaceObjectService.findById(scopeId).pipe(getSucceededRemoteData());
+    const scopeList: Observable<DSpaceObject[]> = scopeObject.pipe(
+      switchMap((dsoRD: RemoteData<DSpaceObject>) => {
+          if (dsoRD.payload.type === ResourceType.Community) {
+            const community: Community = dsoRD.payload as Community;
+            return Observable.combineLatest(community.subcommunities, community.collections, (subCommunities, collections) => {
+              /*if this is a community, we also need to show the direct children*/
+              return [community, ...subCommunities.payload.page, ...collections.payload.page]
+            })
+          } else {
+            return Observable.of([dsoRD.payload]);
+          }
+        }
+      ));
+
+    return scopeList;
+
+  }
+
+  /**
+   * Requests the current view mode based on the current URL
+   * @returns {Observable<ViewMode>} The current view mode
+   */
   getViewMode(): Observable<ViewMode> {
     return this.route.queryParams.map((params) => {
       if (isNotEmpty(params.view) && hasValue(params.view)) {
@@ -228,6 +300,10 @@ export class SearchService implements OnDestroy {
     });
   }
 
+  /**
+   * Changes the current view mode in the current URL
+   * @param {ViewMode} viewMode Mode to switch to
+   */
   setViewMode(viewMode: ViewMode) {
     const navigationExtras: NavigationExtras = {
       queryParams: { view: viewMode },
@@ -237,12 +313,18 @@ export class SearchService implements OnDestroy {
     this.router.navigate([this.getSearchLink()], navigationExtras);
   }
 
+  /**
+   * @returns {string} The base path to the search page
+   */
   getSearchLink(): string {
     const urlTree = this.router.parseUrl(this.router.url);
     const g: UrlSegmentGroup = urlTree.root.children[PRIMARY_OUTLET];
     return '/' + g.toString();
   }
 
+  /**
+   * Unsubscribe from the subscription
+   */
   ngOnDestroy(): void {
     if (this.sub !== undefined) {
       this.sub.unsubscribe();
diff --git a/src/app/+search-page/search-settings/search-settings.component.html b/src/app/+search-page/search-settings/search-settings.component.html
index 18fd45caed..d693196dae 100644
--- a/src/app/+search-page/search-settings/search-settings.component.html
+++ b/src/app/+search-page/search-settings/search-settings.component.html
@@ -1,22 +1,24 @@
-<h3>{{ 'search.sidebar.settings.title' | translate}}</h3>
-<div *ngIf="[searchOptions].sort" class="setting-option result-order-settings mb-3 p-3">
+<ng-container *ngVar="(searchOptions$ | async) as config">
+    <h3>{{ 'search.sidebar.settings.title' | translate}}</h3>
+    <div *ngIf="config?.sort" class="setting-option result-order-settings mb-3 p-3">
     <h5>{{ 'search.sidebar.settings.sort-by' | translate}}</h5>
     <select class="form-control" (change)="reloadOrder($event)">
-        <option *ngFor="let sortDirection of (sortDirections | dsKeys)"
-                [value]="sortDirection.value"
-                [selected]="sortDirection.value === direction? 'selected': null">
-            {{'sorting.' + sortDirection.key | translate}}
+        <option *ngFor="let sortOption of searchOptionPossibilities"
+                [value]="sortOption.field + ',' + sortOption.direction.toString()"
+                [selected]="sortOption.field === config?.sort.field && sortOption.direction === (config?.sort.direction)? 'selected': null">
+            {{'sorting.' + sortOption.field + '.' + sortOption.direction | translate}}
         </option>
     </select>
-</div>
+    </div>
 
-<div class="setting-option page-size-settings mb-3 p-3">
-    <h5>{{ 'search.sidebar.settings.rpp' | translate}}</h5>
-
-    <select class="form-control" (change)="reloadRPP($event)">
-        <option *ngFor="let pageSizeOption of pageSizeOptions" [value]="pageSizeOption"
-                [selected]="pageSizeOption === pageSize ? 'selected': null">
-            {{pageSizeOption}}
-        </option>
-    </select>
-</div>
+    <div class="setting-option page-size-settings mb-3 p-3">
+        <h5>{{ 'search.sidebar.settings.rpp' | translate}}</h5>
+        <select class="form-control" (change)="reloadRPP($event)">
+            <option *ngFor="let pageSizeOption of config?.pagination.pageSizeOptions"
+                    [value]="pageSizeOption"
+                    [selected]="pageSizeOption === +config?.pagination.pageSize ? 'selected': null">
+                {{pageSizeOption}}
+            </option>
+        </select>
+    </div>
+</ng-container>
\ No newline at end of file
diff --git a/src/app/+search-page/search-settings/search-settings.component.spec.ts b/src/app/+search-page/search-settings/search-settings.component.spec.ts
index 2330b62669..5e6dc9b369 100644
--- a/src/app/+search-page/search-settings/search-settings.component.spec.ts
+++ b/src/app/+search-page/search-settings/search-settings.component.spec.ts
@@ -11,6 +11,10 @@ import { SearchSidebarService } from '../search-sidebar/search-sidebar.service';
 import { NO_ERRORS_SCHEMA } from '@angular/core';
 import { EnumKeysPipe } from '../../shared/utils/enum-keys-pipe';
 import { By } from '@angular/platform-browser';
+import { SearchFilterService } from '../search-filters/search-filter/search-filter.service';
+import { hot } from 'jasmine-marbles';
+import { VarDirective } from '../../shared/utils/var.directive';
+import { SearchConfigurationService } from '../search-service/search-configuration.service';
 
 describe('SearchSettingsComponent', () => {
 
@@ -23,13 +27,21 @@ describe('SearchSettingsComponent', () => {
   pagination.currentPage = 1;
   pagination.pageSize = 10;
   const sort: SortOptions = new SortOptions('score', SortDirection.DESC);
-  const mockResults = [ 'test', 'data' ];
+  const mockResults = ['test', 'data'];
   const searchServiceStub = {
     searchOptions: { pagination: pagination, sort: sort },
     search: () => mockResults
   };
+
   const queryParam = 'test query';
   const scopeParam = '7669c72a-3f2a-451f-a3b9-9210e7a4c02f';
+  const paginatedSearchOptions = {
+    query: queryParam,
+    scope: scopeParam,
+    pagination,
+    sort
+  };
+
   const activatedRouteStub = {
     queryParams: Observable.of({
       query: queryParam,
@@ -41,12 +53,12 @@ describe('SearchSettingsComponent', () => {
     isCollapsed: Observable.of(true),
     collapse: () => this.isCollapsed = Observable.of(true),
     expand: () => this.isCollapsed = Observable.of(false)
-  }
+  };
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      imports: [ TranslateModule.forRoot(), RouterTestingModule.withRoutes([]) ],
-      declarations: [ SearchSettingsComponent, EnumKeysPipe ],
+      imports: [TranslateModule.forRoot(), RouterTestingModule.withRoutes([])],
+      declarations: [SearchSettingsComponent, EnumKeysPipe, VarDirective],
       providers: [
         { provide: SearchService, useValue: searchServiceStub },
 
@@ -55,8 +67,23 @@ describe('SearchSettingsComponent', () => {
           provide: SearchSidebarService,
           useValue: sidebarService
         },
+        {
+          provide: SearchFilterService,
+          useValue: {}
+        },
+        {
+          provide: SearchConfigurationService,
+          useValue: {
+            paginatedSearchOptions: hot('a', {
+              a: paginatedSearchOptions
+            }),
+            getCurrentScope: hot('a', {
+              a: 'test-id'
+            }),
+          }
+        },
       ],
-      schemas: [ NO_ERRORS_SCHEMA ]
+      schemas: [NO_ERRORS_SCHEMA]
     }).compileComponents();
   }));
 
@@ -74,30 +101,42 @@ describe('SearchSettingsComponent', () => {
   });
 
   it('it should show the order settings with the respective selectable options', () => {
-    const orderSetting = fixture.debugElement.query(By.css('div.result-order-settings'));
-    expect(orderSetting).toBeDefined();
-    const childElements = orderSetting.query(By.css('.form-control')).children;
-    expect(childElements.length).toEqual(2);
-
+    (comp as any).searchOptions$.first().subscribe((options) => {
+      fixture.detectChanges();
+      const orderSetting = fixture.debugElement.query(By.css('div.result-order-settings'));
+      expect(orderSetting).toBeDefined();
+      const childElements = orderSetting.query(By.css('.form-control')).children;
+      expect(childElements.length).toEqual(comp.searchOptionPossibilities.length);
+    });
   });
 
   it('it should show the size settings with the respective selectable options', () => {
-    const pageSizeSetting = fixture.debugElement.query(By.css('div.page-size-settings'));
-    expect(pageSizeSetting).toBeDefined();
-    const childElements = pageSizeSetting.query(By.css('.form-control')).children;
-    expect(childElements.length).toEqual(7);
+    (comp as any).searchOptions$.first().subscribe((options) => {
+        fixture.detectChanges();
+        const pageSizeSetting = fixture.debugElement.query(By.css('div.page-size-settings'));
+        expect(pageSizeSetting).toBeDefined();
+        const childElements = pageSizeSetting.query(By.css('.form-control')).children;
+        expect(childElements.length).toEqual(options.pagination.pageSizeOptions.length);
+      }
+    )
   });
 
   it('should have the proper order value selected by default', () => {
-    const orderSetting = fixture.debugElement.query(By.css('div.result-order-settings'));
-    const childElementToBeSelected = orderSetting.query(By.css('.form-control option[value="0"][selected="selected"]'))
-    expect(childElementToBeSelected).toBeDefined();
+    (comp as any).searchOptions$.first().subscribe((options) => {
+      fixture.detectChanges();
+      const orderSetting = fixture.debugElement.query(By.css('div.result-order-settings'));
+      const childElementToBeSelected = orderSetting.query(By.css('.form-control option[value="0"][selected="selected"]'));
+      expect(childElementToBeSelected).toBeDefined();
+    });
   });
 
   it('should have the proper rpp value selected by default', () => {
-    const pageSizeSetting = fixture.debugElement.query(By.css('div.page-size-settings'));
-    const childElementToBeSelected = pageSizeSetting.query(By.css('.form-control option[value="10"][selected="selected"]'))
-    expect(childElementToBeSelected).toBeDefined();
+    (comp as any).searchOptions$.first().subscribe((options) => {
+      fixture.detectChanges();
+      const pageSizeSetting = fixture.debugElement.query(By.css('div.page-size-settings'));
+      const childElementToBeSelected = pageSizeSetting.query(By.css('.form-control option[value="10"][selected="selected"]'));
+      expect(childElementToBeSelected).toBeDefined();
+    });
   });
 
 });
diff --git a/src/app/+search-page/search-settings/search-settings.component.ts b/src/app/+search-page/search-settings/search-settings.component.ts
index 145b58e27b..81e2366e39 100644
--- a/src/app/+search-page/search-settings/search-settings.component.ts
+++ b/src/app/+search-page/search-settings/search-settings.component.ts
@@ -1,77 +1,75 @@
-import { Component, Input, OnInit, ChangeDetectionStrategy } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { SearchService } from '../search-service/search.service';
-import { SearchOptions, ViewMode } from '../search-options.model';
-import { SortDirection } from '../../core/cache/models/sort-options.model';
+import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
 import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
 import { PaginatedSearchOptions } from '../paginated-search-options.model';
+import { SearchFilterService } from '../search-filters/search-filter/search-filter.service';
+import { Observable } from 'rxjs/Observable';
+import { SearchConfigurationService } from '../search-service/search-configuration.service';
 
 @Component({
   selector: 'ds-search-settings',
   styleUrls: ['./search-settings.component.scss'],
   templateUrl: './search-settings.component.html'
 })
+
+/**
+ * This component represents the part of the search sidebar that contains the general search settings.
+ */
 export class SearchSettingsComponent implements OnInit {
 
-  @Input() searchOptions: PaginatedSearchOptions;
   /**
-   * Declare SortDirection enumeration to use it in the template
+   * The configuration for the current paginated search results
    */
-  public sortDirections = SortDirection;
-  /**
-   * Number of items per page.
-   */
-  public pageSize;
-  @Input() public pageSizeOptions;
+  searchOptions$: Observable<PaginatedSearchOptions>;
 
-  private sub;
-  private scope: string;
-  query: string;
-  page: number;
-  direction: SortDirection;
-  currentParams = {};
+  /**
+   * All sort options that are shown in the settings
+   */
+  searchOptionPossibilities = [new SortOptions('score', SortDirection.DESC), new SortOptions('dc.title', SortDirection.ASC), new SortOptions('dc.title', SortDirection.DESC)];
 
   constructor(private service: SearchService,
               private route: ActivatedRoute,
-              private router: Router) {
+              private router: Router,
+              private searchConfigurationService: SearchConfigurationService) {
   }
 
+  /**
+   * Initialize paginated search options
+   */
   ngOnInit(): void {
-    this.searchOptions = this.service.searchOptions;
-    this.pageSize = this.searchOptions.pagination.pageSize;
-    this.pageSizeOptions = this.searchOptions.pagination.pageSizeOptions;
-    this.sub = this.route
-      .queryParams
-      .subscribe((params) => {
-        this.currentParams = params;
-        this.query = params.query || '';
-        this.scope = params.scope;
-        this.page  = +params.page || this.searchOptions.pagination.currentPage;
-        this.pageSize = +params.pageSize || this.searchOptions.pagination.pageSize;
-        this.direction = params.sortDirection || this.searchOptions.sort.direction;
-        if (params.view === ViewMode.Grid) {
-          this.pageSizeOptions = this.pageSizeOptions;
-        } else {
-          this.pageSizeOptions = this.pageSizeOptions;
-        }
-      });
+    this.searchOptions$ = this.searchConfigurationService.paginatedSearchOptions;
   }
 
+  /**
+   * Method to change the current page size (results per page)
+   * @param {Event} event Change event containing the new page size value
+   */
   reloadRPP(event: Event) {
     const value = (event.target as HTMLInputElement).value;
     const navigationExtras: NavigationExtras = {
-      queryParams: Object.assign({}, this.currentParams, {
-        pageSize: value
-      })
+      queryParams: {
+        pageSize: value,
+        page: 1
+      },
+      queryParamsHandling: 'merge'
     };
     this.router.navigate([ '/search' ], navigationExtras);
   }
 
+  /**
+   * Method to change the current sort field and direction
+   * @param {Event} event Change event containing the sort direction and sort field
+   */
   reloadOrder(event: Event) {
-    const value = (event.target as HTMLInputElement).value;
+    const values = (event.target as HTMLInputElement).value.split(',');
     const navigationExtras: NavigationExtras = {
-      queryParams: Object.assign({}, this.currentParams, {
-        sortDirection: value
-      })
+      queryParams: {
+        sortDirection: values[1],
+        sortField: values[0],
+        page: 1
+      },
+      queryParamsHandling: 'merge'
     };
     this.router.navigate([ '/search' ], navigationExtras);
   }
diff --git a/src/app/+search-page/search-sidebar/search-sidebar.actions.ts b/src/app/+search-page/search-sidebar/search-sidebar.actions.ts
index f393bc10b3..84a34b2790 100644
--- a/src/app/+search-page/search-sidebar/search-sidebar.actions.ts
+++ b/src/app/+search-page/search-sidebar/search-sidebar.actions.ts
@@ -17,14 +17,23 @@ export const SearchSidebarActionTypes = {
 };
 
 /* tslint:disable:max-classes-per-file */
+/**
+ * Used to collapse the sidebar
+ */
 export class SearchSidebarCollapseAction implements Action {
   type = SearchSidebarActionTypes.COLLAPSE;
 }
 
+/**
+ * Used to expand the sidebar
+ */
 export class SearchSidebarExpandAction implements Action {
   type = SearchSidebarActionTypes.EXPAND;
 }
 
+/**
+ * Used to collapse the sidebar when it's expanded and expand it when it's collapsed
+ */
 export class SearchSidebarToggleAction implements Action {
   type = SearchSidebarActionTypes.TOGGLE;
 }
diff --git a/src/app/+search-page/search-sidebar/search-sidebar.component.ts b/src/app/+search-page/search-sidebar/search-sidebar.component.ts
index 946048462a..8b68cda793 100644
--- a/src/app/+search-page/search-sidebar/search-sidebar.component.ts
+++ b/src/app/+search-page/search-sidebar/search-sidebar.component.ts
@@ -12,7 +12,18 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
   templateUrl: './search-sidebar.component.html',
 })
 
+/**
+ * Component representing the sidebar on the search page
+ */
 export class SearchSidebarComponent {
+
+  /**
+   * The total amount of results
+   */
   @Input() resultCount;
+
+  /**
+   * Emits event when the user clicks a button to open or close the sidebar
+   */
   @Output() toggleSidebar = new EventEmitter<boolean>();
 }
diff --git a/src/app/+search-page/search-sidebar/search-sidebar.effects.ts b/src/app/+search-page/search-sidebar/search-sidebar.effects.ts
index b65010b6e0..758ef2320b 100644
--- a/src/app/+search-page/search-sidebar/search-sidebar.effects.ts
+++ b/src/app/+search-page/search-sidebar/search-sidebar.effects.ts
@@ -5,6 +5,9 @@ import * as fromRouter from '@ngrx/router-store';
 import { SearchSidebarCollapseAction } from './search-sidebar.actions';
 import { URLBaser } from '../../core/url-baser/url-baser';
 
+/**
+ * Makes sure that if the user navigates to another route, the sidebar is collapsed
+ */
 @Injectable()
 export class SearchSidebarEffects {
   private previousPath: string;
diff --git a/src/app/+search-page/search-sidebar/search-sidebar.reducer.ts b/src/app/+search-page/search-sidebar/search-sidebar.reducer.ts
index 81d9069238..a01f0ff6d6 100644
--- a/src/app/+search-page/search-sidebar/search-sidebar.reducer.ts
+++ b/src/app/+search-page/search-sidebar/search-sidebar.reducer.ts
@@ -1,5 +1,8 @@
 import { SearchSidebarAction, SearchSidebarActionTypes } from './search-sidebar.actions';
 
+/**
+ * Interface that represents the state of the sidebar
+ */
 export interface SearchSidebarState {
   sidebarCollapsed: boolean;
 }
@@ -8,6 +11,12 @@ const initialState: SearchSidebarState = {
   sidebarCollapsed: true
 };
 
+/**
+ * Performs a search sidebar action on the current state
+ * @param {SearchSidebarState} state The state before the action is performed
+ * @param {SearchSidebarAction} action The action that should be performed
+ * @returns {SearchSidebarState} The state after the action is performed
+ */
 export function sidebarReducer(state = initialState, action: SearchSidebarAction): SearchSidebarState {
   switch (action.type) {
 
diff --git a/src/app/+search-page/search-sidebar/search-sidebar.service.ts b/src/app/+search-page/search-sidebar/search-sidebar.service.ts
index 3a17dc87ab..8cf9339c5c 100644
--- a/src/app/+search-page/search-sidebar/search-sidebar.service.ts
+++ b/src/app/+search-page/search-sidebar/search-sidebar.service.ts
@@ -9,27 +9,47 @@ import { HostWindowService } from '../../shared/host-window.service';
 const sidebarStateSelector = (state: AppState) => state.searchSidebar;
 const sidebarCollapsedSelector = createSelector(sidebarStateSelector, (sidebar: SearchSidebarState) => sidebar.sidebarCollapsed);
 
+/**
+ * Service that performs all actions that have to do with the search sidebar
+ */
 @Injectable()
 export class SearchSidebarService {
+  /**
+   * Emits true is the current screen size is mobile
+   */
   private isXsOrSm$: Observable<boolean>;
-  private isCollapsdeInStored: Observable<boolean>;
+
+  /**
+   * Emits true is the sidebar's state in the store is currently collapsed
+   */
+  private isCollapsedInStore: Observable<boolean>;
 
   constructor(private store: Store<AppState>, private windowService: HostWindowService) {
     this.isXsOrSm$ = this.windowService.isXsOrSm();
-    this.isCollapsdeInStored = this.store.select(sidebarCollapsedSelector);
+    this.isCollapsedInStore = this.store.select(sidebarCollapsedSelector);
   }
 
+  /**
+   * Checks if the sidebar should currently be collapsed
+   * @returns {Observable<boolean>} Emits true if the user's screen size is mobile or when the state in the store is currently collapsed
+   */
   get isCollapsed(): Observable<boolean> {
     return Observable.combineLatest(
       this.isXsOrSm$,
-      this.isCollapsdeInStored,
+      this.isCollapsedInStore,
       (mobile, store) => mobile ? store : true);
   }
 
+  /**
+   * Dispatches a collapse action to the store
+   */
   public collapse(): void {
     this.store.dispatch(new SearchSidebarCollapseAction());
   }
 
+  /**
+   * Dispatches an expand action to the store
+   */
   public expand(): void {
     this.store.dispatch(new SearchSidebarExpandAction());
   }
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index 00a3e56121..e4c51ae37b 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -1,5 +1,6 @@
 @import '../styles/variables.scss';
 @import '../../node_modules/bootstrap/scss/bootstrap.scss';
+@import '../../node_modules/nouislider/distribute/nouislider.min.css';
 @import "../../node_modules/font-awesome/scss/font-awesome.scss";
 
 html {
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 d576b9ea32..d934f60e48 100644
--- a/src/app/core/cache/builders/remote-data-build.service.ts
+++ b/src/app/core/cache/builders/remote-data-build.service.ts
@@ -8,12 +8,14 @@ import { RemoteDataError } from '../../data/remote-data-error';
 import { GetRequest } from '../../data/request.models';
 import { RequestEntry } from '../../data/request.reducer';
 import { RequestService } from '../../data/request.service';
+
 import { NormalizedObject } from '../models/normalized-object.model';
 import { ObjectCacheService } from '../object-cache.service';
 import { DSOSuccessResponse, ErrorResponse } from '../response-cache.models';
 import { ResponseCacheEntry } from '../response-cache.reducer';
 import { ResponseCacheService } from '../response-cache.service';
 import { getMapsTo, getRelationMetadata, getRelationships } from './build-decorators';
+import { PageInfo } from '../../shared/page-info.model';
 import {
   getRequestFromSelflink,
   getResourceLinksFromResponse,
@@ -96,7 +98,6 @@ export class RemoteDataBuildService {
             error = new RemoteDataError(resEntry.response.statusCode, errorMessage);
           }
         }
-
         return new RemoteData(
           requestPending,
           responsePending,
@@ -107,7 +108,7 @@ export class RemoteDataBuildService {
       });
   }
 
-  buildList<TNormalized extends NormalizedObject, TDomain>(href$: string | Observable<string>): Observable<RemoteData<TDomain[] | PaginatedList<TDomain>>> {
+  buildList<TNormalized extends NormalizedObject, TDomain>(href$: string | Observable<string>): Observable<RemoteData<PaginatedList<TDomain>>> {
     if (typeof href$ === 'string') {
       href$ = Observable.of(href$);
     }
@@ -144,11 +145,7 @@ export class RemoteDataBuildService {
   );
 
     const payload$ = Observable.combineLatest(tDomainList$, pageInfo$, (tDomainList, pageInfo) => {
-      if (hasValue(pageInfo)) {
-        return new PaginatedList(pageInfo, tDomainList);
-      } else {
-        return tDomainList;
-      }
+      return new PaginatedList(pageInfo, tDomainList);
     });
 
     return this.toRemoteDataObservable(requestEntry$, responseCache$, payload$);
@@ -160,35 +157,43 @@ export class RemoteDataBuildService {
     const relationships = getRelationships(normalized.constructor) || [];
 
     relationships.forEach((relationship: string) => {
+      let result;
       if (hasValue(normalized[relationship])) {
         const { resourceType, isList } = getRelationMetadata(normalized, relationship);
-        if (Array.isArray(normalized[relationship])) {
-          normalized[relationship].forEach((href: string) => {
+        const objectList = normalized[relationship].page || normalized[relationship];
+        if (typeof objectList !== 'string') {
+          objectList.forEach((href: string) => {
             this.requestService.configure(new GetRequest(this.requestService.generateRequestId(), href))
           });
 
           const rdArr = [];
-          normalized[relationship].forEach((href: string) => {
+          objectList.forEach((href: string) => {
             rdArr.push(this.buildSingle(href));
           });
 
           if (isList) {
-            links[relationship] = this.aggregate(rdArr);
+            result = this.aggregate(rdArr);
           } else if (rdArr.length === 1) {
-            links[relationship] = rdArr[0];
+            result = rdArr[0];
           }
         } else {
-          this.requestService.configure(new GetRequest(this.requestService.generateRequestId(), normalized[relationship]));
+          this.requestService.configure(new GetRequest(this.requestService.generateRequestId(), objectList));
 
           // The rest API can return a single URL to represent a list of resources (e.g. /items/:id/bitstreams)
           // in that case only 1 href will be stored in the normalized obj (so the isArray above fails),
           // but it should still be built as a list
           if (isList) {
-            links[relationship] = this.buildList(normalized[relationship]);
+            result = this.buildList(objectList);
           } else {
-            links[relationship] = this.buildSingle(normalized[relationship]);
+            result = this.buildSingle(objectList);
           }
         }
+
+        if (hasValue(normalized[relationship].page)) {
+          links[relationship] = this.aggregatePaginatedList(result, normalized[relationship].pageInfo);
+        } else {
+          links[relationship] = result;
+        }
       }
     });
 
@@ -249,4 +254,8 @@ export class RemoteDataBuildService {
       })
   }
 
+  aggregatePaginatedList<T>(input: Observable<RemoteData<T[]>>, pageInfo: PageInfo): Observable<RemoteData<PaginatedList<T>>> {
+    return input.map((rd) => Object.assign(rd, {payload: new PaginatedList(pageInfo, rd.payload)}));
+  }
+
 }
diff --git a/src/app/core/cache/id-to-uuid-serializer.spec.ts b/src/app/core/cache/id-to-uuid-serializer.spec.ts
new file mode 100644
index 0000000000..e7f6929ddd
--- /dev/null
+++ b/src/app/core/cache/id-to-uuid-serializer.spec.ts
@@ -0,0 +1,34 @@
+import { IDToUUIDSerializer } from './id-to-uuid-serializer';
+
+describe('IDToUUIDSerializer', () => {
+  let serializer: IDToUUIDSerializer;
+  const prefix = 'test-prefix';
+
+  beforeEach(() => {
+    serializer = new IDToUUIDSerializer(prefix);
+  });
+
+  describe('Serialize', () => {
+    it('should return undefined', () => {
+      expect(serializer.Serialize('some-uuid')).toBeUndefined()
+    });
+  });
+
+  describe('Deserialize', () => {
+    describe('when ID is defined', () => {
+      it('should prepend the prefix to the ID', () => {
+        const id = 'some-id';
+        expect(serializer.Deserialize(id)).toBe(`${prefix}-${id}`);
+      });
+    });
+
+    describe('when ID is null or undefined', () => {
+      it('should return null or undefined', () => {
+        expect(serializer.Deserialize(null)).toBeNull();
+        expect(serializer.Deserialize(undefined)).toBeUndefined();
+      });
+    });
+
+  });
+
+});
diff --git a/src/app/core/cache/id-to-uuid-serializer.ts b/src/app/core/cache/id-to-uuid-serializer.ts
new file mode 100644
index 0000000000..79576d448e
--- /dev/null
+++ b/src/app/core/cache/id-to-uuid-serializer.ts
@@ -0,0 +1,35 @@
+import { hasValue } from '../../shared/empty.util';
+
+/**
+ * Serializer to create unique fake UUID's from id's that might otherwise be the same across multiple object types
+ */
+export class IDToUUIDSerializer {
+  /**
+   * @param {string} prefix To prepend the original ID with
+   */
+  constructor(private prefix: string) {
+  }
+
+  /**
+   * Method to serialize a UUID
+   * @param {string} uuid
+   * @returns {any} undefined Fake UUID's should not be sent back to the server, but only be used in the UI
+   */
+  Serialize(uuid: string): any {
+    return undefined;
+  }
+
+  /**
+   * Method to deserialize a UUID
+   * @param {string} id Identifier to transform in to a UUID
+   * @returns {string} UUID based on the prefix and the given id
+   */
+  Deserialize(id: string): string {
+    if (hasValue(id)) {
+      return `${this.prefix}-${id}`;
+    } else {
+      return id;
+    }
+
+  }
+}
diff --git a/src/app/core/cache/models/action-type.model.ts b/src/app/core/cache/models/action-type.model.ts
new file mode 100644
index 0000000000..4965f93e89
--- /dev/null
+++ b/src/app/core/cache/models/action-type.model.ts
@@ -0,0 +1,64 @@
+/**
+ * Enum representing the Action Type of a Resource Policy
+ */
+export enum ActionType {
+  /**
+   * Action of reading, viewing or downloading something
+   */
+  READ = 0,
+
+  /**
+   * Action of modifying something
+   */
+  WRITE = 1,
+
+  /**
+   * Action of deleting something
+   */
+  DELETE = 2,
+
+  /**
+   * Action of adding something to a container
+   */
+  ADD = 3,
+
+  /**
+   * Action of removing something from a container
+   */
+  REMOVE = 4,
+
+  /**
+   * Action of performing workflow step 1
+   */
+  WORKFLOW_STEP_1 = 5,
+
+  /**
+   * Action of performing workflow step 2
+   */
+  WORKFLOW_STEP_2 = 6,
+
+  /**
+   *  Action of performing workflow step 3
+   */
+  WORKFLOW_STEP_3 = 7,
+
+  /**
+   *  Action of performing a workflow abort
+   */
+  WORKFLOW_ABORT = 8,
+
+  /**
+   * Default Read policies for Bitstreams submitted to container
+   */
+  DEFAULT_BITSTREAM_READ = 9,
+
+  /**
+   *  Default Read policies for Items submitted to container
+   */
+  DEFAULT_ITEM_READ = 10,
+
+  /**
+   * Administrative actions
+   */
+  ADMIN = 11,
+}
diff --git a/src/app/core/cache/models/normalized-bitstream-format.model.ts b/src/app/core/cache/models/normalized-bitstream-format.model.ts
new file mode 100644
index 0000000000..5d11c97107
--- /dev/null
+++ b/src/app/core/cache/models/normalized-bitstream-format.model.ts
@@ -0,0 +1,66 @@
+import { autoserialize, autoserializeAs, inheritSerialization } from 'cerialize';
+import { BitstreamFormat } from '../../shared/bitstream-format.model';
+
+import { mapsTo } from '../builders/build-decorators';
+import { IDToUUIDSerializer } from '../id-to-uuid-serializer';
+import { NormalizedObject } from './normalized-object.model';
+import { SupportLevel } from './support-level.model';
+
+/**
+ * Normalized model class for a Bitstream Format
+ */
+@mapsTo(BitstreamFormat)
+@inheritSerialization(NormalizedObject)
+export class NormalizedBitstreamFormat extends NormalizedObject {
+
+  /**
+   * Short description of this Bitstream Format
+   */
+  @autoserialize
+  shortDescription: string;
+
+  /**
+   * Description of this Bitstream Format
+   */
+  @autoserialize
+  description: string;
+
+  /**
+   * String representing the MIME type of this Bitstream Format
+   */
+  @autoserialize
+  mimetype: string;
+
+  /**
+   * The level of support the system offers for this Bitstream Format
+   */
+  @autoserialize
+  supportLevel: SupportLevel;
+
+  /**
+   * True if the Bitstream Format is used to store system information, rather than the content of items in the system
+   */
+  @autoserialize
+  internal: boolean;
+
+  /**
+   * String representing this Bitstream Format's file extension
+   */
+  @autoserialize
+  extensions: string;
+
+  /**
+   * Identifier for this Bitstream Format
+   * Note that this ID is unique for bitstream formats,
+   * but might not be unique across different object types
+   */
+  @autoserialize
+  id: string;
+
+  /**
+   * Universally unique identifier for this Bitstream Format
+   * Consist of a prefix and the id field to ensure the identifier is unique across all object types
+   */
+  @autoserializeAs(new IDToUUIDSerializer('bitstream-format'), 'id')
+  uuid: string;
+}
diff --git a/src/app/core/cache/models/normalized-bitstream.model.ts b/src/app/core/cache/models/normalized-bitstream.model.ts
index db8002a874..63f84add41 100644
--- a/src/app/core/cache/models/normalized-bitstream.model.ts
+++ b/src/app/core/cache/models/normalized-bitstream.model.ts
@@ -5,6 +5,9 @@ import { Bitstream } from '../../shared/bitstream.model';
 import { mapsTo, relationship } from '../builders/build-decorators';
 import { ResourceType } from '../../shared/resource-type';
 
+/**
+ * Normalized model class for a DSpace Bitstream
+ */
 @mapsTo(Bitstream)
 @inheritSerialization(NormalizedDSpaceObject)
 export class NormalizedBitstream extends NormalizedDSpaceObject {
diff --git a/src/app/core/cache/models/normalized-bundle.model.ts b/src/app/core/cache/models/normalized-bundle.model.ts
index 3b594dd308..5535ab57e5 100644
--- a/src/app/core/cache/models/normalized-bundle.model.ts
+++ b/src/app/core/cache/models/normalized-bundle.model.ts
@@ -5,6 +5,9 @@ import { Bundle } from '../../shared/bundle.model';
 import { mapsTo, relationship } from '../builders/build-decorators';
 import { ResourceType } from '../../shared/resource-type';
 
+/**
+ * Normalized model class for a DSpace Bundle
+ */
 @mapsTo(Bundle)
 @inheritSerialization(NormalizedDSpaceObject)
 export class NormalizedBundle extends NormalizedDSpaceObject {
@@ -25,6 +28,9 @@ export class NormalizedBundle extends NormalizedDSpaceObject {
    */
   owner: string;
 
+  /**
+   * List of Bitstreams that are part of this Bundle
+   */
   @autoserialize
   @relationship(ResourceType.Bitstream, true)
   bitstreams: string[];
diff --git a/src/app/core/cache/models/normalized-collection.model.ts b/src/app/core/cache/models/normalized-collection.model.ts
index 22e0d20eaa..a2c634c3e5 100644
--- a/src/app/core/cache/models/normalized-collection.model.ts
+++ b/src/app/core/cache/models/normalized-collection.model.ts
@@ -1,10 +1,13 @@
-import { autoserialize, inheritSerialization, autoserializeAs } from 'cerialize';
+import { autoserialize, inheritSerialization } from 'cerialize';
 
 import { NormalizedDSpaceObject } from './normalized-dspace-object.model';
 import { Collection } from '../../shared/collection.model';
 import { mapsTo, relationship } from '../builders/build-decorators';
 import { ResourceType } from '../../shared/resource-type';
 
+/**
+ * Normalized model class for a DSpace Collection
+ */
 @mapsTo(Collection)
 @inheritSerialization(NormalizedDSpaceObject)
 export class NormalizedCollection extends NormalizedDSpaceObject {
@@ -36,6 +39,9 @@ export class NormalizedCollection extends NormalizedDSpaceObject {
   @relationship(ResourceType.Community, false)
   owner: string;
 
+  /**
+   * List of Items that are part of (not necessarily owned by) this Collection
+   */
   @autoserialize
   @relationship(ResourceType.Item, true)
   items: string[];
diff --git a/src/app/core/cache/models/normalized-community.model.ts b/src/app/core/cache/models/normalized-community.model.ts
index 03784e414b..4ab2408a53 100644
--- a/src/app/core/cache/models/normalized-community.model.ts
+++ b/src/app/core/cache/models/normalized-community.model.ts
@@ -1,10 +1,13 @@
-import { autoserialize, inheritSerialization, autoserializeAs } from 'cerialize';
+import { autoserialize, inheritSerialization } from 'cerialize';
 
 import { NormalizedDSpaceObject } from './normalized-dspace-object.model';
 import { Community } from '../../shared/community.model';
 import { mapsTo, relationship } from '../builders/build-decorators';
 import { ResourceType } from '../../shared/resource-type';
 
+/**
+ * Normalized model class for a DSpace Community
+ */
 @mapsTo(Community)
 @inheritSerialization(NormalizedDSpaceObject)
 export class NormalizedCommunity extends NormalizedDSpaceObject {
@@ -36,8 +39,15 @@ export class NormalizedCommunity extends NormalizedDSpaceObject {
   @relationship(ResourceType.Community, false)
   owner: string;
 
+  /**
+   * List of Collections that are owned by this Community
+   */
   @autoserialize
   @relationship(ResourceType.Collection, true)
   collections: string[];
 
+  @autoserialize
+  @relationship(ResourceType.Community, true)
+  subcommunities: string[];
+
 }
diff --git a/src/app/core/cache/models/normalized-item.model.ts b/src/app/core/cache/models/normalized-item.model.ts
index a4a14e424c..7d518bd048 100644
--- a/src/app/core/cache/models/normalized-item.model.ts
+++ b/src/app/core/cache/models/normalized-item.model.ts
@@ -5,6 +5,9 @@ import { Item } from '../../shared/item.model';
 import { mapsTo, relationship } from '../builders/build-decorators';
 import { ResourceType } from '../../shared/resource-type';
 
+/**
+ * Normalized model class for a DSpace Item
+ */
 @mapsTo(Item)
 @inheritSerialization(NormalizedDSpaceObject)
 export class NormalizedItem extends NormalizedDSpaceObject {
@@ -49,9 +52,13 @@ export class NormalizedItem extends NormalizedDSpaceObject {
   /**
    * The Collection that owns this Item
    */
+  @autoserialize
   @relationship(ResourceType.Collection, false)
   owningCollection: string;
 
+  /**
+   * List of Bitstreams that are owned by this Item
+   */
   @autoserialize
   @relationship(ResourceType.Bitstream, true)
   bitstreams: string[];
diff --git a/src/app/core/cache/models/normalized-object-factory.ts b/src/app/core/cache/models/normalized-object-factory.ts
index 5b13d55ac8..df67a1f2ce 100644
--- a/src/app/core/cache/models/normalized-object-factory.ts
+++ b/src/app/core/cache/models/normalized-object-factory.ts
@@ -6,6 +6,8 @@ import { GenericConstructor } from '../../shared/generic-constructor';
 import { NormalizedCommunity } from './normalized-community.model';
 import { ResourceType } from '../../shared/resource-type';
 import { NormalizedObject } from './normalized-object.model';
+import { NormalizedBitstreamFormat } from './normalized-bitstream-format.model';
+import { NormalizedResourcePolicy } from './normalized-resource-policy.model';
 
 export class NormalizedObjectFactory {
   public static getConstructor(type: ResourceType): GenericConstructor<NormalizedObject> {
@@ -25,6 +27,12 @@ export class NormalizedObjectFactory {
       case ResourceType.Community: {
         return NormalizedCommunity
       }
+      case ResourceType.BitstreamFormat: {
+        return NormalizedBitstreamFormat
+      }
+      case ResourceType.ResourcePolicy: {
+        return NormalizedResourcePolicy
+      }
       default: {
         return undefined;
       }
diff --git a/src/app/core/cache/models/normalized-resource-policy.model.ts b/src/app/core/cache/models/normalized-resource-policy.model.ts
new file mode 100644
index 0000000000..b767ca6491
--- /dev/null
+++ b/src/app/core/cache/models/normalized-resource-policy.model.ts
@@ -0,0 +1,49 @@
+import { autoserialize, autoserializeAs, inheritSerialization } from 'cerialize';
+import { ResourcePolicy } from '../../shared/resource-policy.model';
+
+import { mapsTo, relationship } from '../builders/build-decorators';
+import { NormalizedObject } from './normalized-object.model';
+import { IDToUUIDSerializer } from '../id-to-uuid-serializer';
+import { ResourceType } from '../../shared/resource-type';
+import { ActionType } from './action-type.model';
+
+/**
+ * Normalized model class for a Resource Policy
+ */
+@mapsTo(ResourcePolicy)
+@inheritSerialization(NormalizedObject)
+export class NormalizedResourcePolicy extends NormalizedObject {
+
+  /**
+   * The action that is allowed by this Resource Policy
+   */
+  action: ActionType;
+
+  /**
+   * The name for this Resource Policy
+   */
+  @autoserialize
+  name: string;
+
+  /**
+   * The uuid of the Group this Resource Policy applies to
+   */
+  @relationship(ResourceType.Group, false)
+  @autoserializeAs(String, 'groupUUID')
+  group: string;
+
+  /**
+   * Identifier for this Resource Policy
+   * Note that this ID is unique for resource policies,
+   * but might not be unique across different object types
+   */
+  @autoserialize
+  id: string;
+
+  /**
+   * The universally unique identifier for this Resource Policy
+   * Consist of a prefix and the id field to ensure the identifier is unique across all object types
+   */
+  @autoserializeAs(new IDToUUIDSerializer('resource-policy'), 'id')
+  uuid: string;
+}
diff --git a/src/app/core/cache/models/support-level.model.ts b/src/app/core/cache/models/support-level.model.ts
new file mode 100644
index 0000000000..30f759d55f
--- /dev/null
+++ b/src/app/core/cache/models/support-level.model.ts
@@ -0,0 +1,19 @@
+/**
+ * Enum representing the Support Level of a Bitstream Format
+ */
+export enum SupportLevel {
+  /**
+   * Unknown for Bitstream Formats that are unknown to the system
+   */
+  Unknown = 0,
+
+  /**
+   * Unknown for Bitstream Formats that are known to the system, but not fully supported
+   */
+  Known = 1,
+
+  /**
+   * Supported for Bitstream Formats that are known to the system and fully supported
+   */
+  Supported = 2,
+}
diff --git a/src/app/core/cache/response-cache.service.spec.ts b/src/app/core/cache/response-cache.service.spec.ts
index 1def7faa02..77838b6eb6 100644
--- a/src/app/core/cache/response-cache.service.spec.ts
+++ b/src/app/core/cache/response-cache.service.spec.ts
@@ -46,7 +46,6 @@ describe('ResponseCacheService', () => {
 
       let testObj: ResponseCacheEntry;
       service.get(keys[1]).first().subscribe((entry) => {
-        console.log(entry);
         testObj = entry;
       });
       expect(testObj.key).toEqual(keys[1]);
diff --git a/src/app/core/core.module.ts b/src/app/core/core.module.ts
index 422717e233..73e97c7933 100644
--- a/src/app/core/core.module.ts
+++ b/src/app/core/core.module.ts
@@ -63,6 +63,7 @@ import { RegistryBitstreamformatsResponseParsingService } from './data/registry-
 import { NotificationsService } from '../shared/notifications/notifications.service';
 import { UploaderService } from '../shared/uploader/uploader.service';
 import { BrowseItemsResponseParsingService } from './data/browse-items-response-parsing-service';
+import { DSpaceObjectDataService } from './data/dspace-object-data.service';
 
 const IMPORTS = [
   CommonModule,
@@ -126,6 +127,7 @@ const PROVIDERS = [
   IntegrationResponseParsingService,
   UploaderService,
   UUIDService,
+  DSpaceObjectDataService,
   // register AuthInterceptor as HttpInterceptor
   {
     provide: HTTP_INTERCEPTORS,
diff --git a/src/app/core/data/base-response-parsing.service.ts b/src/app/core/data/base-response-parsing.service.ts
index bde0857946..050b3c2da5 100644
--- a/src/app/core/data/base-response-parsing.service.ts
+++ b/src/app/core/data/base-response-parsing.service.ts
@@ -4,8 +4,9 @@ import { CacheableObject } from '../cache/object-cache.reducer';
 import { PageInfo } from '../shared/page-info.model';
 import { ObjectCacheService } from '../cache/object-cache.service';
 import { GlobalConfig } from '../../../config/global-config.interface';
-import { NormalizedObject } from '../cache/models/normalized-object.model';
 import { GenericConstructor } from '../shared/generic-constructor';
+import { PaginatedList } from './paginated-list';
+import { NormalizedObject } from '../cache/models/normalized-object.model';
 
 function isObjectLevel(halObj: any) {
   return isNotEmpty(halObj._links) && hasValue(halObj._links.self);
@@ -17,96 +18,103 @@ function isPaginatedResponse(halObj: any) {
 
 /* tslint:disable:max-classes-per-file */
 
-class ProcessRequestDTO<ObjectDomain> {
-  [key: string]: ObjectDomain[]
-}
-
 export abstract class BaseResponseParsingService {
   protected abstract EnvConfig: GlobalConfig;
   protected abstract objectCache: ObjectCacheService;
   protected abstract objectFactory: any;
   protected abstract toCache: boolean;
 
-  protected process<ObjectDomain,ObjectType>(data: any, requestHref: string): ProcessRequestDTO<ObjectDomain> {
+  protected process<ObjectDomain, ObjectType>(data: any, requestHref: string): any {
 
     if (isNotEmpty(data)) {
-      if (isPaginatedResponse(data)) {
-        return this.process(data._embedded, requestHref);
+      if (hasNoValue(data) || (typeof data !== 'object')) {
+        return data;
+      } else if (isPaginatedResponse(data)) {
+        return this.processPaginatedList(data, requestHref);
+      } else if (Array.isArray(data)) {
+        return this.processArray(data, requestHref);
       } else if (isObjectLevel(data)) {
-        return { topLevel: this.deserializeAndCache(data, requestHref) };
-      } else {
-        const result = new ProcessRequestDTO<ObjectDomain>();
-        if (Array.isArray(data)) {
-          result.topLevel = [];
-          data.forEach((datum) => {
-            if (isPaginatedResponse(datum)) {
-              const obj = this.process(datum, requestHref);
-              result.topLevel = [...result.topLevel, ...this.flattenSingleKeyObject(obj)];
-            } else {
-              result.topLevel = [...result.topLevel, ...this.deserializeAndCache<ObjectDomain,ObjectType>(datum, requestHref)];
-            }
-          });
-        } else {
-          Object.keys(data)
-            .filter((property) => data.hasOwnProperty(property))
-            .filter((property) => hasValue(data[property]))
+        const object = this.deserialize(data);
+        if (isNotEmpty(data._embedded)) {
+          Object
+            .keys(data._embedded)
+            .filter((property) => data._embedded.hasOwnProperty(property))
             .forEach((property) => {
-              if (isPaginatedResponse(data[property])) {
-                const obj = this.process(data[property], requestHref);
-                result[property] = this.flattenSingleKeyObject(obj);
-              } else {
-                result[property] = this.deserializeAndCache(data[property], requestHref);
+              const parsedObj = this.process<ObjectDomain, ObjectType>(data._embedded[property], requestHref);
+              if (isNotEmpty(parsedObj)) {
+                if (isPaginatedResponse(data._embedded[property])) {
+                  object[property] = parsedObj;
+                  object[property].page = parsedObj.page.map((obj) => obj.self);
+                } else if (isObjectLevel(data._embedded[property])) {
+                  object[property] = parsedObj.self;
+                } else if (Array.isArray(parsedObj)) {
+                  object[property] = parsedObj.map((obj) => obj.self)
+                }
               }
             });
         }
-        return result;
+        this.cache(object, requestHref);
+        return object;
       }
+      const result = {};
+      Object.keys(data)
+        .filter((property) => data.hasOwnProperty(property))
+        .filter((property) => hasValue(data[property]))
+        .forEach((property) => {
+          const obj = this.process(data[property], requestHref);
+          result[property] = obj;
+        });
+      return result;
+
     }
   }
 
-  protected deserializeAndCache<ObjectDomain,ObjectType>(obj, requestHref: string): ObjectDomain[] {
-    if (Array.isArray(obj)) {
-      let result = [];
-      obj.forEach((o) => result = [...result, ...this.deserializeAndCache<ObjectDomain,ObjectType>(o, requestHref)]);
-      return result;
-    }
+  protected processPaginatedList<ObjectDomain, ObjectType>(data: any, requestHref: string): PaginatedList<ObjectDomain> {
+    const pageInfo: PageInfo = this.processPageInfo(data);
+    let list = data._embedded;
 
+    // Workaround for inconsistency in rest response. Issue: https://github.com/DSpace/dspace-angular/issues/238
+    if (!Array.isArray(list)) {
+      list = this.flattenSingleKeyObject(list);
+    }
+    const page: ObjectDomain[] = this.processArray(list, requestHref);
+    return new PaginatedList<ObjectDomain>(pageInfo, page);
+  }
+
+  protected processArray<ObjectDomain, ObjectType>(data: any, requestHref: string): ObjectDomain[] {
+    let array: ObjectDomain[] = [];
+    data.forEach((datum) => {
+        array = [...array, this.process(datum, requestHref)];
+      }
+    );
+    return array;
+  }
+
+  protected deserialize<ObjectDomain, ObjectType>(obj): any {
     const type: ObjectType = obj.type;
     if (hasValue(type)) {
       const normObjConstructor = this.objectFactory.getConstructor(type) as GenericConstructor<ObjectDomain>;
 
       if (hasValue(normObjConstructor)) {
         const serializer = new DSpaceRESTv2Serializer(normObjConstructor);
-
-        let processed;
-        if (isNotEmpty(obj._embedded)) {
-          processed = this.process<ObjectDomain,ObjectType>(obj._embedded, requestHref);
-        }
-        const normalizedObj: any = serializer.deserialize(obj);
-
-        if (isNotEmpty(processed)) {
-          const processedList = {};
-          Object.keys(processed).forEach((key) => {
-            processedList[key] = processed[key].map((no: NormalizedObject) => (this.toCache) ? no.self : no);
-          });
-          Object.assign(normalizedObj, processedList);
-        }
-
-        if (this.toCache) {
-          this.addToObjectCache(normalizedObj, requestHref);
-        }
-        return [normalizedObj] as any;
-
+        const res = serializer.deserialize(obj);
+        return res;
       } else {
         // TODO: move check to Validator?
         // throw new Error(`The server returned an object with an unknown a known type: ${type}`);
-        return [];
+        return null;
       }
 
     } else {
       // TODO: move check to Validator
       // throw new Error(`The server returned an object without a type: ${JSON.stringify(obj)}`);
-      return [];
+      return null;
+    }
+  }
+
+  protected cache<ObjectDomain, ObjectType>(obj, requestHref) {
+    if (this.toCache) {
+      this.addToObjectCache(obj, requestHref);
     }
   }
 
@@ -119,7 +127,7 @@ export abstract class BaseResponseParsingService {
 
   processPageInfo(payload: any): PageInfo {
     if (isNotEmpty(payload.page)) {
-      const pageObj = Object.assign({}, payload.page, {_links: payload._links});
+      const pageObj = Object.assign({}, payload.page, { _links: payload._links });
       const pageInfoObject = new DSpaceRESTv2Serializer(PageInfo).deserialize(pageObj);
       if (pageInfoObject.currentPage >= 0) {
         Object.assign(pageInfoObject, { currentPage: pageInfoObject.currentPage + 1 });
diff --git a/src/app/core/data/community-data.service.ts b/src/app/core/data/community-data.service.ts
index 88ad3a5287..9313823a33 100644
--- a/src/app/core/data/community-data.service.ts
+++ b/src/app/core/data/community-data.service.ts
@@ -1,7 +1,6 @@
-import { Inject, Injectable } from '@angular/core';
+import { Injectable } from '@angular/core';
 
 import { Store } from '@ngrx/store';
-import { GLOBAL_CONFIG, GlobalConfig } from '../../../config';
 import { RemoteDataBuildService } from '../cache/builders/remote-data-build.service';
 import { NormalizedCommunity } from '../cache/models/normalized-community.model';
 import { ObjectCacheService } from '../cache/object-cache.service';
@@ -11,10 +10,16 @@ import { Community } from '../shared/community.model';
 import { ComColDataService } from './comcol-data.service';
 import { RequestService } from './request.service';
 import { HALEndpointService } from '../shared/hal-endpoint.service';
+import { FindAllOptions, FindAllRequest } from './request.models';
+import { RemoteData } from './remote-data';
+import { hasValue, isNotEmpty } from '../../shared/empty.util';
+import { Observable } from 'rxjs/Observable';
+import { PaginatedList } from './paginated-list';
 
 @Injectable()
 export class CommunityDataService extends ComColDataService<NormalizedCommunity, Community> {
   protected linkPath = 'communities';
+  protected topLinkPath = 'communities/search/top';
   protected cds = this;
 
   constructor(
@@ -31,4 +36,18 @@ export class CommunityDataService extends ComColDataService<NormalizedCommunity,
   getEndpoint() {
     return this.halService.getEndpoint(this.linkPath);
   }
+
+  findTop(options: FindAllOptions = {}): Observable<RemoteData<PaginatedList<Community>>> {
+    const hrefObs = this.getFindAllHref(options);
+
+    hrefObs
+      .filter((href: string) => hasValue(href))
+      .take(1)
+      .subscribe((href: string) => {
+        const request = new FindAllRequest(this.requestService.generateRequestId(), href, options);
+        this.requestService.configure(request);
+      });
+
+    return this.rdbService.buildList<NormalizedCommunity, Community>(hrefObs) as Observable<RemoteData<PaginatedList<Community>>>;
+  }
 }
diff --git a/src/app/core/data/config-response-parsing.service.spec.ts b/src/app/core/data/config-response-parsing.service.spec.ts
index 3a09de6e4c..654ee53651 100644
--- a/src/app/core/data/config-response-parsing.service.spec.ts
+++ b/src/app/core/data/config-response-parsing.service.spec.ts
@@ -1,5 +1,4 @@
 import { ConfigSuccessResponse, ErrorResponse } from '../cache/response-cache.models';
-import { DSpaceRESTV2Response } from '../dspace-rest-v2/dspace-rest-v2-response.model';
 import { ConfigResponseParsingService } from './config-response-parsing.service';
 import { ObjectCacheService } from '../cache/object-cache.service';
 import { GlobalConfig } from '../../../config/global-config.interface';
@@ -8,7 +7,8 @@ import { ConfigRequest } from './request.models';
 import { Store } from '@ngrx/store';
 import { CoreState } from '../core.reducers';
 import { SubmissionDefinitionsModel } from '../shared/config/config-submission-definitions.model';
-import { SubmissionSectionModel } from '../shared/config/config-submission-section.model';
+import { PaginatedList } from './paginated-list';
+import { PageInfo } from '../shared/page-info.model';
 
 describe('ConfigResponseParsingService', () => {
   let service: ConfigResponseParsingService;
@@ -16,141 +16,143 @@ describe('ConfigResponseParsingService', () => {
   const EnvConfig = {} as GlobalConfig;
   const store = {} as Store<CoreState>;
   const objectCacheService = new ObjectCacheService(store);
-
+  let validResponse;
   beforeEach(() => {
     service = new ConfigResponseParsingService(EnvConfig, objectCacheService);
+    validResponse = {
+      payload: {
+        id: 'traditional',
+        name: 'traditional',
+        type: 'submissiondefinition',
+        isDefault: true,
+        _links: {
+          sections: {
+            href: 'https://rest.api/config/submissiondefinitions/traditional/sections'
+          },
+          self: {
+            href: 'https://rest.api/config/submissiondefinitions/traditional'
+          }
+        },
+        _embedded: {
+          sections: {
+            page: {
+              number: 0,
+              size: 4,
+              totalPages: 1, totalElements: 4
+            },
+            _embedded: [
+              {
+                id: 'traditionalpageone', header: 'submit.progressbar.describe.stepone',
+                mandatory: true,
+                sectionType: 'submission-form',
+                visibility: {
+                  main: null,
+                  other: 'READONLY'
+                },
+                type: 'submissionsection',
+                _links: {
+                  self: {
+                    href: 'https://rest.api/config/submissionsections/traditionalpageone'
+                  },
+                  config: {
+                    href: 'https://rest.api/config/submissionforms/traditionalpageone'
+                  }
+                }
+              }, {
+                id: 'traditionalpagetwo',
+                header: 'submit.progressbar.describe.steptwo',
+                mandatory: true,
+                sectionType: 'submission-form',
+                visibility: {
+                  main: null,
+                  other: 'READONLY'
+                },
+                type: 'submissionsection',
+                _links: {
+                  self: {
+                    href: 'https://rest.api/config/submissionsections/traditionalpagetwo'
+                  },
+                  config: {
+                    href: 'https://rest.api/config/submissionforms/traditionalpagetwo'
+                  }
+                }
+              }, {
+                id: 'upload',
+                header: 'submit.progressbar.upload',
+                mandatory: false,
+                sectionType: 'upload',
+                visibility: {
+                  main: null,
+                  other: 'READONLY'
+                },
+                type: 'submissionsection',
+                _links: {
+                  self: {
+                    href: 'https://rest.api/config/submissionsections/upload'
+                  },
+                  config: {
+                    href: 'https://rest.api/config/submissionuploads/upload'
+                  }
+                }
+              }, {
+                id: 'license',
+                header: 'submit.progressbar.license',
+                mandatory: true,
+                sectionType: 'license',
+                visibility: {
+                  main: null,
+                  other: 'READONLY'
+                },
+                type: 'submissionsection',
+                _links: {
+                  self: {
+                    href: 'https://rest.api/config/submissionsections/license'
+                  }
+                }
+              }
+            ],
+            _links: {
+              self: {
+                href: 'https://rest.api/config/submissiondefinitions/traditional/sections'
+              }
+            }
+          }
+        }
+      },
+      statusCode: '200'
+    };
   });
 
   describe('parse', () => {
     const validRequest = new ConfigRequest('69f375b5-19f4-4453-8c7a-7dc5c55aafbb', 'https://rest.api/config/submissiondefinitions/traditional');
 
-    const validResponse = {
-      payload: {
-        id:'traditional',
-        name:'traditional',
-        type:'submissiondefinition',
-        isDefault:true,
-        _links:{
-          sections:{
-            href:'https://rest.api/config/submissiondefinitions/traditional/sections'
-          },self:{
-            href:'https://rest.api/config/submissiondefinitions/traditional'
-          }
-        },
-        _embedded:{
-          sections:{
-            page:{
-              number:0,
-              size:4,
-              totalPages:1,totalElements:4
-            },
-            _embedded:[
-              {
-                id:'traditionalpageone',header:'submit.progressbar.describe.stepone',
-                mandatory:true,
-                sectionType:'submission-form',
-                visibility:{
-                  main:null,
-                  other:'READONLY'
-                },
-                type:'submissionsection',
-                _links:{
-                  self:{
-                    href:'https://rest.api/config/submissionsections/traditionalpageone'
-                  },
-                  config:{
-                    href:'https://rest.api/config/submissionforms/traditionalpageone'
-                  }
-                }
-              }, {
-                id:'traditionalpagetwo',
-                header:'submit.progressbar.describe.steptwo',
-                mandatory:true,
-                sectionType:'submission-form',
-                visibility:{
-                  main:null,
-                  other:'READONLY'
-                },
-                type:'submissionsection',
-                _links:{
-                  self:{
-                    href:'https://rest.api/config/submissionsections/traditionalpagetwo'
-                  },
-                  config:{
-                    href:'https://rest.api/config/submissionforms/traditionalpagetwo'
-                  }
-                }
-              }, {
-                id:'upload',
-                header:'submit.progressbar.upload',
-                mandatory:false,
-                sectionType:'upload',
-                visibility:{
-                  main:null,
-                  other:'READONLY'
-                },
-                type:'submissionsection',
-                _links:{
-                  self:{
-                    href:'https://rest.api/config/submissionsections/upload'
-                  },
-                  config: {
-                    href:'https://rest.api/config/submissionuploads/upload'
-                  }
-                }
-              }, {
-                id:'license',
-                header:'submit.progressbar.license',
-                mandatory:true,
-                sectionType:'license',
-                visibility:{
-                  main:null,
-                  other:'READONLY'
-                },
-                type:'submissionsection',
-                _links:{
-                  self:{
-                    href:'https://rest.api/config/submissionsections/license'
-                  }
-                }
-              }
-            ],
-            _links:{
-              self:'https://rest.api/config/submissiondefinitions/traditional/sections'
-            }
-          }
-        }
-      },
-      statusCode:'200'
-    };
-
     const invalidResponse1 = {
       payload: {},
-      statusCode:'200'
+      statusCode: '200'
     };
 
     const invalidResponse2 = {
       payload: {
-        id:'traditional',
-        name:'traditional',
-        type:'submissiondefinition',
-        isDefault:true,
-        _links:{},
-        _embedded:{
-          sections:{
-            page:{
-              number:0,
-              size:4,
-              totalPages:1,totalElements:4
+        id: 'traditional',
+        name: 'traditional',
+        type: 'submissiondefinition',
+        isDefault: true,
+        _links: {},
+        _embedded: {
+          sections: {
+            page: {
+              number: 0,
+              size: 4,
+              totalPages: 1, totalElements: 4
             },
-            _embedded:[{},{}],
-            _links:{
-              self:'https://rest.api/config/submissiondefinitions/traditional/sections'
+            _embedded: [{}, {}],
+            _links: {
+              self: 'https://rest.api/config/submissiondefinitions/traditional/sections'
             }
           }
         }
       },
-      statusCode:'200'
+      statusCode: '200'
     };
 
     const invalidResponse3 = {
@@ -159,61 +161,24 @@ describe('ConfigResponseParsingService', () => {
         page: { size: 20, totalElements: 2, totalPages: 1, number: 0 }
       }, statusCode: '500'
     };
-
-    const definitions = [
+    const pageinfo = Object.assign(new PageInfo(), { elementsPerPage: 4, totalElements: 4, totalPages: 1, currentPage: 1 });
+    const definitions =
       Object.assign(new SubmissionDefinitionsModel(), {
         isDefault: true,
         name: 'traditional',
         type: 'submissiondefinition',
-        _links: {},
-        sections: [
-          Object.assign(new SubmissionSectionModel(), {
-            header: 'submit.progressbar.describe.stepone',
-            mandatory: true,
-            sectionType: 'submission-form',
-            visibility:{
-              main:null,
-              other:'READONLY'
-            },
-            type: 'submissionsection',
-            _links: {}
-          }),
-          Object.assign(new SubmissionSectionModel(), {
-            header: 'submit.progressbar.describe.steptwo',
-            mandatory: true,
-            sectionType: 'submission-form',
-            visibility:{
-              main:null,
-              other:'READONLY'
-            },
-            type: 'submissionsection',
-            _links: {}
-          }),
-          Object.assign(new SubmissionSectionModel(), {
-            header: 'submit.progressbar.upload',
-            mandatory: false,
-            sectionType: 'upload',
-            visibility:{
-              main:null,
-              other:'READONLY'
-            },
-            type: 'submissionsection',
-            _links: {}
-          }),
-          Object.assign(new SubmissionSectionModel(), {
-            header: 'submit.progressbar.license',
-            mandatory: true,
-            sectionType: 'license',
-            visibility:{
-              main:null,
-              other:'READONLY'
-            },
-            type: 'submissionsection',
-            _links: {}
-          })
-        ]
-      })
-    ];
+        _links: {
+          sections: 'https://rest.api/config/submissiondefinitions/traditional/sections',
+          self: 'https://rest.api/config/submissiondefinitions/traditional'
+        },
+        self: 'https://rest.api/config/submissiondefinitions/traditional',
+        sections: new PaginatedList(pageinfo, [
+          'https://rest.api/config/submissionsections/traditionalpageone',
+          'https://rest.api/config/submissionsections/traditionalpagetwo',
+          'https://rest.api/config/submissionsections/upload',
+          'https://rest.api/config/submissionsections/license'
+        ])
+      });
 
     it('should return a ConfigSuccessResponse if data contains a valid config endpoint response', () => {
       const response = service.parse(validRequest, validResponse);
diff --git a/src/app/core/data/config-response-parsing.service.ts b/src/app/core/data/config-response-parsing.service.ts
index dfbbfc50c7..2b1b923625 100644
--- a/src/app/core/data/config-response-parsing.service.ts
+++ b/src/app/core/data/config-response-parsing.service.ts
@@ -29,7 +29,7 @@ export class ConfigResponseParsingService extends BaseResponseParsingService imp
   parse(request: RestRequest, data: DSpaceRESTV2Response): RestResponse {
     if (isNotEmpty(data.payload) && isNotEmpty(data.payload._links) && (data.statusCode === '201' || data.statusCode === '200' || data.statusCode === 'OK')) {
       const configDefinition = this.process<ConfigObject,ConfigType>(data.payload, request.href);
-      return new ConfigSuccessResponse(configDefinition[Object.keys(configDefinition)[0]], data.statusCode, this.processPageInfo(data.payload));
+      return new ConfigSuccessResponse(configDefinition, data.statusCode, this.processPageInfo(data.payload));
     } else {
       return new ErrorResponse(
         Object.assign(
diff --git a/src/app/core/data/data.service.spec.ts b/src/app/core/data/data.service.spec.ts
new file mode 100644
index 0000000000..727b375791
--- /dev/null
+++ b/src/app/core/data/data.service.spec.ts
@@ -0,0 +1,125 @@
+import { DataService } from './data.service';
+import { NormalizedObject } from '../cache/models/normalized-object.model';
+import { ResponseCacheService } from '../cache/response-cache.service';
+import { RequestService } from './request.service';
+import { RemoteDataBuildService } from '../cache/builders/remote-data-build.service';
+import { CoreState } from '../core.reducers';
+import { Store } from '@ngrx/store';
+import { HALEndpointService } from '../shared/hal-endpoint.service';
+import { Observable } from 'rxjs/Observable';
+import { FindAllOptions } from './request.models';
+import { SortOptions, SortDirection } from '../cache/models/sort-options.model';
+
+const LINK_NAME = 'test';
+const ENDPOINT = 'https://rest.api/core';
+
+// tslint:disable:max-classes-per-file
+class NormalizedTestObject extends NormalizedObject {
+}
+
+class TestService extends DataService<NormalizedTestObject, any> {
+    constructor(
+        protected responseCache: ResponseCacheService,
+        protected requestService: RequestService,
+        protected rdbService: RemoteDataBuildService,
+        protected store: Store<CoreState>,
+        protected linkPath: string,
+        protected halService: HALEndpointService
+    ) {
+        super();
+    }
+
+    public getBrowseEndpoint(options: FindAllOptions): Observable<string> {
+        return Observable.of(ENDPOINT);
+    }
+
+}
+
+describe('DataService', () => {
+    let service: TestService;
+    let options: FindAllOptions;
+    const responseCache = {} as ResponseCacheService;
+    const requestService = {} as RequestService;
+    const halService = {} as HALEndpointService;
+    const rdbService = {} as RemoteDataBuildService;
+    const store = {} as Store<CoreState>;
+
+    function initTestService(): TestService {
+        return new TestService(
+            responseCache,
+            requestService,
+            rdbService,
+            store,
+            LINK_NAME,
+            halService
+          );
+    }
+
+    service = initTestService();
+
+    describe('getFindAllHref', () => {
+
+        it('should return an observable with the endpoint', () => {
+            options = {};
+
+            (service as any).getFindAllHref(options).subscribe((value) => {
+                    expect(value).toBe(ENDPOINT);
+                }
+            );
+        });
+
+        it('should include page in href if currentPage provided in options', () => {
+            options = { currentPage: 2 };
+            const expected = `${ENDPOINT}?page=${options.currentPage - 1}`;
+
+            (service as any).getFindAllHref(options).subscribe((value) => {
+                expect(value).toBe(expected);
+            });
+        });
+
+        it('should include size in href if elementsPerPage provided in options', () => {
+            options = { elementsPerPage: 5 };
+            const expected = `${ENDPOINT}?size=${options.elementsPerPage}`;
+
+            (service as any).getFindAllHref(options).subscribe((value) => {
+                expect(value).toBe(expected);
+            });
+        });
+
+        it('should include sort href if SortOptions provided in options', () => {
+            const sortOptions = new SortOptions('field1', SortDirection.ASC);
+            options = { sort:  sortOptions};
+            const expected = `${ENDPOINT}?sort=${sortOptions.field},${sortOptions.direction}`;
+
+            (service as any).getFindAllHref(options).subscribe((value) => {
+                expect(value).toBe(expected);
+            });
+        });
+
+        it('should include startsWith in href if startsWith provided in options', () => {
+            options = { startsWith: 'ab' };
+            const expected = `${ENDPOINT}?startsWith=${options.startsWith}`;
+
+            (service as any).getFindAllHref(options).subscribe((value) => {
+                expect(value).toBe(expected);
+            });
+        });
+
+        it('should include all provided options in href', () => {
+            const sortOptions = new SortOptions('field1', SortDirection.DESC)
+            options = {
+                currentPage: 6,
+                elementsPerPage: 10,
+                sort: sortOptions,
+                startsWith: 'ab'
+            }
+            const expected = `${ENDPOINT}?page=${options.currentPage - 1}&size=${options.elementsPerPage}` +
+                `&sort=${sortOptions.field},${sortOptions.direction}&startsWith=${options.startsWith}`;
+
+            (service as any).getFindAllHref(options).subscribe((value) => {
+                expect(value).toBe(expected);
+        });
+        })
+    });
+
+});
diff --git a/src/app/core/data/data.service.ts b/src/app/core/data/data.service.ts
index 5c01412ba7..413de9bb9b 100644
--- a/src/app/core/data/data.service.ts
+++ b/src/app/core/data/data.service.ts
@@ -41,6 +41,10 @@ export abstract class DataService<TNormalized extends NormalizedObject, TDomain>
       args.push(`sort=${options.sort.field},${options.sort.direction}`);
     }
 
+    if (hasValue(options.startsWith)) {
+      args.push(`startsWith=${options.startsWith}`);
+    }
+
     if (isNotEmpty(args)) {
       return result.map((href: string) => new URLCombiner(href, `?${args.join('&')}`).toString());
     } else {
@@ -71,8 +75,7 @@ export abstract class DataService<TNormalized extends NormalizedObject, TDomain>
       .map((endpoint: string) => this.getFindByIDHref(endpoint, id));
 
     hrefObs
-      .filter((href: string) => hasValue(href))
-      .take(1)
+      .first((href: string) => hasValue(href))
       .subscribe((href: string) => {
         const request = new FindByIDRequest(this.requestService.generateRequestId(), href, id);
         this.requestService.configure(request);
diff --git a/src/app/core/data/dso-response-parsing.service.ts b/src/app/core/data/dso-response-parsing.service.ts
index 9651eb3157..aff450781f 100644
--- a/src/app/core/data/dso-response-parsing.service.ts
+++ b/src/app/core/data/dso-response-parsing.service.ts
@@ -12,6 +12,7 @@ import { RestRequest } from './request.models';
 
 import { ResponseParsingService } from './parsing.service';
 import { BaseResponseParsingService } from './base-response-parsing.service';
+import { hasNoValue, hasValue } from '../../shared/empty.util';
 
 @Injectable()
 export class DSOResponseParsingService extends BaseResponseParsingService implements ResponseParsingService {
@@ -27,7 +28,16 @@ export class DSOResponseParsingService extends BaseResponseParsingService implem
 
   parse(request: RestRequest, data: DSpaceRESTV2Response): RestResponse {
     const processRequestDTO = this.process<NormalizedObject,ResourceType>(data.payload, request.href);
-    const selfLinks = this.flattenSingleKeyObject(processRequestDTO).map((no) => no.self);
+    let objectList = processRequestDTO;
+    if (hasNoValue(processRequestDTO)) {
+      return new DSOSuccessResponse([], data.statusCode, undefined)
+    }
+    if (hasValue(processRequestDTO.page)) {
+      objectList = processRequestDTO.page;
+    } else if (!Array.isArray(processRequestDTO)) {
+      objectList = [processRequestDTO];
+    }
+    const selfLinks = objectList.map((no) => no.self);
     return new DSOSuccessResponse(selfLinks, data.statusCode, this.processPageInfo(data.payload))
   }
 
diff --git a/src/app/core/data/dspace-object-data.service.spec.ts b/src/app/core/data/dspace-object-data.service.spec.ts
new file mode 100644
index 0000000000..bb2bdc675d
--- /dev/null
+++ b/src/app/core/data/dspace-object-data.service.spec.ts
@@ -0,0 +1,73 @@
+import { cold, getTestScheduler } from 'jasmine-marbles';
+import { TestScheduler } from '../../../../node_modules/rxjs';
+import { RemoteDataBuildService } from '../cache/builders/remote-data-build.service';
+import { DSpaceObject } from '../shared/dspace-object.model';
+import { HALEndpointService } from '../shared/hal-endpoint.service';
+import { FindByIDRequest } from './request.models';
+import { RequestService } from './request.service';
+import { DSpaceObjectDataService } from './dspace-object-data.service';
+
+describe('DSpaceObjectDataService', () => {
+  let scheduler: TestScheduler;
+  let service: DSpaceObjectDataService;
+  let halService: HALEndpointService;
+  let requestService: RequestService;
+  let rdbService: RemoteDataBuildService;
+  const testObject = {
+    uuid: '9b4f22f4-164a-49db-8817-3316b6ee5746'
+  } as DSpaceObject;
+  const dsoLink = 'https://rest.api/rest/api/dso/find{?uuid}';
+  const requestURL = `https://rest.api/rest/api/dso/find?uuid=${testObject.uuid}`;
+  const requestUUID = '34cfed7c-f597-49ef-9cbe-ea351f0023c2';
+
+  beforeEach(() => {
+    scheduler = getTestScheduler();
+
+    halService = jasmine.createSpyObj('halService', {
+      getEndpoint: cold('a', { a: dsoLink })
+    });
+    requestService = jasmine.createSpyObj('requestService', {
+      generateRequestId: requestUUID,
+      configure: true
+    });
+    rdbService = jasmine.createSpyObj('rdbService', {
+      buildSingle: cold('a', {
+        a: {
+          payload: testObject
+        }
+      })
+    });
+
+    service = new DSpaceObjectDataService(
+      requestService,
+      rdbService,
+      halService
+    )
+  });
+
+  describe('findById', () => {
+    it('should call HALEndpointService with the path to the dso endpoint', () => {
+      scheduler.schedule(() => service.findById(testObject.uuid));
+      scheduler.flush();
+
+      expect(halService.getEndpoint).toHaveBeenCalledWith('dso');
+    });
+
+    it('should configure the proper FindByIDRequest', () => {
+      scheduler.schedule(() => service.findById(testObject.uuid));
+      scheduler.flush();
+
+      expect(requestService.configure).toHaveBeenCalledWith(new FindByIDRequest(requestUUID, requestURL, testObject.uuid));
+    });
+
+    it('should return a RemoteData<DSpaceObject> for the object with the given ID', () => {
+      const result = service.findById(testObject.uuid);
+      const expected = cold('a', {
+        a: {
+          payload: testObject
+        }
+      });
+      expect(result).toBeObservable(expected);
+    });
+  });
+});
diff --git a/src/app/core/data/dspace-object-data.service.ts b/src/app/core/data/dspace-object-data.service.ts
new file mode 100644
index 0000000000..afd9d74f5b
--- /dev/null
+++ b/src/app/core/data/dspace-object-data.service.ts
@@ -0,0 +1,52 @@
+import { Injectable } from '@angular/core';
+import { Store } from '@ngrx/store';
+import { Observable } from 'rxjs/Observable';
+import { RemoteDataBuildService } from '../cache/builders/remote-data-build.service';
+import { NormalizedDSpaceObject } from '../cache/models/normalized-dspace-object.model';
+import { ResponseCacheService } from '../cache/response-cache.service';
+import { CoreState } from '../core.reducers';
+import { DSpaceObject } from '../shared/dspace-object.model';
+import { HALEndpointService } from '../shared/hal-endpoint.service';
+import { DataService } from './data.service';
+import { RemoteData } from './remote-data';
+import { RequestService } from './request.service';
+import { FindAllOptions } from './request.models';
+
+/* tslint:disable:max-classes-per-file */
+class DataServiceImpl extends DataService<NormalizedDSpaceObject, DSpaceObject> {
+  protected linkPath = 'dso';
+
+  constructor(
+    protected responseCache: ResponseCacheService,
+    protected requestService: RequestService,
+    protected rdbService: RemoteDataBuildService,
+    protected store: Store<CoreState>,
+    protected halService: HALEndpointService) {
+    super();
+  }
+
+  getBrowseEndpoint(options: FindAllOptions): Observable<string> {
+    return this.halService.getEndpoint(this.linkPath);
+  }
+
+  getFindByIDHref(endpoint, resourceID): string {
+    return endpoint.replace(/\{\?uuid\}/,`?uuid=${resourceID}`);
+  }
+}
+
+@Injectable()
+export class DSpaceObjectDataService {
+  protected linkPath = 'dso';
+  private dataService: DataServiceImpl;
+
+  constructor(
+    protected requestService: RequestService,
+    protected rdbService: RemoteDataBuildService,
+    protected halService: HALEndpointService) {
+    this.dataService = new DataServiceImpl(null, requestService, rdbService, null, halService);
+  }
+
+  findById(uuid: string): Observable<RemoteData<DSpaceObject>> {
+    return this.dataService.findById(uuid);
+  }
+}
diff --git a/src/app/core/data/paginated-list.ts b/src/app/core/data/paginated-list.ts
index 21cc13f3fa..07d53739d0 100644
--- a/src/app/core/data/paginated-list.ts
+++ b/src/app/core/data/paginated-list.ts
@@ -8,7 +8,7 @@ export class PaginatedList<T> {
   }
 
   get elementsPerPage(): number {
-    if (hasValue(this.pageInfo)) {
+    if (hasValue(this.pageInfo) && hasValue(this.pageInfo.elementsPerPage)) {
       return this.pageInfo.elementsPerPage;
     }
     return this.page.length;
@@ -19,7 +19,7 @@ export class PaginatedList<T> {
   }
 
   get totalElements(): number {
-    if (hasValue(this.pageInfo)) {
+    if (hasValue(this.pageInfo) && hasValue(this.pageInfo.totalElements)) {
       return this.pageInfo.totalElements;
     }
     return this.page.length;
@@ -30,7 +30,7 @@ export class PaginatedList<T> {
   }
 
   get totalPages(): number {
-    if (hasValue(this.pageInfo)) {
+    if (hasValue(this.pageInfo) && hasValue(this.pageInfo.totalPages)) {
       return this.pageInfo.totalPages;
     }
     return 1;
@@ -41,7 +41,7 @@ export class PaginatedList<T> {
   }
 
   get currentPage(): number {
-    if (hasValue(this.pageInfo)) {
+    if (hasValue(this.pageInfo) && hasValue(this.pageInfo.currentPage)) {
       return this.pageInfo.currentPage;
     }
     return 1;
diff --git a/src/app/core/data/registry-metadatafields-response-parsing.service.ts b/src/app/core/data/registry-metadatafields-response-parsing.service.ts
index 2620916070..1fe8b1e15f 100644
--- a/src/app/core/data/registry-metadatafields-response-parsing.service.ts
+++ b/src/app/core/data/registry-metadatafields-response-parsing.service.ts
@@ -1,15 +1,13 @@
 import {
-  RegistryMetadatafieldsSuccessResponse, RegistryMetadataschemasSuccessResponse,
+  RegistryMetadatafieldsSuccessResponse,
   RestResponse
 } from '../cache/response-cache.models';
 import { DSpaceRESTV2Response } from '../dspace-rest-v2/dspace-rest-v2-response.model';
 import { RestRequest } from './request.models';
 import { ResponseParsingService } from './parsing.service';
-import { RegistryMetadataschemasResponse } from '../registry/registry-metadataschemas-response.model';
 import { DSpaceRESTv2Serializer } from '../dspace-rest-v2/dspace-rest-v2.serializer';
 import { DSOResponseParsingService } from './dso-response-parsing.service';
 import { Injectable } from '@angular/core';
-import { forEach } from '@angular/router/src/utils/collection';
 import { RegistryMetadatafieldsResponse } from '../registry/registry-metadatafields-response.model';
 
 @Injectable()
diff --git a/src/app/core/data/search-response-parsing.service.ts b/src/app/core/data/search-response-parsing.service.ts
index c7456aa2f9..4039b8f761 100644
--- a/src/app/core/data/search-response-parsing.service.ts
+++ b/src/app/core/data/search-response-parsing.service.ts
@@ -5,8 +5,7 @@ import { ResponseParsingService } from './parsing.service';
 import { RestRequest } from './request.models';
 import { DSpaceRESTV2Response } from '../dspace-rest-v2/dspace-rest-v2-response.model';
 import { DSpaceRESTv2Serializer } from '../dspace-rest-v2/dspace-rest-v2.serializer';
-import { PageInfo } from '../shared/page-info.model';
-import { hasValue, isNotEmpty } from '../../shared/empty.util';
+import { hasValue } from '../../shared/empty.util';
 import { SearchQueryResponse } from '../../+search-page/search-service/search-query-response.model';
 import { Metadatum } from '../shared/metadatum.model';
 
@@ -16,7 +15,7 @@ export class SearchResponseParsingService implements ResponseParsingService {
   }
 
   parse(request: RestRequest, data: DSpaceRESTV2Response): RestResponse {
-    const payload = data.payload;
+    const payload = data.payload._embedded.searchResult;
     const hitHighlights = payload._embedded.objects
       .map((object) => object.hitHighlights)
       .map((hhObject) => {
@@ -56,6 +55,6 @@ export class SearchResponseParsingService implements ResponseParsingService {
       }));
     payload.objects = objects;
     const deserialized = new DSpaceRESTv2Serializer(SearchQueryResponse).deserialize(payload);
-    return new SearchSuccessResponse(deserialized, data.statusCode, this.dsoParser.processPageInfo(data.payload));
+    return new SearchSuccessResponse(deserialized, data.statusCode, this.dsoParser.processPageInfo(payload));
   }
 }
diff --git a/src/app/core/integration/integration-response-parsing.service.spec.ts b/src/app/core/integration/integration-response-parsing.service.spec.ts
index e2e2f92d5a..9c3e5b0344 100644
--- a/src/app/core/integration/integration-response-parsing.service.spec.ts
+++ b/src/app/core/integration/integration-response-parsing.service.spec.ts
@@ -8,6 +8,8 @@ import { CoreState } from '../core.reducers';
 import { IntegrationResponseParsingService } from './integration-response-parsing.service';
 import { IntegrationRequest } from '../data/request.models';
 import { AuthorityValueModel } from './models/authority-value.model';
+import { PageInfo } from '../shared/page-info.model';
+import { PaginatedList } from '../data/paginated-list';
 
 describe('IntegrationResponseParsingService', () => {
   let service: IntegrationResponseParsingService;
@@ -78,7 +80,7 @@ describe('IntegrationResponseParsingService', () => {
 
         },
         _links: {
-          self: 'https://rest.api/integration/authorities/type/entries'
+          self: { href: 'https://rest.api/integration/authorities/type/entries' }
         }
       },
       statusCode: '200'
@@ -141,39 +143,44 @@ describe('IntegrationResponseParsingService', () => {
       },
       statusCode: '200'
     };
-
-    const definitions = [
-      Object.assign(new AuthorityValueModel(), {
+    const pageinfo = Object.assign(new PageInfo(), { elementsPerPage: 5, totalElements: 5, totalPages: 1, currentPage: 1 });
+    const definitions = new PaginatedList(pageinfo,[
+      Object.assign({}, new AuthorityValueModel(), {
+        type: 'authority',
         display: 'One',
         id: 'One',
-        otherInformation: {},
+        otherInformation: undefined,
         value: 'One'
       }),
-      Object.assign(new AuthorityValueModel(), {
+      Object.assign({}, new AuthorityValueModel(), {
+        type: 'authority',
         display: 'Two',
         id: 'Two',
-        otherInformation: {},
+        otherInformation: undefined,
         value: 'Two'
       }),
-      Object.assign(new AuthorityValueModel(), {
+      Object.assign({}, new AuthorityValueModel(), {
+        type: 'authority',
         display: 'Three',
         id: 'Three',
-        otherInformation: {},
+        otherInformation: undefined,
         value: 'Three'
       }),
-      Object.assign(new AuthorityValueModel(), {
+      Object.assign({}, new AuthorityValueModel(), {
+        type: 'authority',
         display: 'Four',
         id: 'Four',
-        otherInformation: {},
+        otherInformation: undefined,
         value: 'Four'
       }),
-      Object.assign(new AuthorityValueModel(), {
+      Object.assign({}, new AuthorityValueModel(), {
+        type: 'authority',
         display: 'Five',
         id: 'Five',
-        otherInformation: {},
+        otherInformation: undefined,
         value: 'Five'
       })
-    ];
+    ]);
 
     it('should return a IntegrationSuccessResponse if data contains a valid endpoint response', () => {
       const response = service.parse(validRequest, validResponse);
diff --git a/src/app/core/integration/integration-response-parsing.service.ts b/src/app/core/integration/integration-response-parsing.service.ts
index 5d6ce09114..06c6b9620d 100644
--- a/src/app/core/integration/integration-response-parsing.service.ts
+++ b/src/app/core/integration/integration-response-parsing.service.ts
@@ -33,7 +33,7 @@ export class IntegrationResponseParsingService extends BaseResponseParsingServic
   parse(request: RestRequest, data: DSpaceRESTV2Response): RestResponse {
     if (isNotEmpty(data.payload) && isNotEmpty(data.payload._links)) {
       const dataDefinition = this.process<IntegrationModel,IntegrationType>(data.payload, request.href);
-      return new IntegrationSuccessResponse(dataDefinition[Object.keys(dataDefinition)[0]], data.statusCode, this.processPageInfo(data.payload.page));
+      return new IntegrationSuccessResponse(dataDefinition, data.statusCode, this.processPageInfo(data.payload.page));
     } else {
       return new ErrorResponse(
         Object.assign(
diff --git a/src/app/core/metadata/metadata.service.ts b/src/app/core/metadata/metadata.service.ts
index 39fb454ac5..cf597195e9 100644
--- a/src/app/core/metadata/metadata.service.ts
+++ b/src/app/core/metadata/metadata.service.ts
@@ -26,7 +26,7 @@ import { Metadatum } from '../shared/metadatum.model';
 
 import { GLOBAL_CONFIG, GlobalConfig } from '../../../config';
 import { BitstreamFormat } from '../shared/bitstream-format.model';
-import { hasValue } from '../../shared/empty.util';
+import { hasValue, isNotEmpty } from '../../shared/empty.util';
 
 @Injectable()
 export class MetadataService {
@@ -269,11 +269,9 @@ export class MetadataService {
   private setCitationPdfUrlTag(): void {
     if (this.currentObject.value instanceof Item) {
       const item = this.currentObject.value as Item;
-      // NOTE: Observable resolves many times with same data
-      // taking only two, fist one is empty array
-      item.getFiles().take(2).subscribe((bitstreams: Bitstream[]) => {
+      item.getFiles().filter((files) => isNotEmpty(files)).first().subscribe((bitstreams: Bitstream[]) => {
         for (const bitstream of bitstreams) {
-          bitstream.format.take(1)
+          bitstream.format.first()
             .map((rd: RemoteData<BitstreamFormat>) => rd.payload)
             .filter((format: BitstreamFormat) => hasValue(format))
             .subscribe((format: BitstreamFormat) => {
diff --git a/src/app/core/shared/bitstream-format.model.ts b/src/app/core/shared/bitstream-format.model.ts
index b85d9e2053..9af345e607 100644
--- a/src/app/core/shared/bitstream-format.model.ts
+++ b/src/app/core/shared/bitstream-format.model.ts
@@ -1,24 +1,55 @@
 
-import { autoserialize } from 'cerialize';
+import { CacheableObject } from '../cache/object-cache.reducer';
+import { ResourceType } from './resource-type';
 
-export class BitstreamFormat {
+/**
+ * Model class for a Bitstream Format
+ */
+export class BitstreamFormat implements CacheableObject {
 
-  @autoserialize
+  /**
+   * Short description of this Bitstream Format
+   */
   shortDescription: string;
 
-  @autoserialize
+  /**
+   * Description of this Bitstream Format
+   */
   description: string;
 
-  @autoserialize
+  /**
+   * String representing the MIME type of this Bitstream Format
+   */
   mimetype: string;
 
-  @autoserialize
+  /**
+   * The level of support the system offers for this Bitstream Format
+   */
   supportLevel: number;
 
-  @autoserialize
+  /**
+   * True if the Bitstream Format is used to store system information, rather than the content of items in the system
+   */
   internal: boolean;
 
-  @autoserialize
+  /**
+   * String representing this Bitstream Format's file extension
+   */
   extensions: string;
 
+  /**
+   * The link to the rest endpoint where this Bitstream Format can be found
+   */
+  self: string;
+
+  /**
+   * A ResourceType representing the kind of Object of this BitstreamFormat
+   */
+  type: ResourceType;
+
+  /**
+   * Universally unique identifier for this Bitstream Format
+   */
+  uuid: string;
+
 }
diff --git a/src/app/core/shared/community.model.ts b/src/app/core/shared/community.model.ts
index c34666b0f0..20bd50f4a9 100644
--- a/src/app/core/shared/community.model.ts
+++ b/src/app/core/shared/community.model.ts
@@ -3,6 +3,7 @@ import { Bitstream } from './bitstream.model';
 import { Collection } from './collection.model';
 import { RemoteData } from '../data/remote-data';
 import { Observable } from 'rxjs/Observable';
+import { PaginatedList } from '../data/paginated-list';
 
 export class Community extends DSpaceObject {
 
@@ -58,6 +59,8 @@ export class Community extends DSpaceObject {
    */
   owner: Observable<RemoteData<Community>>;
 
-  collections: Observable<RemoteData<Collection[]>>;
+  collections: Observable<RemoteData<PaginatedList<Collection>>>;
+
+  subcommunities: Observable<RemoteData<PaginatedList<Collection>>>;
 
 }
diff --git a/src/app/core/shared/config/config-submission-definitions.model.ts b/src/app/core/shared/config/config-submission-definitions.model.ts
index 8249d2b118..0247f13944 100644
--- a/src/app/core/shared/config/config-submission-definitions.model.ts
+++ b/src/app/core/shared/config/config-submission-definitions.model.ts
@@ -1,6 +1,7 @@
 import { autoserialize, autoserializeAs, inheritSerialization } from 'cerialize';
 import { ConfigObject } from './config.model';
 import { SubmissionSectionModel } from './config-submission-section.model';
+import { PaginatedList } from '../../data/paginated-list';
 
 @inheritSerialization(ConfigObject)
 export class SubmissionDefinitionsModel extends ConfigObject {
@@ -9,6 +10,6 @@ export class SubmissionDefinitionsModel extends ConfigObject {
   isDefault: boolean;
 
   @autoserializeAs(SubmissionSectionModel)
-  sections: SubmissionSectionModel[];
+  sections: PaginatedList<SubmissionSectionModel>;
 
 }
diff --git a/src/app/core/shared/item.model.ts b/src/app/core/shared/item.model.ts
index dd60ad9b01..cc84694e84 100644
--- a/src/app/core/shared/item.model.ts
+++ b/src/app/core/shared/item.model.ts
@@ -5,6 +5,7 @@ import { Collection } from './collection.model';
 import { RemoteData } from '../data/remote-data';
 import { Bitstream } from './bitstream.model';
 import { hasValue, isNotEmpty } from '../../shared/empty.util';
+import { PaginatedList } from '../data/paginated-list';
 
 export class Item extends DSpaceObject {
 
@@ -47,7 +48,7 @@ export class Item extends DSpaceObject {
     return this.owningCollection;
   }
 
-  bitstreams: Observable<RemoteData<Bitstream[]>>;
+  bitstreams: Observable<RemoteData<PaginatedList<Bitstream>>>;
 
   /**
    * Retrieves the thumbnail of this item
@@ -88,7 +89,7 @@ export class Item extends DSpaceObject {
    */
   getBitstreamsByBundleName(bundleName: string): Observable<Bitstream[]> {
     return this.bitstreams
-      .map((rd: RemoteData<Bitstream[]>) => rd.payload)
+      .map((rd: RemoteData<PaginatedList<Bitstream>>) => rd.payload.page)
       .filter((bitstreams: Bitstream[]) => hasValue(bitstreams))
       .startWith([])
       .map((bitstreams) => {
diff --git a/src/app/core/shared/operators.ts b/src/app/core/shared/operators.ts
index 1efc7885c8..887210c296 100644
--- a/src/app/core/shared/operators.ts
+++ b/src/app/core/shared/operators.ts
@@ -1,5 +1,5 @@
 import { Observable } from 'rxjs/Observable';
-import { filter, flatMap, map, tap } from 'rxjs/operators';
+import { filter, first, flatMap, map, tap } from 'rxjs/operators';
 import { hasValueOperator, isNotEmpty } from '../../shared/empty.util';
 import { DSOSuccessResponse } from '../cache/response-cache.models';
 import { ResponseCacheEntry } from '../cache/response-cache.reducer';
@@ -47,6 +47,10 @@ export const getRemoteDataPayload = () =>
   <T>(source: Observable<RemoteData<T>>): Observable<T> =>
     source.pipe(map((remoteData: RemoteData<T>) => remoteData.payload));
 
+export const getSucceededRemoteData = () =>
+  <T>(source: Observable<RemoteData<T>>): Observable<RemoteData<T>> =>
+    source.pipe(first((rd: RemoteData<T>) => rd.hasSucceeded));
+
 /**
  * Get the browse links from a definition by ID given an array of all definitions
  * @param {string} definitionID
diff --git a/src/app/core/shared/resource-policy.model.ts b/src/app/core/shared/resource-policy.model.ts
new file mode 100644
index 0000000000..cccbea1e89
--- /dev/null
+++ b/src/app/core/shared/resource-policy.model.ts
@@ -0,0 +1,40 @@
+import { CacheableObject } from '../cache/object-cache.reducer';
+import { ResourceType } from './resource-type';
+import { Group } from '../eperson/models/group.model';
+import { ActionType } from '../cache/models/action-type.model';
+
+/**
+ * Model class for a Resource Policy
+ */
+export class ResourcePolicy implements CacheableObject {
+  /**
+   * The action that is allowed by this Resource Policy
+   */
+  action: ActionType;
+
+  /**
+   * The name for this Resource Policy
+   */
+  name: string;
+
+  /**
+   * The Group this Resource Policy applies to
+   */
+  group: Group;
+
+  /**
+   * The link to the rest endpoint where this Resource Policy can be found
+   */
+  self: string;
+
+  /**
+   * A ResourceType representing the kind of Object of this ResourcePolicy
+   */
+  type: ResourceType;
+
+  /**
+   * The universally unique identifier for this Resource Policy
+   */
+  uuid: string;
+
+}
diff --git a/src/app/core/shared/resource-type.ts b/src/app/core/shared/resource-type.ts
index b774188f63..71053f628b 100644
--- a/src/app/core/shared/resource-type.ts
+++ b/src/app/core/shared/resource-type.ts
@@ -8,4 +8,5 @@ export enum ResourceType {
   Community = 'community',
   Eperson = 'eperson',
   Group = 'group',
+  ResourcePolicy = 'resourcePolicy'
 }
diff --git a/src/app/core/shared/view-mode.model.ts b/src/app/core/shared/view-mode.model.ts
new file mode 100644
index 0000000000..b026d68431
--- /dev/null
+++ b/src/app/core/shared/view-mode.model.ts
@@ -0,0 +1,8 @@
+/**
+ * This enumeration represents all possible ways of representing a group of objects in the UI
+ */
+
+export enum ViewMode {
+  List = 'list',
+  Grid = 'grid'
+}
diff --git a/src/app/shared/input-suggestions/input-suggestions.component.html b/src/app/shared/input-suggestions/input-suggestions.component.html
new file mode 100644
index 0000000000..bbe090dac0
--- /dev/null
+++ b/src/app/shared/input-suggestions/input-suggestions.component.html
@@ -0,0 +1,21 @@
+<form #form="ngForm" (ngSubmit)="submitSuggestion.emit(ngModel)"
+      [action]="action" (keydown)="onKeydown($event)"
+      (keydown.arrowdown)="shiftFocusDown($event)"
+      (keydown.arrowup)="shiftFocusUp($event)" (keydown.esc)="close()"
+      (dsClickOutside)="close()">
+    <input #inputField type="text" [(ngModel)]="ngModel" [name]="name"
+           class="form-control suggestion_input"
+           [dsDebounce]="debounceTime" (onDebounce)="find($event)"
+           [placeholder]="placeholder"
+           [ngModelOptions]="{standalone: true}" autocomplete="off"/>
+    <input type="submit" class="d-none"/>
+    <div class="autocomplete dropdown-menu" [ngClass]="{'show': (show | async) && isNotEmpty(suggestions)}">
+        <ul class="list-unstyled">
+            <li *ngFor="let suggestionOption of suggestions">
+                <a href="#" class="d-block dropdown-item"  (click)="onClickSuggestion(suggestionOption.value)" #suggestion>
+                    <span [innerHTML]="suggestionOption.displayValue"></span>
+                </a>
+            </li>
+        </ul>
+    </div>
+</form>
\ No newline at end of file
diff --git a/src/app/shared/input-suggestions/input-suggestions.component.scss b/src/app/shared/input-suggestions/input-suggestions.component.scss
new file mode 100644
index 0000000000..bea74cf7af
--- /dev/null
+++ b/src/app/shared/input-suggestions/input-suggestions.component.scss
@@ -0,0 +1,17 @@
+.autocomplete {
+    width: 100%;
+    .dropdown-item {
+        white-space: normal;
+        word-break: break-word;
+        &:focus {
+            outline: none;
+        }
+    }
+}
+
+form {
+    position: relative;
+    .dropdown-menu {
+        position: absolute;
+    }
+}
\ No newline at end of file
diff --git a/src/app/shared/input-suggestions/input-suggestions.component.spec.ts b/src/app/shared/input-suggestions/input-suggestions.component.spec.ts
new file mode 100644
index 0000000000..8b6cdd2aa5
--- /dev/null
+++ b/src/app/shared/input-suggestions/input-suggestions.component.spec.ts
@@ -0,0 +1,306 @@
+import { ChangeDetectionStrategy, DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+
+import { TranslateModule } from '@ngx-translate/core';
+import { InputSuggestionsComponent } from './input-suggestions.component';
+import { By } from '@angular/platform-browser';
+import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
+import { FormsModule } from '@angular/forms';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { RouterTestingModule } from '@angular/router/testing';
+
+describe('InputSuggestionsComponent', () => {
+
+  let comp: InputSuggestionsComponent;
+  let fixture: ComponentFixture<InputSuggestionsComponent>;
+  let de: DebugElement;
+  let el: HTMLElement;
+  const suggestions = [{displayValue: 'suggestion uno', value: 'suggestion uno'}, {displayValue: 'suggestion dos', value: 'suggestion dos'}, {displayValue: 'suggestion tres', value: 'suggestion tres'}];
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot(), RouterTestingModule.withRoutes([]), NoopAnimationsModule, FormsModule],
+      declarations: [InputSuggestionsComponent],
+      providers: [],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).overrideComponent(InputSuggestionsComponent, {
+      set: { changeDetection: ChangeDetectionStrategy.Default }
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(InputSuggestionsComponent);
+
+    comp = fixture.componentInstance; // LoadingComponent test instance
+    comp.suggestions = suggestions;
+    // query for the message <label> by CSS element selector
+    de = fixture.debugElement;
+    el = de.nativeElement;
+    comp.show.next(true);
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(comp).toBeTruthy();
+  });
+
+  describe('when the input field is in focus', () => {
+
+    beforeEach(() => {
+      const inputElement = de.query(By.css('.suggestion_input'));
+      inputElement.nativeElement.focus();
+      fixture.detectChanges();
+
+    });
+
+    it('should not have any element in focus', () => {
+      const activeElement = el.ownerDocument.activeElement;
+      expect(activeElement.nodeName.toLowerCase()).not.toEqual('a');
+    });
+
+    describe('when key up is pressed', () => {
+      beforeEach(() => {
+        spyOn(comp, 'shiftFocusUp');
+        const form = de.query(By.css('form'));
+        form.triggerEventHandler('keydown.arrowup', {});
+        fixture.detectChanges();
+      });
+
+      it('should call shiftFocusUp()', () => {
+        expect(comp.shiftFocusUp).toHaveBeenCalled();
+      });
+    });
+
+    describe('when shiftFocusUp() is triggered', () => {
+      beforeEach(() => {
+        comp.shiftFocusUp(new KeyboardEvent('keydown.arrowup'));
+        fixture.detectChanges();
+      });
+
+      it('should put the focus on the last element ', () => {
+        const lastLink = de.query(By.css('.list-unstyled > li:last-child a'));
+        const activeElement = el.ownerDocument.activeElement;
+        expect(activeElement).toEqual(lastLink.nativeElement);
+      });
+    });
+
+    describe('when key down is pressed', () => {
+      beforeEach(() => {
+        spyOn(comp, 'shiftFocusDown');
+        const form = de.query(By.css('form'));
+        form.triggerEventHandler('keydown.arrowdown', {});
+        fixture.detectChanges();
+      });
+
+      it('should call shiftFocusDown()', () => {
+        expect(comp.shiftFocusDown).toHaveBeenCalled();
+      });
+    });
+
+    describe('when shiftFocusDown() is triggered', () => {
+      beforeEach(() => {
+        comp.shiftFocusDown(new KeyboardEvent('keydown.arrowdown'));
+        fixture.detectChanges();
+      });
+
+      it('should put the focus on the first element ', () => {
+        const firstLink = de.query(By.css('.list-unstyled > li:first-child a'));
+        const activeElement = el.ownerDocument.activeElement;
+        expect(activeElement).toEqual(firstLink.nativeElement);
+      });
+    });
+
+    describe('when changeFocus() is triggered when selectedIndex is 1', () => {
+      beforeEach(() => {
+        comp.selectedIndex = 1;
+        comp.changeFocus();
+        fixture.detectChanges();
+      });
+
+      it('should put the focus on the second element', () => {
+        const secondLink = de.query(By.css('.list-unstyled > li:nth-child(2) a'));
+        const activeElement = el.ownerDocument.activeElement;
+        expect(activeElement).toEqual(secondLink.nativeElement);
+      });
+    });
+  });
+
+  describe('when the first element is in focus', () => {
+    beforeEach(() => {
+      const firstLink = de.query(By.css('.list-unstyled > li:first-child a'));
+      firstLink.nativeElement.focus();
+      comp.selectedIndex = 0;
+      fixture.detectChanges();
+
+    });
+
+    describe('when shiftFocusUp() is triggered', () => {
+      beforeEach(() => {
+        comp.shiftFocusUp(new KeyboardEvent('keydown.arrowup'));
+        fixture.detectChanges();
+      });
+
+      it('should put the focus on the last element ', () => {
+        const lastLink = de.query(By.css('.list-unstyled > li:last-child a'));
+        const activeElement = el.ownerDocument.activeElement;
+        expect(activeElement).toEqual(lastLink.nativeElement);
+      });
+    });
+
+    describe('when shiftFocusDown() is triggered', () => {
+      beforeEach(() => {
+        comp.shiftFocusDown(new KeyboardEvent('keydown.arrowdown'));
+        fixture.detectChanges();
+      });
+
+      it('should put the focus on the second element ', () => {
+        const secondLink = de.query(By.css('.list-unstyled > li:nth-child(2) a'));
+        const activeElement = el.ownerDocument.activeElement;
+        expect(activeElement).toEqual(secondLink.nativeElement);
+      });
+    });
+  });
+
+  describe('when the last element is in focus', () => {
+    beforeEach(() => {
+      const lastLink = de.query(By.css('.list-unstyled > li:last-child a'));
+      lastLink.nativeElement.focus();
+      comp.selectedIndex = suggestions.length - 1;
+      fixture.detectChanges();
+
+    });
+
+    describe('when shiftFocusUp() is triggered', () => {
+      beforeEach(() => {
+        comp.shiftFocusUp(new KeyboardEvent('keydown.arrowup'));
+        fixture.detectChanges();
+      });
+
+      it('should put the focus on the second last element ', () => {
+        const secondLastLink = de.query(By.css('.list-unstyled > li:nth-last-child(2) a'));
+        const activeElement = el.ownerDocument.activeElement;
+        expect(activeElement).toEqual(secondLastLink.nativeElement);
+      });
+    });
+
+    describe('when shiftFocusDown() is triggered', () => {
+      beforeEach(() => {
+        comp.shiftFocusDown(new KeyboardEvent('keydown.arrowdown'));
+        fixture.detectChanges();
+      });
+
+      it('should put the focus on the first element ', () => {
+        const firstLink = de.query(By.css('.list-unstyled > li:first-child a'));
+        const activeElement = el.ownerDocument.activeElement;
+        expect(activeElement).toEqual(firstLink.nativeElement);
+      });
+    });
+
+    describe('when any key but is pressed in the form', () => {
+      beforeEach(() => {
+        spyOn(comp, 'onKeydown');
+        const form = de.query(By.css('form'));
+        form.triggerEventHandler('keydown', { key: 'Shift' });
+        fixture.detectChanges();
+      });
+
+      it('should call onKeydown', () => {
+        expect(comp.onKeydown).toHaveBeenCalled();
+        fixture.detectChanges();
+      })
+    });
+    describe('when onKeydown is triggered with the Enter key', () => {
+      beforeEach(() => {
+        spyOn(comp.queryInput.nativeElement, 'focus');
+        comp.onKeydown(new KeyboardEvent('keydown', {key: 'Enter'}));
+        fixture.detectChanges();
+      });
+
+      it('should not change the focus', () => {
+        expect(comp.queryInput.nativeElement.focus).not.toHaveBeenCalled();
+      });
+
+    });
+
+    describe('when onKeydown is triggered with the any other (not-Enter) key', () => {
+      beforeEach(() => {
+        spyOn(comp.queryInput.nativeElement, 'focus');
+        comp.onKeydown(new KeyboardEvent('keydown', {key: 'Shift'}));
+        fixture.detectChanges();
+      });
+
+      it('should change the focus', () => {
+        expect(comp.queryInput.nativeElement.focus).toHaveBeenCalled();
+      });
+
+    });
+  });
+
+  describe('when the suggestions list is not empty and show is true', () => {
+    beforeEach(() => {
+      comp.show.next(true);
+      fixture.detectChanges();
+    });
+    it('should contain an .autocomplete list with a \'show\' class', () => {
+      const autocomplete = de.query(By.css('div.autocomplete'));
+      expect(autocomplete.nativeElement.classList).toContain('show');
+    });
+  });
+
+  describe('when the suggestions list is not empty and show is false', () => {
+    beforeEach(() => {
+      comp.show.next(false);
+      fixture.detectChanges();
+    });
+    it('should contain an .autocomplete list without a \'show\' class', () => {
+      const autocomplete = de.query(By.css('div.autocomplete'));
+      expect(autocomplete.nativeElement.classList).not.toContain('show');
+    });
+  });
+
+  describe('when the suggestions list is empty and show is false', () => {
+    beforeEach(() => {
+      comp.suggestions = [];
+      comp.show.next(false);
+      fixture.detectChanges();
+    });
+    it('should contain an .autocomplete list without a \'show\' class', () => {
+      const autocomplete = de.query(By.css('div.autocomplete'));
+      expect(autocomplete.nativeElement.classList).not.toContain('show');
+    });
+  });
+  describe('when the suggestions list is empty and show is true', () => {
+    beforeEach(() => {
+      comp.suggestions = [];
+      comp.show.next(true);
+      fixture.detectChanges();
+    });
+    it('should contain an .autocomplete list without a \'show\' class', () => {
+      const autocomplete = de.query(By.css('div.autocomplete'));
+      expect(autocomplete.nativeElement.classList).not.toContain('show');
+    });
+  });
+  describe('when the variable \'show\' is set to true and close() is called', () => {
+    beforeEach(() => {
+      comp.show.next(true);
+      comp.close();
+      fixture.detectChanges();
+    });
+    it('should set \'show\' to false', () => {
+      expect(comp.show.getValue()).toBeFalsy();
+    });
+  });
+
+  describe('when an element is clicked', () => {
+    const clickedIndex = 0;
+    beforeEach(() => {
+      spyOn(comp, 'onClickSuggestion');
+      const clickedLink = de.query(By.css('.list-unstyled > li:nth-child(' + (clickedIndex + 1) + ') a'));
+      clickedLink.triggerEventHandler('click', {} );
+      fixture.detectChanges();
+    });
+    it('should call onClickSuggestion() with the suggestion as a parameter', () => {
+      expect(comp.onClickSuggestion).toHaveBeenCalledWith(suggestions[clickedIndex].value);
+    });
+  });
+
+});
diff --git a/src/app/shared/input-suggestions/input-suggestions.component.ts b/src/app/shared/input-suggestions/input-suggestions.component.ts
new file mode 100644
index 0000000000..eb28583eaa
--- /dev/null
+++ b/src/app/shared/input-suggestions/input-suggestions.component.ts
@@ -0,0 +1,191 @@
+import {
+  Component,
+  ElementRef, EventEmitter,
+  Input,
+  Output,
+  QueryList, SimpleChanges,
+  ViewChild,
+  ViewChildren
+} from '@angular/core';
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { hasValue, isNotEmpty } from '../empty.util';
+
+@Component({
+  selector: 'ds-input-suggestions',
+  styleUrls: ['./input-suggestions.component.scss'],
+  templateUrl: './input-suggestions.component.html'
+})
+
+/**
+ * Component representing a form with a autocomplete functionality
+ */
+export class InputSuggestionsComponent {
+  /**
+   * The suggestions that should be shown
+   */
+  @Input() suggestions: any[] = [];
+
+  /**
+   * The time waited to detect if any other input will follow before requesting the suggestions
+   */
+  @Input() debounceTime = 500;
+
+  /**
+   * Placeholder attribute for the input field
+   */
+  @Input() placeholder = '';
+
+  /**
+   * Action attribute for the form
+   */
+  @Input() action;
+
+  /**
+   * Name attribute for the input field
+   */
+  @Input() name;
+
+  /**
+   * Value of the input field
+   */
+  @Input() ngModel;
+
+  /**
+   * Output for when the input field's value changes
+   */
+  @Output() ngModelChange = new EventEmitter();
+
+  /**
+   * Output for when the form is submitted
+   */
+  @Output() submitSuggestion = new EventEmitter();
+
+  /**
+   * Output for when a suggestion is clicked
+   */
+  @Output() clickSuggestion = new EventEmitter();
+
+  /**
+   * Output for when new suggestions should be requested
+   */
+  @Output() findSuggestions = new EventEmitter();
+
+  /**
+   * Emits true when the list of suggestions should be shown
+   */
+  show = new BehaviorSubject<boolean>(false);
+
+  /**
+   * Index of the currently selected suggestion
+   */
+  selectedIndex = -1;
+
+  /**
+   * True when the dropdown should not reopen
+   */
+  blockReopen = false;
+
+  /**
+   * Reference to the input field component
+   */
+  @ViewChild('inputField') queryInput: ElementRef;
+  /**
+   * Reference to the suggestion components
+   */
+  @ViewChildren('suggestion') resultViews: QueryList<ElementRef>;
+
+  /**
+   * When any of the inputs change, check if we should still show the suggestions
+   */
+  ngOnChanges(changes: SimpleChanges) {
+    if (hasValue(changes.suggestions)) {
+      this.show.next(isNotEmpty(changes.suggestions.currentValue));
+    }
+  }
+
+  /**
+   * Move the focus on one of the suggestions up to the previous suggestion
+   * When no suggestion is currently in focus OR the first suggestion is in focus: shift to the last suggestion
+   */
+  shiftFocusUp(event: KeyboardEvent) {
+    event.preventDefault();
+    if (this.selectedIndex > 0) {
+      this.selectedIndex--;
+      this.selectedIndex = (this.selectedIndex + this.resultViews.length) % this.resultViews.length; // Prevent negative modulo outcome
+    } else {
+      this.selectedIndex = this.resultViews.length - 1;
+    }
+    this.changeFocus();
+  }
+
+  /**
+   * Move the focus on one of the suggestions up to the next suggestion
+   * When no suggestion is currently in focus OR the last suggestion is in focus: shift to the first suggestion
+   */
+  shiftFocusDown(event: KeyboardEvent) {
+    event.preventDefault();
+    if (this.selectedIndex >= 0) {
+      this.selectedIndex++;
+      this.selectedIndex %= this.resultViews.length;
+    } else {
+      this.selectedIndex = 0;
+    }
+    this.changeFocus();
+  }
+
+  /**
+   * Perform the change of focus to the current selectedIndex
+   */
+  changeFocus() {
+    if (this.resultViews.length > 0) {
+      this.resultViews.toArray()[this.selectedIndex].nativeElement.focus();
+    }
+  }
+
+  /**
+   * When any key is pressed (except for the Enter button) the query input should move to the input field
+   * @param {KeyboardEvent} event The keyboard event
+   */
+  onKeydown(event: KeyboardEvent) {
+    if (event.key !== 'Enter') {
+      this.queryInput.nativeElement.focus();
+    }
+  }
+
+  /**
+   * Changes the show variable so the suggestion dropdown closes
+   */
+  close() {
+    this.show.next(false);
+  }
+
+  /**
+   * For usage of the isNotEmpty function in the template
+   */
+  isNotEmpty(data) {
+    return isNotEmpty(data);
+  }
+
+  /**
+   * Make sure that if a suggestion is clicked, the suggestions dropdown closes, does not reopen and the focus moves to the input field
+   */
+  onClickSuggestion(data) {
+    this.clickSuggestion.emit(data);
+    this.close();
+    this.blockReopen = true;
+    this.queryInput.nativeElement.focus();
+    return false;
+  }
+
+  /**
+   * Finds new suggestions when necessary
+   * @param data The query value to emit
+   */
+  find(data) {
+    if (!this.blockReopen) {
+      this.findSuggestions.emit(data);
+    }
+    this.blockReopen = false;
+  }
+
+}
diff --git a/src/app/shared/loading/loading.component.html b/src/app/shared/loading/loading.component.html
index 4f6b1a34fa..c628f75f7b 100644
--- a/src/app/shared/loading/loading.component.html
+++ b/src/app/shared/loading/loading.component.html
@@ -1,5 +1,5 @@
 <div>
-  <label>{{ message }}</label>
+  <label *ngIf="message">{{ message }}</label>
   <div class="loader">
     <span class="l-1"></span>
     <span class="l-2"></span>
diff --git a/src/app/shared/loading/loading.component.spec.ts b/src/app/shared/loading/loading.component.spec.ts
index aca9673282..3c58fa3e9e 100644
--- a/src/app/shared/loading/loading.component.spec.ts
+++ b/src/app/shared/loading/loading.component.spec.ts
@@ -34,7 +34,8 @@ describe('LoadingComponent (inline template)', () => {
     fixture = TestBed.createComponent(LoadingComponent);
 
     comp = fixture.componentInstance; // LoadingComponent test instance
-
+    comp.message = 'test message';
+    fixture.detectChanges();
     // query for the message <label> by CSS element selector
     de = fixture.debugElement.query(By.css('label'));
     el = de.nativeElement;
diff --git a/src/app/shared/mocks/mock-active-router.ts b/src/app/shared/mocks/mock-active-router.ts
index 391b9c3426..183d6c13d0 100644
--- a/src/app/shared/mocks/mock-active-router.ts
+++ b/src/app/shared/mocks/mock-active-router.ts
@@ -29,6 +29,6 @@ export class MockActivatedRoute {
 
   // ActivatedRoute.snapshot.params
   get snapshot() {
-    return { params: this.testParams };
+    return { params: this.testParams, queryParams: this.testParams };
   }
 }
diff --git a/src/app/shared/mocks/mock-item.ts b/src/app/shared/mocks/mock-item.ts
index 81c1fcf26c..f6dd0be861 100644
--- a/src/app/shared/mocks/mock-item.ts
+++ b/src/app/shared/mocks/mock-item.ts
@@ -17,78 +17,86 @@ export const MockItem: Item = Object.assign(new Item(), {
     errorMessage: '',
     statusCode: '202',
     pageInfo: {},
-    payload: [
-      {
-        sizeBytes: 10201,
-        content: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713/content',
-        format: Observable.of({
-          self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreamformats/10',
-          requestPending: false,
-          responsePending: false,
-          isSuccessful: true,
-          errorMessage: '',
-          statusCode: '202',
-          pageInfo: {},
-          payload: {
-            shortDescription: 'Microsoft Word XML',
-            description: 'Microsoft Word XML',
-            mimetype: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
-            supportLevel: 0,
-            internal: false,
-            extensions: null,
-            self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreamformats/10'
-          }
-        }),
-        bundleName: 'ORIGINAL',
-        self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713',
-        id: 'cf9b0c8e-a1eb-4b65-afd0-567366448713',
-        uuid: 'cf9b0c8e-a1eb-4b65-afd0-567366448713',
-        type: 'bitstream',
-        name: 'test_word.docx',
-        metadata: [
-          {
-            key: 'dc.title',
-            language: null,
-            value: 'test_word.docx'
-          }
-        ]
+    payload: {
+      pageInfo: {
+        elementsPerPage: 20,
+        totalElements: 3,
+        totalPages: 1,
+        currentPage: 2
       },
-      {
-        sizeBytes: 31302,
-        content: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/99b00f3c-1cc6-4689-8158-91965bee6b28/content',
-        format: Observable.of({
-          self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreamformats/4',
-          requestPending: false,
-          responsePending: false,
-          isSuccessful: true,
-          errorMessage: '',
-          statusCode: '202',
-          pageInfo: {},
-          payload: {
-            shortDescription: 'Adobe PDF',
-            description: 'Adobe Portable Document Format',
-            mimetype: 'application/pdf',
-            supportLevel: 0,
-            internal: false,
-            extensions: null,
-            self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreamformats/4'
-          }
-        }),
-        bundleName: 'ORIGINAL',
-        self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/99b00f3c-1cc6-4689-8158-91965bee6b28',
-        id: '99b00f3c-1cc6-4689-8158-91965bee6b28',
-        uuid: '99b00f3c-1cc6-4689-8158-91965bee6b28',
-        type: 'bitstream',
-        name: 'test_pdf.pdf',
-        metadata: [
-          {
-            key: 'dc.title',
-            language: null,
-            value: 'test_pdf.pdf'
-          }
-        ]
-      }
-    ]
+      page: [
+        {
+          sizeBytes: 10201,
+          content: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713/content',
+          format: Observable.of({
+            self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreamformats/10',
+            requestPending: false,
+            responsePending: false,
+            isSuccessful: true,
+            errorMessage: '',
+            statusCode: '202',
+            pageInfo: {},
+            payload: {
+              shortDescription: 'Microsoft Word XML',
+              description: 'Microsoft Word XML',
+              mimetype: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+              supportLevel: 0,
+              internal: false,
+              extensions: null,
+              self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreamformats/10'
+            }
+          }),
+          bundleName: 'ORIGINAL',
+          self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713',
+          id: 'cf9b0c8e-a1eb-4b65-afd0-567366448713',
+          uuid: 'cf9b0c8e-a1eb-4b65-afd0-567366448713',
+          type: 'bitstream',
+          name: 'test_word.docx',
+          metadata: [
+            {
+              key: 'dc.title',
+              language: null,
+              value: 'test_word.docx'
+            }
+          ]
+        },
+        {
+          sizeBytes: 31302,
+          content: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/99b00f3c-1cc6-4689-8158-91965bee6b28/content',
+          format: Observable.of({
+            self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreamformats/4',
+            requestPending: false,
+            responsePending: false,
+            isSuccessful: true,
+            errorMessage: '',
+            statusCode: '202',
+            pageInfo: {},
+            payload: {
+              shortDescription: 'Adobe PDF',
+              description: 'Adobe Portable Document Format',
+              mimetype: 'application/pdf',
+              supportLevel: 0,
+              internal: false,
+              extensions: null,
+              self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreamformats/4'
+            }
+          }),
+          bundleName: 'ORIGINAL',
+          self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/99b00f3c-1cc6-4689-8158-91965bee6b28',
+          id: '99b00f3c-1cc6-4689-8158-91965bee6b28',
+          uuid: '99b00f3c-1cc6-4689-8158-91965bee6b28',
+          type: 'bitstream',
+          name: 'test_pdf.pdf',
+          metadata: [
+            {
+              key: 'dc.title',
+              language: null,
+              value: 'test_pdf.pdf'
+            }
+          ]
+        }
+      ]
+    }
   }),
   self: 'https://dspace7.4science.it/dspace-spring-rest/api/core/items/0ec7ff22-f211-40ab-a69e-c819b0b1f357',
   id: '0ec7ff22-f211-40ab-a69e-c819b0b1f357',
diff --git a/src/app/shared/notifications/notification/notification.component.html b/src/app/shared/notifications/notification/notification.component.html
index 561e10263c..b35d6dee59 100644
--- a/src/app/shared/notifications/notification/notification.component.html
+++ b/src/app/shared/notifications/notification/notification.component.html
@@ -1,4 +1,4 @@
-<div class="alert {{notification.type}} alert-dismissible p-3" role="alert"
+<div class="alert {{notification.type}} alert-dismissible m-3 shadow" role="alert"
      [@enterLeave]="animate">
 
   <div class="notification-progress-loader position-absolute w-100" *ngIf="showProgressBar">
diff --git a/src/app/shared/notifications/notification/notification.component.scss b/src/app/shared/notifications/notification/notification.component.scss
index c433cd1e4d..1c8f0ae17c 100644
--- a/src/app/shared/notifications/notification/notification.component.scss
+++ b/src/app/shared/notifications/notification/notification.component.scss
@@ -1,5 +1,11 @@
 @import '../../../../styles/variables.scss';
 
+.alert {
+  display: inline-block;
+  min-width: $modal-sm;
+  text-align: left;
+}
+
 .close {
   outline: none !important
 }
diff --git a/src/app/shared/notifications/notifications-board/notifications-board.component.html b/src/app/shared/notifications/notifications-board/notifications-board.component.html
index d660444632..15f5044bc4 100644
--- a/src/app/shared/notifications/notifications-board/notifications-board.component.html
+++ b/src/app/shared/notifications/notifications-board/notifications-board.component.html
@@ -1,5 +1,6 @@
 <div class="notifications-wrapper position-fixed" [ngClass]="position">
   <ds-notification
+    class="notification"
     *ngFor="let a of notifications; let i = index"
     [notification]="a">
   </ds-notification>
diff --git a/src/app/shared/notifications/notifications-board/notifications-board.component.scss b/src/app/shared/notifications/notifications-board/notifications-board.component.scss
index 0dd1584c4e..47b1dba0c3 100644
--- a/src/app/shared/notifications/notifications-board/notifications-board.component.scss
+++ b/src/app/shared/notifications/notifications-board/notifications-board.component.scss
@@ -2,24 +2,28 @@
 @import '../../../../styles/mixins';
 
 .notifications-wrapper {
-  width: 300px;
-  z-index: 1051;
+  z-index: $zindex-popover;
+  text-align: right;
+  @include word-wrap;
+  .notification {
+    display: block;
+  }
 }
 
 .notifications-wrapper.left {
-  left: 20px;
+  left: 0;
 }
 
 .notifications-wrapper.top {
-  top: 20px;
+  top:0;
 }
 
 .notifications-wrapper.right {
-  right: 20px;
+  right: 0;
 }
 
 .notifications-wrapper.bottom {
-  bottom: 20px;
+  bottom: 0;
 }
 
 .notifications-wrapper.center {
@@ -39,7 +43,7 @@
 @media screen and (max-width: map-get($grid-breakpoints, sm)) {
   .notifications-wrapper {
     width: auto;
-    left: 20px;
-    right: 20px;
+    left: 0;
+    right: 0;
   }
 }
diff --git a/src/app/shared/object-collection/object-collection.component.spec.ts b/src/app/shared/object-collection/object-collection.component.spec.ts
index b27a342eac..0548efc967 100644
--- a/src/app/shared/object-collection/object-collection.component.spec.ts
+++ b/src/app/shared/object-collection/object-collection.component.spec.ts
@@ -1,13 +1,11 @@
 import { ObjectCollectionComponent } from './object-collection.component';
-import { ViewMode } from '../../+search-page/search-options.model';
-import { element } from 'protractor';
 import { By } from '@angular/platform-browser';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { Config } from '../../../config/config.interface';
-import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { NO_ERRORS_SCHEMA } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Observable } from 'rxjs/Observable';
 import { RouterStub } from '../testing/router-stub';
+import { ViewMode } from '../../core/shared/view-mode.model';
 
 describe('ObjectCollectionComponent', () => {
   let fixture: ComponentFixture<ObjectCollectionComponent>;
diff --git a/src/app/shared/object-collection/object-collection.component.ts b/src/app/shared/object-collection/object-collection.component.ts
index 3af92443c1..b4a436c5de 100644
--- a/src/app/shared/object-collection/object-collection.component.ts
+++ b/src/app/shared/object-collection/object-collection.component.ts
@@ -14,8 +14,8 @@ import { PaginationComponentOptions } from '../pagination/pagination-component-o
 import { SortDirection, SortOptions } from '../../core/cache/models/sort-options.model';
 
 import { ListableObject } from './shared/listable-object.model';
-import { ViewMode } from '../../+search-page/search-options.model';
 import { hasValue, isNotEmpty } from '../empty.util';
+import { ViewMode } from '../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-viewable-collection',
diff --git a/src/app/shared/object-collection/shared/dso-element-decorator.spec.ts b/src/app/shared/object-collection/shared/dso-element-decorator.spec.ts
index 9f54bebed9..9243d13b8e 100644
--- a/src/app/shared/object-collection/shared/dso-element-decorator.spec.ts
+++ b/src/app/shared/object-collection/shared/dso-element-decorator.spec.ts
@@ -1,6 +1,6 @@
-import { ViewMode } from '../../../+search-page/search-options.model';
 import { renderElementsFor } from './dso-element-decorator';
 import { Item } from '../../../core/shared/item.model';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 describe('ElementDecorator', () => {
   const gridDecorator = renderElementsFor(Item, ViewMode.Grid);
diff --git a/src/app/shared/object-collection/shared/dso-element-decorator.ts b/src/app/shared/object-collection/shared/dso-element-decorator.ts
index 51aa57bc50..98650fd25b 100644
--- a/src/app/shared/object-collection/shared/dso-element-decorator.ts
+++ b/src/app/shared/object-collection/shared/dso-element-decorator.ts
@@ -1,6 +1,6 @@
 import { GenericConstructor } from '../../../core/shared/generic-constructor';
 import { ListableObject } from './listable-object.model';
-import { ViewMode } from '../../../+search-page/search-options.model';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 const dsoElementMap = new Map();
 export function renderElementsFor(listable: GenericConstructor<ListableObject>, viewMode: ViewMode) {
diff --git a/src/app/shared/object-collection/shared/object-collection-element/abstract-listable-element.component.ts b/src/app/shared/object-collection/shared/object-collection-element/abstract-listable-element.component.ts
index d52036b5dc..59df86fdff 100644
--- a/src/app/shared/object-collection/shared/object-collection-element/abstract-listable-element.component.ts
+++ b/src/app/shared/object-collection/shared/object-collection-element/abstract-listable-element.component.ts
@@ -1,5 +1,6 @@
 import { Component, Inject } from '@angular/core';
 import { ListableObject } from '../listable-object.model';
+import { hasValue } from '../../../empty.util';
 
 @Component({
   selector: 'ds-abstract-object-element',
@@ -10,4 +11,8 @@ export class AbstractListableElementComponent <T extends ListableObject> {
   public constructor(@Inject('objectElementProvider') public listableObject: ListableObject) {
     this.object = listableObject as T;
   }
+
+  hasValue(data) {
+    return hasValue(data);
+  }
 }
diff --git a/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.ts b/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.ts
index f383367e3f..a690037619 100644
--- a/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.ts
+++ b/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.ts
@@ -2,8 +2,8 @@ import { Component, Inject } from '@angular/core';
 
 import { Collection } from '../../../core/shared/collection.model';
 import { renderElementsFor} from '../../object-collection/shared/dso-element-decorator';
-import { ViewMode } from '../../../+search-page/search-options.model';
 import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-collection-grid-element',
diff --git a/src/app/shared/object-grid/community-grid-element/community-grid-element.component.ts b/src/app/shared/object-grid/community-grid-element/community-grid-element.component.ts
index 21d73ff0fa..4df9ab9555 100644
--- a/src/app/shared/object-grid/community-grid-element/community-grid-element.component.ts
+++ b/src/app/shared/object-grid/community-grid-element/community-grid-element.component.ts
@@ -3,7 +3,7 @@ import { Component, Input, Inject } from '@angular/core';
 import { Community } from '../../../core/shared/community.model';
 import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
 import { renderElementsFor} from '../../object-collection/shared/dso-element-decorator';
-import { ViewMode } from '../../../+search-page/search-options.model';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-community-grid-element',
diff --git a/src/app/shared/object-grid/item-grid-element/item-grid-element.component.ts b/src/app/shared/object-grid/item-grid-element/item-grid-element.component.ts
index 5a8d46f1f2..7a679fef25 100644
--- a/src/app/shared/object-grid/item-grid-element/item-grid-element.component.ts
+++ b/src/app/shared/object-grid/item-grid-element/item-grid-element.component.ts
@@ -3,7 +3,7 @@ import { Component, Input, Inject } from '@angular/core';
 import { Item } from '../../../core/shared/item.model';
 import { renderElementsFor} from '../../object-collection/shared/dso-element-decorator';
 import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
-import { ViewMode } from '../../../+search-page/search-options.model';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-item-grid-element',
diff --git a/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.ts b/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.ts
index 7f8a3bb9fd..c1f27bee4f 100644
--- a/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.ts
+++ b/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.ts
@@ -3,8 +3,8 @@ import { Component } from '@angular/core';
 import { renderElementsFor} from '../../../object-collection/shared/dso-element-decorator';
 import { SearchResultGridElementComponent } from '../search-result-grid-element.component';
 import { Collection } from '../../../../core/shared/collection.model';
-import { ViewMode } from '../../../../+search-page/search-options.model';
 import { CollectionSearchResult } from '../../../object-collection/shared/collection-search-result.model';
+import { ViewMode } from '../../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-collection-search-result-grid-element',
diff --git a/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.ts b/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.ts
index 7c34207f5e..8fac11a6a4 100644
--- a/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.ts
+++ b/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.ts
@@ -2,8 +2,8 @@ import { Component } from '@angular/core';
 import { Community } from '../../../../core/shared/community.model';
 import { renderElementsFor } from '../../../object-collection/shared/dso-element-decorator';
 import { SearchResultGridElementComponent } from '../search-result-grid-element.component';
-import { ViewMode } from '../../../../+search-page/search-options.model';
 import { CommunitySearchResult } from '../../../object-collection/shared/community-search-result.model';
+import { ViewMode } from '../../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-community-search-result-grid-element',
diff --git a/src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.html b/src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.html
index 1cf14587ad..1e4f6f3c64 100644
--- a/src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.html
+++ b/src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.html
@@ -13,7 +13,7 @@
             <p *ngIf="dso.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']).length > 0"
                class="item-authors card-text text-muted">
                 <ds-truncatable-part [fixedHeight]="true" [id]="dso.id" [minLines]="1">
-                    <span *ngIf="dso.findMetadata('dc.date.issued').length > 0" class="item-date">{{dso.findMetadata("dc.date.issued")}}</span>
+                    <span *ngIf="hasValue(dso.findMetadata('dc.date.issued'))" class="item-date">{{dso.findMetadata("dc.date.issued")}}</span>
                     <span *ngFor="let authorMd of dso.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']);">,
                         <span [innerHTML]="authorMd.value"></span>
                     </span>
diff --git a/src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.ts b/src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.ts
index 518fc23a44..232c161779 100644
--- a/src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.ts
+++ b/src/app/shared/object-grid/search-result-grid-element/item-search-result/item-search-result-grid-element.component.ts
@@ -4,8 +4,8 @@ import { renderElementsFor } from '../../../object-collection/shared/dso-element
 import { SearchResultGridElementComponent } from '../search-result-grid-element.component';
 import { Item } from '../../../../core/shared/item.model';
 import { ItemSearchResult } from '../../../object-collection/shared/item-search-result.model';
-import { ViewMode } from '../../../../+search-page/search-options.model';
 import { focusShadow } from '../../../../shared/animations/focus';
+import { ViewMode } from '../../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-item-search-result-grid-element',
diff --git a/src/app/shared/object-grid/search-result-grid-element/search-result-grid-element.component.ts b/src/app/shared/object-grid/search-result-grid-element/search-result-grid-element.component.ts
index e6217eb0bb..5ab9f472b4 100644
--- a/src/app/shared/object-grid/search-result-grid-element/search-result-grid-element.component.ts
+++ b/src/app/shared/object-grid/search-result-grid-element/search-result-grid-element.component.ts
@@ -3,7 +3,7 @@ import { Component, Inject } from '@angular/core';
 import { SearchResult } from '../../../+search-page/search-result.model';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
 import { Metadatum } from '../../../core/shared/metadatum.model';
-import { isEmpty, hasNoValue } from '../../empty.util';
+import { isEmpty, hasNoValue, hasValue } from '../../empty.util';
 import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
 import { ListableObject } from '../../object-collection/shared/listable-object.model';
 import { TruncatableService } from '../../truncatable/truncatable.service';
@@ -60,4 +60,5 @@ export class SearchResultGridElementComponent<T extends SearchResult<K>, K exten
   isCollapsed(): Observable<boolean> {
     return this.truncatableService.isCollapsed(this.dso.id);
   }
+
 }
diff --git a/src/app/shared/object-grid/wrapper-grid-element/wrapper-grid-element.component.ts b/src/app/shared/object-grid/wrapper-grid-element/wrapper-grid-element.component.ts
index f807542e76..e16aac6799 100644
--- a/src/app/shared/object-grid/wrapper-grid-element/wrapper-grid-element.component.ts
+++ b/src/app/shared/object-grid/wrapper-grid-element/wrapper-grid-element.component.ts
@@ -1,8 +1,8 @@
 import { Component, Injector, Input, OnInit } from '@angular/core';
-import { ViewMode } from '../../../+search-page/search-options.model';
 import { GenericConstructor } from '../../../core/shared/generic-constructor';
 import { rendersDSOType } from '../../object-collection/shared/dso-element-decorator';
 import { ListableObject } from '../../object-collection/shared/listable-object.model';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-wrapper-grid-element',
diff --git a/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.ts b/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.ts
index 6581d4c4ae..44f6a8d051 100644
--- a/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.ts
+++ b/src/app/shared/object-list/browse-entry-list-element/browse-entry-list-element.component.ts
@@ -2,8 +2,8 @@ import { Component, Input, Inject } from '@angular/core';
 
 import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
 import { renderElementsFor } from '../../object-collection/shared/dso-element-decorator';
-import { ViewMode } from '../../../+search-page/search-options.model';
 import { BrowseEntry } from '../../../core/shared/browse-entry.model';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-browse-entry-list-element',
diff --git a/src/app/shared/object-list/collection-list-element/collection-list-element.component.ts b/src/app/shared/object-list/collection-list-element/collection-list-element.component.ts
index f95c087d5c..b4e9de16b7 100644
--- a/src/app/shared/object-list/collection-list-element/collection-list-element.component.ts
+++ b/src/app/shared/object-list/collection-list-element/collection-list-element.component.ts
@@ -2,8 +2,8 @@ import { Component, Inject } from '@angular/core';
 
 import { Collection } from '../../../core/shared/collection.model';
 import { renderElementsFor } from '../../object-collection/shared/dso-element-decorator';
-import { ViewMode } from '../../../+search-page/search-options.model';
 import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-collection-list-element',
diff --git a/src/app/shared/object-list/community-list-element/community-list-element.component.ts b/src/app/shared/object-list/community-list-element/community-list-element.component.ts
index e92c080a31..8f6870db7e 100644
--- a/src/app/shared/object-list/community-list-element/community-list-element.component.ts
+++ b/src/app/shared/object-list/community-list-element/community-list-element.component.ts
@@ -1,9 +1,9 @@
-import { Component, Input, Inject } from '@angular/core';
+import { Component } from '@angular/core';
 
 import { Community } from '../../../core/shared/community.model';
 import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
 import { renderElementsFor } from '../../object-collection/shared/dso-element-decorator';
-import { ViewMode } from '../../../+search-page/search-options.model';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-community-list-element',
diff --git a/src/app/shared/object-list/item-list-element/item-list-element.component.html b/src/app/shared/object-list/item-list-element/item-list-element.component.html
index 28b83b4000..711ce19037 100644
--- a/src/app/shared/object-list/item-list-element/item-list-element.component.html
+++ b/src/app/shared/object-list/item-list-element/item-list-element.component.html
@@ -11,8 +11,8 @@
                 <span *ngIf="!last">; </span>
             </span>
         </span>
-        (<span *ngIf="object.findMetadata('dc.publisher')" class="item-list-publisher">{{object.findMetadata("dc.publisher")}}, </span><span
-              *ngIf="object.findMetadata('dc.date.issued')" class="item-list-date">{{object.findMetadata("dc.date.issued")}}</span>)
+        (<span *ngIf="hasValue(object.findMetadata('dc.publisher'))" class="item-list-publisher">{{object.findMetadata("dc.publisher")}}, </span><span
+              *ngIf="hasValue(object.findMetadata('dc.date.issued'))" class="item-list-date">{{object.findMetadata("dc.date.issued")}}</span>)
       </span>
     </ds-truncatable-part>
     <ds-truncatable-part [id]="object.id" [minLines]="3">
diff --git a/src/app/shared/object-list/item-list-element/item-list-element.component.ts b/src/app/shared/object-list/item-list-element/item-list-element.component.ts
index e4efbd6b08..bc77b513fb 100644
--- a/src/app/shared/object-list/item-list-element/item-list-element.component.ts
+++ b/src/app/shared/object-list/item-list-element/item-list-element.component.ts
@@ -1,9 +1,9 @@
-import { Component, Input, Inject } from '@angular/core';
+import { Component } from '@angular/core';
 
 import { Item } from '../../../core/shared/item.model';
 import { AbstractListableElementComponent } from '../../object-collection/shared/object-collection-element/abstract-listable-element.component';
 import { renderElementsFor } from '../../object-collection/shared/dso-element-decorator';
-import { ViewMode } from '../../../+search-page/search-options.model';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-item-list-element',
diff --git a/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.ts b/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.ts
index 746e700f05..264f9ce1a9 100644
--- a/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.ts
+++ b/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.ts
@@ -4,8 +4,8 @@ import { renderElementsFor } from '../../../object-collection/shared/dso-element
 
 import { SearchResultListElementComponent } from '../search-result-list-element.component';
 import { Collection } from '../../../../core/shared/collection.model';
-import { ViewMode } from '../../../../+search-page/search-options.model';
 import { CollectionSearchResult } from '../../../object-collection/shared/collection-search-result.model';
+import { ViewMode } from '../../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-collection-search-result-list-element',
diff --git a/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.ts b/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.ts
index 2ca89fc9c5..227ff9a45d 100644
--- a/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.ts
+++ b/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.ts
@@ -4,8 +4,8 @@ import { renderElementsFor } from '../../../object-collection/shared/dso-element
 
 import { SearchResultListElementComponent } from '../search-result-list-element.component';
 import { Community } from '../../../../core/shared/community.model';
-import { ViewMode } from '../../../../+search-page/search-options.model';
 import { CommunitySearchResult } from '../../../object-collection/shared/community-search-result.model';
+import { ViewMode } from '../../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-community-search-result-list-element',
diff --git a/src/app/shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component.html b/src/app/shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component.html
index b8f3197a7c..584d476e73 100644
--- a/src/app/shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component.html
+++ b/src/app/shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component.html
@@ -5,8 +5,8 @@
   <span class="text-muted">
     <ds-truncatable-part [id]="dso.id" [minLines]="1">
             (<span *ngIf="dso.findMetadata('dc.publisher')" class="item-list-publisher"
-                   [innerHTML]="getFirstValue('dc.publisher')">, </span><span
-            *ngIf="dso.findMetadata('dc.date.issued')" class="item-list-date"
+                   [innerHTML]="getFirstValue('dc.publisher') + ', '"></span><span
+            *ngIf="hasValue(dso.findMetadata('dc.date.issued'))" class="item-list-date"
             [innerHTML]="getFirstValue('dc.date.issued')"></span>)
             <span *ngIf="dso.filterMetadata(['dc.contributor.author', 'dc.creator', 'dc.contributor.*']).length > 0"
                   class="item-list-authors">
diff --git a/src/app/shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component.ts b/src/app/shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component.ts
index b776abc214..a0cbc2469c 100644
--- a/src/app/shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component.ts
+++ b/src/app/shared/object-list/search-result-list-element/item-search-result/item-search-result-list-element.component.ts
@@ -1,12 +1,11 @@
-import { ChangeDetectorRef, Component, Inject, OnInit } from '@angular/core';
+import { Component } from '@angular/core';
 
 import { renderElementsFor } from '../../../object-collection/shared/dso-element-decorator';
 import { SearchResultListElementComponent } from '../search-result-list-element.component';
 import { Item } from '../../../../core/shared/item.model';
 import { ItemSearchResult } from '../../../object-collection/shared/item-search-result.model';
-import { ViewMode } from '../../../../+search-page/search-options.model';
-import { ListableObject } from '../../../object-collection/shared/listable-object.model';
 import { focusBackground } from '../../../animations/focus';
+import { ViewMode } from '../../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-item-search-result-list-element',
diff --git a/src/app/shared/object-list/wrapper-list-element/wrapper-list-element.component.ts b/src/app/shared/object-list/wrapper-list-element/wrapper-list-element.component.ts
index 217c1776c5..e95def7cf7 100644
--- a/src/app/shared/object-list/wrapper-list-element/wrapper-list-element.component.ts
+++ b/src/app/shared/object-list/wrapper-list-element/wrapper-list-element.component.ts
@@ -1,8 +1,8 @@
 import { Component, Injector, Input, OnInit } from '@angular/core';
-import { ViewMode } from '../../../+search-page/search-options.model';
 import { GenericConstructor } from '../../../core/shared/generic-constructor';
 import { rendersDSOType } from '../../object-collection/shared/dso-element-decorator'
 import { ListableObject } from '../../object-collection/shared/listable-object.model';
+import { ViewMode } from '../../../core/shared/view-mode.model';
 
 @Component({
   selector: 'ds-wrapper-list-element',
diff --git a/src/app/shared/search-form/search-form.component.html b/src/app/shared/search-form/search-form.component.html
index 8bca5aabeb..19c6f8f1ac 100644
--- a/src/app/shared/search-form/search-form.component.html
+++ b/src/app/shared/search-form/search-form.component.html
@@ -1,6 +1,6 @@
 <form #form="ngForm" (ngSubmit)="onSubmit(form.value)" class="row" action="/search">
 <div *ngIf="isNotEmpty(scopes)" class="col-12 col-sm-3">
-  <select [(ngModel)]="selectedId" name="scope" class="form-control" aria-label="Search scope">
+  <select [(ngModel)]="scope" name="scope" class="form-control" aria-label="Search scope" (change)="onScopeChange($event.target.value)">
     <option value>{{'search.form.search_dspace' | translate}}</option>
     <option *ngFor="let scopeOption of scopes" [value]="scopeOption.id">{{scopeOption?.name ? scopeOption.name : 'search.form.search_dspace' | translate}}</option>
   </select>
diff --git a/src/app/shared/search-form/search-form.component.ts b/src/app/shared/search-form/search-form.component.ts
index 5fd984a731..21a90daed4 100644
--- a/src/app/shared/search-form/search-form.component.ts
+++ b/src/app/shared/search-form/search-form.component.ts
@@ -1,8 +1,8 @@
 import { Component, Input } from '@angular/core';
-import { SearchService } from '../../+search-page/search-service/search.service';
 import { DSpaceObject } from '../../core/shared/dspace-object.model';
 import { Router } from '@angular/router';
-import { isNotEmpty, hasValue, isEmpty, hasNoValue } from '../empty.util';
+import { hasValue, isNotEmpty } from '../empty.util';
+import { QueryParamsHandling } from '@angular/router/src/config';
 
 /**
  * This component renders a simple item page.
@@ -15,36 +15,67 @@ import { isNotEmpty, hasValue, isEmpty, hasNoValue } from '../empty.util';
   styleUrls: ['./search-form.component.scss'],
   templateUrl: './search-form.component.html'
 })
-export class SearchFormComponent {
-  @Input() query: string;
-  selectedId = '';
-  @Input() currentUrl: string;
-  @Input() scopes: DSpaceObject[];
 
+/**
+ * Component that represents the search form
+ */
+export class SearchFormComponent {
+  /**
+   * The search query
+   */
+  @Input() query: string;
+
+  /**
+   * The currently selected scope object's UUID
+   */
   @Input()
-  set scope(id: string) {
-    this.selectedId = id;
-  }
+  scope = '';
+
+  @Input() currentUrl: string;
+
+  /**
+   * The available scopes
+   */
+  @Input() scopes: DSpaceObject[];
 
   constructor(private router: Router) {
   }
 
+  /**
+   * Updates the search when the form is submitted
+   * @param data Values submitted using the form
+   */
   onSubmit(data: any) {
     this.updateSearch(data);
   }
 
+  /**
+   * Updates the search when the current scope has been changed
+   * @param {string} scope The new scope
+   */
+  onScopeChange(scope: string) {
+    this.updateSearch({ scope });
+  }
+
+  /**
+   * Updates the search URL
+   * @param data Updated parameters
+   */
   updateSearch(data: any) {
-    const newUrl = hasValue(this.currentUrl) ? this.currentUrl : 'search';
+    const newUrl = hasValue(this.currentUrl) ? this.currentUrl : '/search';
+    let handling: QueryParamsHandling = '' ;
+    if (this.currentUrl === '/search') {
+      handling = 'merge';
+    }
     this.router.navigate([newUrl], {
-      queryParams: {
-        query: data.query,
-        scope: data.scope || undefined,
-        page: data.page || 1
-      },
-      queryParamsHandling: 'merge'
+      queryParams: Object.assign({}, { page: 1 }, data),
+      queryParamsHandling: handling
     });
   }
 
+  /**
+   * For usage of the isNotEmpty function in the template
+   */
   isNotEmpty(object: any) {
     return isNotEmpty(object);
   }
diff --git a/src/app/shared/services/route.service.ts b/src/app/shared/services/route.service.ts
index aa683a6403..7c24c6f6c1 100644
--- a/src/app/shared/services/route.service.ts
+++ b/src/app/shared/services/route.service.ts
@@ -38,6 +38,7 @@ export class RouteService {
               params[key] = [...map.getAll(key)];
             });
           return params;
-        }).distinctUntilChanged();
+        })
+      .distinctUntilChanged((a, b) => JSON.stringify(a) === JSON.stringify(b));
   }
 }
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 7ae6163bf1..b6122dc70a 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { RouterModule } from '@angular/router';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { NouisliderModule } from 'ng2-nouislider';
 
 import { NgbDatepickerModule, NgbModule, NgbTimepickerModule, NgbTypeaheadModule } from '@ng-bootstrap/ng-bootstrap';
 
@@ -75,6 +76,13 @@ import { MockAdminGuard } from './mocks/mock-admin-guard.service';
 import { BrowseByModule } from '../+browse-by/browse-by.module';
 import { BrowseByComponent } from './browse-by/browse-by.component';
 import { BrowseEntryListElementComponent } from './object-list/browse-entry-list-element/browse-entry-list-element.component';
+import { DebounceDirective } from './utils/debounce.directive';
+import { ClickOutsideDirective } from './utils/click-outside.directive';
+import { EmphasizePipe } from './utils/emphasize.pipe';
+import { InputSuggestionsComponent } from './input-suggestions/input-suggestions.component';
+import { CapitalizePipe } from './utils/capitalize.pipe';
+import { MomentModule } from 'angular2-moment';
+import { ObjectKeysPipe } from './utils/object-keys-pipe';
 
 const MODULES = [
   // Do NOT include UniversalModule, HttpModule, or JsonpModule here
@@ -93,6 +101,8 @@ const MODULES = [
   ReactiveFormsModule,
   RouterModule,
   TranslateModule,
+  NouisliderModule,
+  MomentModule,
   TextMaskModule
 ];
 
@@ -102,6 +112,9 @@ const PIPES = [
   FileSizePipe,
   SafeUrlPipe,
   TruncatePipe,
+  EmphasizePipe,
+  CapitalizePipe,
+  ObjectKeysPipe,
   ConsolePipe
 ];
 
@@ -142,7 +155,8 @@ const COMPONENTS = [
   ViewModeSwitchComponent,
   TruncatableComponent,
   TruncatablePartComponent,
-  BrowseByComponent
+  BrowseByComponent,
+  InputSuggestionsComponent
 ];
 
 const ENTRY_COMPONENTS = [
@@ -165,7 +179,9 @@ const PROVIDERS = [
 
 const DIRECTIVES = [
   VarDirective,
-  DragClickDirective
+  DragClickDirective,
+  DebounceDirective,
+  ClickOutsideDirective
 ];
 
 @NgModule({
@@ -192,6 +208,10 @@ const DIRECTIVES = [
     ...ENTRY_COMPONENTS
   ]
 })
+
+/**
+ * This module handles all components and pipes that need to be shared among multiple other modules
+ */
 export class SharedModule {
 
 }
diff --git a/src/app/shared/testing/active-router-stub.ts b/src/app/shared/testing/active-router-stub.ts
index 35c966d72a..22c4060855 100644
--- a/src/app/shared/testing/active-router-stub.ts
+++ b/src/app/shared/testing/active-router-stub.ts
@@ -21,7 +21,10 @@ export class ActivatedRouteStub {
   }
 
   // Test parameters
-  get testParams() { return this._testParams; }
+  get testParams() {
+    return this._testParams;
+  }
+
   set testParams(params: {}) {
     this._testParams = params;
     this.subject.next(params);
@@ -29,6 +32,9 @@ export class ActivatedRouteStub {
 
   // ActivatedRoute.snapshot.params
   get snapshot() {
-    return { params: this.testParams };
+    return {
+      params: this.testParams,
+      queryParamMap: convertToParamMap(this.testParams)
+    }
   }
 }
diff --git a/src/app/shared/testing/hal-endpoint-service-stub.ts b/src/app/shared/testing/hal-endpoint-service-stub.ts
index e7dbe8bea1..a1764df009 100644
--- a/src/app/shared/testing/hal-endpoint-service-stub.ts
+++ b/src/app/shared/testing/hal-endpoint-service-stub.ts
@@ -1,6 +1,4 @@
 import { Observable } from 'rxjs/Observable';
-import { ViewMode } from '../../+search-page/search-options.model';
-import { BehaviorSubject } from 'rxjs/BehaviorSubject';
 
 export class HALEndpointServiceStub {
 
diff --git a/src/app/shared/testing/search-service-stub.ts b/src/app/shared/testing/search-service-stub.ts
index 7ad0d871ce..b9c1d7533f 100644
--- a/src/app/shared/testing/search-service-stub.ts
+++ b/src/app/shared/testing/search-service-stub.ts
@@ -1,6 +1,6 @@
 import { Observable } from 'rxjs/Observable';
-import { ViewMode } from '../../+search-page/search-options.model';
 import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { ViewMode } from '../../core/shared/view-mode.model';
 
 export class SearchServiceStub {
 
@@ -37,4 +37,8 @@ export class SearchServiceStub {
   getSearchLink() {
     return this.searchLink;
   }
+
+  getFilterLabels() {
+    return Observable.of([]);
+  }
 }
diff --git a/src/app/shared/truncatable/truncatable-part/truncatable-part.component.ts b/src/app/shared/truncatable/truncatable-part/truncatable-part.component.ts
index 0f695625ec..fef5d7d098 100644
--- a/src/app/shared/truncatable/truncatable-part/truncatable-part.component.ts
+++ b/src/app/shared/truncatable/truncatable-part/truncatable-part.component.ts
@@ -1,5 +1,6 @@
 import { Component, Input, OnDestroy, OnInit } from '@angular/core';
 import { TruncatableService } from '../truncatable.service';
+import { hasValue } from '../../empty.util';
 
 @Component({
   selector: 'ds-truncatable-part',
@@ -7,22 +8,59 @@ import { TruncatableService } from '../truncatable.service';
   styleUrls: ['./truncatable-part.component.scss']
 })
 
+/**
+ * Component that truncates/clamps a piece of text
+ * It needs a TruncatableComponent parent to identify it's current state
+ */
 export class TruncatablePartComponent implements OnInit, OnDestroy {
+  /**
+   * Number of lines shown when the part is collapsed
+   */
   @Input() minLines: number;
+
+  /**
+   * Number of lines shown when the part is expanded. -1 indicates no limit
+   */
   @Input() maxLines = -1;
+
+  /**
+   * The identifier of the parent TruncatableComponent
+   */
   @Input() id: string;
+
+  /**
+   * Type of text, can be a h4 for headers or any other class you want to add
+   */
   @Input() type: string;
+
+  /**
+   * True if the minimal height of the part should at least be as high as it's minimum amount of lines
+   */
   @Input() fixedHeight = false;
+
+  /**
+   * Current amount of lines shown of this part
+   */
   lines: string;
+
+  /**
+   * Subscription to unsubscribe from
+   */
   private sub;
 
   public constructor(private service: TruncatableService) {
   }
 
+  /**
+   * Initialize lines variable
+   */
   ngOnInit() {
     this.setLines();
   }
 
+  /**
+   * Subscribe to the current state to determine how much lines should be shown of this part
+   */
   private setLines() {
     this.sub = this.service.isCollapsed(this.id).subscribe((collapsed: boolean) => {
       if (collapsed) {
@@ -33,7 +71,12 @@ export class TruncatablePartComponent implements OnInit, OnDestroy {
     });
   }
 
+  /**
+   * Unsubscribe from the subscription
+   */
   ngOnDestroy(): void {
-    this.sub.unsubscribe();
+    if (hasValue(this.sub)) {
+      this.sub.unsubscribe();
+    }
   }
 }
diff --git a/src/app/shared/truncatable/truncatable.actions.ts b/src/app/shared/truncatable/truncatable.actions.ts
index 9d3a51219b..9f85d55afe 100644
--- a/src/app/shared/truncatable/truncatable.actions.ts
+++ b/src/app/shared/truncatable/truncatable.actions.ts
@@ -16,22 +16,43 @@ export const TruncatableActionTypes = {
 };
 
 export class TruncatableAction implements Action {
+  /**
+   * UUID of the truncatable component the action is performed on, used to identify the filter
+   */
   id: string;
+
+  /**
+   * Type of action that will be performed
+   */
   type;
-  constructor(name: string) {
-    this.id = name;
+
+  /**
+   * Initialize with the truncatable component's UUID
+   * @param {string} id of the filter
+   */
+  constructor(id: string) {
+    this.id = id;
   }
 }
 
 /* tslint:disable:max-classes-per-file */
+/**
+ * Used to collapse a truncatable component when it's expanded and expand it when it's collapsed
+ */
 export class TruncatableToggleAction extends TruncatableAction {
   type = TruncatableActionTypes.TOGGLE;
 }
 
+/**
+ * Used to collapse a truncatable component
+ */
 export class TruncatableCollapseAction extends TruncatableAction {
   type = TruncatableActionTypes.COLLAPSE;
 }
 
+/**
+ * Used to expand a truncatable component
+ */
 export class TruncatableExpandAction extends TruncatableAction {
   type = TruncatableActionTypes.EXPAND;
 }
diff --git a/src/app/shared/truncatable/truncatable.component.ts b/src/app/shared/truncatable/truncatable.component.ts
index 81ad2b3cff..e22ce4441e 100644
--- a/src/app/shared/truncatable/truncatable.component.ts
+++ b/src/app/shared/truncatable/truncatable.component.ts
@@ -9,14 +9,32 @@ import { TruncatableService } from './truncatable.service';
   styleUrls: ['./truncatable.component.scss'],
 
 })
+
+/**
+ * Component that represents a section with one or more truncatable parts that all listen to this state
+ */
 export class TruncatableComponent {
+  /**
+   * Is true when all truncatable parts in this truncatable should be expanded on loading
+   */
   @Input() initialExpand = false;
+
+  /**
+   * The unique identifier of this truncatable component
+   */
   @Input() id: string;
+
+  /**
+   * Is true when the truncatable should expand on both hover as click
+   */
   @Input() onHover = false;
 
   public constructor(private service: TruncatableService) {
   }
 
+  /**
+   * Set the initial state
+   */
   ngOnInit() {
     if (this.initialExpand) {
       this.service.expand(this.id);
@@ -25,18 +43,27 @@ export class TruncatableComponent {
     }
   }
 
+  /**
+   * If onHover is true, collapses the truncatable
+   */
   public hoverCollapse() {
     if (this.onHover) {
       this.service.collapse(this.id);
     }
   }
 
+  /**
+   * If onHover is true, expands the truncatable
+   */
   public hoverExpand() {
     if (this.onHover) {
       this.service.expand(this.id);
     }
   }
 
+  /**
+   * Expands the truncatable when it's collapsed, collapses it when it's expanded
+   */
   public toggle() {
     this.service.toggle(this.id);
   }
diff --git a/src/app/shared/truncatable/truncatable.reducer.ts b/src/app/shared/truncatable/truncatable.reducer.ts
index d9a2111682..11b4ac758d 100644
--- a/src/app/shared/truncatable/truncatable.reducer.ts
+++ b/src/app/shared/truncatable/truncatable.reducer.ts
@@ -1,15 +1,27 @@
 import { TruncatableAction, TruncatableActionTypes } from './truncatable.actions';
 
+/**
+ * Interface that represents the state of a single truncatable
+ */
 export interface TruncatableState {
   collapsed: boolean;
 }
 
+/**
+ * Interface that represents the state of all truncatable
+ */
 export interface TruncatablesState {
   [id: string]: TruncatableState
 }
 
 const initialState: TruncatablesState = Object.create(null);
 
+/**
+ * Performs a truncatable action on the current state
+ * @param {TruncatablesState} state The state before the action is performed
+ * @param {TruncatableAction} action The action that should be performed
+ * @returns {TruncatablesState} The state after the action is performed
+ */
 export function truncatableReducer(state = initialState, action: TruncatableAction): TruncatablesState {
 
   switch (action.type) {
diff --git a/src/app/shared/truncatable/truncatable.service.ts b/src/app/shared/truncatable/truncatable.service.ts
index 5f36c6a60d..2f707d6609 100644
--- a/src/app/shared/truncatable/truncatable.service.ts
+++ b/src/app/shared/truncatable/truncatable.service.ts
@@ -7,12 +7,20 @@ import { hasValue } from '../empty.util';
 
 const truncatableStateSelector = (state: TruncatablesState) => state.truncatable;
 
+/**
+ * Service responsible for truncating/clamping text and performing actions on truncatable elements
+ */
 @Injectable()
 export class TruncatableService {
 
   constructor(private store: Store<TruncatablesState>) {
   }
 
+  /**
+   * Checks if a trunctable component should currently be collapsed
+   * @param {string} id The UUID of the truncatable component
+   * @returns {Observable<boolean>} Emits true if the state in the store is currently collapsed for the given truncatable component
+   */
   isCollapsed(id: string): Observable<boolean> {
     return this.store.select(truncatableByIdSelector(id))
       .map((object: TruncatableState) => {
@@ -24,14 +32,26 @@ export class TruncatableService {
       });
   }
 
+  /**
+   * Dispatches a toggle action to the store for a given truncatable component
+   * @param {string} id The identifier of the truncatable for which the action is dispatched
+   */
   public toggle(id: string): void {
     this.store.dispatch(new TruncatableToggleAction(id));
   }
 
+  /**
+   * Dispatches a collapse action to the store for a given truncatable component
+   * @param {string} id The identifier of the truncatable for which the action is dispatched
+   */
   public collapse(id: string): void {
     this.store.dispatch(new TruncatableCollapseAction(id));
   }
 
+  /**
+   * Dispatches an expand action to the store for a given truncatable component
+   * @param {string} id The identifier of the truncatable for which the action is dispatched
+   */
   public expand(id: string): void {
     this.store.dispatch(new TruncatableExpandAction(id));
   }
diff --git a/src/app/shared/utils/capitalize.pipe.ts b/src/app/shared/utils/capitalize.pipe.ts
new file mode 100644
index 0000000000..03ad25ed6e
--- /dev/null
+++ b/src/app/shared/utils/capitalize.pipe.ts
@@ -0,0 +1,22 @@
+import { Pipe, PipeTransform } from '@angular/core'
+
+@Pipe({
+  name: 'dsCapitalize'
+})
+
+/**
+ * Pipe for capizalizing a string
+ */
+export class CapitalizePipe implements PipeTransform {
+  /**
+   * @param {string} value String to be capitalized
+   * @returns {string} Capitalized version of the input value
+   */
+  transform(value: string): string {
+    if (value) {
+      return value.charAt(0).toUpperCase() + value.slice(1);
+    }
+    return value;
+  }
+
+}
diff --git a/src/app/shared/utils/click-outside.directive.ts b/src/app/shared/utils/click-outside.directive.ts
new file mode 100644
index 0000000000..e8efdf2d7a
--- /dev/null
+++ b/src/app/shared/utils/click-outside.directive.ts
@@ -0,0 +1,26 @@
+import { Directive, ElementRef, Output, EventEmitter, HostListener } from '@angular/core';
+
+@Directive({
+  selector: '[dsClickOutside]'
+})
+/**
+ * Directive to detect when the users clicks outside of the element the directive was put on
+ */
+export class ClickOutsideDirective {
+  /**
+   * Emits null when the user clicks outside of the element
+   */
+  @Output()
+  public dsClickOutside = new EventEmitter();
+
+  constructor(private _elementRef: ElementRef) {
+  }
+
+  @HostListener('document:click', ['$event.target'])
+  public onClick(targetElement) {
+    const clickedInside = this._elementRef.nativeElement.contains(targetElement);
+    if (!clickedInside) {
+      this.dsClickOutside.emit(null);
+    }
+  }
+}
diff --git a/src/app/shared/utils/debounce.directive.ts b/src/app/shared/utils/debounce.directive.ts
new file mode 100644
index 0000000000..6a39a598c0
--- /dev/null
+++ b/src/app/shared/utils/debounce.directive.ts
@@ -0,0 +1,67 @@
+import { Directive, Input, Output, EventEmitter, OnDestroy, OnInit } from '@angular/core';
+import { NgControl } from '@angular/forms';
+import 'rxjs/add/operator/debounceTime';
+import 'rxjs/add/operator/distinctUntilChanged';
+import 'rxjs/add/operator/takeUntil';
+import { Subject } from 'rxjs/Subject';
+
+@Directive({
+  selector: '[ngModel][dsDebounce]',
+})
+/**
+ * Directive for setting a debounce time on an input field
+ * It will emit the input field's value when no changes were made to this value in a given debounce time
+ */
+export class DebounceDirective implements OnInit, OnDestroy {
+
+  /**
+   * Emits a value when nothing has changed in dsDebounce milliseconds
+   */
+  @Output()
+  public onDebounce = new EventEmitter<any>();
+
+  /**
+   * The debounce time in milliseconds
+   */
+  @Input()
+  public dsDebounce = 500;
+
+  /**
+   * True if no changes have been made to the input field's value
+   */
+  private isFirstChange = true;
+
+  /**
+   * Subject to unsubscribe from
+   */
+  private subject: Subject<void> = new Subject<void>();
+
+  constructor(public model: NgControl) {
+  }
+
+  /**
+   * Start listening to changes of the input field's value changes
+   * Emit it when the debounceTime is over without new changes
+   */
+  ngOnInit() {
+    this.model.valueChanges
+      .takeUntil(this.subject)
+      .debounceTime(this.dsDebounce)
+      .distinctUntilChanged()
+      .subscribe((modelValue) => {
+        if (this.isFirstChange) {
+          this.isFirstChange = false;
+        } else {
+          this.onDebounce.emit(modelValue);
+        }
+      });
+  }
+
+  /**
+   * Close subject
+   */
+  ngOnDestroy() {
+    this.subject.next();
+    this.subject.complete();
+  }
+}
diff --git a/src/app/shared/utils/drag-click.directive.ts b/src/app/shared/utils/drag-click.directive.ts
index ec9b02dea5..3ba9eb5986 100644
--- a/src/app/shared/utils/drag-click.directive.ts
+++ b/src/app/shared/utils/drag-click.directive.ts
@@ -3,15 +3,36 @@ import { Directive, EventEmitter, HostListener, Output } from '@angular/core';
 @Directive({
   selector: '[dsDragClick]'
 })
+
+/**
+ * Directive for preventing drag events being misinterpret as clicks
+ * The difference is made using the time the mouse button is pushed down
+ */
 export class DragClickDirective {
+  /**
+   * The start time of the mouse down event in milliseconds
+   */
   private start;
+
+  /**
+   * Emits a click event when the click is perceived as an actual click and not a drag
+   */
   @Output() actualClick = new EventEmitter();
 
+  /**
+   * When the mouse button is pushed down, register the start time
+   * @param event Mouse down event
+   */
   @HostListener('mousedown', ['$event'])
   mousedownEvent(event) {
     this.start = new Date();
   }
 
+  /**
+   * When the mouse button is let go of, check how long if it was down for
+   * If the mouse button was down for more than 250ms, don't emit a click event
+   * @param event Mouse down event
+   */
   @HostListener('mouseup', ['$event'])
   mouseupEvent(event) {
     const end: any = new Date();
diff --git a/src/app/shared/utils/emphasize.pipe.ts b/src/app/shared/utils/emphasize.pipe.ts
new file mode 100644
index 0000000000..613074a308
--- /dev/null
+++ b/src/app/shared/utils/emphasize.pipe.ts
@@ -0,0 +1,56 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({ name: 'dsEmphasize' })
+/**
+ * Pipe for emphasizing a part of a string by surrounding it with <em> tags
+ */
+export class EmphasizePipe implements PipeTransform {
+  /**
+   * Characters that should be escaped
+   */
+  specials = [
+    // order matters for these
+    '-'
+    , '['
+    , ']'
+    // order doesn't matter for any of these
+    , '/'
+    , '{'
+    , '}'
+    , '('
+    , ')'
+    , '*'
+    , '+'
+    , '?'
+    , '.'
+    , '\\'
+    , '^'
+    , '$'
+    , '|'
+  ];
+  /**
+   * Regular expression for escaping the string we're trying to find
+   */
+  regex = RegExp('[' + this.specials.join('\\') + ']', 'g');
+
+  /**
+   *
+   * @param haystack The string which we want to partly highlight
+   * @param needle The string that should become emphasized in the haystack string
+   * @returns {any} Transformed haystack with the needle emphasized
+   */
+  transform(haystack, needle): any {
+    const escaped = this.escapeRegExp(needle);
+    const reg = new RegExp(escaped, 'gi');
+    return haystack.replace(reg, '<em>$&</em>');
+  }
+
+  /**
+   *
+   * @param str Escape special characters in the string we're looking for
+   * @returns {any} The escaped version of the input string
+   */
+   escapeRegExp(str) {
+    return str.replace(this.regex, '\\$&');
+  }
+}
diff --git a/src/app/shared/utils/enum-keys-pipe.ts b/src/app/shared/utils/enum-keys-pipe.ts
index 82893b886f..0a4a445c02 100644
--- a/src/app/shared/utils/enum-keys-pipe.ts
+++ b/src/app/shared/utils/enum-keys-pipe.ts
@@ -1,8 +1,16 @@
 import { Pipe, PipeTransform } from '@angular/core';
 
 @Pipe({ name: 'dsKeys' })
+/**
+ * Pipe for parsing all values of an enumeration to an array of key-value pairs
+ */
 export class EnumKeysPipe implements PipeTransform {
-  transform(value, args: string[]): any {
+
+  /**
+   * @param value An enumeration
+   * @returns {any} Array with all keys and values of the input enumeration
+   */
+  transform(value): any {
     const keys = [];
     for (const enumMember in value) {
       if (!isNaN(parseInt(enumMember, 10))) {
diff --git a/src/app/shared/utils/object-keys-pipe.ts b/src/app/shared/utils/object-keys-pipe.ts
new file mode 100644
index 0000000000..fd3d018b88
--- /dev/null
+++ b/src/app/shared/utils/object-keys-pipe.ts
@@ -0,0 +1,18 @@
+import { PipeTransform, Pipe } from '@angular/core';
+
+@Pipe({name: 'dsObjectKeys'})
+/**
+ * Pipe for parsing all keys of an object to an array of key-value pairs
+ */
+export class ObjectKeysPipe implements PipeTransform {
+
+  /**
+   * @param value An object
+   * @returns {any} Array with all keys the input object
+   */
+  transform(value, args:string[]): any {
+    const keys = [];
+    Object.keys(value).forEach((k) => keys.push(k));
+    return keys;
+  }
+}
diff --git a/src/app/shared/view-mode-switch/view-mode-switch.component.spec.ts b/src/app/shared/view-mode-switch/view-mode-switch.component.spec.ts
index 1b4bf6da46..1211b4bc88 100644
--- a/src/app/shared/view-mode-switch/view-mode-switch.component.spec.ts
+++ b/src/app/shared/view-mode-switch/view-mode-switch.component.spec.ts
@@ -8,8 +8,8 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 
 import { SearchService } from '../../+search-page/search-service/search.service';
 import { ViewModeSwitchComponent } from './view-mode-switch.component';
-import { ViewMode } from '../../+search-page/search-options.model';
 import { SearchServiceStub } from '../testing/search-service-stub';
+import { ViewMode } from '../../core/shared/view-mode.model';
 
 @Component({ template: '' })
 class DummyComponent { }
diff --git a/src/app/shared/view-mode-switch/view-mode-switch.component.ts b/src/app/shared/view-mode-switch/view-mode-switch.component.ts
index f6e04816fb..d34a4b4d60 100644
--- a/src/app/shared/view-mode-switch/view-mode-switch.component.ts
+++ b/src/app/shared/view-mode-switch/view-mode-switch.component.ts
@@ -1,7 +1,7 @@
 import { Subscription } from 'rxjs/Subscription';
 import { Component, OnInit, OnDestroy } from '@angular/core';
-import { ViewMode } from '../../+search-page/search-options.model';
 import { SearchService } from './../../+search-page/search-service/search.service';
+import { ViewMode } from '../../core/shared/view-mode.model';
 
 /**
  * Component to switch between list and grid views.
diff --git a/src/styles/_bootstrap_variables.scss b/src/styles/_bootstrap_variables.scss
index a57d2deddf..ea89a3a0d5 100644
--- a/src/styles/_bootstrap_variables.scss
+++ b/src/styles/_bootstrap_variables.scss
@@ -34,3 +34,4 @@ $navbar-light-color:                rgba(black, .5) !default;
 $navbar-dark-toggler-icon-bg: url("data%3Aimage%2Fsvg+xml%3Bcharset%3Dutf8%2C%3Csvg+viewBox%3D%270+0+30+30%27+xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath+stroke%3D%27#{$navbar-dark-color}%27+stroke-width%3D%272%27+stroke-linecap%3D%27round%27+stroke-miterlimit%3D%2710%27+d%3D%27M4+7h22M4+15h22M4+23h22%27%2F%3E%3C%2Fsvg%3E");
 $navbar-light-toggler-icon-bg: url("data%3Aimage%2Fsvg+xml%3Bcharset%3Dutf8%2C%3Csvg+viewBox%3D%270+0+30+30%27+xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%3E%3Cpath+stroke%3D%27#{$navbar-light-color}%27+stroke-width%3D%272%27+stroke-linecap%3D%27round%27+stroke-miterlimit%3D%2710%27+d%3D%27M4+7h22M4+15h22M4+23h22%27%2F%3E%3C%2Fsvg%3E");
 
+$enable-shadows: true !default;
diff --git a/src/styles/_mixins.scss b/src/styles/_mixins.scss
index 564ffc7755..2155396164 100644
--- a/src/styles/_mixins.scss
+++ b/src/styles/_mixins.scss
@@ -1,3 +1,15 @@
 @import '../../node_modules/bootstrap/scss/functions.scss';
 @import '../../node_modules/bootstrap/scss/mixins.scss';
-@import '../../node_modules/bootstrap/scss/variables.scss';
\ No newline at end of file
+@import '../../node_modules/bootstrap/scss/variables.scss';
+
+@mixin word-wrap() {
+  overflow-wrap: break-word;
+  word-wrap: break-word;
+  -ms-word-break: break-all;
+  word-break: break-all;
+  word-break: break-word;
+  -ms-hyphens: auto;
+  -moz-hyphens: auto;
+  -webkit-hyphens: auto;
+  hyphens: auto;
+}
diff --git a/webpack/webpack.test.js b/webpack/webpack.test.js
index 66a1454a08..210c33e66c 100644
--- a/webpack/webpack.test.js
+++ b/webpack/webpack.test.js
@@ -74,12 +74,8 @@ module.exports = function (options) {
           enforce: 'pre',
           test: /\.js$/,
           loader: 'source-map-loader',
-          exclude: [
-            // these packages have problems with their sourcemaps
-            root('node_modules/@angular'),
-            root('node_modules/@nguniversal'),
-            root('node_modules/rxjs')
-          ]
+          exclude: [/node_modules/],
+
         },
 
         /**
diff --git a/yarn.lock b/yarn.lock
index 3207959415..344093d446 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -437,6 +437,12 @@ angular-idle-preload@2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/angular-idle-preload/-/angular-idle-preload-2.0.4.tgz#7b177c0f52918c090e5c345480b922297cd59a0d"
 
+angular2-moment@^1.9.0:
+  version "1.9.0"
+  resolved "https://registry.yarnpkg.com/angular2-moment/-/angular2-moment-1.9.0.tgz#d198a4d9bc825f61de19106ac7ea07a78569f5a1"
+  dependencies:
+    moment "^2.19.3"
+
 angular-sortablejs@^2.5.0:
   version "2.5.2"
   resolved "https://registry.yarnpkg.com/angular-sortablejs/-/angular-sortablejs-2.5.2.tgz#ffd651e47cc93a191db4c023f617db3789fd9af5"
@@ -1064,9 +1070,9 @@ boom@5.x.x:
   dependencies:
     hoek "4.x.x"
 
-bootstrap@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.0.0.tgz#ceb03842c145fcc1b9b4e15da2a05656ba68469a"
+bootstrap@4.1.1:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.1.1.tgz#3aec85000fa619085da8d2e4983dfd67cf2114cb"
 
 boxen@^1.2.1:
   version "1.3.0"
@@ -5525,6 +5531,10 @@ module-deps@^4.0.8:
     through2 "^2.0.0"
     xtend "^4.0.0"
 
+moment@^2.19.3, moment@^2.22.1:
+  version "2.22.1"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.22.1.tgz#529a2e9bf973f259c9643d237fda84de3a26e8ad"
+
 morgan@1.9.0:
   version "1.9.0"
   resolved "https://registry.yarnpkg.com/morgan/-/morgan-1.9.0.tgz#d01fa6c65859b76fcf31b3cb53a3821a311d8051"
@@ -5625,6 +5635,10 @@ ng2-file-upload@1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/ng2-file-upload/-/ng2-file-upload-1.2.1.tgz#5563c5dfd6f43fbfbe815c206e343464a0a6a197"
 
+ng2-nouislider@^1.7.11:
+  version "1.7.11"
+  resolved "https://registry.yarnpkg.com/ng2-nouislider/-/ng2-nouislider-1.7.11.tgz#b8ba5e3d2ffc23e1e32dfe54dd1726e2b4be316b"
+
 ngrx-store-freeze@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/ngrx-store-freeze/-/ngrx-store-freeze-0.2.1.tgz#04fb29db33cafda0f2d6ea32adeaac4891b1b27b"
@@ -5848,6 +5862,10 @@ normalize-url@^1.4.0:
     query-string "^4.1.0"
     sort-keys "^1.0.0"
 
+nouislider@^11.0.0:
+  version "11.1.0"
+  resolved "https://registry.yarnpkg.com/nouislider/-/nouislider-11.1.0.tgz#1768eb5b854917325d41b96f2dc4eb3757d73381"
+
 npm-run-all@4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/npm-run-all/-/npm-run-all-4.1.2.tgz#90d62d078792d20669139e718621186656cea056"