From 902d4c2330304ee48597118ea1ea91d50db26fd3 Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Mon, 6 Jul 2020 19:18:40 +0200
Subject: [PATCH 01/29] 71712: Export metadata CSV; WIP

---
 .../admin-sidebar/admin-sidebar.component.ts  | 149 +++++++++++-------
 src/app/app.component.ts                      |   1 -
 .../data/processes/script-data.service.ts     |  21 +++
 .../core/shared/dspace-object-type.model.ts   |   1 +
 .../dso-selector/dso-selector.component.ts    |   2 +-
 .../dso-selector-modal-wrapper.component.ts   |   7 +-
 .../edit-item-selector.component.spec.ts      |   2 -
 .../export-metadata-selector.component.ts     |  79 ++++++++++
 src/app/shared/shared.module.ts               |   5 +-
 src/assets/i18n/en.json5                      |   4 +
 10 files changed, 205 insertions(+), 66 deletions(-)
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index eb86de5f3c..2a911f6097 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -2,8 +2,13 @@ import { Component, Injector, OnInit } from '@angular/core';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { combineLatest as combineLatestObservable } from 'rxjs';
 import { Observable } from 'rxjs/internal/Observable';
-import { first, map } from 'rxjs/operators';
+import { of } from 'rxjs/internal/observable/of';
+import { first, map, take } from 'rxjs/operators';
 import { AuthService } from '../../core/auth/auth.service';
+import { ProcessDataService } from '../../core/data/processes/process-data.service';
+import { ScriptDataService } from '../../core/data/processes/script-data.service';
+import { RemoteData } from '../../core/data/remote-data';
+import { Script } from '../../process-page/scripts/script.model';
 import { slideHorizontal, slideSidebar } from '../../shared/animations/slide';
 import { CreateCollectionParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component';
 import { CreateCommunityParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component';
@@ -11,6 +16,10 @@ import { CreateItemParentSelectorComponent } from '../../shared/dso-selector/mod
 import { EditCollectionSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-collection-selector/edit-collection-selector.component';
 import { EditCommunitySelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component';
 import { EditItemSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component';
+import {
+  ExportMetadataSelectorComponent,
+  METADATA_EXPORT_SCRIPT_NAME
+} from '../../shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component';
 import { MenuID, MenuItemType } from '../../shared/menu/initial-menus-state';
 import { LinkMenuItemModel } from '../../shared/menu/menu-item/models/link.model';
 import { OnClickMenuItemModel } from '../../shared/menu/menu-item/models/onclick.model';
@@ -64,7 +73,8 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
               private variableService: CSSVariableService,
               private authService: AuthService,
               private modalService: NgbModal,
-              private authorizationService: AuthorizationDataService
+              private authorizationService: AuthorizationDataService,
+              private scriptDataService: ScriptDataService,
   ) {
     super(menuService, injector);
   }
@@ -75,6 +85,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
   ngOnInit(): void {
     this.createMenu();
     this.createSiteAdministratorMenuSections();
+    this.createExportMenuSections();
     super.ngOnInit();
     this.sidebarWidth = this.variableService.getVariable('sidebarItemsWidth');
     this.authService.isAuthenticated()
@@ -259,61 +270,6 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
           link: ''
         } as LinkMenuItemModel,
       },
-      /* Export */
-      {
-        id: 'export',
-        active: false,
-        visible: true,
-        model: {
-          type: MenuItemType.TEXT,
-          text: 'menu.section.export'
-        } as TextMenuItemModel,
-        icon: 'sign-out-alt',
-        index: 3
-      },
-      {
-        id: 'export_community',
-        parentID: 'export',
-        active: false,
-        visible: true,
-        model: {
-          type: MenuItemType.LINK,
-          text: 'menu.section.export_community',
-          link: ''
-        } as LinkMenuItemModel,
-      },
-      {
-        id: 'export_collection',
-        parentID: 'export',
-        active: false,
-        visible: true,
-        model: {
-          type: MenuItemType.LINK,
-          text: 'menu.section.export_collection',
-          link: ''
-        } as LinkMenuItemModel,
-      },
-      {
-        id: 'export_item',
-        parentID: 'export',
-        active: false,
-        visible: true,
-        model: {
-          type: MenuItemType.LINK,
-          text: 'menu.section.export_item',
-          link: ''
-        } as LinkMenuItemModel,
-      }, {
-        id: 'export_metadata',
-        parentID: 'export',
-        active: false,
-        visible: true,
-        model: {
-          type: MenuItemType.LINK,
-          text: 'menu.section.export_metadata',
-          link: ''
-        } as LinkMenuItemModel,
-      },
 
       /* Statistics */
       {
@@ -362,6 +318,85 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
     })));
   }
 
+  /**
+   * Create menu sections dependent on whether or not the current user is a site administrator and on whether or not
+   * the export scripts exist and the current user is allowed to execute them
+   */
+  createExportMenuSections() {
+    const isAuthorized$: Observable<boolean> = this.authorizationService.isAuthorized(FeatureID.AdministratorOf);
+    isAuthorized$.subscribe((authorized: boolean) => {
+      if (authorized) {
+        const metadataExportScriptExists$ = this.scriptDataService.scripWithNameExistsAndCanExecute(METADATA_EXPORT_SCRIPT_NAME);
+        metadataExportScriptExists$.subscribe((metadataExportScriptExists: boolean) => {
+          const menuList = [
+            /* Export */
+            {
+              id: 'export',
+              active: false,
+              visible: true,
+              model: {
+                type: MenuItemType.TEXT,
+                text: 'menu.section.export'
+              } as TextMenuItemModel,
+              icon: 'sign-out-alt',
+              index: 3
+            },
+            {
+              id: 'export_community',
+              parentID: 'export',
+              active: false,
+              visible: true,
+              model: {
+                type: MenuItemType.LINK,
+                text: 'menu.section.export_community',
+                link: ''
+              } as LinkMenuItemModel,
+            },
+            {
+              id: 'export_collection',
+              parentID: 'export',
+              active: false,
+              visible: true,
+              model: {
+                type: MenuItemType.LINK,
+                text: 'menu.section.export_collection',
+                link: ''
+              } as LinkMenuItemModel,
+            },
+            {
+              id: 'export_item',
+              parentID: 'export',
+              active: false,
+              visible: true,
+              model: {
+                type: MenuItemType.LINK,
+                text: 'menu.section.export_item',
+                link: ''
+              } as LinkMenuItemModel,
+            },
+            {
+              id: 'export_metadata',
+              parentID: 'export',
+              active: true,
+              visible: authorized && metadataExportScriptExists,
+              model: {
+                type: MenuItemType.ONCLICK,
+                text: 'menu.section.export_metadata',
+                function: () => {
+                  this.modalService.open(ExportMetadataSelectorComponent);
+                }
+              } as OnClickMenuItemModel,
+            },
+          ];
+          menuList.forEach((menuSection) => this.menuService.addSection(this.menuID, Object.assign(menuSection, {
+            shouldPersistOnRouteChange: true
+          })));
+        });
+      }
+    });
+
+  }
+
   /**
    * Create menu sections dependent on whether or not the current user is a site administrator
    */
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 35ca4db131..10f81a9adc 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -21,7 +21,6 @@ import { HostWindowState } from './shared/search/host-window.reducer';
 import { NativeWindowRef, NativeWindowService } from './core/services/window.service';
 import { isAuthenticated } from './core/auth/selectors';
 import { AuthService } from './core/auth/auth.service';
-import variables from '../styles/_exposed_variables.scss';
 import { CSSVariableService } from './shared/sass-helper/sass-helper.service';
 import { MenuService } from './shared/menu/menu.service';
 import { MenuID } from './shared/menu/initial-menus-state';
diff --git a/src/app/core/data/processes/script-data.service.ts b/src/app/core/data/processes/script-data.service.ts
index 6600444ea0..2dcc6e364d 100644
--- a/src/app/core/data/processes/script-data.service.ts
+++ b/src/app/core/data/processes/script-data.service.ts
@@ -1,4 +1,5 @@
 import { Injectable } from '@angular/core';
+import { getRemoteDataPayload, getSucceededRemoteData } from '../../shared/operators';
 import { DataService } from '../data.service';
 import { RemoteDataBuildService } from '../../cache/builders/remote-data-build.service';
 import { Store } from '@ngrx/store';
@@ -12,6 +13,7 @@ import { Script } from '../../../process-page/scripts/script.model';
 import { ProcessParameter } from '../../../process-page/processes/process-parameter.model';
 import { find, map, switchMap } from 'rxjs/operators';
 import { URLCombiner } from '../../url-combiner/url-combiner';
+import { PaginatedList } from '../paginated-list';
 import { MultipartPostRequest, RestRequest } from '../request.models';
 import { RequestService } from '../request.service';
 import { Observable } from 'rxjs';
@@ -58,4 +60,23 @@ export class ScriptDataService extends DataService<Script> {
     });
     return form;
   }
+
+  /**
+   * Check whether a script with given name exist; user needs to be allowed to execute script for this to to not throw a 401 Unauthorized
+   * @param scriptName    script we want to check exists (and we can execute)
+   */
+  public scripWithNameExistsAndCanExecute(scriptName: string): Observable<boolean> {
+    return this.findAll().pipe(
+      getSucceededRemoteData(),
+      getRemoteDataPayload(),
+      map((scriptsRD: PaginatedList<Script>) => {
+        let found = false;
+        scriptsRD.page.forEach((script: Script) => {
+          if (script.id === scriptName) {
+            found = true;
+          }
+        });
+        return found;
+      }));
+  }
 }
diff --git a/src/app/core/shared/dspace-object-type.model.ts b/src/app/core/shared/dspace-object-type.model.ts
index 7e2c1cb678..a5139e8b72 100644
--- a/src/app/core/shared/dspace-object-type.model.ts
+++ b/src/app/core/shared/dspace-object-type.model.ts
@@ -4,4 +4,5 @@ export enum DSpaceObjectType {
   ITEM = 'ITEM',
   COLLECTION = 'COLLECTION',
   COMMUNITY = 'COMMUNITY',
+  DSPACEOBJECT = 'DSPACEOBJECT',
 }
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
index 3c9d399f8b..c27c5e6d13 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
@@ -93,7 +93,7 @@ export class DSOSelectorComponent implements OnInit {
             return this.searchService.search(
               new PaginatedSearchOptions({
                 query: query,
-                dsoType: this.type,
+                dsoType: this.type != DSpaceObjectType.DSPACEOBJECT ? this.type : null,
                 pagination: this.defaultPagination
               })
             )
diff --git a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
index c13bd2b69d..0f166dac51 100644
--- a/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/dso-selector-modal-wrapper.component.ts
@@ -1,16 +1,15 @@
 import { Injectable, Input, OnInit } from '@angular/core';
 import { ActivatedRoute, ActivatedRouteSnapshot } from '@angular/router';
-import { Observable } from 'rxjs';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
 import { RemoteData } from '../../../core/data/remote-data';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
-import { map } from 'rxjs/operators';
 import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model';
 import { hasValue, isNotEmpty } from '../../empty.util';
 
 export enum SelectorActionType {
   CREATE = 'create',
-  EDIT = 'edit'
+  EDIT = 'edit',
+  EXPORT_METADATA = 'export-metadata'
 }
 
 /**
@@ -25,7 +24,7 @@ export abstract class DSOSelectorModalWrapperComponent implements OnInit {
   @Input() dsoRD: RemoteData<DSpaceObject>;
 
   /**
-   * The type of the DSO that's being edited or created
+   * The type of the DSO that's being edited, created or exported
    */
   objectType: DSpaceObjectType;
 
diff --git a/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts
index e310d6ac02..dbd5a0a575 100644
--- a/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component.spec.ts
@@ -1,12 +1,10 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { TranslateModule } from '@ngx-translate/core';
 import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
-import { of as observableOf } from 'rxjs';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 import { ActivatedRoute, Router } from '@angular/router';
 import { EditItemSelectorComponent } from './edit-item-selector.component';
 import { Item } from '../../../../core/shared/item.model';
-import { RemoteData } from '../../../../core/data/remote-data';
 import { RouterStub } from '../../../testing/router.stub';
 import * as itemRouter from '../../../../+item-page/item-page-routing.module';
 import { MetadataValue } from '../../../../core/shared/metadata.models';
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
new file mode 100644
index 0000000000..e5c4befcd8
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
@@ -0,0 +1,79 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
+import { take } from 'rxjs/operators';
+import { ScriptDataService } from '../../../../core/data/processes/script-data.service';
+import { RequestEntry } from '../../../../core/data/request.reducer';
+import { Collection } from '../../../../core/shared/collection.model';
+import { Community } from '../../../../core/shared/community.model';
+import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
+import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ProcessParameter } from '../../../../process-page/processes/process-parameter.model';
+import { isNotEmpty } from '../../../empty.util';
+import { NotificationsService } from '../../../notifications/notifications.service';
+import { DSOSelectorModalWrapperComponent, SelectorActionType } from '../dso-selector-modal-wrapper.component';
+
+export const METADATA_EXPORT_SCRIPT_NAME: string = 'metadata-export';
+
+/**
+ * Component to wrap a list of existing dso's inside a modal
+ * Used to choose a dso from to export metadata of
+ */
+@Component({
+  selector: 'ds-edit-item-selector',
+  templateUrl: '../dso-selector-modal-wrapper.component.html',
+})
+export class ExportMetadataSelectorComponent extends DSOSelectorModalWrapperComponent implements OnInit {
+  objectType = DSpaceObjectType.DSPACEOBJECT;
+  selectorType = DSpaceObjectType.DSPACEOBJECT;
+  action = SelectorActionType.EXPORT_METADATA;
+
+  constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute, private router: Router,
+              protected notificationsService: NotificationsService, protected translationService: TranslateService,
+              protected scriptDataService: ScriptDataService) {
+    super(activeModal, route);
+  }
+
+  /**
+   * If the dso is a collection or community: start export-metadata script & navigate to process if successful
+   * Otherwise show error message
+   */
+  navigate(dso: DSpaceObject) {
+    if (dso instanceof Collection || dso instanceof Community) {
+      this.startScriptNotifyAndRedirect(dso, dso.handle);
+    } else {
+      this.notificationsService.error(this.translationService.get('dso-selector.export-metadata.notValidDSO'));
+    }
+  }
+
+  /**
+   * Start export-metadata script of dso & navigate to process if successful
+   * Otherwise show error message
+   * @param dso   Dso to export
+   */
+  private startScriptNotifyAndRedirect(dso: DSpaceObject, handle: string) {
+    const parameterValues: ProcessParameter[] = [
+      Object.assign(new ProcessParameter(), { name: '-i', value: handle }),
+      Object.assign(new ProcessParameter(), { name: '-f', value: dso.uuid + '.csv' }),
+    ];
+    this.scriptDataService.invoke(METADATA_EXPORT_SCRIPT_NAME, parameterValues, [])
+      .pipe(take(1))
+      .subscribe((requestEntry: RequestEntry) => {
+        if (requestEntry.response.isSuccessful) {
+          const title = this.translationService.get('process.new.notification.success.title');
+          const content = this.translationService.get('process.new.notification.success.content');
+          this.notificationsService.success(title, content);
+          const response: any = requestEntry.response;
+          if (isNotEmpty(response.resourceSelfLinks)) {
+            const processNumber = response.resourceSelfLinks[0].split('/').pop();
+            this.router.navigateByUrl('/processes/' + processNumber);
+          }
+        } else {
+          const title = this.translationService.get('process.new.notification.error.title');
+          const content = this.translationService.get('process.new.notification.error.content');
+          this.notificationsService.error(title, content);
+        }
+      });
+  }
+}
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 8729ffbc95..d7f5defb9d 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -10,6 +10,7 @@ import { MissingTranslationHandler, TranslateModule } from '@ngx-translate/core'
 
 import { NgxPaginationModule } from 'ngx-pagination';
 import { ComcolRoleComponent } from './comcol-forms/edit-comcol-page/comcol-role/comcol-role.component';
+import { ExportMetadataSelectorComponent } from './dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component';
 import { PublicationListElementComponent } from './object-list/item-list-element/item-types/publication/publication-list-element.component';
 
 import { FileUploadModule } from 'ng2-file-upload';
@@ -397,7 +398,8 @@ const COMPONENTS = [
   EpersonSearchBoxComponent,
   GroupSearchBoxComponent,
   FileDownloadLinkComponent,
-  CollectionDropdownComponent
+  CollectionDropdownComponent,
+  ExportMetadataSelectorComponent
 ];
 
 const ENTRY_COMPONENTS = [
@@ -474,6 +476,7 @@ const ENTRY_COMPONENTS = [
   ClaimedTaskActionsEditMetadataComponent,
   FileDownloadLinkComponent,
   CurationFormComponent,
+  ExportMetadataSelectorComponent
 ];
 
 const SHARED_ITEM_PAGE_COMPONENTS = [
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index bfa1c81aa6..9a3d59585a 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -965,6 +965,10 @@
 
   "dso-selector.edit.item.head": "Edit item",
 
+  "dso-selector.export-metadata.dspaceobject.head": "Export metadata from",
+
+  "dso-selector.export-metadata.notValidDSO": "You can only export metadata for collections and communities",
+
   "dso-selector.no-results": "No {{ type }} found",
 
   "dso-selector.placeholder": "Search for a {{ type }}",

From d2523ade9bf21efc8d77dd7b169fe81b6bc69208 Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Tue, 7 Jul 2020 12:42:33 +0200
Subject: [PATCH 02/29] 71712: Check script exists with findBy Id & new tests &
 test fixes

---
 .../admin-sidebar.component.spec.ts           |   7 +-
 .../admin-sidebar/admin-sidebar.component.ts  |   2 +-
 .../data/processes/script-data.service.ts     |  17 +-
 ...export-metadata-selector.component.spec.ts | 165 ++++++++++++++++++
 4 files changed, 177 insertions(+), 14 deletions(-)
 create mode 100644 src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
index 40539d3e13..0a79c407d8 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
@@ -2,6 +2,7 @@ import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { TranslateModule } from '@ngx-translate/core';
 import { ChangeDetectionStrategy, Injector, NO_ERRORS_SCHEMA } from '@angular/core';
+import { ScriptDataService } from '../../core/data/processes/script-data.service';
 import { AdminSidebarComponent } from './admin-sidebar.component';
 import { MenuService } from '../../shared/menu/menu.service';
 import { MenuServiceStub } from '../../shared/testing/menu-service.stub';
@@ -21,11 +22,13 @@ describe('AdminSidebarComponent', () => {
   let fixture: ComponentFixture<AdminSidebarComponent>;
   const menuService = new MenuServiceStub();
   let authorizationService: AuthorizationDataService;
+  let scriptService;
 
   beforeEach(async(() => {
     authorizationService = jasmine.createSpyObj('authorizationService', {
       isAuthorized: observableOf(true)
     });
+    scriptService = jasmine.createSpyObj('scriptService', { scripWithNameExistsAndCanExecute: observableOf(true) });
     TestBed.configureTestingModule({
       imports: [TranslateModule.forRoot(), NoopAnimationsModule, RouterTestingModule],
       declarations: [AdminSidebarComponent],
@@ -36,9 +39,11 @@ describe('AdminSidebarComponent', () => {
         { provide: AuthService, useClass: AuthServiceStub },
         { provide: ActivatedRoute, useValue: {} },
         { provide: AuthorizationDataService, useValue: authorizationService },
+        { provide: ScriptDataService, useValue: scriptService },
         {
           provide: NgbModal, useValue: {
-            open: () => {/*comment*/}
+            open: () => {/*comment*/
+            }
           }
         }
       ],
diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index 2a911f6097..6bd65bb85d 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -378,7 +378,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
               id: 'export_metadata',
               parentID: 'export',
               active: true,
-              visible: authorized && metadataExportScriptExists,
+              visible: (authorized && metadataExportScriptExists),
               model: {
                 type: MenuItemType.ONCLICK,
                 text: 'menu.section.export_metadata',
diff --git a/src/app/core/data/processes/script-data.service.ts b/src/app/core/data/processes/script-data.service.ts
index 2dcc6e364d..837d1fb70e 100644
--- a/src/app/core/data/processes/script-data.service.ts
+++ b/src/app/core/data/processes/script-data.service.ts
@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { getRemoteDataPayload, getSucceededRemoteData } from '../../shared/operators';
+import { getSucceededRemoteData } from '../../shared/operators';
 import { DataService } from '../data.service';
 import { RemoteDataBuildService } from '../../cache/builders/remote-data-build.service';
 import { Store } from '@ngrx/store';
@@ -13,7 +13,7 @@ import { Script } from '../../../process-page/scripts/script.model';
 import { ProcessParameter } from '../../../process-page/processes/process-parameter.model';
 import { find, map, switchMap } from 'rxjs/operators';
 import { URLCombiner } from '../../url-combiner/url-combiner';
-import { PaginatedList } from '../paginated-list';
+import { RemoteData } from '../remote-data';
 import { MultipartPostRequest, RestRequest } from '../request.models';
 import { RequestService } from '../request.service';
 import { Observable } from 'rxjs';
@@ -66,17 +66,10 @@ export class ScriptDataService extends DataService<Script> {
    * @param scriptName    script we want to check exists (and we can execute)
    */
   public scripWithNameExistsAndCanExecute(scriptName: string): Observable<boolean> {
-    return this.findAll().pipe(
+    return this.findById(scriptName).pipe(
       getSucceededRemoteData(),
-      getRemoteDataPayload(),
-      map((scriptsRD: PaginatedList<Script>) => {
-        let found = false;
-        scriptsRD.page.forEach((script: Script) => {
-          if (script.id === scriptName) {
-            found = true;
-          }
-        });
-        return found;
+      map((scriptRD: RemoteData<Script>) => {
+        return (scriptRD.hasSucceeded);
       }));
   }
 }
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
new file mode 100644
index 0000000000..16dcee38d8
--- /dev/null
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
@@ -0,0 +1,165 @@
+import { of as observableOf } from 'rxjs';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { ActivatedRoute, Router } from '@angular/router';
+import { ScriptDataService } from '../../../../core/data/processes/script-data.service';
+import { Collection } from '../../../../core/shared/collection.model';
+import { Community } from '../../../../core/shared/community.model';
+import { Item } from '../../../../core/shared/item.model';
+import { ProcessParameter } from '../../../../process-page/processes/process-parameter.model';
+import { NotificationsService } from '../../../notifications/notifications.service';
+import { NotificationsServiceStub } from '../../../testing/notifications-service.stub';
+import { createSuccessfulRemoteDataObject } from '../../../remote-data.utils';
+import { ExportMetadataSelectorComponent, METADATA_EXPORT_SCRIPT_NAME } from './export-metadata-selector.component';
+
+describe('ExportMetadataSelectorComponent', () => {
+  let component: ExportMetadataSelectorComponent;
+  let fixture: ComponentFixture<ExportMetadataSelectorComponent>;
+  let debugElement: DebugElement;
+
+  let router;
+  let notificationService: NotificationsServiceStub;
+  let scriptService;
+
+  const mockItem = Object.assign(new Item(), {
+    id: 'fake-id',
+    handle: 'fake/handle',
+    lastModified: '2018'
+  });
+
+  const mockCollection1: Collection = Object.assign(new Collection(), {
+    id: 'test-collection-1-1',
+    name: 'test-collection-1',
+    handle: 'fake/test-collection-1',
+  });
+
+  const mockCommunity = Object.assign(new Community(), {
+    id: 'test-uuid',
+    handle: 'fake/test-community-1',
+  });
+
+  const itemRD = createSuccessfulRemoteDataObject(mockItem);
+  const modalStub = jasmine.createSpyObj('modalStub', ['close']);
+
+  beforeEach(async(() => {
+    notificationService = new NotificationsServiceStub();
+    router = jasmine.createSpyObj('router', {
+      navigateByUrl: jasmine.createSpy('navigateByUrl')
+    });
+    scriptService = jasmine.createSpyObj('scriptService',
+      {
+        invoke: observableOf({
+          response:
+            {
+              isSuccessful: true,
+              resourceSelfLinks: ['https://localhost:8080/api/core/processes/45']
+            }
+        })
+      }
+    );
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot(), RouterTestingModule.withRoutes([])],
+      declarations: [ExportMetadataSelectorComponent],
+      providers: [
+        { provide: NgbActiveModal, useValue: modalStub },
+        { provide: NotificationsService, useValue: notificationService },
+        { provide: ScriptDataService, useValue: scriptService },
+        {
+          provide: ActivatedRoute,
+          useValue: {
+            root: {
+              snapshot: {
+                data: {
+                  dso: itemRD,
+                },
+              },
+            }
+          },
+        },
+        {
+          provide: Router, useValue: router
+        }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ExportMetadataSelectorComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  describe('if item is selected', () => {
+    beforeEach(() => {
+      component.navigate(mockItem);
+    });
+    it('should show error notification', () => {
+      expect(notificationService.error).toHaveBeenCalled();
+    });
+  });
+
+  describe('if collection is selected', () => {
+    beforeEach(() => {
+      component.navigate(mockCollection1);
+    });
+    it('metadata-export script is invoked with its -i handle and -f uuid.csv', () => {
+      const parameterValues: ProcessParameter[] = [
+        Object.assign(new ProcessParameter(), { name: '-i', value: mockCollection1.handle }),
+        Object.assign(new ProcessParameter(), { name: '-f', value: mockCollection1.uuid + '.csv' }),
+      ];
+      expect(scriptService.invoke).toHaveBeenCalledWith(METADATA_EXPORT_SCRIPT_NAME, parameterValues, []);
+    });
+    it('success notification is shown', () => {
+      expect(notificationService.success).toHaveBeenCalled();
+    });
+    it('redirected to process page', () => {
+      expect(router.navigateByUrl).toHaveBeenCalledWith('/processes/45');
+    });
+  });
+
+  describe('if community is selected', () => {
+    beforeEach(() => {
+      component.navigate(mockCommunity);
+    });
+    it('metadata-export script is invoked with its -i handle and -f uuid.csv', () => {
+      const parameterValues: ProcessParameter[] = [
+        Object.assign(new ProcessParameter(), { name: '-i', value: mockCommunity.handle }),
+        Object.assign(new ProcessParameter(), { name: '-f', value: mockCommunity.uuid + '.csv' }),
+      ];
+      expect(scriptService.invoke).toHaveBeenCalledWith(METADATA_EXPORT_SCRIPT_NAME, parameterValues, []);
+    });
+    it('success notification is shown', () => {
+      expect(notificationService.success).toHaveBeenCalled();
+    });
+    it('redirected to process page', () => {
+      expect(router.navigateByUrl).toHaveBeenCalledWith('/processes/45');
+    });
+  });
+
+  describe('if community/collection is selected; but script invoke fails', () => {
+    beforeEach(() => {
+      jasmine.getEnv().allowRespy(true);
+      spyOn(scriptService, 'invoke').and.returnValue(observableOf({
+        response:
+          {
+            isSuccessful: false,
+          }
+      }));
+      component.navigate(mockCommunity);
+    });
+    it('error notification is shown', () => {
+      expect(notificationService.error).toHaveBeenCalled();
+    });
+  });
+
+});

From 2f946ba2a3af93c2d3048866bd00511e2d7557a5 Mon Sep 17 00:00:00 2001
From: Art Lowel <art@atmire.com>
Date: Tue, 7 Jul 2020 15:21:20 +0200
Subject: [PATCH 03/29] fix issue where the menu wouldn't update if an option
 was added after the initial render

---
 .../admin-sidebar-section.component.html      |   4 +-
 .../admin-sidebar.component.html              |   4 +-
 .../admin-sidebar/admin-sidebar.component.ts  | 151 +++++++++---------
 ...dable-admin-sidebar-section.component.html |   8 +-
 .../data/processes/script-data.service.ts     |  16 +-
 .../expandable-navbar-section.component.html  |   8 +-
 .../navbar-section.component.html             |   4 +-
 src/app/navbar/navbar.component.html          |   2 +-
 .../menu-section/menu-section.component.ts    |  80 +++++++---
 src/app/shared/menu/menu.component.ts         |  42 +++--
 10 files changed, 186 insertions(+), 133 deletions(-)

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar-section/admin-sidebar-section.component.html b/src/app/+admin/admin-sidebar/admin-sidebar-section/admin-sidebar-section.component.html
index e72a17aac1..eb06df3630 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar-section/admin-sidebar-section.component.html
+++ b/src/app/+admin/admin-sidebar/admin-sidebar-section/admin-sidebar-section.component.html
@@ -5,7 +5,7 @@
     <div class="sidebar-collapsible">
             <span class="section-header-text">
         <ng-container
-                *ngComponentOutlet="itemComponents.get(section.id); injector: itemInjectors.get(section.id);"></ng-container>
+                *ngComponentOutlet="(sectionMap$ | async).get(section.id).component; injector: (sectionMap$ | async).get(section.id).injector;"></ng-container>
             </span>
     </div>
-</li>
\ No newline at end of file
+</li>
diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.html b/src/app/+admin/admin-sidebar/admin-sidebar.component.html
index 02a25a8227..357ed058d1 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.html
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.html
@@ -25,7 +25,7 @@
 
             <ng-container *ngFor="let section of (sections | async)">
                 <ng-container
-                        *ngComponentOutlet="sectionComponents.get(section.id); injector: sectionInjectors.get(section.id);"></ng-container>
+                        *ngComponentOutlet="(sectionMap$ | async).get(section.id).component; injector: (sectionMap$ | async).get(section.id).injector;"></ng-container>
             </ng-container>
         </ul>
     </div>
@@ -49,4 +49,4 @@
             </div>
         </div>
     </div>
-</nav>
\ No newline at end of file
+</nav>
diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index 6bd65bb85d..58058f055e 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -1,9 +1,9 @@
 import { Component, Injector, OnInit } from '@angular/core';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
-import { combineLatest as combineLatestObservable } from 'rxjs';
+import { combineLatest as observableCombineLatest } from 'rxjs';
 import { Observable } from 'rxjs/internal/Observable';
 import { of } from 'rxjs/internal/observable/of';
-import { first, map, take } from 'rxjs/operators';
+import { first, map, take, tap, filter } from 'rxjs/operators';
 import { AuthService } from '../../core/auth/auth.service';
 import { ProcessDataService } from '../../core/data/processes/process-data.service';
 import { ScriptDataService } from '../../core/data/processes/script-data.service';
@@ -99,7 +99,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
         this.sidebarOpen = !collapsed;
         this.sidebarClosed = collapsed;
       });
-    this.sidebarExpanded = combineLatestObservable(this.menuCollapsed, this.menuPreviewCollapsed)
+    this.sidebarExpanded = observableCombineLatest(this.menuCollapsed, this.menuPreviewCollapsed)
       .pipe(
         map(([collapsed, previewCollapsed]) => (!collapsed || !previewCollapsed))
       );
@@ -323,78 +323,81 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
    * the export scripts exist and the current user is allowed to execute them
    */
   createExportMenuSections() {
-    const isAuthorized$: Observable<boolean> = this.authorizationService.isAuthorized(FeatureID.AdministratorOf);
-    isAuthorized$.subscribe((authorized: boolean) => {
-      if (authorized) {
-        const metadataExportScriptExists$ = this.scriptDataService.scripWithNameExistsAndCanExecute(METADATA_EXPORT_SCRIPT_NAME);
-        metadataExportScriptExists$.subscribe((metadataExportScriptExists: boolean) => {
-          const menuList = [
-            /* Export */
-            {
-              id: 'export',
-              active: false,
-              visible: true,
-              model: {
-                type: MenuItemType.TEXT,
-                text: 'menu.section.export'
-              } as TextMenuItemModel,
-              icon: 'sign-out-alt',
-              index: 3
-            },
-            {
-              id: 'export_community',
-              parentID: 'export',
-              active: false,
-              visible: true,
-              model: {
-                type: MenuItemType.LINK,
-                text: 'menu.section.export_community',
-                link: ''
-              } as LinkMenuItemModel,
-            },
-            {
-              id: 'export_collection',
-              parentID: 'export',
-              active: false,
-              visible: true,
-              model: {
-                type: MenuItemType.LINK,
-                text: 'menu.section.export_collection',
-                link: ''
-              } as LinkMenuItemModel,
-            },
-            {
-              id: 'export_item',
-              parentID: 'export',
-              active: false,
-              visible: true,
-              model: {
-                type: MenuItemType.LINK,
-                text: 'menu.section.export_item',
-                link: ''
-              } as LinkMenuItemModel,
-            },
-            {
-              id: 'export_metadata',
-              parentID: 'export',
-              active: true,
-              visible: (authorized && metadataExportScriptExists),
-              model: {
-                type: MenuItemType.ONCLICK,
-                text: 'menu.section.export_metadata',
-                function: () => {
-                  this.modalService.open(ExportMetadataSelectorComponent);
-                }
-              } as OnClickMenuItemModel,
-            },
-          ];
-          menuList.forEach((menuSection) => this.menuService.addSection(this.menuID, Object.assign(menuSection, {
-            shouldPersistOnRouteChange: true
-          })));
-        });
-      }
-    });
+    const menuList = [
+      /* Export */
+      {
+        id: 'export',
+        active: false,
+        visible: true,
+        model: {
+          type: MenuItemType.TEXT,
+          text: 'menu.section.export'
+        } as TextMenuItemModel,
+        icon: 'sign-out-alt',
+        index: 3,
+        shouldPersistOnRouteChange: true
+      },
+      {
+        id: 'export_community',
+        parentID: 'export',
+        active: false,
+        visible: true,
+        model: {
+          type: MenuItemType.LINK,
+          text: 'menu.section.export_community',
+          link: ''
+        } as LinkMenuItemModel,
+        shouldPersistOnRouteChange: true
+      },
+      {
+        id: 'export_collection',
+        parentID: 'export',
+        active: false,
+        visible: true,
+        model: {
+          type: MenuItemType.LINK,
+          text: 'menu.section.export_collection',
+          link: ''
+        } as LinkMenuItemModel,
+        shouldPersistOnRouteChange: true
+      },
+      {
+        id: 'export_item',
+        parentID: 'export',
+        active: false,
+        visible: true,
+        model: {
+          type: MenuItemType.LINK,
+          text: 'menu.section.export_item',
+          link: ''
+        } as LinkMenuItemModel,
+        shouldPersistOnRouteChange: true
+      },
+    ];
+    menuList.forEach((menuSection) => this.menuService.addSection(this.menuID, menuSection));
 
+    observableCombineLatest(
+      this.authorizationService.isAuthorized(FeatureID.AdministratorOf),
+      this.scriptDataService.scriptWithNameExistsAndCanExecute(METADATA_EXPORT_SCRIPT_NAME)
+    ).pipe(
+      filter(([authorized, metadataExportScriptExists]: boolean[]) => authorized && metadataExportScriptExists),
+      take(1)
+    ).subscribe(() => {
+      this.menuService.addSection(this.menuID, {
+        id: 'export_metadata',
+        parentID: 'export',
+        active: true,
+        visible: true,
+        model: {
+          type: MenuItemType.ONCLICK,
+          text: 'menu.section.export_metadata',
+          function: () => {
+            this.modalService.open(ExportMetadataSelectorComponent);
+          }
+        } as OnClickMenuItemModel,
+        shouldPersistOnRouteChange: true
+      });
+    });
   }
 
   /**
diff --git a/src/app/+admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html b/src/app/+admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html
index 808683910e..d9869ddf1f 100644
--- a/src/app/+admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html
+++ b/src/app/+admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.html
@@ -12,16 +12,16 @@
            (click)="toggleSection($event)">
             <span class="section-header-text">
                 <ng-container
-                        *ngComponentOutlet="itemComponents.get(section.id); injector: itemInjectors.get(section.id);"></ng-container>
+                        *ngComponentOutlet="(sectionMap$ | async).get(section.id).component; injector: (sectionMap$ | async).get(section.id).injector;"></ng-container>
             </span>
             <i class="fas fa-chevron-right fa-pull-right"
                [@rotate]="(expanded | async) ? 'expanded' : 'collapsed'" [title]="('menu.section.toggle.' + section.id) | translate"></i>
         </a>
         <ul class="sidebar-sub-level-items list-unstyled" @slide *ngIf="(expanded | async)">
-            <li *ngFor="let subSection of (subSections | async)">
+            <li *ngFor="let subSection of (subSections$ | async)">
                 <ng-container
-                        *ngComponentOutlet="itemComponents.get(subSection.id); injector: itemInjectors.get(subSection.id);"></ng-container>
+                        *ngComponentOutlet="(sectionMap$ | async).get(subSection.id).component; injector: (sectionMap$ | async).get(subSection.id).injector;"></ng-container>
             </li>
         </ul>
     </div>
-</li>
\ No newline at end of file
+</li>
diff --git a/src/app/core/data/processes/script-data.service.ts b/src/app/core/data/processes/script-data.service.ts
index 837d1fb70e..696df8b441 100644
--- a/src/app/core/data/processes/script-data.service.ts
+++ b/src/app/core/data/processes/script-data.service.ts
@@ -1,5 +1,8 @@
 import { Injectable } from '@angular/core';
-import { getSucceededRemoteData } from '../../shared/operators';
+import {
+  getSucceededRemoteData,
+  getFirstSucceededRemoteDataPayload
+} from '../../shared/operators';
 import { DataService } from '../data.service';
 import { RemoteDataBuildService } from '../../cache/builders/remote-data-build.service';
 import { Store } from '@ngrx/store';
@@ -11,7 +14,7 @@ import { HttpClient } from '@angular/common/http';
 import { DefaultChangeAnalyzer } from '../default-change-analyzer.service';
 import { Script } from '../../../process-page/scripts/script.model';
 import { ProcessParameter } from '../../../process-page/processes/process-parameter.model';
-import { find, map, switchMap } from 'rxjs/operators';
+import { find, map, switchMap, filter } from 'rxjs/operators';
 import { URLCombiner } from '../../url-combiner/url-combiner';
 import { RemoteData } from '../remote-data';
 import { MultipartPostRequest, RestRequest } from '../request.models';
@@ -20,6 +23,7 @@ import { Observable } from 'rxjs';
 import { RequestEntry } from '../request.reducer';
 import { dataService } from '../../cache/builders/build-decorators';
 import { SCRIPT } from '../../../process-page/scripts/script.resource-type';
+import { hasValue } from '../../../shared/empty.util';
 
 @Injectable()
 @dataService(SCRIPT)
@@ -65,11 +69,11 @@ export class ScriptDataService extends DataService<Script> {
    * Check whether a script with given name exist; user needs to be allowed to execute script for this to to not throw a 401 Unauthorized
    * @param scriptName    script we want to check exists (and we can execute)
    */
-  public scripWithNameExistsAndCanExecute(scriptName: string): Observable<boolean> {
+  public scriptWithNameExistsAndCanExecute(scriptName: string): Observable<boolean> {
     return this.findById(scriptName).pipe(
-      getSucceededRemoteData(),
-      map((scriptRD: RemoteData<Script>) => {
-        return (scriptRD.hasSucceeded);
+      find((rd: RemoteData<Script>) => hasValue(rd.payload) || hasValue(rd.error)),
+      map((rd: RemoteData<Script>) => {
+        return hasValue(rd.payload);
       }));
   }
 }
diff --git a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.html b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.html
index 258c8b6c11..a7cf7c1856 100644
--- a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.html
+++ b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.html
@@ -5,13 +5,13 @@
        id="browseDropdown" (click)="toggleSection($event)"
        data-toggle="dropdown">
         <ng-container
-                *ngComponentOutlet="itemComponents.get(section.id); injector: itemInjectors.get(section.id);"></ng-container>
+                *ngComponentOutlet="(sectionMap$ | async).get(section.id).component; injector: (sectionMap$ | async).get(section.id).injector;"></ng-container>
     </a>
     <ul @slide *ngIf="(active | async)" (click)="deactivateSection($event)"
         class="m-0 shadow-none border-top-0 dropdown-menu show">
-        <ng-container *ngFor="let subSection of (subSections | async)">
+        <ng-container *ngFor="let subSection of (subSections$ | async)">
             <ng-container
-                    *ngComponentOutlet="itemComponents.get(subSection.id); injector: itemInjectors.get(subSection.id);"></ng-container>
+                    *ngComponentOutlet="(sectionMap$ | async).get(subSection.id).component; injector: (sectionMap$ | async).get(subSection.id).injector;"></ng-container>
         </ng-container>
     </ul>
-</li>
\ No newline at end of file
+</li>
diff --git a/src/app/navbar/navbar-section/navbar-section.component.html b/src/app/navbar/navbar-section/navbar-section.component.html
index b257a7bd57..00461995bc 100644
--- a/src/app/navbar/navbar-section/navbar-section.component.html
+++ b/src/app/navbar/navbar-section/navbar-section.component.html
@@ -1,4 +1,4 @@
 <li class="nav-item">
   <ng-container
-          *ngComponentOutlet="itemComponents.get(section.id); injector: itemInjectors.get(section.id);"></ng-container>
-</li>
\ No newline at end of file
+          *ngComponentOutlet="(sectionMap$ | async).get(section.id).component; injector: (sectionMap$ | async).get(section.id).injector;"></ng-container>
+</li>
diff --git a/src/app/navbar/navbar.component.html b/src/app/navbar/navbar.component.html
index eb6164b26f..2356077e43 100644
--- a/src/app/navbar/navbar.component.html
+++ b/src/app/navbar/navbar.component.html
@@ -7,7 +7,7 @@
                 <ul class="navbar-nav mr-auto shadow-none">
                     <ng-container *ngFor="let section of (sections | async)">
                         <ng-container
-                                *ngComponentOutlet="sectionComponents.get(section.id); injector: sectionInjectors.get(section.id);"></ng-container>
+                                *ngComponentOutlet="(sectionMap$ | async).get(section.id).component; injector: (sectionMap$ | async).get(section.id).injector;"></ng-container>
                     </ng-container>
                 </ul>
             </div>
diff --git a/src/app/shared/menu/menu-section/menu-section.component.ts b/src/app/shared/menu/menu-section/menu-section.component.ts
index f7e4f7d867..4dfe6589f7 100644
--- a/src/app/shared/menu/menu-section/menu-section.component.ts
+++ b/src/app/shared/menu/menu-section/menu-section.component.ts
@@ -1,13 +1,15 @@
-import { Component, Injector } from '@angular/core';
+import { Component, Injector, OnInit, OnDestroy } from '@angular/core';
 import { MenuService } from '../menu.service';
 import { MenuSection } from '../menu.reducer';
 import { getComponentForMenuItemType } from '../menu-item.decorator';
 import { MenuID, MenuItemType } from '../initial-menus-state';
-import { hasNoValue } from '../../empty.util';
+import { hasNoValue, hasValue } from '../../empty.util';
 import { Observable } from 'rxjs/internal/Observable';
 import { MenuItemModel } from '../menu-item/models/menu-item.model';
-import { distinctUntilChanged } from 'rxjs/operators';
+import { distinctUntilChanged, switchMap } from 'rxjs/operators';
 import { GenericConstructor } from '../../../core/shared/generic-constructor';
+import { Subscription } from 'rxjs/internal/Subscription';
+import { BehaviorSubject } from 'rxjs';
 
 /**
  * A basic implementation of a menu section's component
@@ -16,7 +18,7 @@ import { GenericConstructor } from '../../../core/shared/generic-constructor';
   selector: 'ds-menu-section',
   template: ''
 })
-export class MenuSectionComponent {
+export class MenuSectionComponent implements OnInit, OnDestroy{
 
   /**
    * Observable that emits whether or not this section is currently active
@@ -28,20 +30,25 @@ export class MenuSectionComponent {
    */
   menuID: MenuID;
 
-  /**
-   * List of Injectors for each dynamically rendered menu item of this section
-   */
-  itemInjectors: Map<string, Injector> = new Map<string, Injector>();
-
-  /**
-   * List of child Components for each dynamically rendered menu item of this section
-   */
-  itemComponents: Map<string, GenericConstructor<MenuSectionComponent>> = new Map<string, GenericConstructor<MenuSectionComponent>>();
-
   /**
    * List of available subsections in this section
    */
-  subSections: Observable<MenuSection[]>;
+  subSections$: Observable<MenuSection[]>;
+
+  /**
+   * Map of components and injectors for each dynamically rendered menu section
+   */
+  sectionMap$: BehaviorSubject<Map<string, {
+    injector: Injector,
+    component: GenericConstructor<MenuSectionComponent>
+  }>> = new BehaviorSubject(new Map());
+
+
+  /**
+   * Array to track all subscriptions and unsubscribe them onDestroy
+   * @type {Array}
+   */
+  subs: Subscription[] = [];
 
   constructor(public section: MenuSection, protected menuService: MenuService, protected injector: Injector) {
   }
@@ -85,15 +92,34 @@ export class MenuSectionComponent {
    * Method for initializing all injectors and component constructors for the menu items in this section
    */
   private initializeInjectorData() {
-    this.itemInjectors.set(this.section.id, this.getItemModelInjector(this.section.model));
-    this.itemComponents.set(this.section.id, this.getMenuItemComponent(this.section.model));
-    this.subSections = this.menuService.getSubSectionsByParentID(this.menuID, this.section.id);
-    this.subSections.subscribe((sections: MenuSection[]) => {
-      sections.forEach((section: MenuSection) => {
-        this.itemInjectors.set(section.id, this.getItemModelInjector(section.model));
-        this.itemComponents.set(section.id, this.getMenuItemComponent(section.model));
+    this.updateSectionMap(
+      this.section.id,
+      this.getItemModelInjector(this.section.model),
+      this.getMenuItemComponent(this.section.model)
+    );
+    this.subSections$ = this.menuService.getSubSectionsByParentID(this.menuID, this.section.id);
+    this.subs.push(
+      this.subSections$.pipe(
+        // if you return an array from a switchMap it will emit each element as a separate event.
+        // So this switchMap is equivalent to a subscribe with a forEach inside
+        switchMap((sections: MenuSection[]) => sections)
+      ).subscribe((section: MenuSection) => {
+        this.updateSectionMap(
+          section.id,
+          this.getItemModelInjector(section.model),
+          this.getMenuItemComponent(section.model)
+        )
       })
-    })
+    );
+  }
+
+  /**
+   * Update the sectionMap
+   */
+  private updateSectionMap(id, injector, component) {
+    const nextMap = this.sectionMap$.getValue();
+    nextMap.set(id, { injector, component });
+    this.sectionMap$.next(nextMap);
   }
 
   /**
@@ -124,4 +150,12 @@ export class MenuSectionComponent {
     });
   }
 
+  /**
+   * Unsubscribe from open subscriptions
+   */
+  ngOnDestroy(): void {
+    this.subs
+      .filter((subscription) => hasValue(subscription))
+      .forEach((subscription) => subscription.unsubscribe());
+  }
 }
diff --git a/src/app/shared/menu/menu.component.ts b/src/app/shared/menu/menu.component.ts
index 28e906c456..808631256d 100644
--- a/src/app/shared/menu/menu.component.ts
+++ b/src/app/shared/menu/menu.component.ts
@@ -3,12 +3,14 @@ import { Observable } from 'rxjs/internal/Observable';
 import { MenuService } from './menu.service';
 import { MenuID } from './initial-menus-state';
 import { MenuSection } from './menu.reducer';
-import { distinctUntilChanged, first, map } from 'rxjs/operators';
+import { distinctUntilChanged, first, map, tap, switchMap, take } from 'rxjs/operators';
 import { GenericConstructor } from '../../core/shared/generic-constructor';
 import { hasValue } from '../empty.util';
 import { MenuSectionComponent } from './menu-section/menu-section.component';
 import { getComponentForMenu } from './menu-section.decorator';
 import { Subscription } from 'rxjs/internal/Subscription';
+import { BehaviorSubject } from 'rxjs';
+import { compareArraysUsingIds } from '../../+item-page/simple/item-types/shared/item-relationships-utils';
 
 /**
  * A basic implementation of a MenuComponent
@@ -44,14 +46,12 @@ export class MenuComponent implements OnInit, OnDestroy {
   sections: Observable<MenuSection[]>;
 
   /**
-   * List of Injectors for each dynamically rendered menu section
+   * Map of components and injectors for each dynamically rendered menu section
    */
-  sectionInjectors: Map<string, Injector> = new Map<string, Injector>();
-
-  /**
-   * List of child Components for each dynamically rendered menu section
-   */
-  sectionComponents: Map<string, GenericConstructor<MenuSectionComponent>> = new Map<string, GenericConstructor<MenuSectionComponent>>();
+  sectionMap$: BehaviorSubject<Map<string, {
+    injector: Injector,
+    component: GenericConstructor<MenuSectionComponent>
+  }>> = new BehaviorSubject(new Map());
 
   /**
    * Prevent unnecessary rerendering
@@ -79,13 +79,25 @@ export class MenuComponent implements OnInit, OnDestroy {
     this.menuCollapsed = this.menuService.isMenuCollapsed(this.menuID);
     this.menuPreviewCollapsed = this.menuService.isMenuPreviewCollapsed(this.menuID);
     this.menuVisible = this.menuService.isMenuVisible(this.menuID);
-    this.sections = this.menuService.getMenuTopSections(this.menuID).pipe(distinctUntilChanged((x, y) => JSON.stringify(x) === JSON.stringify(y)));
-    this.subs.push(this.sections.subscribe((sections: MenuSection[]) => {
-      sections.forEach((section: MenuSection) => {
-        this.sectionInjectors.set(section.id, this.getSectionDataInjector(section));
-        this.getSectionComponent(section).pipe(first()).subscribe((constr) => this.sectionComponents.set(section.id, constr));
-      });
-    }));
+    this.sections = this.menuService.getMenuTopSections(this.menuID).pipe(distinctUntilChanged(compareArraysUsingIds()));
+    this.subs.push(
+      this.sections.pipe(
+        // if you return an array from a switchMap it will emit each element as a separate event.
+        // So this switchMap is equivalent to a subscribe with a forEach inside
+        switchMap((sections: MenuSection[]) => sections),
+        switchMap((section: MenuSection) => this.getSectionComponent(section).pipe(
+          map((component:  GenericConstructor<MenuSectionComponent>) =>  ({ section, component }))
+        )),
+        distinctUntilChanged((x,y) => x.section.id === y.section.id)
+      ).subscribe(({ section, component}) => {
+        const nextMap = this.sectionMap$.getValue();
+        nextMap.set(section.id, {
+          injector: this.getSectionDataInjector(section),
+          component
+        });
+        this.sectionMap$.next(nextMap);
+      })
+    );
   }
 
   /**

From 311d93efad983f04befff6a902f1324176e67bca Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Tue, 7 Jul 2020 16:17:48 +0200
Subject: [PATCH 04/29] 71712: Left out the filter for authorized &
 metadata-export script exists to show export metadata option for now, until
 #635 is fixed See https://github.com/DSpace/dspace-angular/issues/635 If
 uncommented now: in prod mode: button only available after refresh after
 login; in dev mode: button not available in any way because authorisation
 request header is not added to script request

---
 src/app/+admin/admin-sidebar/admin-sidebar.component.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index 58058f055e..c6853ebc0a 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -380,7 +380,8 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
       this.authorizationService.isAuthorized(FeatureID.AdministratorOf),
       this.scriptDataService.scriptWithNameExistsAndCanExecute(METADATA_EXPORT_SCRIPT_NAME)
     ).pipe(
-      filter(([authorized, metadataExportScriptExists]: boolean[]) => authorized && metadataExportScriptExists),
+      // TODO uncomment when #635 (https://github.com/DSpace/dspace-angular/issues/635) is fixed; otherwise even in production mode, the metadata export button is only available after a refresh (and not in dev mode)
+      // filter(([authorized, metadataExportScriptExists]: boolean[]) => authorized && metadataExportScriptExists),
       take(1)
     ).subscribe(() => {
       this.menuService.addSection(this.menuID, {

From 8f28e989a1a279a10b88f141a5c6005ceba93c12 Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Tue, 7 Jul 2020 17:09:15 +0200
Subject: [PATCH 05/29] 71712: Test fixes

---
 src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
index 0a79c407d8..9cdcccba28 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.spec.ts
@@ -28,7 +28,7 @@ describe('AdminSidebarComponent', () => {
     authorizationService = jasmine.createSpyObj('authorizationService', {
       isAuthorized: observableOf(true)
     });
-    scriptService = jasmine.createSpyObj('scriptService', { scripWithNameExistsAndCanExecute: observableOf(true) });
+    scriptService = jasmine.createSpyObj('scriptService', { scriptWithNameExistsAndCanExecute: observableOf(true) });
     TestBed.configureTestingModule({
       imports: [TranslateModule.forRoot(), NoopAnimationsModule, RouterTestingModule],
       declarations: [AdminSidebarComponent],

From d295fa422fced92c53ab828bc4e6286ed1f3dec9 Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Thu, 9 Jul 2020 12:25:40 +0200
Subject: [PATCH 06/29] 71712: Item export no longer redirects & test async
 fixes

---
 .../dso-selector/dso-selector.component.html  |  3 +-
 .../dso-selector/dso-selector.component.ts    |  6 +++
 ...export-metadata-selector.component.spec.ts | 42 ++++++++++++----
 .../export-metadata-selector.component.ts     | 50 +++++++++++--------
 4 files changed, 68 insertions(+), 33 deletions(-)

diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
index e2eda4dcfd..8a30399391 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.html
@@ -15,6 +15,7 @@
             class="list-group-item list-group-item-action border-0 list-entry"
             title="{{ listEntry.indexableObject.name }}"
             (click)="onSelect.emit(listEntry.indexableObject)" #listEntryElement>
-        <ds-listable-object-component-loader [object]="listEntry" [viewMode]="viewMode"></ds-listable-object-component-loader>
+      <ds-listable-object-component-loader [object]="listEntry" [viewMode]="viewMode"
+                                           [linkType]=linkTypes.None></ds-listable-object-component-loader>
     </button>
 </div>
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
index c27c5e6d13..04cfd32e3b 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
@@ -13,6 +13,7 @@ import { FormControl } from '@angular/forms';
 import { Observable } from 'rxjs';
 import { debounceTime, startWith, switchMap } from 'rxjs/operators';
 import { SearchService } from '../../../core/shared/search/search.service';
+import { CollectionElementLinkType } from '../../object-collection/collection-element-link.type';
 import { PaginatedSearchOptions } from '../../search/paginated-search-options.model';
 import { DSpaceObjectType } from '../../../core/shared/dspace-object-type.model';
 import { RemoteData } from '../../../core/data/remote-data';
@@ -76,6 +77,11 @@ export class DSOSelectorComponent implements OnInit {
    */
   debounceTime = 500;
 
+  /**
+   * The available link types
+   */
+  linkTypes = CollectionElementLinkType;
+
   constructor(private searchService: SearchService) {
   }
 
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
index 16dcee38d8..550c28f556 100644
--- a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
@@ -30,7 +30,7 @@ describe('ExportMetadataSelectorComponent', () => {
     lastModified: '2018'
   });
 
-  const mockCollection1: Collection = Object.assign(new Collection(), {
+  const mockCollection: Collection = Object.assign(new Collection(), {
     id: 'test-collection-1-1',
     name: 'test-collection-1',
     handle: 'fake/test-collection-1',
@@ -100,26 +100,36 @@ describe('ExportMetadataSelectorComponent', () => {
   });
 
   describe('if item is selected', () => {
-    beforeEach(() => {
-      component.navigate(mockItem);
+    let scriptRequestSucceeded;
+    beforeEach((done) => {
+      component.navigate(mockItem).subscribe((succeeded: boolean) => {
+        scriptRequestSucceeded = succeeded;
+        done()
+      });
     });
     it('should show error notification', () => {
       expect(notificationService.error).toHaveBeenCalled();
+      expect(scriptRequestSucceeded).toBeFalse();
     });
   });
 
   describe('if collection is selected', () => {
-    beforeEach(() => {
-      component.navigate(mockCollection1);
+    let scriptRequestSucceeded;
+    beforeEach((done) => {
+      component.navigate(mockCollection).subscribe((succeeded: boolean) => {
+        scriptRequestSucceeded = succeeded;
+        done()
+      });
     });
     it('metadata-export script is invoked with its -i handle and -f uuid.csv', () => {
       const parameterValues: ProcessParameter[] = [
-        Object.assign(new ProcessParameter(), { name: '-i', value: mockCollection1.handle }),
-        Object.assign(new ProcessParameter(), { name: '-f', value: mockCollection1.uuid + '.csv' }),
+        Object.assign(new ProcessParameter(), { name: '-i', value: mockCollection.handle }),
+        Object.assign(new ProcessParameter(), { name: '-f', value: mockCollection.uuid + '.csv' }),
       ];
       expect(scriptService.invoke).toHaveBeenCalledWith(METADATA_EXPORT_SCRIPT_NAME, parameterValues, []);
     });
     it('success notification is shown', () => {
+      expect(scriptRequestSucceeded).toBeTrue();
       expect(notificationService.success).toHaveBeenCalled();
     });
     it('redirected to process page', () => {
@@ -128,8 +138,12 @@ describe('ExportMetadataSelectorComponent', () => {
   });
 
   describe('if community is selected', () => {
-    beforeEach(() => {
-      component.navigate(mockCommunity);
+    let scriptRequestSucceeded;
+    beforeEach((done) => {
+      component.navigate(mockCommunity).subscribe((succeeded: boolean) => {
+        scriptRequestSucceeded = succeeded;
+        done()
+      });
     });
     it('metadata-export script is invoked with its -i handle and -f uuid.csv', () => {
       const parameterValues: ProcessParameter[] = [
@@ -139,6 +153,7 @@ describe('ExportMetadataSelectorComponent', () => {
       expect(scriptService.invoke).toHaveBeenCalledWith(METADATA_EXPORT_SCRIPT_NAME, parameterValues, []);
     });
     it('success notification is shown', () => {
+      expect(scriptRequestSucceeded).toBeTrue();
       expect(notificationService.success).toHaveBeenCalled();
     });
     it('redirected to process page', () => {
@@ -147,7 +162,8 @@ describe('ExportMetadataSelectorComponent', () => {
   });
 
   describe('if community/collection is selected; but script invoke fails', () => {
-    beforeEach(() => {
+    let scriptRequestSucceeded;
+    beforeEach((done) => {
       jasmine.getEnv().allowRespy(true);
       spyOn(scriptService, 'invoke').and.returnValue(observableOf({
         response:
@@ -155,9 +171,13 @@ describe('ExportMetadataSelectorComponent', () => {
             isSuccessful: false,
           }
       }));
-      component.navigate(mockCommunity);
+      component.navigate(mockCommunity).subscribe((succeeded: boolean) => {
+        scriptRequestSucceeded = succeeded;
+        done()
+      });
     });
     it('error notification is shown', () => {
+      expect(scriptRequestSucceeded).toBeFalse();
       expect(notificationService.error).toHaveBeenCalled();
     });
   });
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
index e5c4befcd8..88f01404e8 100644
--- a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
@@ -1,7 +1,9 @@
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { TranslateService } from '@ngx-translate/core';
-import { take } from 'rxjs/operators';
+import { Observable } from 'rxjs/internal/Observable';
+import { take, map } from 'rxjs/operators';
+import { of as observableOf } from 'rxjs';
 import { ScriptDataService } from '../../../../core/data/processes/script-data.service';
 import { RequestEntry } from '../../../../core/data/request.reducer';
 import { Collection } from '../../../../core/shared/collection.model';
@@ -39,11 +41,14 @@ export class ExportMetadataSelectorComponent extends DSOSelectorModalWrapperComp
    * If the dso is a collection or community: start export-metadata script & navigate to process if successful
    * Otherwise show error message
    */
-  navigate(dso: DSpaceObject) {
+  navigate(dso: DSpaceObject): Observable<boolean> {
     if (dso instanceof Collection || dso instanceof Community) {
-      this.startScriptNotifyAndRedirect(dso, dso.handle);
+      const startScriptSucceeded = this.startScriptNotifyAndRedirect(dso, dso.handle);
+      startScriptSucceeded.pipe(take(1)).subscribe();
+      return startScriptSucceeded;
     } else {
       this.notificationsService.error(this.translationService.get('dso-selector.export-metadata.notValidDSO'));
+      return observableOf(false);
     }
   }
 
@@ -52,28 +57,31 @@ export class ExportMetadataSelectorComponent extends DSOSelectorModalWrapperComp
    * Otherwise show error message
    * @param dso   Dso to export
    */
-  private startScriptNotifyAndRedirect(dso: DSpaceObject, handle: string) {
+  private startScriptNotifyAndRedirect(dso: DSpaceObject, handle: string): Observable<boolean> {
     const parameterValues: ProcessParameter[] = [
       Object.assign(new ProcessParameter(), { name: '-i', value: handle }),
       Object.assign(new ProcessParameter(), { name: '-f', value: dso.uuid + '.csv' }),
     ];
-    this.scriptDataService.invoke(METADATA_EXPORT_SCRIPT_NAME, parameterValues, [])
-      .pipe(take(1))
-      .subscribe((requestEntry: RequestEntry) => {
-        if (requestEntry.response.isSuccessful) {
-          const title = this.translationService.get('process.new.notification.success.title');
-          const content = this.translationService.get('process.new.notification.success.content');
-          this.notificationsService.success(title, content);
-          const response: any = requestEntry.response;
-          if (isNotEmpty(response.resourceSelfLinks)) {
-            const processNumber = response.resourceSelfLinks[0].split('/').pop();
-            this.router.navigateByUrl('/processes/' + processNumber);
+    return this.scriptDataService.invoke(METADATA_EXPORT_SCRIPT_NAME, parameterValues, [])
+      .pipe(
+        take(1),
+        map((requestEntry: RequestEntry) => {
+          if (requestEntry.response.isSuccessful) {
+            const title = this.translationService.get('process.new.notification.success.title');
+            const content = this.translationService.get('process.new.notification.success.content');
+            this.notificationsService.success(title, content);
+            const response: any = requestEntry.response;
+            if (isNotEmpty(response.resourceSelfLinks)) {
+              const processNumber = response.resourceSelfLinks[0].split('/').pop();
+              this.router.navigateByUrl('/processes/' + processNumber);
+            }
+            return true;
+          } else {
+            const title = this.translationService.get('process.new.notification.error.title');
+            const content = this.translationService.get('process.new.notification.error.content');
+            this.notificationsService.error(title, content);
+            return false;
           }
-        } else {
-          const title = this.translationService.get('process.new.notification.error.title');
-          const content = this.translationService.get('process.new.notification.error.content');
-          this.notificationsService.error(title, content);
-        }
-      });
+        }));
   }
 }

From 2898cbac6ddd41a2749f1082c5814970e12caa8b Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Tue, 7 Jul 2020 18:46:50 +0200
Subject: [PATCH 07/29] 71713: Import metadata CSV

---
 .../metadata-import-page.component.html       |  34 ++++
 .../metadata-import-page.component.scss       |  29 ++++
 .../metadata-import-page.component.ts         | 149 ++++++++++++++++++
 src/app/+admin/admin-routing.module.ts        |   7 +
 .../admin-sidebar/admin-sidebar.component.ts  | 104 ++++++++----
 src/app/+admin/admin.module.ts                |   9 +-
 .../data/processes/script-data.service.ts     |   9 +-
 ...export-metadata-selector.component.spec.ts |   4 +-
 .../export-metadata-selector.component.ts     |   4 +-
 src/assets/i18n/en.json5                      |  20 ++-
 10 files changed, 322 insertions(+), 47 deletions(-)
 create mode 100644 src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
 create mode 100644 src/app/+admin/admin-import-metadata-page/metadata-import-page.component.scss
 create mode 100644 src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts

diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
new file mode 100644
index 0000000000..2fc914d5f9
--- /dev/null
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
@@ -0,0 +1,34 @@
+<div class="container">
+  <h2 id="header">{{'admin.metadata-import.page.header' | translate}}</h2>
+  <p>{{'admin.metadata-import.page.help' | translate}}</p>
+
+  <div ng2FileDrop
+       class="ds-document-drop-zone position-fixed h-100 w-100"
+       [class.ds-document-drop-zone-active]="(isOverDocumentDropZone | async)"
+       [uploader]="uploader"
+       (onFileDrop)="setFile($event)"
+       (fileOver)="fileOverDocument($event)">
+  </div>
+  <div *ngIf="(isOverDocumentDropZone | async)"
+       class="ds-document-drop-zone-inner position-fixed h-100 w-100 p-2">
+    <div
+      class="ds-document-drop-zone-inner-content position-relative d-flex flex-column justify-content-center text-center h-100 w-100">
+      <p class="text-primary">{{'admin.metadata-import.page.dropMsg' | translate}}</p>
+    </div>
+  </div>
+  <div class="well ds-base-drop-zone mt-1 mb-3 text-muted">
+    <label for="file-upload" class="d-flex align-items-center m-0">
+      <span class="btn btn-light">
+          {{'process.new.parameter.file.upload-button' | translate}}
+      </span>
+      <span class="file-name ml-1">{{fileObject?.name}}</span>
+    </label>
+    <input requireFile #file="ngModel" type="file" name="file-upload" id="file-upload" class="form-control-file d-none"
+           [ngModel]="fileObject" (ngModelChange)="setFile($event)"/>
+  </div>
+
+  <button class="btn btn-secondary"
+          (click)="this.onReturn();">{{'admin.metadata-import.page.button.return' | translate}}</button>
+  <button class="btn btn-primary"
+          (click)="this.importMetadata();">{{'admin.metadata-import.page.button.proceed' | translate}}</button>
+</div>
diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.scss b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.scss
new file mode 100644
index 0000000000..94b0fefb4b
--- /dev/null
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.scss
@@ -0,0 +1,29 @@
+.ds-base-drop-zone {
+  border: 2px dashed $gray-600;
+}
+
+.ds-document-drop-zone {
+  top: 0;
+  left: 0;
+  z-index: -1;
+}
+
+.ds-document-drop-zone-active {
+  z-index: $drop-zone-area-z-index !important;
+}
+
+.ds-document-drop-zone-inner {
+  background-color: rgba($white, 0.7);
+  z-index: $drop-zone-area-inner-z-index;
+  top: 0;
+  left: 0;
+}
+
+.ds-document-drop-zone-inner-content {
+  border: 4px dashed map-get($theme-colors, primary);
+  z-index: $drop-zone-area-inner-z-index;
+}
+
+.ds-document-drop-zone-inner-content p {
+  font-size: ($font-size-lg * 2.5);
+}
diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
new file mode 100644
index 0000000000..060ad42059
--- /dev/null
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
@@ -0,0 +1,149 @@
+import { Location } from '@angular/common';
+import { Component, HostListener, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
+import { uniqueId } from 'lodash';
+import { FileUploader } from 'ng2-file-upload';
+import { Observable } from 'rxjs/internal/Observable';
+import { filter, map, take, tap } from 'rxjs/operators';
+import { AuthService } from '../../core/auth/auth.service';
+import { METADATA_IMPORT_SCRIPT_NAME, ScriptDataService } from '../../core/data/processes/script-data.service';
+import { RequestEntry } from '../../core/data/request.reducer';
+import { EPerson } from '../../core/eperson/models/eperson.model';
+import { ProcessParameter } from '../../process-page/processes/process-parameter.model';
+import { hasValue, isNotEmpty } from '../../shared/empty.util';
+import { NotificationsService } from '../../shared/notifications/notifications.service';
+import { of as observableOf } from 'rxjs';
+import { UploaderOptions } from '../../shared/uploader/uploader-options.model';
+
+@Component({
+  selector: 'ds-metadata-import-page',
+  templateUrl: './metadata-import-page.component.html',
+  styleUrls: ['./metadata-import-page.component.scss']
+})
+
+/**
+ * Component that represents a metadata import page for administrators
+ */
+export class MetadataImportPageComponent implements OnInit {
+
+  public isOverDocumentDropZone: Observable<boolean>;
+  public uploader: FileUploader;
+  public uploaderId: string;
+
+  /**
+   * The uploader configuration options
+   * @type {UploaderOptions}
+   */
+  uploadFilesOptions: UploaderOptions = Object.assign(new UploaderOptions(), {
+    // URL needs to contain something to not produce any errors. We are using onFileDrop; not the uploader
+    url: 'placeholder',
+  });
+
+  /**
+   * The current value of the file
+   */
+  fileObject: File;
+
+  /**
+   * The authenticated user's email
+   */
+  private currentUserEmail$: Observable<string>;
+
+  public constructor(protected authService: AuthService,
+                     private location: Location,
+                     protected translate: TranslateService,
+                     protected notificationsService: NotificationsService,
+                     private scriptDataService: ScriptDataService,
+                     private router: Router) {
+  }
+
+  /**
+   * Method provided by Angular. Invoked after the constructor.
+   */
+  ngOnInit() {
+    this.currentUserEmail$ = this.authService.getAuthenticatedUserFromStore().pipe(
+      map((user: EPerson) => user.email)
+    );
+    this.uploaderId = 'ds-drag-and-drop-uploader' + uniqueId();
+    this.isOverDocumentDropZone = observableOf(false);
+    window.addEventListener('drop', e => {
+      e && e.preventDefault();
+    }, false);
+    this.uploader = new FileUploader({
+      // required, but using onFileDrop, not uploader
+      url: 'placeholder',
+    });
+  }
+
+  @HostListener('window:dragover', ['$event'])
+  onDragOver(event: any) {
+    // Show drop area on the page
+    event.preventDefault();
+    if ((event.target as any).tagName !== 'HTML') {
+      this.isOverDocumentDropZone = observableOf(true);
+    }
+  }
+
+  /**
+   * Called when files are dragged on the window document drop area.
+   */
+  public fileOverDocument(isOver: boolean) {
+    if (!isOver) {
+      this.isOverDocumentDropZone = observableOf(isOver);
+    }
+  }
+
+  /**
+   * Set (CSV) file
+   * @param files
+   */
+  setFile(files) {
+    console.log('setfiles', files)
+    this.fileObject = files.length > 0 ? files[0] : undefined;
+  }
+
+  /**
+   * When return button is pressed go to previous location
+   */
+  public onReturn() {
+    this.location.back();
+  }
+
+  /**
+   * Starts import-metadata script with -e currentUserEmail -f fileName (and the selected file)
+   */
+  public importMetadata() {
+    if (this.fileObject == null) {
+      this.notificationsService.error(this.translate.get('admin.metadata-import.page.error.addFile'));
+    } else {
+      this.currentUserEmail$.pipe(
+        filter((email: string) => hasValue(email)),
+        take(1)
+      ).subscribe((email: string) => {
+        const parameterValues: ProcessParameter[] = [
+          Object.assign(new ProcessParameter(), { name: '-e', value: email }),
+          Object.assign(new ProcessParameter(), { name: '-f', value: this.fileObject.name }),
+        ];
+        this.scriptDataService.invoke(METADATA_IMPORT_SCRIPT_NAME, parameterValues, [this.fileObject])
+          .pipe(take(1))
+          .subscribe((requestEntry: RequestEntry) => {
+            if (requestEntry.response.isSuccessful) {
+              const title = this.translate.get('process.new.notification.success.title');
+              const content = this.translate.get('process.new.notification.success.content');
+              this.notificationsService.success(title, content);
+              const response: any = requestEntry.response;
+              if (isNotEmpty(response.resourceSelfLinks)) {
+                const processNumber = response.resourceSelfLinks[0].split('/').pop();
+                this.router.navigateByUrl('/processes/' + processNumber);
+              }
+            } else {
+              const title = this.translate.get('process.new.notification.error.title');
+              const content = this.translate.get('process.new.notification.error.content');
+              this.notificationsService.error(title, content);
+            }
+          });
+      });
+    }
+  }
+}
diff --git a/src/app/+admin/admin-routing.module.ts b/src/app/+admin/admin-routing.module.ts
index 43b3a4ab34..84b418772a 100644
--- a/src/app/+admin/admin-routing.module.ts
+++ b/src/app/+admin/admin-routing.module.ts
@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { getAdminModulePath } from '../app-routing.module';
+import { MetadataImportPageComponent } from './admin-import-metadata-page/metadata-import-page.component';
 import { AdminSearchPageComponent } from './admin-search-page/admin-search-page.component';
 import { I18nBreadcrumbResolver } from '../core/breadcrumbs/i18n-breadcrumb.resolver';
 import { AdminWorkflowPageComponent } from './admin-workflow-page/admin-workflow-page.component';
@@ -48,6 +49,12 @@ export function getAccessControlModulePath() {
         component: AdminCurationTasksComponent,
         data: { title: 'admin.curation-tasks.title', breadcrumbKey: 'admin.curation-tasks' }
       },
+      {
+        path: 'metadata-import',
+        resolve: { breadcrumb: I18nBreadcrumbResolver },
+        component: MetadataImportPageComponent,
+        data: { title: 'admin.metadata-import.title', breadcrumbKey: 'admin.metadata-import' }
+      },
     ])
   ],
   providers: [
diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index c6853ebc0a..eefc10c16e 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -2,13 +2,13 @@ import { Component, Injector, OnInit } from '@angular/core';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { combineLatest as observableCombineLatest } from 'rxjs';
 import { Observable } from 'rxjs/internal/Observable';
-import { of } from 'rxjs/internal/observable/of';
-import { first, map, take, tap, filter } from 'rxjs/operators';
+import { first, map, take } from 'rxjs/operators';
 import { AuthService } from '../../core/auth/auth.service';
-import { ProcessDataService } from '../../core/data/processes/process-data.service';
-import { ScriptDataService } from '../../core/data/processes/script-data.service';
-import { RemoteData } from '../../core/data/remote-data';
-import { Script } from '../../process-page/scripts/script.model';
+import {
+  METADATA_EXPORT_SCRIPT_NAME,
+  METADATA_IMPORT_SCRIPT_NAME,
+  ScriptDataService
+} from '../../core/data/processes/script-data.service';
 import { slideHorizontal, slideSidebar } from '../../shared/animations/slide';
 import { CreateCollectionParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-collection-parent-selector/create-collection-parent-selector.component';
 import { CreateCommunityParentSelectorComponent } from '../../shared/dso-selector/modal-wrappers/create-community-parent-selector/create-community-parent-selector.component';
@@ -17,8 +17,7 @@ import { EditCollectionSelectorComponent } from '../../shared/dso-selector/modal
 import { EditCommunitySelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-community-selector/edit-community-selector.component';
 import { EditItemSelectorComponent } from '../../shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component';
 import {
-  ExportMetadataSelectorComponent,
-  METADATA_EXPORT_SCRIPT_NAME
+  ExportMetadataSelectorComponent
 } from '../../shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component';
 import { MenuID, MenuItemType } from '../../shared/menu/initial-menus-state';
 import { LinkMenuItemModel } from '../../shared/menu/menu-item/models/link.model';
@@ -86,6 +85,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
     this.createMenu();
     this.createSiteAdministratorMenuSections();
     this.createExportMenuSections();
+    this.createImportMenuSections();
     super.ngOnInit();
     this.sidebarWidth = this.variableService.getVariable('sidebarItemsWidth');
     this.authService.isAuthenticated()
@@ -236,39 +236,18 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
         } as OnClickMenuItemModel,
       },
 
-      /* Import */
+      /* Curation tasks */
       {
-        id: 'import',
-        active: false,
-        visible: true,
-        model: {
-          type: MenuItemType.TEXT,
-          text: 'menu.section.import'
-        } as TextMenuItemModel,
-        icon: 'sign-in-alt',
-        index: 2
-      },
-      {
-        id: 'import_metadata',
-        parentID: 'import',
+        id: 'curation_tasks',
         active: false,
         visible: true,
         model: {
           type: MenuItemType.LINK,
-          text: 'menu.section.import_metadata',
-          link: ''
-        } as LinkMenuItemModel,
-      },
-      {
-        id: 'import_batch',
-        parentID: 'import',
-        active: false,
-        visible: true,
-        model: {
-          type: MenuItemType.LINK,
-          text: 'menu.section.import_batch',
+          text: 'menu.section.curation_task',
           link: ''
         } as LinkMenuItemModel,
+        icon: 'filter',
+        index: 7
       },
 
       /* Statistics */
@@ -401,6 +380,63 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
     });
   }
 
+  /**
+   * Create menu sections dependent on whether or not the current user is a site administrator and on whether or not
+   * the import scripts exist and the current user is allowed to execute them
+   */
+  createImportMenuSections() {
+    const menuList = [
+      /* Import */
+      {
+        id: 'import',
+        active: false,
+        visible: true,
+        model: {
+          type: MenuItemType.TEXT,
+          text: 'menu.section.import'
+        } as TextMenuItemModel,
+        icon: 'sign-in-alt',
+        index: 2
+      },
+      {
+        id: 'import_batch',
+        parentID: 'import',
+        active: false,
+        visible: true,
+        model: {
+          type: MenuItemType.LINK,
+          text: 'menu.section.import_batch',
+          link: ''
+        } as LinkMenuItemModel,
+      }
+    ];
+    menuList.forEach((menuSection) => this.menuService.addSection(this.menuID, Object.assign(menuSection, {
+      shouldPersistOnRouteChange: true
+    })));
+
+    observableCombineLatest(
+      this.authorizationService.isAuthorized(FeatureID.AdministratorOf),
+      this.scriptDataService.scriptWithNameExistsAndCanExecute(METADATA_IMPORT_SCRIPT_NAME)
+    ).pipe(
+      // TODO uncomment when #635 (https://github.com/DSpace/dspace-angular/issues/635) is fixed
+      // filter(([authorized, metadataImportScriptExists]: boolean[]) => authorized && metadataImportScriptExists),
+      take(1)
+    ).subscribe(() => {
+      this.menuService.addSection(this.menuID, {
+        id: 'import_metadata',
+        parentID: 'import',
+        active: true,
+        visible: true,
+        model: {
+          type: MenuItemType.LINK,
+          text: 'menu.section.import_metadata',
+          link: '/admin/metadata-import'
+        } as LinkMenuItemModel,
+        shouldPersistOnRouteChange: true
+      });
+    });
+  }
+
   /**
    * Create menu sections dependent on whether or not the current user is a site administrator
    */
diff --git a/src/app/+admin/admin.module.ts b/src/app/+admin/admin.module.ts
index 85749afe03..c350272c3b 100644
--- a/src/app/+admin/admin.module.ts
+++ b/src/app/+admin/admin.module.ts
@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { SharedModule } from '../shared/shared.module';
 import { AdminAccessControlModule } from './admin-access-control/admin-access-control.module';
+import { MetadataImportPageComponent } from './admin-import-metadata-page/metadata-import-page.component';
 import { AdminRegistriesModule } from './admin-registries/admin-registries.module';
 import { AdminRoutingModule } from './admin-routing.module';
 import { AdminSearchPageComponent } from './admin-search-page/admin-search-page.component';
@@ -40,7 +41,9 @@ import { AdminCurationTasksComponent } from './admin-curation-tasks/admin-curati
 
     WorkflowItemSearchResultAdminWorkflowListElementComponent,
     WorkflowItemSearchResultAdminWorkflowGridElementComponent,
-    WorkflowItemAdminWorkflowActionsComponent
+    WorkflowItemAdminWorkflowActionsComponent,
+
+    MetadataImportPageComponent
 
   ],
   entryComponents: [
@@ -54,7 +57,9 @@ import { AdminCurationTasksComponent } from './admin-curation-tasks/admin-curati
 
     WorkflowItemSearchResultAdminWorkflowListElementComponent,
     WorkflowItemSearchResultAdminWorkflowGridElementComponent,
-    WorkflowItemAdminWorkflowActionsComponent
+    WorkflowItemAdminWorkflowActionsComponent,
+
+    MetadataImportPageComponent
   ]
 })
 export class AdminModule {
diff --git a/src/app/core/data/processes/script-data.service.ts b/src/app/core/data/processes/script-data.service.ts
index 696df8b441..34fa24cfff 100644
--- a/src/app/core/data/processes/script-data.service.ts
+++ b/src/app/core/data/processes/script-data.service.ts
@@ -1,8 +1,4 @@
 import { Injectable } from '@angular/core';
-import {
-  getSucceededRemoteData,
-  getFirstSucceededRemoteDataPayload
-} from '../../shared/operators';
 import { DataService } from '../data.service';
 import { RemoteDataBuildService } from '../../cache/builders/remote-data-build.service';
 import { Store } from '@ngrx/store';
@@ -14,7 +10,7 @@ import { HttpClient } from '@angular/common/http';
 import { DefaultChangeAnalyzer } from '../default-change-analyzer.service';
 import { Script } from '../../../process-page/scripts/script.model';
 import { ProcessParameter } from '../../../process-page/processes/process-parameter.model';
-import { find, map, switchMap, filter } from 'rxjs/operators';
+import { find, map, switchMap } from 'rxjs/operators';
 import { URLCombiner } from '../../url-combiner/url-combiner';
 import { RemoteData } from '../remote-data';
 import { MultipartPostRequest, RestRequest } from '../request.models';
@@ -25,6 +21,9 @@ import { dataService } from '../../cache/builders/build-decorators';
 import { SCRIPT } from '../../../process-page/scripts/script.resource-type';
 import { hasValue } from '../../../shared/empty.util';
 
+export const METADATA_IMPORT_SCRIPT_NAME: string = 'metadata-import';
+export const METADATA_EXPORT_SCRIPT_NAME: string = 'metadata-export';
+
 @Injectable()
 @dataService(SCRIPT)
 export class ScriptDataService extends DataService<Script> {
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
index 550c28f556..e534cbf226 100644
--- a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
@@ -5,7 +5,7 @@ import { TranslateModule } from '@ngx-translate/core';
 import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 import { ActivatedRoute, Router } from '@angular/router';
-import { ScriptDataService } from '../../../../core/data/processes/script-data.service';
+import { METADATA_EXPORT_SCRIPT_NAME, ScriptDataService } from '../../../../core/data/processes/script-data.service';
 import { Collection } from '../../../../core/shared/collection.model';
 import { Community } from '../../../../core/shared/community.model';
 import { Item } from '../../../../core/shared/item.model';
@@ -13,7 +13,7 @@ import { ProcessParameter } from '../../../../process-page/processes/process-par
 import { NotificationsService } from '../../../notifications/notifications.service';
 import { NotificationsServiceStub } from '../../../testing/notifications-service.stub';
 import { createSuccessfulRemoteDataObject } from '../../../remote-data.utils';
-import { ExportMetadataSelectorComponent, METADATA_EXPORT_SCRIPT_NAME } from './export-metadata-selector.component';
+import { ExportMetadataSelectorComponent } from './export-metadata-selector.component';
 
 describe('ExportMetadataSelectorComponent', () => {
   let component: ExportMetadataSelectorComponent;
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
index 88f01404e8..4fd01d52ef 100644
--- a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
@@ -4,7 +4,7 @@ import { TranslateService } from '@ngx-translate/core';
 import { Observable } from 'rxjs/internal/Observable';
 import { take, map } from 'rxjs/operators';
 import { of as observableOf } from 'rxjs';
-import { ScriptDataService } from '../../../../core/data/processes/script-data.service';
+import { METADATA_EXPORT_SCRIPT_NAME, ScriptDataService } from '../../../../core/data/processes/script-data.service';
 import { RequestEntry } from '../../../../core/data/request.reducer';
 import { Collection } from '../../../../core/shared/collection.model';
 import { Community } from '../../../../core/shared/community.model';
@@ -16,8 +16,6 @@ import { isNotEmpty } from '../../../empty.util';
 import { NotificationsService } from '../../../notifications/notifications.service';
 import { DSOSelectorModalWrapperComponent, SelectorActionType } from '../dso-selector-modal-wrapper.component';
 
-export const METADATA_EXPORT_SCRIPT_NAME: string = 'metadata-export';
-
 /**
  * Component to wrap a list of existing dso's inside a modal
  * Used to choose a dso from to export metadata of
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index 9a3d59585a..978de832cd 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -442,6 +442,24 @@
 
 
 
+  "admin.metadata-import.breadcrumbs": "Import Metadata",
+
+  "admin.metadata-import.title": "Import Metadata",
+
+  "admin.metadata-import.page.header": "Import Metadata",
+
+  "admin.metadata-import.page.help": "You can drop or browse CSV files that contain batch metadata operations on files here",
+
+  "admin.metadata-import.page.dropMsg": "Drop a metadata CSV to upload",
+
+  "admin.metadata-import.page.button.return": "Return",
+
+  "admin.metadata-import.page.button.proceed": "Proceed",
+
+  "admin.metadata-import.page.error.addFile": "Select file first!",
+
+
+
 
   "auth.errors.invalid-user": "Invalid email address or password.",
 
@@ -3092,6 +3110,6 @@
 
   "workflow-item.send-back.button.cancel": "Cancel",
 
-  "workflow-item.send-back.button.confirm": "Send back",
+  "workflow-item.send-back.button.confirm": "Send back"
 }
 

From 9ae68fee32163e743489fce5f6d8584cbd3ee0a2 Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Wed, 8 Jul 2020 12:09:47 +0200
Subject: [PATCH 08/29] 71713: Tests Import metadata CSV page added

---
 .../metadata-import-page.component.html       |   4 +-
 .../metadata-import-page.component.spec.ts    | 151 ++++++++++++++++++
 .../metadata-import-page.component.ts         |   3 +-
 3 files changed, 154 insertions(+), 4 deletions(-)
 create mode 100644 src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts

diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
index 2fc914d5f9..067e1c8d94 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
@@ -27,8 +27,8 @@
            [ngModel]="fileObject" (ngModelChange)="setFile($event)"/>
   </div>
 
-  <button class="btn btn-secondary"
+  <button class="btn btn-secondary" id="backButton"
           (click)="this.onReturn();">{{'admin.metadata-import.page.button.return' | translate}}</button>
-  <button class="btn btn-primary"
+  <button class="btn btn-primary" id="proceedButton"
           (click)="this.importMetadata();">{{'admin.metadata-import.page.button.proceed' | translate}}</button>
 </div>
diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts
new file mode 100644
index 0000000000..bc3e0ebade
--- /dev/null
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts
@@ -0,0 +1,151 @@
+import { Location } from '@angular/common';
+import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, fakeAsync, TestBed } from '@angular/core/testing';
+import { FormsModule } from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { Router } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+import { of as observableOf } from 'rxjs/internal/observable/of';
+import { AuthService } from '../../core/auth/auth.service';
+import {
+  METADATA_IMPORT_SCRIPT_NAME,
+  ScriptDataService
+} from '../../core/data/processes/script-data.service';
+import { EPerson } from '../../core/eperson/models/eperson.model';
+import { ProcessParameter } from '../../process-page/processes/process-parameter.model';
+import { NotificationsService } from '../../shared/notifications/notifications.service';
+import { NotificationsServiceStub } from '../../shared/testing/notifications-service.stub';
+import { FileValueAccessorDirective } from '../../shared/utils/file-value-accessor.directive';
+import { FileValidator } from '../../shared/utils/require-file.validator';
+import { MetadataImportPageComponent } from './metadata-import-page.component';
+
+describe('MetadataImportPageComponent', () => {
+  let comp: MetadataImportPageComponent;
+  let fixture: ComponentFixture<MetadataImportPageComponent>;
+
+  let user;
+
+  let notificationService: NotificationsServiceStub;
+  let scriptService: any;
+  let router;
+  let authService;
+  let locationStub;
+
+  function init() {
+    notificationService = new NotificationsServiceStub();
+    scriptService = jasmine.createSpyObj('scriptService',
+      {
+        invoke: observableOf({
+          response:
+            {
+              isSuccessful: true,
+              resourceSelfLinks: ['https://localhost:8080/api/core/processes/45']
+            }
+        })
+      }
+    );
+    user = Object.assign(new EPerson(), {
+      id: 'userId',
+      email: 'user@test.com'
+    });
+    authService = jasmine.createSpyObj('authService', {
+      getAuthenticatedUserFromStore: observableOf(user)
+    });
+    router = jasmine.createSpyObj('router', {
+      navigateByUrl: jasmine.createSpy('navigateByUrl')
+    });
+    locationStub = jasmine.createSpyObj('location', {
+      back: jasmine.createSpy('back')
+    });
+  }
+
+  beforeEach(async(() => {
+    init();
+    TestBed.configureTestingModule({
+      imports: [
+        FormsModule,
+        TranslateModule.forRoot(),
+        RouterTestingModule.withRoutes([])
+      ],
+      declarations: [MetadataImportPageComponent, FileValueAccessorDirective, FileValidator],
+      providers: [
+        { provide: NotificationsService, useValue: notificationService },
+        { provide: ScriptDataService, useValue: scriptService },
+        { provide: Router, useValue: router },
+        { provide: AuthService, useValue: authService },
+        { provide: Location, useValue: locationStub },
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MetadataImportPageComponent);
+    comp = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(comp).toBeTruthy();
+  });
+
+  describe('if back button is pressed', () => {
+    beforeEach(fakeAsync(() => {
+      const proceed = fixture.debugElement.query(By.css('#backButton')).nativeElement;
+      proceed.click();
+      fixture.detectChanges();
+    }));
+    it('should do location.back', () => {
+      expect(locationStub.back).toHaveBeenCalled();
+    });
+  });
+
+  describe('if file is set', () => {
+    let fileMock: File;
+
+    beforeEach(() => {
+      fileMock = new File([''], 'filename.txt', { type: 'text/plain' });
+      comp.setFile([fileMock]);
+    });
+
+    describe('if proceed button is pressed', () => {
+      beforeEach(fakeAsync(() => {
+        const proceed = fixture.debugElement.query(By.css('#proceedButton')).nativeElement;
+        proceed.click();
+        fixture.detectChanges();
+      }));
+      it('metadata-import script is invoked with its -e currentUserEmail, -f fileName and the mockFile', () => {
+        const parameterValues: ProcessParameter[] = [
+          Object.assign(new ProcessParameter(), { name: '-e', value: user.email }),
+          Object.assign(new ProcessParameter(), { name: '-f', value: 'filename.txt' }),
+        ];
+        expect(scriptService.invoke).toHaveBeenCalledWith(METADATA_IMPORT_SCRIPT_NAME, parameterValues, [fileMock]);
+      });
+      it('success notification is shown', () => {
+        expect(notificationService.success).toHaveBeenCalled();
+      });
+      it('redirected to process page', () => {
+        expect(router.navigateByUrl).toHaveBeenCalledWith('/processes/45');
+      });
+    });
+
+    describe('if proceed is pressed; but script invoke fails', () => {
+      beforeEach(fakeAsync(() => {
+        jasmine.getEnv().allowRespy(true);
+        spyOn(scriptService, 'invoke').and.returnValue(observableOf({
+          response:
+            {
+              isSuccessful: false,
+            }
+        }));
+        const proceed = fixture.debugElement.query(By.css('#proceedButton')).nativeElement;
+        proceed.click();
+        fixture.detectChanges();
+      }));
+      it('error notification is shown', () => {
+        expect(notificationService.error).toHaveBeenCalled();
+      });
+    });
+  });
+});
diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
index 060ad42059..96dc8dde97 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
@@ -5,7 +5,7 @@ import { TranslateService } from '@ngx-translate/core';
 import { uniqueId } from 'lodash';
 import { FileUploader } from 'ng2-file-upload';
 import { Observable } from 'rxjs/internal/Observable';
-import { filter, map, take, tap } from 'rxjs/operators';
+import { filter, map, take } from 'rxjs/operators';
 import { AuthService } from '../../core/auth/auth.service';
 import { METADATA_IMPORT_SCRIPT_NAME, ScriptDataService } from '../../core/data/processes/script-data.service';
 import { RequestEntry } from '../../core/data/request.reducer';
@@ -99,7 +99,6 @@ export class MetadataImportPageComponent implements OnInit {
    * @param files
    */
   setFile(files) {
-    console.log('setfiles', files)
     this.fileObject = files.length > 0 ? files[0] : undefined;
   }
 

From 393bdf0786cd6408781cc4c6cc8663ff2ce3a23d Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Thu, 9 Jul 2020 13:04:18 +0200
Subject: [PATCH 09/29] 71713: restyle dropzone & rewrite antipattern nested
 subscribes

---
 .../metadata-import-page.component.html       | 20 ++++---
 .../metadata-import-page.component.ts         | 57 ++++++++++---------
 src/assets/i18n/en.json5                      |  4 +-
 3 files changed, 45 insertions(+), 36 deletions(-)

diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
index 067e1c8d94..81be9baedd 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
@@ -17,14 +17,18 @@
     </div>
   </div>
   <div class="well ds-base-drop-zone mt-1 mb-3 text-muted">
-    <label for="file-upload" class="d-flex align-items-center m-0">
-      <span class="btn btn-light">
-          {{'process.new.parameter.file.upload-button' | translate}}
-      </span>
-      <span class="file-name ml-1">{{fileObject?.name}}</span>
-    </label>
-    <input requireFile #file="ngModel" type="file" name="file-upload" id="file-upload" class="form-control-file d-none"
-           [ngModel]="fileObject" (ngModelChange)="setFile($event)"/>
+    <p class="text-center m-0 p-0 d-flex justify-content-center align-items-center"
+       *ngIf="fileObject!=null">  {{ fileObject.name }} </p>
+    <p class="text-center m-0 p-0 d-flex justify-content-center align-items-center">
+      <span><i class="fas fa-cloud-upload"
+               aria-hidden="true"></i> {{ (fileObject == null ? 'admin.metadata-import.page.dropMsg' : 'admin.metadata-import.page.dropMsgReplace') | translate}} {{'uploader.or' | translate}}</span>
+      <label class="btn btn-link m-0 p-0 ml-1">
+        <input class="form-control-file d-none" requireFile #file="ngModel" type="file" name="file-upload"
+               id="file-upload"
+               [ngModel]="fileObject" (ngModelChange)="setFile($event)">
+        {{'uploader.browse' | translate}}
+      </label>
+    </p>
   </div>
 
   <button class="btn btn-secondary" id="backButton"
diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
index 96dc8dde97..0fff7fe5b1 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
@@ -5,13 +5,13 @@ import { TranslateService } from '@ngx-translate/core';
 import { uniqueId } from 'lodash';
 import { FileUploader } from 'ng2-file-upload';
 import { Observable } from 'rxjs/internal/Observable';
-import { filter, map, take } from 'rxjs/operators';
+import { map, switchMap, take } from 'rxjs/operators';
 import { AuthService } from '../../core/auth/auth.service';
 import { METADATA_IMPORT_SCRIPT_NAME, ScriptDataService } from '../../core/data/processes/script-data.service';
 import { RequestEntry } from '../../core/data/request.reducer';
 import { EPerson } from '../../core/eperson/models/eperson.model';
 import { ProcessParameter } from '../../process-page/processes/process-parameter.model';
-import { hasValue, isNotEmpty } from '../../shared/empty.util';
+import { isNotEmpty } from '../../shared/empty.util';
 import { NotificationsService } from '../../shared/notifications/notifications.service';
 import { of as observableOf } from 'rxjs';
 import { UploaderOptions } from '../../shared/uploader/uploader-options.model';
@@ -117,32 +117,35 @@ export class MetadataImportPageComponent implements OnInit {
       this.notificationsService.error(this.translate.get('admin.metadata-import.page.error.addFile'));
     } else {
       this.currentUserEmail$.pipe(
-        filter((email: string) => hasValue(email)),
+        switchMap((email: string) => {
+          if (isNotEmpty(email)) {
+            const parameterValues: ProcessParameter[] = [
+              Object.assign(new ProcessParameter(), { name: '-e', value: email }),
+              Object.assign(new ProcessParameter(), { name: '-f', value: this.fileObject.name }),
+            ];
+            return this.scriptDataService.invoke(METADATA_IMPORT_SCRIPT_NAME, parameterValues, [this.fileObject])
+              .pipe(
+                take(1),
+                map((requestEntry: RequestEntry) => {
+                  if (requestEntry.response.isSuccessful) {
+                    const title = this.translate.get('process.new.notification.success.title');
+                    const content = this.translate.get('process.new.notification.success.content');
+                    this.notificationsService.success(title, content);
+                    const response: any = requestEntry.response;
+                    if (isNotEmpty(response.resourceSelfLinks)) {
+                      const processNumber = response.resourceSelfLinks[0].split('/').pop();
+                      this.router.navigateByUrl('/processes/' + processNumber);
+                    }
+                  } else {
+                    const title = this.translate.get('process.new.notification.error.title');
+                    const content = this.translate.get('process.new.notification.error.content');
+                    this.notificationsService.error(title, content);
+                  }
+                }));
+          }
+        }),
         take(1)
-      ).subscribe((email: string) => {
-        const parameterValues: ProcessParameter[] = [
-          Object.assign(new ProcessParameter(), { name: '-e', value: email }),
-          Object.assign(new ProcessParameter(), { name: '-f', value: this.fileObject.name }),
-        ];
-        this.scriptDataService.invoke(METADATA_IMPORT_SCRIPT_NAME, parameterValues, [this.fileObject])
-          .pipe(take(1))
-          .subscribe((requestEntry: RequestEntry) => {
-            if (requestEntry.response.isSuccessful) {
-              const title = this.translate.get('process.new.notification.success.title');
-              const content = this.translate.get('process.new.notification.success.content');
-              this.notificationsService.success(title, content);
-              const response: any = requestEntry.response;
-              if (isNotEmpty(response.resourceSelfLinks)) {
-                const processNumber = response.resourceSelfLinks[0].split('/').pop();
-                this.router.navigateByUrl('/processes/' + processNumber);
-              }
-            } else {
-              const title = this.translate.get('process.new.notification.error.title');
-              const content = this.translate.get('process.new.notification.error.content');
-              this.notificationsService.error(title, content);
-            }
-          });
-      });
+      ).subscribe();
     }
   }
 }
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index 978de832cd..a77abbcbd4 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -450,7 +450,9 @@
 
   "admin.metadata-import.page.help": "You can drop or browse CSV files that contain batch metadata operations on files here",
 
-  "admin.metadata-import.page.dropMsg": "Drop a metadata CSV to upload",
+  "admin.metadata-import.page.dropMsg": "Drop a metadata CSV to import",
+
+  "admin.metadata-import.page.dropMsgReplace": "Drop to replace the metadata CSV to import",
 
   "admin.metadata-import.page.button.return": "Return",
 

From 930512efaa3c5727ac7bf6917e50be81e7efd47e Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Thu, 16 Jul 2020 10:36:53 +0200
Subject: [PATCH 10/29] 71713: dropzone padding

---
 .../metadata-import-page.component.html                         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
index 81be9baedd..8a09727847 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
@@ -16,7 +16,7 @@
       <p class="text-primary">{{'admin.metadata-import.page.dropMsg' | translate}}</p>
     </div>
   </div>
-  <div class="well ds-base-drop-zone mt-1 mb-3 text-muted">
+  <div class="well ds-base-drop-zone mt-1 mb-3 text-muted p-2">
     <p class="text-center m-0 p-0 d-flex justify-content-center align-items-center"
        *ngIf="fileObject!=null">  {{ fileObject.name }} </p>
     <p class="text-center m-0 p-0 d-flex justify-content-center align-items-center">

From 9e095d09b6126e804422d696c9b613e6a286e90c Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Thu, 16 Jul 2020 11:45:48 +0200
Subject: [PATCH 11/29] lint fixes

---
 .../metadata-import-page.component.ts                         | 4 ++--
 src/app/core/data/processes/script-data.service.ts            | 4 ++--
 .../dso-selector/dso-selector/dso-selector.component.ts       | 2 +-
 src/app/shared/menu/menu-section/menu-section.component.ts    | 3 +--
 src/app/shared/menu/menu.component.ts                         | 2 +-
 5 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
index 0fff7fe5b1..4a9b86d7e3 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
@@ -67,8 +67,8 @@ export class MetadataImportPageComponent implements OnInit {
     );
     this.uploaderId = 'ds-drag-and-drop-uploader' + uniqueId();
     this.isOverDocumentDropZone = observableOf(false);
-    window.addEventListener('drop', e => {
-      e && e.preventDefault();
+    window.addEventListener('drop', (e: DragEvent) => {
+      return e && e.preventDefault();
     }, false);
     this.uploader = new FileUploader({
       // required, but using onFileDrop, not uploader
diff --git a/src/app/core/data/processes/script-data.service.ts b/src/app/core/data/processes/script-data.service.ts
index 34fa24cfff..cecfeabf18 100644
--- a/src/app/core/data/processes/script-data.service.ts
+++ b/src/app/core/data/processes/script-data.service.ts
@@ -21,8 +21,8 @@ import { dataService } from '../../cache/builders/build-decorators';
 import { SCRIPT } from '../../../process-page/scripts/script.resource-type';
 import { hasValue } from '../../../shared/empty.util';
 
-export const METADATA_IMPORT_SCRIPT_NAME: string = 'metadata-import';
-export const METADATA_EXPORT_SCRIPT_NAME: string = 'metadata-export';
+export const METADATA_IMPORT_SCRIPT_NAME = 'metadata-import';
+export const METADATA_EXPORT_SCRIPT_NAME = 'metadata-export';
 
 @Injectable()
 @dataService(SCRIPT)
diff --git a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
index 04cfd32e3b..551a7e458a 100644
--- a/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
+++ b/src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
@@ -99,7 +99,7 @@ export class DSOSelectorComponent implements OnInit {
             return this.searchService.search(
               new PaginatedSearchOptions({
                 query: query,
-                dsoType: this.type != DSpaceObjectType.DSPACEOBJECT ? this.type : null,
+                dsoType: this.type !== DSpaceObjectType.DSPACEOBJECT ? this.type : null,
                 pagination: this.defaultPagination
               })
             )
diff --git a/src/app/shared/menu/menu-section/menu-section.component.ts b/src/app/shared/menu/menu-section/menu-section.component.ts
index 4dfe6589f7..9657422084 100644
--- a/src/app/shared/menu/menu-section/menu-section.component.ts
+++ b/src/app/shared/menu/menu-section/menu-section.component.ts
@@ -18,7 +18,7 @@ import { BehaviorSubject } from 'rxjs';
   selector: 'ds-menu-section',
   template: ''
 })
-export class MenuSectionComponent implements OnInit, OnDestroy{
+export class MenuSectionComponent implements OnInit, OnDestroy {
 
   /**
    * Observable that emits whether or not this section is currently active
@@ -43,7 +43,6 @@ export class MenuSectionComponent implements OnInit, OnDestroy{
     component: GenericConstructor<MenuSectionComponent>
   }>> = new BehaviorSubject(new Map());
 
-
   /**
    * Array to track all subscriptions and unsubscribe them onDestroy
    * @type {Array}
diff --git a/src/app/shared/menu/menu.component.ts b/src/app/shared/menu/menu.component.ts
index 808631256d..398167cb39 100644
--- a/src/app/shared/menu/menu.component.ts
+++ b/src/app/shared/menu/menu.component.ts
@@ -86,7 +86,7 @@ export class MenuComponent implements OnInit, OnDestroy {
         // So this switchMap is equivalent to a subscribe with a forEach inside
         switchMap((sections: MenuSection[]) => sections),
         switchMap((section: MenuSection) => this.getSectionComponent(section).pipe(
-          map((component:  GenericConstructor<MenuSectionComponent>) =>  ({ section, component }))
+          map((component: GenericConstructor<MenuSectionComponent>) =>  ({ section, component }))
         )),
         distinctUntilChanged((x,y) => x.section.id === y.section.id)
       ).subscribe(({ section, component}) => {

From e160d46b8173638c5d6b14d57be3274324df6bc2 Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Thu, 16 Jul 2020 15:14:36 +0200
Subject: [PATCH 12/29] 71713: Dropzone without uploader to own component

---
 .../metadata-import-page.component.html       | 33 ++-----
 .../metadata-import-page.component.spec.ts    |  4 +-
 .../metadata-import-page.component.ts         | 65 +++-----------
 src/app/core/auth/auth.service.ts             |  2 +-
 .../file-dropzone-no-uploader.component.html  | 28 ++++++
 .../file-dropzone-no-uploader.component.ts    | 90 +++++++++++++++++++
 .../file-dropzone-no-uploader.scss}           |  0
 src/app/shared/shared.module.ts               |  2 +
 8 files changed, 138 insertions(+), 86 deletions(-)
 create mode 100644 src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.html
 create mode 100644 src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.ts
 rename src/app/{+admin/admin-import-metadata-page/metadata-import-page.component.scss => shared/file-dropzone-no-uploader/file-dropzone-no-uploader.scss} (100%)

diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
index 8a09727847..42a04b0de6 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.html
@@ -2,34 +2,11 @@
   <h2 id="header">{{'admin.metadata-import.page.header' | translate}}</h2>
   <p>{{'admin.metadata-import.page.help' | translate}}</p>
 
-  <div ng2FileDrop
-       class="ds-document-drop-zone position-fixed h-100 w-100"
-       [class.ds-document-drop-zone-active]="(isOverDocumentDropZone | async)"
-       [uploader]="uploader"
-       (onFileDrop)="setFile($event)"
-       (fileOver)="fileOverDocument($event)">
-  </div>
-  <div *ngIf="(isOverDocumentDropZone | async)"
-       class="ds-document-drop-zone-inner position-fixed h-100 w-100 p-2">
-    <div
-      class="ds-document-drop-zone-inner-content position-relative d-flex flex-column justify-content-center text-center h-100 w-100">
-      <p class="text-primary">{{'admin.metadata-import.page.dropMsg' | translate}}</p>
-    </div>
-  </div>
-  <div class="well ds-base-drop-zone mt-1 mb-3 text-muted p-2">
-    <p class="text-center m-0 p-0 d-flex justify-content-center align-items-center"
-       *ngIf="fileObject!=null">  {{ fileObject.name }} </p>
-    <p class="text-center m-0 p-0 d-flex justify-content-center align-items-center">
-      <span><i class="fas fa-cloud-upload"
-               aria-hidden="true"></i> {{ (fileObject == null ? 'admin.metadata-import.page.dropMsg' : 'admin.metadata-import.page.dropMsgReplace') | translate}} {{'uploader.or' | translate}}</span>
-      <label class="btn btn-link m-0 p-0 ml-1">
-        <input class="form-control-file d-none" requireFile #file="ngModel" type="file" name="file-upload"
-               id="file-upload"
-               [ngModel]="fileObject" (ngModelChange)="setFile($event)">
-        {{'uploader.browse' | translate}}
-      </label>
-    </p>
-  </div>
+  <ds-file-dropzone-no-uploader
+    (onFileAdded)="setFile($event)"
+    [dropMessageLabel]="'admin.metadata-import.page.dropMsg'"
+    [dropMessageLabelReplacement]="'admin.metadata-import.page.dropMsgReplace'">
+  </ds-file-dropzone-no-uploader>
 
   <button class="btn btn-secondary" id="backButton"
           (click)="this.onReturn();">{{'admin.metadata-import.page.button.return' | translate}}</button>
diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts
index bc3e0ebade..9d179aa950 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts
@@ -20,7 +20,7 @@ import { FileValueAccessorDirective } from '../../shared/utils/file-value-access
 import { FileValidator } from '../../shared/utils/require-file.validator';
 import { MetadataImportPageComponent } from './metadata-import-page.component';
 
-describe('MetadataImportPageComponent', () => {
+fdescribe('MetadataImportPageComponent', () => {
   let comp: MetadataImportPageComponent;
   let fixture: ComponentFixture<MetadataImportPageComponent>;
 
@@ -106,7 +106,7 @@ describe('MetadataImportPageComponent', () => {
 
     beforeEach(() => {
       fileMock = new File([''], 'filename.txt', { type: 'text/plain' });
-      comp.setFile([fileMock]);
+      comp.setFile(fileMock);
     });
 
     describe('if proceed button is pressed', () => {
diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
index 4a9b86d7e3..3db6ad1c7c 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.ts
@@ -1,9 +1,7 @@
 import { Location } from '@angular/common';
-import { Component, HostListener, OnInit } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
 import { TranslateService } from '@ngx-translate/core';
-import { uniqueId } from 'lodash';
-import { FileUploader } from 'ng2-file-upload';
 import { Observable } from 'rxjs/internal/Observable';
 import { map, switchMap, take } from 'rxjs/operators';
 import { AuthService } from '../../core/auth/auth.service';
@@ -13,13 +11,10 @@ import { EPerson } from '../../core/eperson/models/eperson.model';
 import { ProcessParameter } from '../../process-page/processes/process-parameter.model';
 import { isNotEmpty } from '../../shared/empty.util';
 import { NotificationsService } from '../../shared/notifications/notifications.service';
-import { of as observableOf } from 'rxjs';
-import { UploaderOptions } from '../../shared/uploader/uploader-options.model';
 
 @Component({
   selector: 'ds-metadata-import-page',
-  templateUrl: './metadata-import-page.component.html',
-  styleUrls: ['./metadata-import-page.component.scss']
+  templateUrl: './metadata-import-page.component.html'
 })
 
 /**
@@ -27,19 +22,6 @@ import { UploaderOptions } from '../../shared/uploader/uploader-options.model';
  */
 export class MetadataImportPageComponent implements OnInit {
 
-  public isOverDocumentDropZone: Observable<boolean>;
-  public uploader: FileUploader;
-  public uploaderId: string;
-
-  /**
-   * The uploader configuration options
-   * @type {UploaderOptions}
-   */
-  uploadFilesOptions: UploaderOptions = Object.assign(new UploaderOptions(), {
-    // URL needs to contain something to not produce any errors. We are using onFileDrop; not the uploader
-    url: 'placeholder',
-  });
-
   /**
    * The current value of the file
    */
@@ -58,6 +40,14 @@ export class MetadataImportPageComponent implements OnInit {
                      private router: Router) {
   }
 
+  /**
+   * Set file
+   * @param file
+   */
+  setFile(file) {
+    this.fileObject = file;
+  }
+
   /**
    * Method provided by Angular. Invoked after the constructor.
    */
@@ -65,41 +55,6 @@ export class MetadataImportPageComponent implements OnInit {
     this.currentUserEmail$ = this.authService.getAuthenticatedUserFromStore().pipe(
       map((user: EPerson) => user.email)
     );
-    this.uploaderId = 'ds-drag-and-drop-uploader' + uniqueId();
-    this.isOverDocumentDropZone = observableOf(false);
-    window.addEventListener('drop', (e: DragEvent) => {
-      return e && e.preventDefault();
-    }, false);
-    this.uploader = new FileUploader({
-      // required, but using onFileDrop, not uploader
-      url: 'placeholder',
-    });
-  }
-
-  @HostListener('window:dragover', ['$event'])
-  onDragOver(event: any) {
-    // Show drop area on the page
-    event.preventDefault();
-    if ((event.target as any).tagName !== 'HTML') {
-      this.isOverDocumentDropZone = observableOf(true);
-    }
-  }
-
-  /**
-   * Called when files are dragged on the window document drop area.
-   */
-  public fileOverDocument(isOver: boolean) {
-    if (!isOver) {
-      this.isOverDocumentDropZone = observableOf(isOver);
-    }
-  }
-
-  /**
-   * Set (CSV) file
-   * @param files
-   */
-  setFile(files) {
-    this.fileObject = files.length > 0 ? files[0] : undefined;
   }
 
   /**
diff --git a/src/app/core/auth/auth.service.ts b/src/app/core/auth/auth.service.ts
index 85e5eebb9e..7d854d9d4d 100644
--- a/src/app/core/auth/auth.service.ts
+++ b/src/app/core/auth/auth.service.ts
@@ -206,7 +206,7 @@ export class AuthService {
     return this.store.pipe(
       select(getAuthenticatedUserId),
       hasValueOperator(),
-      switchMap((id: string) => this.epersonService.findById(id)),
+      switchMap((id: string) => this.epersonService.findById(id) ),
       getAllSucceededRemoteDataPayload()
     )
   }
diff --git a/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.html b/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.html
new file mode 100644
index 0000000000..759f84ef45
--- /dev/null
+++ b/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.html
@@ -0,0 +1,28 @@
+<div ng2FileDrop
+     class="ds-document-drop-zone position-fixed h-100 w-100"
+     [class.ds-document-drop-zone-active]="(isOverDocumentDropZone | async)"
+     [uploader]="uploader"
+     (onFileDrop)="setFile($event)"
+     (fileOver)="fileOverDocument($event)">
+</div>
+<div *ngIf="(isOverDocumentDropZone | async)"
+     class="ds-document-drop-zone-inner position-fixed h-100 w-100 p-2">
+  <div
+    class="ds-document-drop-zone-inner-content position-relative d-flex flex-column justify-content-center text-center h-100 w-100">
+    <p class="text-primary">{{ dropMessageLabel | translate}}</p>
+  </div>
+</div>
+<div class="well ds-base-drop-zone mt-1 mb-3 text-muted p-2">
+  <p class="text-center m-0 p-0 d-flex justify-content-center align-items-center"
+     *ngIf="fileObject!=null">  {{ fileObject.name }} </p>
+  <p class="text-center m-0 p-0 d-flex justify-content-center align-items-center">
+      <span><i class="fas fa-cloud-upload"
+               aria-hidden="true"></i> {{ (fileObject == null ? dropMessageLabel : dropMessageLabelReplacement) | translate}} {{'uploader.or' | translate}}</span>
+    <label class="btn btn-link m-0 p-0 ml-1">
+      <input class="form-control-file d-none" requireFile #file="ngModel" type="file" name="file-upload"
+             id="file-upload"
+             [ngModel]="fileObject" (ngModelChange)="setFile($event)">
+      {{'uploader.browse' | translate}}
+    </label>
+  </p>
+</div>
diff --git a/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.ts b/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.ts
new file mode 100644
index 0000000000..473250d9f6
--- /dev/null
+++ b/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.ts
@@ -0,0 +1,90 @@
+import { Component, EventEmitter, HostListener, Input, OnInit, Output } from '@angular/core';
+import { uniqueId } from 'lodash';
+import { FileUploader } from 'ng2-file-upload';
+import { Observable } from 'rxjs/internal/Observable';
+import { UploaderOptions } from '../uploader/uploader-options.model';
+import { of as observableOf } from 'rxjs';
+
+/**
+ * Component to have a file dropzone without that dropping/choosing a file in browse automatically triggers
+ * the uploader, instead an event is emitted with the file that was added.
+ *
+ * Here only one file is allowed to be selected, so if one is selected/dropped the message changes to a
+ * replace message.
+ */
+@Component({
+  selector: 'ds-file-dropzone-no-uploader',
+  templateUrl: './file-dropzone-no-uploader.component.html',
+  styleUrls: ['./file-dropzone-no-uploader.scss']
+})
+export class FileDropzoneNoUploaderComponent implements OnInit {
+
+  public isOverDocumentDropZone: Observable<boolean>;
+  public uploader: FileUploader;
+  public uploaderId: string;
+
+  @Input() dropMessageLabel: string;
+  @Input() dropMessageLabelReplacement: string;
+
+  /**
+   * The function to call when file is added
+   */
+  @Output() onFileAdded: EventEmitter<any> = new EventEmitter<any>();
+
+  /**
+   * The uploader configuration options
+   * @type {UploaderOptions}
+   */
+  uploadFilesOptions: UploaderOptions = Object.assign(new UploaderOptions(), {
+    // URL needs to contain something to not produce any errors. We are using onFileDrop; not the uploader
+    url: 'placeholder',
+  });
+
+  /**
+   * The current value of the file
+   */
+  fileObject: File;
+
+  /**
+   * Method provided by Angular. Invoked after the constructor.
+   */
+  ngOnInit() {
+    this.uploaderId = 'ds-drag-and-drop-uploader' + uniqueId();
+    this.isOverDocumentDropZone = observableOf(false);
+    window.addEventListener('drop', (e: DragEvent) => {
+      return e && e.preventDefault();
+    }, false);
+    this.uploader = new FileUploader({
+      // required, but using onFileDrop, not uploader
+      url: 'placeholder',
+    });
+  }
+
+  @HostListener('window:dragover', ['$event'])
+  onDragOver(event: any) {
+    // Show drop area on the page
+    event.preventDefault();
+    if ((event.target as any).tagName !== 'HTML') {
+      this.isOverDocumentDropZone = observableOf(true);
+    }
+  }
+
+  /**
+   * Called when files are dragged on the window document drop area.
+   */
+  public fileOverDocument(isOver: boolean) {
+    if (!isOver) {
+      this.isOverDocumentDropZone = observableOf(isOver);
+    }
+  }
+
+  /**
+   * Set file
+   * @param files
+   */
+  setFile(files) {
+    this.fileObject = files.length > 0 ? files[0] : undefined;
+    this.onFileAdded.emit(this.fileObject);
+  }
+
+}
diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.scss b/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.scss
similarity index 100%
rename from src/app/+admin/admin-import-metadata-page/metadata-import-page.component.scss
rename to src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.scss
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index d7f5defb9d..8e4e958097 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -11,6 +11,7 @@ import { MissingTranslationHandler, TranslateModule } from '@ngx-translate/core'
 import { NgxPaginationModule } from 'ngx-pagination';
 import { ComcolRoleComponent } from './comcol-forms/edit-comcol-page/comcol-role/comcol-role.component';
 import { ExportMetadataSelectorComponent } from './dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component';
+import { FileDropzoneNoUploaderComponent } from './file-dropzone-no-uploader/file-dropzone-no-uploader.component';
 import { PublicationListElementComponent } from './object-list/item-list-element/item-types/publication/publication-list-element.component';
 
 import { FileUploadModule } from 'ng2-file-upload';
@@ -308,6 +309,7 @@ const COMPONENTS = [
   ThumbnailComponent,
   GridThumbnailComponent,
   UploaderComponent,
+  FileDropzoneNoUploaderComponent,
   ItemListPreviewComponent,
   MyDSpaceItemStatusComponent,
   ItemSubmitterComponent,

From 66cdf9dd1824813219ab95f2560a85cb7968995b Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Thu, 16 Jul 2020 16:30:47 +0200
Subject: [PATCH 13/29] fdescribe removed

---
 .../metadata-import-page.component.spec.ts                      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts
index 9d179aa950..9c4efb6796 100644
--- a/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts
+++ b/src/app/+admin/admin-import-metadata-page/metadata-import-page.component.spec.ts
@@ -20,7 +20,7 @@ import { FileValueAccessorDirective } from '../../shared/utils/file-value-access
 import { FileValidator } from '../../shared/utils/require-file.validator';
 import { MetadataImportPageComponent } from './metadata-import-page.component';
 
-fdescribe('MetadataImportPageComponent', () => {
+describe('MetadataImportPageComponent', () => {
   let comp: MetadataImportPageComponent;
   let fixture: ComponentFixture<MetadataImportPageComponent>;
 

From 3e0f4a54e6910a37f7fedccc4d42419528e1ea18 Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Mon, 27 Jul 2020 18:17:37 +0200
Subject: [PATCH 14/29] 71712: confirmation modal for export + tests & -
 request causing error because of issue #756, commented out for now & - drop
 event prevention in a HostListener like dragover event

---
 .../admin-sidebar/admin-sidebar.component.ts  |   4 +-
 .../confirmation-modal.component.html         |  16 +++
 .../confirmation-modal.component.spec.ts      | 117 ++++++++++++++++++
 .../confirmation-modal.component.ts           |  48 +++++++
 .../export-metadata-selector.component.ts     |  30 ++++-
 .../file-dropzone-no-uploader.component.ts    |   8 +-
 src/app/shared/shared.module.ts               |   7 +-
 src/assets/i18n/en.json5                      |  10 ++
 src/environments/mock-environment.ts          |   2 +-
 9 files changed, 228 insertions(+), 14 deletions(-)
 create mode 100644 src/app/shared/confirmation-modal/confirmation-modal.component.html
 create mode 100644 src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
 create mode 100644 src/app/shared/confirmation-modal/confirmation-modal.component.ts

diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
index eefc10c16e..3bfbf2de5b 100644
--- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
+++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts
@@ -357,7 +357,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
 
     observableCombineLatest(
       this.authorizationService.isAuthorized(FeatureID.AdministratorOf),
-      this.scriptDataService.scriptWithNameExistsAndCanExecute(METADATA_EXPORT_SCRIPT_NAME)
+      // this.scriptDataService.scriptWithNameExistsAndCanExecute(METADATA_EXPORT_SCRIPT_NAME)
     ).pipe(
       // TODO uncomment when #635 (https://github.com/DSpace/dspace-angular/issues/635) is fixed; otherwise even in production mode, the metadata export button is only available after a refresh (and not in dev mode)
       // filter(([authorized, metadataExportScriptExists]: boolean[]) => authorized && metadataExportScriptExists),
@@ -416,7 +416,7 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
 
     observableCombineLatest(
       this.authorizationService.isAuthorized(FeatureID.AdministratorOf),
-      this.scriptDataService.scriptWithNameExistsAndCanExecute(METADATA_IMPORT_SCRIPT_NAME)
+      // this.scriptDataService.scriptWithNameExistsAndCanExecute(METADATA_IMPORT_SCRIPT_NAME)
     ).pipe(
       // TODO uncomment when #635 (https://github.com/DSpace/dspace-angular/issues/635) is fixed
       // filter(([authorized, metadataImportScriptExists]: boolean[]) => authorized && metadataImportScriptExists),
diff --git a/src/app/shared/confirmation-modal/confirmation-modal.component.html b/src/app/shared/confirmation-modal/confirmation-modal.component.html
new file mode 100644
index 0000000000..bb67213ed3
--- /dev/null
+++ b/src/app/shared/confirmation-modal/confirmation-modal.component.html
@@ -0,0 +1,16 @@
+<div>
+  <div class="modal-header">{{ headerLabel | translate:{dsoName: dso?.name} }}
+    <button type="button" class="close" (click)="close()" aria-label="Close">
+      <span aria-hidden="true">×</span>
+    </button>
+  </div>
+  <div class="modal-body">
+    <p>{{ infoLabel | translate:{dsoName: dso?.name} }}</p>
+    <button type="button" class="cancel btn btn-secondary" (click)="cancelPressed()" aria-label="Cancel">
+      {{ cancelLabel | translate:{dsoName: dso?.name} }}
+    </button>
+    <button type="button" class="confirm btn btn-primary" (click)="confirmPressed()" aria-label="Confirm" ngbAutofocus>
+      {{ confirmLabel | translate:{dsoName: dso?.name} }}
+    </button>
+  </div>
+</div>
diff --git a/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts b/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
new file mode 100644
index 0000000000..63930fc4ed
--- /dev/null
+++ b/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
@@ -0,0 +1,117 @@
+import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
+import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { TranslateModule } from '@ngx-translate/core';
+import { ConfirmationModalComponent } from './confirmation-modal.component';
+
+describe('ConfirmationModalComponent', () => {
+  let component: ConfirmationModalComponent;
+  let fixture: ComponentFixture<ConfirmationModalComponent>;
+  let debugElement: DebugElement;
+
+  const modalStub = jasmine.createSpyObj('modalStub', ['close']);
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [TranslateModule.forRoot()],
+      declarations: [ConfirmationModalComponent],
+      providers: [
+        { provide: NgbActiveModal, useValue: modalStub }
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ConfirmationModalComponent);
+    component = fixture.componentInstance;
+    debugElement = fixture.debugElement;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  describe('close', () => {
+    beforeEach(() => {
+      component.close();
+    });
+    it('should call the close method on the active modal', () => {
+      expect(modalStub.close).toHaveBeenCalled();
+    });
+  });
+
+  describe('confirmPressed', () => {
+    beforeEach(() => {
+      spyOn(component.response, 'emit');
+      component.confirmPressed();
+    });
+    it('should call the close method on the active modal', () => {
+      expect(modalStub.close).toHaveBeenCalled();
+    });
+    it('event emitter should emit true', () => {
+      expect(component.response.emit).toHaveBeenCalledWith(true);
+    });
+  });
+
+  describe('cancelPressed', () => {
+    beforeEach(() => {
+      spyOn(component.response, 'emit');
+      component.cancelPressed();
+    });
+    it('should call the close method on the active modal', () => {
+      expect(modalStub.close).toHaveBeenCalled();
+    });
+    it('event emitter should emit false', () => {
+      expect(component.response.emit).toHaveBeenCalledWith(false);
+    });
+  });
+
+  describe('when the click method emits on close button', () => {
+    beforeEach(fakeAsync(() => {
+      spyOn(component, 'close');
+      debugElement.query(By.css('button.close')).triggerEventHandler('click', {});
+      tick();
+      fixture.detectChanges();
+    }));
+    it('should call the close method on the component', () => {
+      expect(component.close).toHaveBeenCalled();
+    });
+  });
+
+  describe('when the click method emits on cancel button', () => {
+    beforeEach(fakeAsync(() => {
+      spyOn(component, 'close');
+      spyOn(component.response, 'emit');
+      debugElement.query(By.css('button.cancel')).triggerEventHandler('click', {});
+      tick();
+      fixture.detectChanges();
+    }));
+    it('should call the close method on the component', () => {
+      expect(component.close).toHaveBeenCalled();
+    });
+    it('event emitter should emit false', () => {
+      expect(component.response.emit).toHaveBeenCalledWith(false);
+    });
+  });
+
+  describe('when the click method emits on confirm button', () => {
+    beforeEach(fakeAsync(() => {
+      spyOn(component, 'close');
+      spyOn(component.response, 'emit');
+      debugElement.query(By.css('button.confirm')).triggerEventHandler('click', {});
+      tick();
+      fixture.detectChanges();
+    }));
+    it('should call the close method on the component', () => {
+      expect(component.close).toHaveBeenCalled();
+    });
+    it('event emitter should emit true', () => {
+      expect(component.response.emit).toHaveBeenCalledWith(true);
+    });
+  });
+
+});
diff --git a/src/app/shared/confirmation-modal/confirmation-modal.component.ts b/src/app/shared/confirmation-modal/confirmation-modal.component.ts
new file mode 100644
index 0000000000..e52d26021f
--- /dev/null
+++ b/src/app/shared/confirmation-modal/confirmation-modal.component.ts
@@ -0,0 +1,48 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { NgbActiveModal, NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { DSpaceObject } from '../../core/shared/dspace-object.model';
+
+@Component({
+  selector: 'ds-confirmation-modal',
+  templateUrl: 'confirmation-modal.component.html',
+})
+export class ConfirmationModalComponent {
+  @Input() headerLabel: string;
+  @Input() infoLabel: string;
+  @Input() cancelLabel: string;
+  @Input() confirmLabel: string;
+  @Input() dso: DSpaceObject;
+
+  /**
+   * An event fired when the cancel or confirm button is clicked, with respectively false or true
+   */
+  @Output()
+  response = new EventEmitter<boolean>();
+
+  constructor(protected activeModal: NgbActiveModal) {
+  }
+
+  /**
+   * Confirm the action that led to the modal
+   */
+  confirmPressed() {
+    this.response.emit(true);
+    this.close();
+  }
+
+  /**
+   * Cancel the action that led to the modal and close modal
+   */
+  cancelPressed() {
+    this.response.emit(false);
+    this.close();
+  }
+
+  /**
+   * Close the modal
+   */
+  close() {
+    this.activeModal.close();
+  }
+}
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
index 4fd01d52ef..647e77584c 100644
--- a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
@@ -4,16 +4,19 @@ import { TranslateService } from '@ngx-translate/core';
 import { Observable } from 'rxjs/internal/Observable';
 import { take, map } from 'rxjs/operators';
 import { of as observableOf } from 'rxjs';
+import { AuthService } from '../../../../core/auth/auth.service';
 import { METADATA_EXPORT_SCRIPT_NAME, ScriptDataService } from '../../../../core/data/processes/script-data.service';
 import { RequestEntry } from '../../../../core/data/request.reducer';
 import { Collection } from '../../../../core/shared/collection.model';
 import { Community } from '../../../../core/shared/community.model';
 import { DSpaceObjectType } from '../../../../core/shared/dspace-object-type.model';
 import { DSpaceObject } from '../../../../core/shared/dspace-object.model';
-import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { NgbActiveModal, NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { ProcessParameter } from '../../../../process-page/processes/process-parameter.model';
+import { ConfirmationModalComponent } from '../../../confirmation-modal/confirmation-modal.component';
 import { isNotEmpty } from '../../../empty.util';
 import { NotificationsService } from '../../../notifications/notifications.service';
+import { createSuccessfulRemoteDataObject } from '../../../remote-data.utils';
 import { DSOSelectorModalWrapperComponent, SelectorActionType } from '../dso-selector-modal-wrapper.component';
 
 /**
@@ -21,7 +24,7 @@ import { DSOSelectorModalWrapperComponent, SelectorActionType } from '../dso-sel
  * Used to choose a dso from to export metadata of
  */
 @Component({
-  selector: 'ds-edit-item-selector',
+  selector: 'ds-export-metadata-selector',
   templateUrl: '../dso-selector-modal-wrapper.component.html',
 })
 export class ExportMetadataSelectorComponent extends DSOSelectorModalWrapperComponent implements OnInit {
@@ -31,7 +34,8 @@ export class ExportMetadataSelectorComponent extends DSOSelectorModalWrapperComp
 
   constructor(protected activeModal: NgbActiveModal, protected route: ActivatedRoute, private router: Router,
               protected notificationsService: NotificationsService, protected translationService: TranslateService,
-              protected scriptDataService: ScriptDataService) {
+              protected scriptDataService: ScriptDataService,
+              private modalService: NgbModal) {
     super(activeModal, route);
   }
 
@@ -41,9 +45,23 @@ export class ExportMetadataSelectorComponent extends DSOSelectorModalWrapperComp
    */
   navigate(dso: DSpaceObject): Observable<boolean> {
     if (dso instanceof Collection || dso instanceof Community) {
-      const startScriptSucceeded = this.startScriptNotifyAndRedirect(dso, dso.handle);
-      startScriptSucceeded.pipe(take(1)).subscribe();
-      return startScriptSucceeded;
+      const modalRef = this.modalService.open(ConfirmationModalComponent);
+      modalRef.componentInstance.dso = dso;
+      modalRef.componentInstance.headerLabel = "confirmation-modal.export-metadata.header";
+      modalRef.componentInstance.infoLabel = "confirmation-modal.export-metadata.info";
+      modalRef.componentInstance.cancelLabel = "confirmation-modal.export-metadata.cancel";
+      modalRef.componentInstance.confirmLabel = "confirmation-modal.export-metadata.confirm";
+
+      modalRef.componentInstance.response.subscribe((confirm: boolean) => {
+        if (confirm) {
+          const startScriptSucceeded = this.startScriptNotifyAndRedirect(dso, dso.handle);
+          startScriptSucceeded.pipe(take(1)).subscribe();
+          return startScriptSucceeded;
+        } else {
+          const modalRef = this.modalService.open(ExportMetadataSelectorComponent);
+          modalRef.componentInstance.dsoRD = createSuccessfulRemoteDataObject(dso);
+        }
+      });
     } else {
       this.notificationsService.error(this.translationService.get('dso-selector.export-metadata.notValidDSO'));
       return observableOf(false);
diff --git a/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.ts b/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.ts
index 473250d9f6..0ce822bc0e 100644
--- a/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.ts
+++ b/src/app/shared/file-dropzone-no-uploader/file-dropzone-no-uploader.component.ts
@@ -51,15 +51,17 @@ export class FileDropzoneNoUploaderComponent implements OnInit {
   ngOnInit() {
     this.uploaderId = 'ds-drag-and-drop-uploader' + uniqueId();
     this.isOverDocumentDropZone = observableOf(false);
-    window.addEventListener('drop', (e: DragEvent) => {
-      return e && e.preventDefault();
-    }, false);
     this.uploader = new FileUploader({
       // required, but using onFileDrop, not uploader
       url: 'placeholder',
     });
   }
 
+  @HostListener('window:drop', ['$event'])
+  onDrop(event: any) {
+    event.preventDefault();
+  }
+
   @HostListener('window:dragover', ['$event'])
   onDragOver(event: any) {
     // Show drop area on the page
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 8e4e958097..66bdea9217 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -10,6 +10,7 @@ import { MissingTranslationHandler, TranslateModule } from '@ngx-translate/core'
 
 import { NgxPaginationModule } from 'ngx-pagination';
 import { ComcolRoleComponent } from './comcol-forms/edit-comcol-page/comcol-role/comcol-role.component';
+import { ConfirmationModalComponent } from './confirmation-modal/confirmation-modal.component';
 import { ExportMetadataSelectorComponent } from './dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component';
 import { FileDropzoneNoUploaderComponent } from './file-dropzone-no-uploader/file-dropzone-no-uploader.component';
 import { PublicationListElementComponent } from './object-list/item-list-element/item-types/publication/publication-list-element.component';
@@ -401,7 +402,8 @@ const COMPONENTS = [
   GroupSearchBoxComponent,
   FileDownloadLinkComponent,
   CollectionDropdownComponent,
-  ExportMetadataSelectorComponent
+  ExportMetadataSelectorComponent,
+  ConfirmationModalComponent
 ];
 
 const ENTRY_COMPONENTS = [
@@ -478,7 +480,8 @@ const ENTRY_COMPONENTS = [
   ClaimedTaskActionsEditMetadataComponent,
   FileDownloadLinkComponent,
   CurationFormComponent,
-  ExportMetadataSelectorComponent
+  ExportMetadataSelectorComponent,
+  ConfirmationModalComponent
 ];
 
 const SHARED_ITEM_PAGE_COMPONENTS = [
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index a77abbcbd4..d1816847fb 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -995,6 +995,16 @@
 
 
 
+  "confirmation-modal.export-metadata.header": "Export metadata for {{ dsoName }}",
+
+  "confirmation-modal.export-metadata.info": "Are you sure you want to export metadata for {{ dsoName }}",
+
+  "confirmation-modal.export-metadata.cancel": "Cancel",
+
+  "confirmation-modal.export-metadata.confirm": "Export",
+
+
+
   "error.bitstream": "Error fetching bitstream",
 
   "error.browse-by": "Error fetching items",
diff --git a/src/environments/mock-environment.ts b/src/environments/mock-environment.ts
index 6e4d60e268..57a747f374 100644
--- a/src/environments/mock-environment.ts
+++ b/src/environments/mock-environment.ts
@@ -105,7 +105,7 @@ export const environment: Partial<GlobalConfig> = {
   },
   // Angular Universal settings
   universal: {
-    preboot: true,
+    preboot: false,
     async: true,
     time: false
   },

From 26905860baa4ff62b86d0f6b820d4f1e12c85474 Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Tue, 28 Jul 2020 01:41:55 +0200
Subject: [PATCH 15/29] 71712: Test fixes: eventemitter to subject in
 confirmation modal

---
 .../confirmation-modal.component.spec.ts      | 24 ++++++-------
 .../confirmation-modal.component.ts           | 12 +++----
 ...export-metadata-selector.component.spec.ts | 35 ++++++++++++++++---
 .../export-metadata-selector.component.ts     | 27 +++++++-------
 src/app/shared/menu/menu.component.ts         |  2 +-
 src/environments/mock-environment.ts          |  2 +-
 6 files changed, 66 insertions(+), 36 deletions(-)

diff --git a/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts b/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
index 63930fc4ed..4d1de112cd 100644
--- a/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
+++ b/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
@@ -46,27 +46,27 @@ describe('ConfirmationModalComponent', () => {
 
   describe('confirmPressed', () => {
     beforeEach(() => {
-      spyOn(component.response, 'emit');
+      spyOn(component.response, 'next');
       component.confirmPressed();
     });
     it('should call the close method on the active modal', () => {
       expect(modalStub.close).toHaveBeenCalled();
     });
-    it('event emitter should emit true', () => {
-      expect(component.response.emit).toHaveBeenCalledWith(true);
+    it('behaviour subject should have true as next', () => {
+      expect(component.response.next).toHaveBeenCalledWith(true);
     });
   });
 
   describe('cancelPressed', () => {
     beforeEach(() => {
-      spyOn(component.response, 'emit');
+      spyOn(component.response, 'next');
       component.cancelPressed();
     });
     it('should call the close method on the active modal', () => {
       expect(modalStub.close).toHaveBeenCalled();
     });
-    it('event emitter should emit false', () => {
-      expect(component.response.emit).toHaveBeenCalledWith(false);
+    it('behaviour subject should have false as next', () => {
+      expect(component.response.next).toHaveBeenCalledWith(false);
     });
   });
 
@@ -85,7 +85,7 @@ describe('ConfirmationModalComponent', () => {
   describe('when the click method emits on cancel button', () => {
     beforeEach(fakeAsync(() => {
       spyOn(component, 'close');
-      spyOn(component.response, 'emit');
+      spyOn(component.response, 'next');
       debugElement.query(By.css('button.cancel')).triggerEventHandler('click', {});
       tick();
       fixture.detectChanges();
@@ -93,15 +93,15 @@ describe('ConfirmationModalComponent', () => {
     it('should call the close method on the component', () => {
       expect(component.close).toHaveBeenCalled();
     });
-    it('event emitter should emit false', () => {
-      expect(component.response.emit).toHaveBeenCalledWith(false);
+    it('behaviour subject should have false as next', () => {
+      expect(component.response.next).toHaveBeenCalledWith(false);
     });
   });
 
   describe('when the click method emits on confirm button', () => {
     beforeEach(fakeAsync(() => {
       spyOn(component, 'close');
-      spyOn(component.response, 'emit');
+      spyOn(component.response, 'next');
       debugElement.query(By.css('button.confirm')).triggerEventHandler('click', {});
       tick();
       fixture.detectChanges();
@@ -109,8 +109,8 @@ describe('ConfirmationModalComponent', () => {
     it('should call the close method on the component', () => {
       expect(component.close).toHaveBeenCalled();
     });
-    it('event emitter should emit true', () => {
-      expect(component.response.emit).toHaveBeenCalledWith(true);
+    it('behaviour subject should have true as next', () => {
+      expect(component.response.next).toHaveBeenCalledWith(true);
     });
   });
 
diff --git a/src/app/shared/confirmation-modal/confirmation-modal.component.ts b/src/app/shared/confirmation-modal/confirmation-modal.component.ts
index e52d26021f..3cf5ffac1f 100644
--- a/src/app/shared/confirmation-modal/confirmation-modal.component.ts
+++ b/src/app/shared/confirmation-modal/confirmation-modal.component.ts
@@ -1,6 +1,6 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
-import { NgbActiveModal, NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { Component, Input, Output } from '@angular/core';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { Subject } from 'rxjs/internal/Subject';
 import { DSpaceObject } from '../../core/shared/dspace-object.model';
 
 @Component({
@@ -18,7 +18,7 @@ export class ConfirmationModalComponent {
    * An event fired when the cancel or confirm button is clicked, with respectively false or true
    */
   @Output()
-  response = new EventEmitter<boolean>();
+  response: Subject<boolean> = new Subject();
 
   constructor(protected activeModal: NgbActiveModal) {
   }
@@ -27,7 +27,7 @@ export class ConfirmationModalComponent {
    * Confirm the action that led to the modal
    */
   confirmPressed() {
-    this.response.emit(true);
+    this.response.next(true);
     this.close();
   }
 
@@ -35,7 +35,7 @@ export class ConfirmationModalComponent {
    * Cancel the action that led to the modal and close modal
    */
   cancelPressed() {
-    this.response.emit(false);
+    this.response.next(false);
     this.close();
   }
 
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
index e534cbf226..c619217688 100644
--- a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
@@ -1,24 +1,45 @@
 import { of as observableOf } from 'rxjs';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { RouterTestingModule } from '@angular/router/testing';
-import { TranslateModule } from '@ngx-translate/core';
-import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core';
-import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
+import { DebugElement, NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
+import { NgbActiveModal, NgbModal, NgbModalModule } from '@ng-bootstrap/ng-bootstrap';
 import { ActivatedRoute, Router } from '@angular/router';
 import { METADATA_EXPORT_SCRIPT_NAME, ScriptDataService } from '../../../../core/data/processes/script-data.service';
 import { Collection } from '../../../../core/shared/collection.model';
 import { Community } from '../../../../core/shared/community.model';
 import { Item } from '../../../../core/shared/item.model';
 import { ProcessParameter } from '../../../../process-page/processes/process-parameter.model';
+import { ConfirmationModalComponent } from '../../../confirmation-modal/confirmation-modal.component';
+import { TranslateLoaderMock } from '../../../mocks/translate-loader.mock';
 import { NotificationsService } from '../../../notifications/notifications.service';
 import { NotificationsServiceStub } from '../../../testing/notifications-service.stub';
 import { createSuccessfulRemoteDataObject } from '../../../remote-data.utils';
 import { ExportMetadataSelectorComponent } from './export-metadata-selector.component';
 
+
+// No way to add entryComponents yet to testbed; alternative implemented; source: https://stackoverflow.com/questions/41689468/how-to-shallow-test-a-component-with-an-entrycomponents
+@NgModule({
+  imports: [ NgbModalModule,
+    TranslateModule.forRoot({
+      loader: {
+        provide: TranslateLoader,
+        useClass: TranslateLoaderMock
+      }
+    }),
+  ],
+  exports: [],
+  declarations: [ConfirmationModalComponent],
+  providers: [],
+  entryComponents: [ConfirmationModalComponent],
+})
+class ModelTestModule { }
+
 describe('ExportMetadataSelectorComponent', () => {
   let component: ExportMetadataSelectorComponent;
   let fixture: ComponentFixture<ExportMetadataSelectorComponent>;
   let debugElement: DebugElement;
+  let modalRef;
 
   let router;
   let notificationService: NotificationsServiceStub;
@@ -61,7 +82,7 @@ describe('ExportMetadataSelectorComponent', () => {
       }
     );
     TestBed.configureTestingModule({
-      imports: [TranslateModule.forRoot(), RouterTestingModule.withRoutes([])],
+      imports: [TranslateModule.forRoot(), RouterTestingModule.withRoutes([]), ModelTestModule],
       declarations: [ExportMetadataSelectorComponent],
       providers: [
         { provide: NgbActiveModal, useValue: modalStub },
@@ -92,6 +113,9 @@ describe('ExportMetadataSelectorComponent', () => {
     fixture = TestBed.createComponent(ExportMetadataSelectorComponent);
     component = fixture.componentInstance;
     debugElement = fixture.debugElement;
+    const modalService = TestBed.get(NgbModal);
+    modalRef = modalService.open(ConfirmationModalComponent);
+    modalRef.componentInstance.response = observableOf(true);
     fixture.detectChanges();
   });
 
@@ -116,6 +140,7 @@ describe('ExportMetadataSelectorComponent', () => {
   describe('if collection is selected', () => {
     let scriptRequestSucceeded;
     beforeEach((done) => {
+      spyOn((component as any).modalService, 'open').and.returnValue(modalRef);
       component.navigate(mockCollection).subscribe((succeeded: boolean) => {
         scriptRequestSucceeded = succeeded;
         done()
@@ -140,6 +165,7 @@ describe('ExportMetadataSelectorComponent', () => {
   describe('if community is selected', () => {
     let scriptRequestSucceeded;
     beforeEach((done) => {
+      spyOn((component as any).modalService, 'open').and.returnValue(modalRef);
       component.navigate(mockCommunity).subscribe((succeeded: boolean) => {
         scriptRequestSucceeded = succeeded;
         done()
@@ -164,6 +190,7 @@ describe('ExportMetadataSelectorComponent', () => {
   describe('if community/collection is selected; but script invoke fails', () => {
     let scriptRequestSucceeded;
     beforeEach((done) => {
+      spyOn((component as any).modalService, 'open').and.returnValue(modalRef);
       jasmine.getEnv().allowRespy(true);
       spyOn(scriptService, 'invoke').and.returnValue(observableOf({
         response:
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
index 647e77584c..fdc4e8344c 100644
--- a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
@@ -2,9 +2,8 @@ import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { TranslateService } from '@ngx-translate/core';
 import { Observable } from 'rxjs/internal/Observable';
-import { take, map } from 'rxjs/operators';
+import { take, map, switchMap } from 'rxjs/operators';
 import { of as observableOf } from 'rxjs';
-import { AuthService } from '../../../../core/auth/auth.service';
 import { METADATA_EXPORT_SCRIPT_NAME, ScriptDataService } from '../../../../core/data/processes/script-data.service';
 import { RequestEntry } from '../../../../core/data/request.reducer';
 import { Collection } from '../../../../core/shared/collection.model';
@@ -47,21 +46,25 @@ export class ExportMetadataSelectorComponent extends DSOSelectorModalWrapperComp
     if (dso instanceof Collection || dso instanceof Community) {
       const modalRef = this.modalService.open(ConfirmationModalComponent);
       modalRef.componentInstance.dso = dso;
-      modalRef.componentInstance.headerLabel = "confirmation-modal.export-metadata.header";
-      modalRef.componentInstance.infoLabel = "confirmation-modal.export-metadata.info";
-      modalRef.componentInstance.cancelLabel = "confirmation-modal.export-metadata.cancel";
-      modalRef.componentInstance.confirmLabel = "confirmation-modal.export-metadata.confirm";
-
-      modalRef.componentInstance.response.subscribe((confirm: boolean) => {
+      modalRef.componentInstance.headerLabel = 'confirmation-modal.export-metadata.header';
+      modalRef.componentInstance.infoLabel = 'confirmation-modal.export-metadata.info';
+      modalRef.componentInstance.cancelLabel = 'confirmation-modal.export-metadata.cancel';
+      modalRef.componentInstance.confirmLabel = 'confirmation-modal.export-metadata.confirm';
+      const resp$ =  modalRef.componentInstance.response.pipe(switchMap((confirm: boolean) => {
         if (confirm) {
-          const startScriptSucceeded = this.startScriptNotifyAndRedirect(dso, dso.handle);
-          startScriptSucceeded.pipe(take(1)).subscribe();
-          return startScriptSucceeded;
+          const startScriptSucceeded$ = this.startScriptNotifyAndRedirect(dso, dso.handle);
+          return startScriptSucceeded$.pipe(
+            switchMap((r: boolean) => {
+              return observableOf(r);
+            })
+          )
         } else {
           const modalRef = this.modalService.open(ExportMetadataSelectorComponent);
           modalRef.componentInstance.dsoRD = createSuccessfulRemoteDataObject(dso);
         }
-      });
+      }));
+      resp$.subscribe();
+      return resp$;
     } else {
       this.notificationsService.error(this.translationService.get('dso-selector.export-metadata.notValidDSO'));
       return observableOf(false);
diff --git a/src/app/shared/menu/menu.component.ts b/src/app/shared/menu/menu.component.ts
index 398167cb39..cc0379ac37 100644
--- a/src/app/shared/menu/menu.component.ts
+++ b/src/app/shared/menu/menu.component.ts
@@ -3,7 +3,7 @@ import { Observable } from 'rxjs/internal/Observable';
 import { MenuService } from './menu.service';
 import { MenuID } from './initial-menus-state';
 import { MenuSection } from './menu.reducer';
-import { distinctUntilChanged, first, map, tap, switchMap, take } from 'rxjs/operators';
+import { distinctUntilChanged, map, switchMap } from 'rxjs/operators';
 import { GenericConstructor } from '../../core/shared/generic-constructor';
 import { hasValue } from '../empty.util';
 import { MenuSectionComponent } from './menu-section/menu-section.component';
diff --git a/src/environments/mock-environment.ts b/src/environments/mock-environment.ts
index 57a747f374..6e4d60e268 100644
--- a/src/environments/mock-environment.ts
+++ b/src/environments/mock-environment.ts
@@ -105,7 +105,7 @@ export const environment: Partial<GlobalConfig> = {
   },
   // Angular Universal settings
   universal: {
-    preboot: false,
+    preboot: true,
     async: true,
     time: false
   },

From 4338250d8d7f9d8da2d8d761d108abc14f61bb39 Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Tue, 28 Jul 2020 17:49:10 +0200
Subject: [PATCH 16/29] abort travis after script fail, to be able to find
 cause of failure

---
 .travis.yml | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/.travis.yml b/.travis.yml
index 54b3c4752a..13a159bfd0 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -51,10 +51,10 @@ before_script:
 
 script:
   # build app and run all tests
-  - ng lint
-  - travis_wait yarn run build:prod
-  - yarn test:headless
-  - yarn run e2e:ci
+  - ng lint || travis_terminate 1;
+  - travis_wait yarn run build:prod || travis_terminate 1;
+  - yarn test:headless || travis_terminate 1;
+  - yarn run e2e:ci || travis_terminate 1;
 
 after_script:
   # Shutdown docker after everything runs

From e06ff5057a1b47ea9d3a5b76d46679d641eb1e9d Mon Sep 17 00:00:00 2001
From: Marie Verdonck <maria.verdonck@atmire.com>
Date: Tue, 28 Jul 2020 17:49:22 +0200
Subject: [PATCH 17/29] lint

---
 .../confirmation-modal.component.spec.ts          | 15 ++++++++++++---
 .../export-metadata-selector.component.spec.ts    |  1 -
 .../export-metadata-selector.component.ts         |  4 ++--
 3 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts b/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
index 4d1de112cd..2aec37e31a 100644
--- a/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
+++ b/src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
@@ -73,7 +73,10 @@ describe('ConfirmationModalComponent', () => {
   describe('when the click method emits on close button', () => {
     beforeEach(fakeAsync(() => {
       spyOn(component, 'close');
-      debugElement.query(By.css('button.close')).triggerEventHandler('click', {});
+      debugElement.query(By.css('button.close')).triggerEventHandler('click', {
+        preventDefault: () => {/**/
+        }
+      });
       tick();
       fixture.detectChanges();
     }));
@@ -86,7 +89,10 @@ describe('ConfirmationModalComponent', () => {
     beforeEach(fakeAsync(() => {
       spyOn(component, 'close');
       spyOn(component.response, 'next');
-      debugElement.query(By.css('button.cancel')).triggerEventHandler('click', {});
+      debugElement.query(By.css('button.cancel')).triggerEventHandler('click', {
+        preventDefault: () => {/**/
+        }
+      });
       tick();
       fixture.detectChanges();
     }));
@@ -102,7 +108,10 @@ describe('ConfirmationModalComponent', () => {
     beforeEach(fakeAsync(() => {
       spyOn(component, 'close');
       spyOn(component.response, 'next');
-      debugElement.query(By.css('button.confirm')).triggerEventHandler('click', {});
+      debugElement.query(By.css('button.confirm')).triggerEventHandler('click', {
+        preventDefault: () => {/**/
+        }
+      });
       tick();
       fixture.detectChanges();
     }));
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
index c619217688..ca7a339a04 100644
--- a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.spec.ts
@@ -17,7 +17,6 @@ import { NotificationsServiceStub } from '../../../testing/notifications-service
 import { createSuccessfulRemoteDataObject } from '../../../remote-data.utils';
 import { ExportMetadataSelectorComponent } from './export-metadata-selector.component';
 
-
 // No way to add entryComponents yet to testbed; alternative implemented; source: https://stackoverflow.com/questions/41689468/how-to-shallow-test-a-component-with-an-entrycomponents
 @NgModule({
   imports: [ NgbModalModule,
diff --git a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
index fdc4e8344c..523c1c592a 100644
--- a/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
+++ b/src/app/shared/dso-selector/modal-wrappers/export-metadata-selector/export-metadata-selector.component.ts
@@ -59,8 +59,8 @@ export class ExportMetadataSelectorComponent extends DSOSelectorModalWrapperComp
             })
           )
         } else {
-          const modalRef = this.modalService.open(ExportMetadataSelectorComponent);
-          modalRef.componentInstance.dsoRD = createSuccessfulRemoteDataObject(dso);
+          const modalRefExport = this.modalService.open(ExportMetadataSelectorComponent);
+          modalRefExport.componentInstance.dsoRD = createSuccessfulRemoteDataObject(dso);
         }
       }));
       resp$.subscribe();

From f6f87a573891faee6c1199c13a8c90c932cd15a5 Mon Sep 17 00:00:00 2001
From: Raf Ponsaerts <raf.ponsaerts@atmire.com>
Date: Fri, 7 Aug 2020 16:07:33 +0200
Subject: [PATCH 18/29] [Task 72397] implemented the bitstream pagination on
 simple and full item pages

---
 .../full-file-section.component.html          | 102 ++++++++---
 .../full-file-section.component.spec.ts       | 117 ++++++++++++
 .../full-file-section.component.ts            |  94 ++++++----
 .../file-section/file-section.component.html  |   7 +
 .../file-section.component.spec.ts            | 169 ++++++++++++++++++
 .../file-section/file-section.component.ts    |  45 ++++-
 src/assets/i18n/en.json5                      |   7 +
 7 files changed, 474 insertions(+), 67 deletions(-)
 create mode 100644 src/app/+item-page/full/field-components/file-section/full-file-section.component.spec.ts
 create mode 100644 src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts

diff --git a/src/app/+item-page/full/field-components/file-section/full-file-section.component.html b/src/app/+item-page/full/field-components/file-section/full-file-section.component.html
index 7c1719eb82..c6f9f8e944 100644
--- a/src/app/+item-page/full/field-components/file-section/full-file-section.component.html
+++ b/src/app/+item-page/full/field-components/file-section/full-file-section.component.html
@@ -1,29 +1,87 @@
 <ds-metadata-field-wrapper [label]="label | translate">
-    <div class="file-section row" *ngFor="let file of (bitstreams$ | async); let last=last;">
-        <div class="col-3">
-            <ds-thumbnail [thumbnail]="(file.thumbnail | async)?.payload"></ds-thumbnail>
-        </div>
-        <div class="col-7">
-            <dl class="row">
-                <dt class="col-md-4">{{"item.page.filesection.name" | translate}}</dt>
-                <dd class="col-md-8">{{file.name}}</dd>
-
-                <dt class="col-md-4">{{"item.page.filesection.size" | translate}}</dt>
-                <dd class="col-md-8">{{(file.sizeBytes) | dsFileSize }}</dd>
+    <div *ngVar="(originals$ | async)?.payload as originals">
+        <h5 class="simple-view-element-header">{{"item.page.filesection.original.bundle" | translate}}</h5>
+        <ds-pagination *ngIf="originals?.page?.length > 0"
+                       [hideGear]="true"
+                       [hidePagerWhenSinglePage]="true"
+                       [paginationOptions]="originalOptions"
+                       [pageInfoState]="originals"
+                       [collectionSize]="originals?.totalElements"
+                       [disableRouteParameterUpdate]="true"
+                       (pageChange)="switchOriginalPage($event)">
 
 
-                <dt class="col-md-4">{{"item.page.filesection.format" | translate}}</dt>
-                <dd class="col-md-8">{{(file.format | async)?.payload?.description}}</dd>
+
+            <div class="file-section row" *ngFor="let file of originals?.page;">
+                <div class="col-3">
+                    <ds-thumbnail [thumbnail]="(file.thumbnail | async)?.payload"></ds-thumbnail>
+                </div>
+                <div class="col-7">
+                    <dl class="row">
+                        <dt class="col-md-4">{{"item.page.filesection.name" | translate}}</dt>
+                        <dd class="col-md-8">{{file.name}}</dd>
+
+                        <dt class="col-md-4">{{"item.page.filesection.size" | translate}}</dt>
+                        <dd class="col-md-8">{{(file.sizeBytes) | dsFileSize }}</dd>
 
 
-                <dt class="col-md-4">{{"item.page.filesection.description" | translate}}</dt>
-                <dd class="col-md-8">{{file.firstMetadataValue("dc.description")}}</dd>
-            </dl>
-        </div>
-        <div class="col-2">
-            <ds-file-download-link [href]="file._links.content.href" [download]="file.name">
-                {{"item.page.filesection.download" | translate}}
-            </ds-file-download-link>
-        </div>
+                        <dt class="col-md-4">{{"item.page.filesection.format" | translate}}</dt>
+                        <dd class="col-md-8">{{(file.format | async)?.payload?.description}}</dd>
+
+
+                        <dt class="col-md-4">{{"item.page.filesection.description" | translate}}</dt>
+                        <dd class="col-md-8">{{file.firstMetadataValue("dc.description")}}</dd>
+                    </dl>
+                </div>
+                <div class="col-2">
+                    <ds-file-download-link [href]="file._links.content.href" [download]="file.name">
+                        {{"item.page.filesection.download" | translate}}
+                    </ds-file-download-link>
+                </div>
+            </div>
+        </ds-pagination>
+    </div>
+
+    <div *ngVar="(licenses$ | async)?.payload as licenses">
+        <h5 class="simple-view-element-header">{{"item.page.filesection.license.bundle" | translate}}</h5>
+        <ds-pagination *ngIf="licenses?.page?.length > 0"
+                       [hideGear]="true"
+                       [hidePagerWhenSinglePage]="true"
+                       [paginationOptions]="licenseOptions"
+                       [pageInfoState]="licenses"
+                       [collectionSize]="licenses?.totalElements"
+                       [disableRouteParameterUpdate]="true"
+                       (pageChange)="switchLicensePage($event)">
+
+
+
+            <div class="file-section row" *ngFor="let file of licenses?.page;">
+                <div class="col-3">
+                    <ds-thumbnail [thumbnail]="(file.thumbnail | async)?.payload"></ds-thumbnail>
+                </div>
+                <div class="col-7">
+                    <dl class="row">
+                        <dt class="col-md-4">{{"item.page.filesection.name" | translate}}</dt>
+                        <dd class="col-md-8">{{file.name}}</dd>
+
+                        <dt class="col-md-4">{{"item.page.filesection.size" | translate}}</dt>
+                        <dd class="col-md-8">{{(file.sizeBytes) | dsFileSize }}</dd>
+
+
+                        <dt class="col-md-4">{{"item.page.filesection.format" | translate}}</dt>
+                        <dd class="col-md-8">{{(file.format | async)?.payload?.description}}</dd>
+
+
+                        <dt class="col-md-4">{{"item.page.filesection.description" | translate}}</dt>
+                        <dd class="col-md-8">{{file.firstMetadataValue("dc.description")}}</dd>
+                    </dl>
+                </div>
+                <div class="col-2">
+                    <ds-file-download-link [href]="file._links.content.href" [download]="file.name">
+                        {{"item.page.filesection.download" | translate}}
+                    </ds-file-download-link>
+                </div>
+            </div>
+        </ds-pagination>
     </div>
 </ds-metadata-field-wrapper>
diff --git a/src/app/+item-page/full/field-components/file-section/full-file-section.component.spec.ts b/src/app/+item-page/full/field-components/file-section/full-file-section.component.spec.ts
new file mode 100644
index 0000000000..970420f252
--- /dev/null
+++ b/src/app/+item-page/full/field-components/file-section/full-file-section.component.spec.ts
@@ -0,0 +1,117 @@
+import {FullFileSectionComponent} from './full-file-section.component';
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+import {createSuccessfulRemoteDataObject$} from '../../../../shared/remote-data.utils';
+import {createPaginatedList} from '../../../../shared/testing/utils.test';
+import {TranslateLoader, TranslateModule} from '@ngx-translate/core';
+import {TranslateLoaderMock} from '../../../../shared/mocks/translate-loader.mock';
+import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+import {VarDirective} from '../../../../shared/utils/var.directive';
+import {FileSizePipe} from '../../../../shared/utils/file-size-pipe';
+import {MetadataFieldWrapperComponent} from '../../../field-components/metadata-field-wrapper/metadata-field-wrapper.component';
+import {BitstreamDataService} from '../../../../core/data/bitstream-data.service';
+import {NO_ERRORS_SCHEMA} from '@angular/core';
+import {Bitstream} from '../../../../core/shared/bitstream.model';
+import {of as observableOf} from 'rxjs';
+import {MockBitstreamFormat1} from '../../../../shared/mocks/item.mock';
+import {By} from '@angular/platform-browser';
+
+describe('FullFileSectionComponent', () => {
+    let comp: FullFileSectionComponent;
+    let fixture: ComponentFixture<FullFileSectionComponent>;
+
+    const mockBitstream: Bitstream = Object.assign(new Bitstream(),
+        {
+            sizeBytes: 10201,
+            content: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713/content',
+            format: observableOf(MockBitstreamFormat1),
+            bundleName: 'ORIGINAL',
+            _links: {
+                self: {
+                    href: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713'
+                },
+                content: {
+                    href: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713/content'
+                }
+            },
+            id: 'cf9b0c8e-a1eb-4b65-afd0-567366448713',
+            uuid: 'cf9b0c8e-a1eb-4b65-afd0-567366448713',
+            type: 'bitstream',
+            metadata: {
+                'dc.title': [
+                    {
+                        language: null,
+                        value: 'test_word.docx'
+                    }
+                ]
+            }
+        });
+
+    const bitstreamDataService = jasmine.createSpyObj('bitstreamDataService', {
+        findAllByItemAndBundleName: createSuccessfulRemoteDataObject$(createPaginatedList([mockBitstream, mockBitstream, mockBitstream]))
+    });
+
+    beforeEach(async(() => {
+
+        TestBed.configureTestingModule({
+            imports: [TranslateModule.forRoot({
+                loader: {
+                    provide: TranslateLoader,
+                    useClass: TranslateLoaderMock
+                }
+            }), BrowserAnimationsModule],
+            declarations: [FullFileSectionComponent, VarDirective, FileSizePipe, MetadataFieldWrapperComponent],
+            providers: [
+                {provide: BitstreamDataService, useValue: bitstreamDataService}
+            ],
+
+            schemas: [NO_ERRORS_SCHEMA]
+        }).compileComponents();
+    }));
+
+    beforeEach(async(() => {
+        fixture = TestBed.createComponent(FullFileSectionComponent);
+        comp = fixture.componentInstance;
+        fixture.detectChanges();
+    }));
+
+    describe('when the full file section gets loaded with bitstreams available', () => {
+        it ('should contain a list with bitstreams', () => {
+            const fileSection = fixture.debugElement.queryAll(By.css('.file-section'));
+            expect(fileSection.length).toEqual(6);
+        });
+
+        describe('when we press the pageChange button for original bundle', () => {
+            beforeEach(() => {
+                comp.switchOriginalPage(2);
+                fixture.detectChanges();
+            });
+
+            it ('should give the value to the currentpage', () => {
+                expect(comp.originalOptions.currentPage).toBe(2);
+            })
+            it ('should call the next function on the originalCurrentPage', (done) => {
+                comp.originalCurrentPage$.subscribe((event) => {
+                    expect(event).toEqual(2);
+                    done();
+                })
+            })
+        })
+
+        describe('when we press the pageChange button for license bundle', () => {
+            beforeEach(() => {
+                comp.switchLicensePage(2);
+                fixture.detectChanges();
+            });
+
+            it ('should give the value to the currentpage', () => {
+                expect(comp.licenseOptions.currentPage).toBe(2);
+            })
+            it ('should call the next function on the licenseCurrentPage', (done) => {
+                comp.licenseCurrentPage$.subscribe((event) => {
+                    expect(event).toEqual(2);
+                    done();
+                })
+            })
+        })
+    })
+})
diff --git a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
index f18fccd7e9..70950d9227 100644
--- a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
+++ b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
@@ -1,13 +1,14 @@
-import { Component, Injector, Input, OnInit } from '@angular/core';
-import { combineLatest as observableCombineLatest, Observable } from 'rxjs';
-import { map, startWith } from 'rxjs/operators';
+import { Component, Input, OnInit } from '@angular/core';
+import {BehaviorSubject, Observable} from 'rxjs';
 import { BitstreamDataService } from '../../../../core/data/bitstream-data.service';
 
 import { Bitstream } from '../../../../core/shared/bitstream.model';
 import { Item } from '../../../../core/shared/item.model';
-import { getFirstSucceededRemoteListPayload } from '../../../../core/shared/operators';
 import { followLink } from '../../../../shared/utils/follow-link-config.model';
 import { FileSectionComponent } from '../../../simple/field-components/file-section/file-section.component';
+import {PaginationComponentOptions} from '../../../../shared/pagination/pagination-component-options.model';
+import {PaginatedList} from '../../../../core/data/paginated-list';
+import {RemoteData} from '../../../../core/data/remote-data';
 
 /**
  * This component renders the file section of the item
@@ -25,7 +26,23 @@ export class FullFileSectionComponent extends FileSectionComponent implements On
 
   label: string;
 
-  bitstreams$: Observable<Bitstream[]>;
+  originals$: Observable<RemoteData<PaginatedList<Bitstream>>>;
+  licenses$: Observable<RemoteData<PaginatedList<Bitstream>>>;
+
+  pageSize = 5;
+  originalOptions = Object.assign(new PaginationComponentOptions(),{
+    id: 'original-bitstreams-options',
+    currentPage: 1,
+    pageSize: this.pageSize
+  });
+  originalCurrentPage$ = new BehaviorSubject<number>(1);
+
+  licenseOptions = Object.assign(new PaginationComponentOptions(),{
+    id: 'license-bitstreams-options',
+    currentPage: 1,
+    pageSize: this.pageSize
+  });
+  licenseCurrentPage$ = new BehaviorSubject<number>(1);
 
   constructor(
     bitstreamDataService: BitstreamDataService
@@ -34,40 +51,45 @@ export class FullFileSectionComponent extends FileSectionComponent implements On
   }
 
   ngOnInit(): void {
-    super.ngOnInit();
+    this.initialize();
   }
 
   initialize(): void {
-    // TODO pagination
-    const originals$ = this.bitstreamDataService.findAllByItemAndBundleName(
-      this.item,
-      'ORIGINAL',
-      { elementsPerPage: Number.MAX_SAFE_INTEGER },
-      followLink( 'format')
-    ).pipe(
-      getFirstSucceededRemoteListPayload(),
-      startWith([])
-    );
-    const licenses$ = this.bitstreamDataService.findAllByItemAndBundleName(
-      this.item,
-      'LICENSE',
-      { elementsPerPage: Number.MAX_SAFE_INTEGER },
-      followLink( 'format')
-    ).pipe(
-      getFirstSucceededRemoteListPayload(),
-      startWith([])
-    );
-    this.bitstreams$ = observableCombineLatest(originals$, licenses$).pipe(
-      map(([o, l]) => [...o, ...l]),
-      map((files: Bitstream[]) =>
-        files.map(
-          (original) => {
-            original.thumbnail = this.bitstreamDataService.getMatchingThumbnail(this.item, original);
-            return original;
-          }
-        )
-      )
-    );
+    this.originalCurrentPage$.subscribe((value) => {
+      this.originals$ = this.bitstreamDataService.findAllByItemAndBundleName(
+          this.item,
+          'ORIGINAL',
+          { elementsPerPage: this.pageSize, currentPage: value },
+          followLink( 'format')
+      );
+    });
+
+    this.licenseCurrentPage$.subscribe((value) => {
+      this.licenses$ = this.bitstreamDataService.findAllByItemAndBundleName(
+          this.item,
+          'LICENSE',
+          { elementsPerPage: this.pageSize, currentPage: value },
+          followLink( 'format')
+      );
+    });
+
   }
 
+  /**
+   * Update the current page for the original bundle bitstreams
+   * @param page
+   */
+  switchOriginalPage(page: number) {
+    this.originalOptions.currentPage = page;
+    this.originalCurrentPage$.next(page);
+  }
+
+  /**
+   * Update the current page for the license bundle bitstreams
+   * @param page
+   */
+  switchLicensePage(page: number) {
+    this.licenseOptions.currentPage = page;
+    this.licenseCurrentPage$.next(page);
+  }
 }
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.html b/src/app/+item-page/simple/field-components/file-section/file-section.component.html
index 17e4a795e7..ecd64ec5ec 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.html
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.html
@@ -6,6 +6,13 @@
         <span>({{(file?.sizeBytes) | dsFileSize }})</span>
         <span *ngIf="!last" innerHTML="{{separator}}"></span>
       </ds-file-download-link>
+      <ds-loading *ngIf="isLoading" message="{{'loading.default' | translate}}"></ds-loading>
+      <div *ngIf="!isLastPage" class="mt-1" id="view-more">
+        <a class="bitstream-view-more" [routerLink]="" (click)="getNextPage()">{{'item.page.bitstreams.view-more' | translate}}</a>
+      </div>
+      <div *ngIf="isLastPage && currentPage != 1" class="mt-1" id="view-less">
+        <a class="bitstream-view-less" [routerLink]="" (click)="currentPage = undefined; getNextPage();">{{'item.page.bitstreams.view-less' | translate}}</a>
+      </div>
     </div>
   </ds-metadata-field-wrapper>
 </ng-container>
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts b/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts
new file mode 100644
index 0000000000..4f907a0b04
--- /dev/null
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts
@@ -0,0 +1,169 @@
+import {FileSectionComponent} from './file-section.component';
+import {async, ComponentFixture, TestBed} from '@angular/core/testing';
+import {TranslateLoader, TranslateModule} from '@ngx-translate/core';
+import {TranslateLoaderMock} from '../../../../shared/mocks/translate-loader.mock';
+import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+import {VarDirective} from '../../../../shared/utils/var.directive';
+import {NO_ERRORS_SCHEMA} from '@angular/core';
+import {BitstreamDataService} from '../../../../core/data/bitstream-data.service';
+import {createSuccessfulRemoteDataObject$} from '../../../../shared/remote-data.utils';
+import {By} from '@angular/platform-browser';
+import {Bitstream} from '../../../../core/shared/bitstream.model';
+import {of as observableOf} from 'rxjs';
+import {MockBitstreamFormat1} from '../../../../shared/mocks/item.mock';
+import {FileSizePipe} from '../../../../shared/utils/file-size-pipe';
+import {PageInfo} from '../../../../core/shared/page-info.model';
+import {MetadataFieldWrapperComponent} from '../../../field-components/metadata-field-wrapper/metadata-field-wrapper.component';
+import {createPaginatedList} from '../../../../shared/testing/utils.test';
+
+describe('FileSectionComponent', () => {
+    let comp: FileSectionComponent;
+    let fixture: ComponentFixture<FileSectionComponent>;
+
+    const bitstreamDataService = jasmine.createSpyObj('bitstreamDataService', {
+        findAllByItemAndBundleName: createSuccessfulRemoteDataObject$(createPaginatedList([]))
+    });
+
+    const mockBitstream: Bitstream = Object.assign(new Bitstream(),
+        {
+            sizeBytes: 10201,
+            content: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713/content',
+            format: observableOf(MockBitstreamFormat1),
+            bundleName: 'ORIGINAL',
+            _links: {
+                self: {
+                    href: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713'
+                },
+                content: {
+                    href: 'https://dspace7.4science.it/dspace-spring-rest/api/core/bitstreams/cf9b0c8e-a1eb-4b65-afd0-567366448713/content'
+                }
+            },
+            id: 'cf9b0c8e-a1eb-4b65-afd0-567366448713',
+            uuid: 'cf9b0c8e-a1eb-4b65-afd0-567366448713',
+            type: 'bitstream',
+            metadata: {
+                'dc.title': [
+                    {
+                        language: null,
+                        value: 'test_word.docx'
+                    }
+                ]
+            }
+        });
+
+    beforeEach(async(() => {
+
+        TestBed.configureTestingModule({
+            imports: [TranslateModule.forRoot({
+                loader: {
+                    provide: TranslateLoader,
+                    useClass: TranslateLoaderMock
+                }
+            }), BrowserAnimationsModule],
+            declarations: [FileSectionComponent, VarDirective, FileSizePipe, MetadataFieldWrapperComponent],
+            providers: [
+                {provide: BitstreamDataService, useValue: bitstreamDataService}
+            ],
+
+            schemas: [NO_ERRORS_SCHEMA]
+        }).compileComponents();
+    }));
+
+    beforeEach(async(() => {
+        fixture = TestBed.createComponent(FileSectionComponent);
+        comp = fixture.componentInstance;
+        fixture.detectChanges();
+    }));
+
+    describe('when the bitstreams are loading', () => {
+        beforeEach(() => {
+            comp.bitstreams$.next([mockBitstream]);
+            comp.isLoading = true;
+            fixture.detectChanges();
+        });
+
+        it('should display a loading component', () => {
+            const loading = fixture.debugElement.query(By.css('ds-loading'));
+            expect(loading.nativeElement).toBeDefined();
+        });
+    });
+
+    describe('when the "Show more" button is clicked', () => {
+
+        beforeEach(() => {
+            comp.bitstreams$.next([mockBitstream]);
+            comp.currentPage = 1;
+            comp.isLastPage = false;
+            fixture.detectChanges();
+        });
+
+        it('should call the service to retrieve more bitstreams', () => {
+            const viewMore = fixture.debugElement.query(By.css('.bitstream-view-more'));
+            viewMore.triggerEventHandler('click', null);
+            expect(bitstreamDataService.findAllByItemAndBundleName).toHaveBeenCalled()
+        })
+
+        it('one bitstream should be on the page', () => {
+            const viewMore = fixture.debugElement.query(By.css('.bitstream-view-more'));
+            viewMore.triggerEventHandler('click', null);
+            const fileDownloadLink = fixture.debugElement.queryAll(By.css('ds-file-download-link'));
+            expect(fileDownloadLink.length).toEqual(1);
+        })
+
+        describe('when it is then clicked again', () => {
+            beforeEach(() => {
+                bitstreamDataService.findAllByItemAndBundleName.and.returnValue(createSuccessfulRemoteDataObject$(createPaginatedList([mockBitstream])));
+                const viewMore = fixture.debugElement.query(By.css('.bitstream-view-more'));
+                viewMore.triggerEventHandler('click', null);
+                fixture.detectChanges();
+
+            })
+            it('should contain another bitstream', () => {
+                const fileDownloadLink = fixture.debugElement.queryAll(By.css('ds-file-download-link'));
+                expect(fileDownloadLink.length).toEqual(2);
+            })
+        })
+    });
+
+    describe('when its the last page of bitstreams', () => {
+        beforeEach(() => {
+            comp.bitstreams$.next([mockBitstream]);
+            comp.isLastPage = true;
+            comp.currentPage = 2;
+            fixture.detectChanges();
+        });
+
+        it('should not contain a view more link', () => {
+            const viewMore = fixture.debugElement.query(By.css('.bitstream-view-more'));
+            expect(viewMore).toBeFalsy();
+        })
+
+        it('should contain a view less link', () => {
+            const viewLess = fixture.debugElement.query(By.css('.bitstream-view-less'));
+            expect(viewLess).toBeTruthy();
+        })
+
+        it('clicking on the view less link should reset the pages and call getNextPage()', () => {
+            const pageInfo = Object.assign(new PageInfo(), {
+                elementsPerPage: 3,
+                totalElements: 5,
+                totalPages: 2,
+                currentPage: 1,
+                _links: {
+                    self: {href: 'https://rest.api/core/bitstreams/'},
+                    next: {href: 'https://rest.api/core/bitstreams?page=2'}
+                }
+            });
+            const PaginatedList = Object.assign(createPaginatedList([mockBitstream]), {
+                pageInfo: pageInfo
+            });
+            bitstreamDataService.findAllByItemAndBundleName.and.returnValue(createSuccessfulRemoteDataObject$(PaginatedList));
+            const viewLess = fixture.debugElement.query(By.css('.bitstream-view-less'));
+            viewLess.triggerEventHandler('click', null);
+            expect(bitstreamDataService.findAllByItemAndBundleName).toHaveBeenCalled();
+            expect(comp.currentPage).toBe(1);
+            expect(comp.isLastPage).toBeFalse();
+        })
+
+    })
+})
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
index 2e09c1cd49..0d869608e1 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
@@ -1,10 +1,13 @@
 import { Component, Input, OnInit } from '@angular/core';
-import { Observable } from 'rxjs';
+import { BehaviorSubject } from 'rxjs';
 import { BitstreamDataService } from '../../../../core/data/bitstream-data.service';
 
 import { Bitstream } from '../../../../core/shared/bitstream.model';
 import { Item } from '../../../../core/shared/item.model';
-import { getFirstSucceededRemoteListPayload } from '../../../../core/shared/operators';
+import {filter, takeWhile} from 'rxjs/operators';
+import {RemoteData} from '../../../../core/data/remote-data';
+import {hasNoValue, hasValue} from '../../../../shared/empty.util';
+import {PaginatedList} from '../../../../core/data/paginated-list';
 
 /**
  * This component renders the file section of the item
@@ -22,7 +25,13 @@ export class FileSectionComponent implements OnInit {
 
   separator = '<br/>';
 
-  bitstreams$: Observable<Bitstream[]>;
+  bitstreams$: BehaviorSubject<Bitstream[]>;
+
+  currentPage: number;
+
+  isLoading: boolean;
+
+  isLastPage: boolean;
 
   constructor(
     protected bitstreamDataService: BitstreamDataService
@@ -30,13 +39,31 @@ export class FileSectionComponent implements OnInit {
   }
 
   ngOnInit(): void {
-    this.initialize();
+    this.getNextPage();
   }
 
-  initialize(): void {
-    this.bitstreams$ = this.bitstreamDataService.findAllByItemAndBundleName(this.item, 'ORIGINAL').pipe(
-      getFirstSucceededRemoteListPayload()
-    );
+  /**
+   * This method will retrieve the next page of Bitstreams from the external BitstreamDataService call.
+   * It'll retrieve the currentPage from the class variables and it'll add the next page of bitstreams with the
+   * already existing one.
+   * If the currentPage variable is undefined, we'll set it to 1 and retrieve the first page of Bitstreams
+   */
+  getNextPage(): void {
+    this.isLoading = true;
+    if (this.currentPage === undefined) {
+      this.currentPage = 1;
+      this.bitstreams$ = new BehaviorSubject([]);
+    } else {
+      this.currentPage++;
+    }
+    this.bitstreamDataService.findAllByItemAndBundleName(this.item, 'ORIGINAL', { currentPage: this.currentPage }).pipe(
+        filter((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => hasValue(bitstreamsRD)),
+        takeWhile((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => hasNoValue(bitstreamsRD.payload) && hasNoValue(bitstreamsRD.error), true)
+    ).subscribe((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => {
+      const current: Bitstream[] = this.bitstreams$.getValue();
+      this.bitstreams$.next([...current, ...bitstreamsRD.payload.page]);
+      this.isLoading = false;
+      this.isLastPage = hasNoValue(bitstreamsRD.payload.next);
+    });
   }
-
 }
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index e602e4cf5c..409a0d183a 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -1524,6 +1524,13 @@
 
   "item.page.uri": "URI",
 
+  "item.page.bitstreams.view-more": "Show more",
+
+  "item.page.bitstreams.view-less": "Show less",
+
+  "item.page.filesection.original.bundle" : "Original bundle",
+
+  "item.page.filesection.license.bundle" : "License bundle",
 
 
   "item.select.confirm": "Confirm selected",

From 0553f68607ecb693f9e1b95420e4a3dd0df98d2b Mon Sep 17 00:00:00 2001
From: Raf Ponsaerts <raf.ponsaerts@atmire.com>
Date: Tue, 11 Aug 2020 11:58:42 +0200
Subject: [PATCH 19/29] [Task 72397] adding debug consoles and pageSize

---
 .../file-section/full-file-section.component.ts             | 2 +-
 .../field-components/file-section/file-section.component.ts | 6 +++++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
index 70950d9227..e6206a3d5f 100644
--- a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
+++ b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
@@ -29,7 +29,7 @@ export class FullFileSectionComponent extends FileSectionComponent implements On
   originals$: Observable<RemoteData<PaginatedList<Bitstream>>>;
   licenses$: Observable<RemoteData<PaginatedList<Bitstream>>>;
 
-  pageSize = 5;
+  pageSize = 2;
   originalOptions = Object.assign(new PaginationComponentOptions(),{
     id: 'original-bitstreams-options',
     currentPage: 1,
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
index 0d869608e1..e4da4f2cca 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
@@ -56,7 +56,9 @@ export class FileSectionComponent implements OnInit {
     } else {
       this.currentPage++;
     }
-    this.bitstreamDataService.findAllByItemAndBundleName(this.item, 'ORIGINAL', { currentPage: this.currentPage }).pipe(
+    console.log(this.isLastPage);
+    console.log(this.currentPage);
+    this.bitstreamDataService.findAllByItemAndBundleName(this.item, 'ORIGINAL', { currentPage: this.currentPage, elementsPerPage: 1 }).pipe(
         filter((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => hasValue(bitstreamsRD)),
         takeWhile((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => hasNoValue(bitstreamsRD.payload) && hasNoValue(bitstreamsRD.error), true)
     ).subscribe((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => {
@@ -64,6 +66,8 @@ export class FileSectionComponent implements OnInit {
       this.bitstreams$.next([...current, ...bitstreamsRD.payload.page]);
       this.isLoading = false;
       this.isLastPage = hasNoValue(bitstreamsRD.payload.next);
+      console.log("lel");
+      console.log(this.isLastPage);
     });
   }
 }

From cb7335208f21780e4c439f277996e583832f61bc Mon Sep 17 00:00:00 2001
From: Raf Ponsaerts <raf.ponsaerts@atmire.com>
Date: Tue, 11 Aug 2020 13:13:02 +0200
Subject: [PATCH 20/29] [Task 72397] undo test consoles and fix pagination
 issue

---
 .../file-section/full-file-section.component.ts           | 2 +-
 .../file-section/file-section.component.ts                | 8 ++------
 2 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
index e6206a3d5f..70950d9227 100644
--- a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
+++ b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
@@ -29,7 +29,7 @@ export class FullFileSectionComponent extends FileSectionComponent implements On
   originals$: Observable<RemoteData<PaginatedList<Bitstream>>>;
   licenses$: Observable<RemoteData<PaginatedList<Bitstream>>>;
 
-  pageSize = 2;
+  pageSize = 5;
   originalOptions = Object.assign(new PaginationComponentOptions(),{
     id: 'original-bitstreams-options',
     currentPage: 1,
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
index e4da4f2cca..11c5ff2917 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
@@ -56,18 +56,14 @@ export class FileSectionComponent implements OnInit {
     } else {
       this.currentPage++;
     }
-    console.log(this.isLastPage);
-    console.log(this.currentPage);
-    this.bitstreamDataService.findAllByItemAndBundleName(this.item, 'ORIGINAL', { currentPage: this.currentPage, elementsPerPage: 1 }).pipe(
+    this.bitstreamDataService.findAllByItemAndBundleName(this.item, 'ORIGINAL', { currentPage: this.currentPage }).pipe(
         filter((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => hasValue(bitstreamsRD)),
         takeWhile((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => hasNoValue(bitstreamsRD.payload) && hasNoValue(bitstreamsRD.error), true)
     ).subscribe((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => {
       const current: Bitstream[] = this.bitstreams$.getValue();
       this.bitstreams$.next([...current, ...bitstreamsRD.payload.page]);
       this.isLoading = false;
-      this.isLastPage = hasNoValue(bitstreamsRD.payload.next);
-      console.log("lel");
-      console.log(this.isLastPage);
+      this.isLastPage = this.currentPage === bitstreamsRD.payload.totalPages;
     });
   }
 }

From 82d780b6c203a1e08261fb403ab13c8b82976b63 Mon Sep 17 00:00:00 2001
From: lotte <lotte_hofstede@hotmail.com>
Date: Wed, 12 Aug 2020 11:56:49 +0200
Subject: [PATCH 21/29] Fixed PageInfo SSR issue

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

diff --git a/src/app/core/cache/builders/remote-data-build.service.ts b/src/app/core/cache/builders/remote-data-build.service.ts
index ae3b0e4fd1..83cecca502 100644
--- a/src/app/core/cache/builders/remote-data-build.service.ts
+++ b/src/app/core/cache/builders/remote-data-build.service.ts
@@ -139,8 +139,8 @@ export class RemoteDataBuildService {
     const pageInfo$ = requestEntry$.pipe(
       filterSuccessfulResponses(),
       map((response: DSOSuccessResponse) => {
-        if (hasValue((response as DSOSuccessResponse).pageInfo)) {
-          return (response as DSOSuccessResponse).pageInfo;
+        if (hasValue(response.pageInfo)) {
+          return Object.assign(new PageInfo(), response.pageInfo);
         }
       })
     );

From 05a92f8e5b632b0c9d1da6bba1171c34ae05c005 Mon Sep 17 00:00:00 2001
From: Art Lowel <art@atmire.com>
Date: Wed, 12 Aug 2020 13:19:23 +0200
Subject: [PATCH 22/29] refactor webpack config

---
 angular.json               |   7 +--
 webpack.config.ts          |  45 ----------------
 webpack/webpack.browser.ts |   8 +++
 webpack/webpack.common.ts  |   9 +---
 webpack/webpack.prod.ts    | 108 +++----------------------------------
 webpack/webpack.test.ts    |   8 +++
 6 files changed, 27 insertions(+), 158 deletions(-)
 delete mode 100644 webpack.config.ts
 create mode 100644 webpack/webpack.browser.ts
 create mode 100644 webpack/webpack.test.ts

diff --git a/angular.json b/angular.json
index 9c55d648b3..d8d8a2dc2e 100644
--- a/angular.json
+++ b/angular.json
@@ -18,7 +18,7 @@
           "builder": "@angular-builders/custom-webpack:browser",
           "options": {
             "customWebpackConfig": {
-              "path": "./webpack/webpack.common.ts",
+              "path": "./webpack/webpack.browser.ts",
               "mergeStrategies": {
                 "loaders": "prepend"
               }
@@ -30,7 +30,8 @@
             "tsConfig": "tsconfig.app.json",
             "aot": false,
             "assets": [
-              "src/assets"
+              "src/assets",
+              "src/robots.txt"
             ],
             "styles": [
               "src/styles.scss"
@@ -84,7 +85,7 @@
           "builder": "@angular-builders/custom-webpack:karma",
           "options": {
             "customWebpackConfig": {
-              "path": "./webpack/webpack.common.ts",
+              "path": "./webpack/webpack.test.ts",
               "mergeStrategies": {
                 "loaders": "prepend"
               }
diff --git a/webpack.config.ts b/webpack.config.ts
deleted file mode 100644
index 03af2d9638..0000000000
--- a/webpack.config.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-const webpackMerge = require('webpack-merge');
-
-const prodPartial = require('./webpack/webpack.prod');
-
-module.exports = (env, options) => {
-  env = env || {};
-  const commonPartial = require('./webpack/webpack.common')(env);
-  const clientPartial = require('./webpack/webpack.client')(env);
-  const { getAotPlugin } = require('./webpack/webpack.aot')(env);
-  const { getServerWebpackPartial } = require('./webpack/webpack.server')(env);
-
-  if (env.aot) {
-    console.log(`Running build for ${env.client ? 'client' : 'server'} with AoT Compilation`);
-  }
-
-  const serverPartial = getServerWebpackPartial(env.aot);
-
-  let serverConfig = webpackMerge({}, commonPartial, serverPartial, {
-    plugins: [
-      getAotPlugin('server', !!env.aot)
-    ]
-  });
-
-  let clientConfig = webpackMerge({}, commonPartial, clientPartial, {
-    plugins: [
-      getAotPlugin('client', !!env.aot)
-    ]
-  });
-  if (options.mode === 'production') {
-    serverConfig = webpackMerge({}, serverConfig, prodPartial);
-    clientConfig = webpackMerge({}, clientConfig, prodPartial);
-  }
-
-  const configs = [];
-
-  if (!env.aot) {
-    configs.push(clientConfig, serverConfig);
-  } else if (env.client) {
-    configs.push(clientConfig);
-  } else if (env.server) {
-    configs.push(serverConfig);
-  }
-
-  return configs;
-};
diff --git a/webpack/webpack.browser.ts b/webpack/webpack.browser.ts
new file mode 100644
index 0000000000..bc281e9b43
--- /dev/null
+++ b/webpack/webpack.browser.ts
@@ -0,0 +1,8 @@
+import { commonExports } from './webpack.common';
+
+module.exports = Object.assign({}, commonExports, {
+  target: 'web',
+  node: {
+    module: 'empty'
+  }
+});
diff --git a/webpack/webpack.common.ts b/webpack/webpack.common.ts
index c8a450902b..3f49cf648a 100644
--- a/webpack/webpack.common.ts
+++ b/webpack/webpack.common.ts
@@ -21,11 +21,9 @@ export const copyWebpackOptions = [
   }, {
     from: path.join(__dirname, '..', 'src', 'assets', 'i18n'),
     to: path.join('assets', 'i18n')
-  }
-  ];
+];
 
 export const commonExports = {
-  target: 'web',
   plugins: [
     new CopyWebpackPlugin(copyWebpackOptions),
     new HtmlWebpackPlugin({
@@ -37,9 +35,6 @@ export const commonExports = {
       defaultAttribute: 'defer'
     })
   ],
-  node: {
-    module: 'empty'
-  },
   module: {
     rules: [
       {
@@ -99,5 +94,3 @@ export const commonExports = {
     ],
   }
 };
-
-module.exports = commonExports;
diff --git a/webpack/webpack.prod.ts b/webpack/webpack.prod.ts
index 903ae366f5..e9fba2e65e 100644
--- a/webpack/webpack.prod.ts
+++ b/webpack/webpack.prod.ts
@@ -1,48 +1,12 @@
+import { commonExports } from './webpack.common';
+import { buildRoot, projectRoot } from './helpers';
+
 const webpack = require('webpack');
-const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
-const CompressionPlugin = require('compression-webpack-plugin');
-const TerserPlugin = require('terser-webpack-plugin');
-const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
-const cssnano = require('cssnano');
 const nodeExternals = require('webpack-node-externals');
 
-import { buildRoot, globalCSSImports, projectRoot, theme, themedTest, themedUse, themePath } from './helpers';
-
-const CopyWebpackPlugin = require('copy-webpack-plugin');
-const path = require('path');
-const fs = require('fs');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const ScriptExtPlugin = require('script-ext-html-webpack-plugin');
-
-export const copyWebpackOptions = [
-  {
-    from: path.join(__dirname, '..', 'node_modules', '@fortawesome', 'fontawesome-free', 'webfonts'),
-    to: path.join('assets', 'fonts'),
-    force: undefined
-  },
-  {
-    from: path.join(__dirname, '..', 'src', 'assets', 'fonts'),
-    to: path.join('assets', 'fonts')
-  }, {
-    from: path.join(__dirname, '..', 'src', 'assets', 'images'),
-    to: path.join('assets', 'images')
-  }, {
-    from: path.join(__dirname, '..', 'src', 'assets', 'i18n'),
-    to: path.join('assets', 'i18n')
-  }
-];
-
-export const commonExports = {
+module.exports = Object.assign({}, commonExports, {
   plugins: [
-    new CopyWebpackPlugin(copyWebpackOptions),
-    new HtmlWebpackPlugin({
-      template: buildRoot('./index.html', ),
-      output: projectRoot('dist'),
-      inject: 'head'
-    }),
-    new ScriptExtPlugin({
-      defaultAttribute: 'defer'
-    }),
+    ...commonExports.plugins,
     new webpack.EnvironmentPlugin({
       'process.env': {
         NODE_ENV: JSON.stringify('production'),
@@ -50,64 +14,6 @@ export const commonExports = {
       }
     }),
   ],
-  module: {
-    rules: [
-      {
-        test: (filePath) => themedTest(filePath, 'scss'),
-        use: (info) => themedUse(info.resource, 'scss')
-      },
-      {
-        test: (filePath) => themedTest(filePath, 'html'),
-        use: (info) => themedUse(info.resource, 'html')
-      },
-      {
-        test: /\.ts$/,
-        loader: '@ngtools/webpack'
-      },
-      {
-        test: /\.scss$/,
-        exclude: [
-          /node_modules/,
-          buildRoot('styles/_exposed_variables.scss'),
-          buildRoot('styles/_variables.scss')
-        ],
-        use: [
-          {
-            loader: 'sass-loader',
-            options: {
-              sourceMap: true,
-              includePaths: [projectRoot('./'), path.join(themePath, 'styles')]
-            }
-          },
-          {
-            loader: 'sass-resources-loader',
-            options: {
-              resources: globalCSSImports()
-            },
-          }
-        ]
-      },
-      {
-        test: /(_exposed)?_variables.scss$/,
-        exclude: [/node_modules/],
-        use: [
-          {
-            loader: 'postcss-loader',
-            options: {
-              sourceMap: true
-            }
-          },
-          {
-            loader: 'sass-loader',
-            options: {
-              sourceMap: true,
-              includePaths: [projectRoot('./'), path.join(themePath, 'styles')]
-            }
-          }
-        ]
-      },
-    ],
-  },
   mode: 'production',
   recordsOutputPath: projectRoot('webpack.records.json'),
   entry: buildRoot('./main.server.ts'),
@@ -122,6 +28,4 @@ export const commonExports = {
       /sortablejs/,
       /ngx/]
   })],
-};
-
-module.exports = commonExports;
+});
diff --git a/webpack/webpack.test.ts b/webpack/webpack.test.ts
new file mode 100644
index 0000000000..bc281e9b43
--- /dev/null
+++ b/webpack/webpack.test.ts
@@ -0,0 +1,8 @@
+import { commonExports } from './webpack.common';
+
+module.exports = Object.assign({}, commonExports, {
+  target: 'web',
+  node: {
+    module: 'empty'
+  }
+});

From 8f822ba4f7a62ae073154e27f680e89543dd5bc8 Mon Sep 17 00:00:00 2001
From: Art Lowel <art@atmire.com>
Date: Wed, 12 Aug 2020 13:20:11 +0200
Subject: [PATCH 23/29] add robots.txt

---
 src/robots.txt            | 151 ++++++++++++++++++++++++++++++++++++++
 webpack/webpack.common.ts |   4 +
 2 files changed, 155 insertions(+)
 create mode 100644 src/robots.txt

diff --git a/src/robots.txt b/src/robots.txt
new file mode 100644
index 0000000000..04cbb888e0
--- /dev/null
+++ b/src/robots.txt
@@ -0,0 +1,151 @@
+# The URL to the DSpace sitemaps
+# XML sitemap is listed first as it is preferred by most search engines
+Sitemap: /sitemap_index.xml
+Sitemap: /sitemap_index.html
+
+##########################
+# Default Access Group
+# (NOTE: blank lines are not allowable in a group record)
+##########################
+User-agent: *
+# Disable access to Discovery search and filters; admin pages; processes; submission; workspace; workflow & profile page
+Disallow: /search
+Disallow: /admin/*
+Disallow: /processes
+Disallow: /submit
+Disallow: /workspaceitems
+Disallow: /profile
+Disallow: /workflowitems
+
+# Optionally uncomment the following line ONLY if sitemaps are working
+# and you have verified that your site is being indexed correctly.
+# Disallow: /browse/*
+#
+# If you have configured DSpace (Solr-based) Statistics to be publicly
+# accessible, then you may not want this content to be indexed
+# Disallow: /statistics
+#
+# You also may wish to disallow access to the following paths, in order
+# to stop web spiders from accessing user-based content
+# Disallow: /contact
+# Disallow: /feedback
+# Disallow: /forgot
+# Disallow: /login
+# Disallow: /register
+
+
+##############################
+# Section for misbehaving bots
+# The following directives to block specific robots were borrowed from Wikipedia's robots.txt
+##############################
+
+# advertising-related bots:
+User-agent: Mediapartners-Google*
+Disallow: /
+
+# Crawlers that are kind enough to obey, but which we'd rather not have
+# unless they're feeding search engines.
+User-agent: UbiCrawler
+Disallow: /
+
+User-agent: DOC
+Disallow: /
+
+User-agent: Zao
+Disallow: /
+
+# Some bots are known to be trouble, particularly those designed to copy
+# entire sites. Please obey robots.txt.
+User-agent: sitecheck.internetseer.com
+Disallow: /
+
+User-agent: Zealbot
+Disallow: /
+
+User-agent: MSIECrawler
+Disallow: /
+
+User-agent: SiteSnagger
+Disallow: /
+
+User-agent: WebStripper
+Disallow: /
+
+User-agent: WebCopier
+Disallow: /
+
+User-agent: Fetch
+Disallow: /
+
+User-agent: Offline Explorer
+Disallow: /
+
+User-agent: Teleport
+Disallow: /
+
+User-agent: TeleportPro
+Disallow: /
+
+User-agent: WebZIP
+Disallow: /
+
+User-agent: linko
+Disallow: /
+
+User-agent: HTTrack
+Disallow: /
+
+User-agent: Microsoft.URL.Control
+Disallow: /
+
+User-agent: Xenu
+Disallow: /
+
+User-agent: larbin
+Disallow: /
+
+User-agent: libwww
+Disallow: /
+
+User-agent: ZyBORG
+Disallow: /
+
+User-agent: Download Ninja
+Disallow: /
+
+# Misbehaving: requests much too fast:
+User-agent: fast
+Disallow: /
+
+#
+# If your DSpace is going down because of someone using recursive wget,
+# you can activate the following rule.
+#
+# If your own faculty is bringing down your dspace with recursive wget,
+# you can advise them to use the --wait option to set the delay between hits.
+#
+#User-agent: wget
+#Disallow: /
+
+#
+# The 'grub' distributed client has been *very* poorly behaved.
+#
+User-agent: grub-client
+Disallow: /
+
+#
+# Doesn't follow robots.txt anyway, but...
+#
+User-agent: k2spider
+Disallow: /
+
+#
+# Hits many times per second, not acceptable
+# http://www.nameprotect.com/botinfo.html
+User-agent: NPBot
+Disallow: /
+
+# A capture bot, downloads gazillions of pages with no public benefit
+# http://www.webreaper.net/
+User-agent: WebReaper
+Disallow: /
diff --git a/webpack/webpack.common.ts b/webpack/webpack.common.ts
index 3f49cf648a..36e1f2e96b 100644
--- a/webpack/webpack.common.ts
+++ b/webpack/webpack.common.ts
@@ -21,6 +21,10 @@ export const copyWebpackOptions = [
   }, {
     from: path.join(__dirname, '..', 'src', 'assets', 'i18n'),
     to: path.join('assets', 'i18n')
+  }, {
+    from: path.join(__dirname, '..', 'src', 'robots.txt'),
+    to: path.join('robots.txt')
+  }
 ];
 
 export const commonExports = {

From a2fa51cef5e5425698a3dc05817a1c77669aae34 Mon Sep 17 00:00:00 2001
From: Art Lowel <art@atmire.com>
Date: Wed, 12 Aug 2020 14:38:06 +0200
Subject: [PATCH 24/29] deprecate the use of /api in the rest nameSpace

---
 scripts/set-env.ts                            | 20 ++++++++++++++++++-
 .../core/shared/hal-endpoint.service.spec.ts  |  2 +-
 src/app/core/shared/hal-endpoint.service.ts   |  2 +-
 3 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/scripts/set-env.ts b/scripts/set-env.ts
index 5eee22a4be..5570b77218 100644
--- a/scripts/set-env.ts
+++ b/scripts/set-env.ts
@@ -54,6 +54,13 @@ import(environmentFilePath)
 function generateEnvironmentFile(file: GlobalConfig): void {
   file.production = production;
   buildBaseUrls(file);
+
+  // TODO remove workaround in beta 5
+  if (file.rest.nameSpace.match("(.*)/api/?$") !== null) {
+    const newValue = getNameSpace(file.rest.nameSpace);
+    console.log(colors.white.bgMagenta.bold(`The rest.nameSpace property in your environment file or in your DSPACE_REST_NAMESPACE environment variable ends with '/api'.\nThis is deprecated. As '/api' isn't configurable on the rest side, it shouldn't be repeated in every environment file.\nPlease change the rest nameSpace to '${newValue}'`));
+  }
+
   const contents = `export const environment = ` + JSON.stringify(file);
   writeFile(targetPath, contents, (err) => {
     if (err) {
@@ -112,5 +119,16 @@ function getPort(port: number): string {
 }
 
 function getNameSpace(nameSpace: string): string {
-  return nameSpace ? nameSpace.charAt(0) === '/' ? nameSpace : '/' + nameSpace : '';
+  // TODO remove workaround in beta 5
+  const apiMatches = nameSpace.match("(.*)/api/?$");
+  if (apiMatches != null) {
+    let newValue = '/'
+    if (hasValue(apiMatches[1])) {
+      newValue = apiMatches[1];
+    }
+    return newValue;
+  }
+  else {
+    return nameSpace ? nameSpace.charAt(0) === '/' ? nameSpace : '/' + nameSpace : '';
+  }
 }
diff --git a/src/app/core/shared/hal-endpoint.service.spec.ts b/src/app/core/shared/hal-endpoint.service.spec.ts
index 5f5c31f29d..31538e6be4 100644
--- a/src/app/core/shared/hal-endpoint.service.spec.ts
+++ b/src/app/core/shared/hal-endpoint.service.spec.ts
@@ -61,7 +61,7 @@ describe('HALEndpointService', () => {
   describe('getRootEndpointMap', () => {
     it('should configure a new EndpointMapRequest', () => {
       (service as any).getRootEndpointMap();
-      const expected = new EndpointMapRequest(requestService.generateRequestId(), environment.rest.baseUrl);
+      const expected = new EndpointMapRequest(requestService.generateRequestId(), environment.rest.baseUrl + '/api');
       expect(requestService.configure).toHaveBeenCalledWith(expected);
     });
 
diff --git a/src/app/core/shared/hal-endpoint.service.ts b/src/app/core/shared/hal-endpoint.service.ts
index d8b1d8931f..a74650ce5a 100644
--- a/src/app/core/shared/hal-endpoint.service.ts
+++ b/src/app/core/shared/hal-endpoint.service.ts
@@ -16,7 +16,7 @@ export class HALEndpointService {
   }
 
   protected getRootHref(): string {
-    return new RESTURLCombiner('/').toString();
+    return new RESTURLCombiner('/api').toString();
   }
 
   protected getRootEndpointMap(): Observable<EndpointMap> {

From 0a063683407faa4bfe75eab52553d5d38b498bb1 Mon Sep 17 00:00:00 2001
From: Art Lowel <art@atmire.com>
Date: Wed, 12 Aug 2020 17:31:33 +0200
Subject: [PATCH 25/29] add a proxy for the sitemaps

---
 package.json |  1 +
 server.ts    |  6 ++++++
 yarn.lock    | 35 +++++++++++++++++++++++++++++++++--
 3 files changed, 40 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index c1e5b05010..52afb7c4c0 100644
--- a/package.json
+++ b/package.json
@@ -146,6 +146,7 @@
     "dotenv": "^8.2.0",
     "fork-ts-checker-webpack-plugin": "^0.4.10",
     "html-webpack-plugin": "^3.2.0",
+    "http-proxy-middleware": "^1.0.5",
     "jasmine-core": "^3.3.0",
     "jasmine-marbles": "0.3.1",
     "jasmine-spec-reporter": "~4.2.1",
diff --git a/server.ts b/server.ts
index a5d47d8bd7..478dd063f6 100644
--- a/server.ts
+++ b/server.ts
@@ -33,6 +33,7 @@ import { enableProdMode, NgModuleFactory, Type } from '@angular/core';
 
 import { REQUEST, RESPONSE } from '@nguniversal/express-engine/tokens';
 import { environment } from './src/environments/environment';
+import { createProxyMiddleware } from 'http-proxy-middleware';
 
 /*
  * Set path for the browser application's dist folder
@@ -106,6 +107,11 @@ app.set('view engine', 'html');
  */
 app.set('views', DIST_FOLDER);
 
+/**
+ * Proxy the sitemaps
+ */
+app.use('/sitemap**', createProxyMiddleware({ target: `${environment.rest.baseUrl}/sitemaps`, changeOrigin: true }));
+
 /*
  * Adds a cache control header to the response
  * The cache control value can be configured in the environments file and defaults to max-age=60
diff --git a/yarn.lock b/yarn.lock
index 3a36e692d7..0b02259f38 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1162,6 +1162,13 @@
     "@types/minimatch" "*"
     "@types/node" "*"
 
+"@types/http-proxy@^1.17.4":
+  version "1.17.4"
+  resolved "https://registry.yarnpkg.com/@types/http-proxy/-/http-proxy-1.17.4.tgz#e7c92e3dbe3e13aa799440ff42e6d3a17a9d045b"
+  integrity sha512-IrSHl2u6AWXduUaDLqYpt45tLVCtYv7o4Z0s1KghBCDgIIS9oW5K1H8mZG/A2CfeLdEa7rTd1ACOiHBc1EMT2Q==
+  dependencies:
+    "@types/node" "*"
+
 "@types/jasmine@*", "@types/jasmine@^3.3.9":
   version "3.5.7"
   resolved "https://registry.yarnpkg.com/@types/jasmine/-/jasmine-3.5.7.tgz#c4237935a4b0db31ada6b0de10e2b0658e7b2643"
@@ -2090,7 +2097,7 @@ braces@^2.3.1, braces@^2.3.2:
     split-string "^3.0.2"
     to-regex "^3.0.1"
 
-braces@^3.0.2, braces@~3.0.2:
+braces@^3.0.1, braces@^3.0.2, braces@~3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107"
   integrity sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==
@@ -5131,6 +5138,17 @@ http-proxy-middleware@0.19.1:
     lodash "^4.17.11"
     micromatch "^3.1.10"
 
+http-proxy-middleware@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/http-proxy-middleware/-/http-proxy-middleware-1.0.5.tgz#4c6e25d95a411e3d750bc79ccf66290675176dc2"
+  integrity sha512-CKzML7u4RdGob8wuKI//H8Ein6wNTEQR7yjVEzPbhBLGdOfkfvgTnp2HLnniKBDP9QW4eG10/724iTWLBeER3g==
+  dependencies:
+    "@types/http-proxy" "^1.17.4"
+    http-proxy "^1.18.1"
+    is-glob "^4.0.1"
+    lodash "^4.17.19"
+    micromatch "^4.0.2"
+
 http-proxy@^1.17.0:
   version "1.18.0"
   resolved "https://registry.yarnpkg.com/http-proxy/-/http-proxy-1.18.0.tgz#dbe55f63e75a347db7f3d99974f2692a314a6a3a"
@@ -6324,6 +6342,11 @@ lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.15.tgz#b447f6670a0455bbfeedd11392eff330ea097548"
   integrity sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==
 
+lodash@^4.17.19:
+  version "4.17.19"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.19.tgz#e48ddedbe30b3321783c5b4301fbd353bc1e4a4b"
+  integrity sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ==
+
 log-driver@^1.2.7:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/log-driver/-/log-driver-1.2.7.tgz#63b95021f0702fedfa2c9bb0a24e7797d71871d8"
@@ -6580,6 +6603,14 @@ micromatch@^3.0.4, micromatch@^3.1.10, micromatch@^3.1.4:
     snapdragon "^0.8.1"
     to-regex "^3.0.2"
 
+micromatch@^4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.2.tgz#4fcb0999bf9fbc2fcbdd212f6d629b9a56c39259"
+  integrity sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==
+  dependencies:
+    braces "^3.0.1"
+    picomatch "^2.0.5"
+
 miller-rabin@^4.0.0:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/miller-rabin/-/miller-rabin-4.0.1.tgz#f080351c865b0dc562a8462966daa53543c78a4d"
@@ -7615,7 +7646,7 @@ picomatch@^2.0.4, picomatch@^2.0.7:
   resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.1.tgz#21bac888b6ed8601f831ce7816e335bc779f0a4a"
   integrity sha512-ISBaA8xQNmwELC7eOjqFKMESB2VIqt4PPDD0nsS95b/9dZXvVKOlz9keMSnoGGKcOHXfTvDD6WMaRoSc9UuhRA==
 
-picomatch@^2.2.1:
+picomatch@^2.0.5, picomatch@^2.2.1:
   version "2.2.2"
   resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad"
   integrity sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==

From 18fb47c9b69e360abc76a204ed9102f566c68194 Mon Sep 17 00:00:00 2001
From: Raf Ponsaerts <raf.ponsaerts@atmire.com>
Date: Mon, 17 Aug 2020 10:14:05 +0200
Subject: [PATCH 26/29] [Task 72397] applied feedback on the file section and
 full file section components

---
 .../full-file-section.component.ts            | 41 ++++++++++---------
 .../file-section/file-section.component.html  |  6 +--
 .../file-section.component.spec.ts            |  4 +-
 .../file-section/file-section.component.ts    | 12 +++---
 4 files changed, 33 insertions(+), 30 deletions(-)

diff --git a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
index 70950d9227..f8af73f55b 100644
--- a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
+++ b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
@@ -1,14 +1,15 @@
 import { Component, Input, OnInit } from '@angular/core';
-import {BehaviorSubject, Observable} from 'rxjs';
+import { BehaviorSubject, Observable } from 'rxjs';
 import { BitstreamDataService } from '../../../../core/data/bitstream-data.service';
 
 import { Bitstream } from '../../../../core/shared/bitstream.model';
 import { Item } from '../../../../core/shared/item.model';
 import { followLink } from '../../../../shared/utils/follow-link-config.model';
 import { FileSectionComponent } from '../../../simple/field-components/file-section/file-section.component';
-import {PaginationComponentOptions} from '../../../../shared/pagination/pagination-component-options.model';
-import {PaginatedList} from '../../../../core/data/paginated-list';
-import {RemoteData} from '../../../../core/data/remote-data';
+import { PaginationComponentOptions } from '../../../../shared/pagination/pagination-component-options.model';
+import { PaginatedList } from '../../../../core/data/paginated-list';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { switchMap } from "rxjs/operators";
 
 /**
  * This component renders the file section of the item
@@ -55,23 +56,23 @@ export class FullFileSectionComponent extends FileSectionComponent implements On
   }
 
   initialize(): void {
-    this.originalCurrentPage$.subscribe((value) => {
-      this.originals$ = this.bitstreamDataService.findAllByItemAndBundleName(
-          this.item,
-          'ORIGINAL',
-          { elementsPerPage: this.pageSize, currentPage: value },
-          followLink( 'format')
-      );
-    });
+    this.originals$ = this.originalCurrentPage$.pipe(
+        switchMap((pageNumber: number) => this.bitstreamDataService.findAllByItemAndBundleName(
+            this.item,
+            'ORIGINAL',
+            { elementsPerPage: this.pageSize, currentPage: pageNumber },
+            followLink( 'format')
+        ))
+    );
 
-    this.licenseCurrentPage$.subscribe((value) => {
-      this.licenses$ = this.bitstreamDataService.findAllByItemAndBundleName(
-          this.item,
-          'LICENSE',
-          { elementsPerPage: this.pageSize, currentPage: value },
-          followLink( 'format')
-      );
-    });
+    this.licenses$ = this.licenseCurrentPage$.pipe(
+        switchMap((pageNumber: number) => this.bitstreamDataService.findAllByItemAndBundleName(
+            this.item,
+            'LICENSE',
+            { elementsPerPage: this.pageSize, currentPage: pageNumber },
+            followLink( 'format')
+        ))
+    );
 
   }
 
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.html b/src/app/+item-page/simple/field-components/file-section/file-section.component.html
index ecd64ec5ec..4a53f1d829 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.html
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.html
@@ -6,12 +6,12 @@
         <span>({{(file?.sizeBytes) | dsFileSize }})</span>
         <span *ngIf="!last" innerHTML="{{separator}}"></span>
       </ds-file-download-link>
-      <ds-loading *ngIf="isLoading" message="{{'loading.default' | translate}}"></ds-loading>
+      <ds-loading *ngIf="isLoading" message="{{'loading.default' | translate}}" [showMessage]="false"></ds-loading>
       <div *ngIf="!isLastPage" class="mt-1" id="view-more">
-        <a class="bitstream-view-more" [routerLink]="" (click)="getNextPage()">{{'item.page.bitstreams.view-more' | translate}}</a>
+        <a class="bitstream-view-more btn btn-outline-secondary btn-sm" [routerLink]="" (click)="getNextPage()">{{'item.page.bitstreams.view-more' | translate}}</a>
       </div>
       <div *ngIf="isLastPage && currentPage != 1" class="mt-1" id="view-less">
-        <a class="bitstream-view-less" [routerLink]="" (click)="currentPage = undefined; getNextPage();">{{'item.page.bitstreams.view-less' | translate}}</a>
+        <a class="bitstream-view-less btn btn-outline-secondary btn-sm" [routerLink]="" (click)="currentPage = undefined; getNextPage();">{{'item.page.bitstreams.view-less' | translate}}</a>
       </div>
     </div>
   </ds-metadata-field-wrapper>
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts b/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts
index 4f907a0b04..aac0fa108e 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts
@@ -135,12 +135,12 @@ describe('FileSectionComponent', () => {
 
         it('should not contain a view more link', () => {
             const viewMore = fixture.debugElement.query(By.css('.bitstream-view-more'));
-            expect(viewMore).toBeFalsy();
+            expect(viewMore).toBeNull();
         })
 
         it('should contain a view less link', () => {
             const viewLess = fixture.debugElement.query(By.css('.bitstream-view-less'));
-            expect(viewLess).toBeTruthy();
+            expect(viewLess).toBeDefined();
         })
 
         it('clicking on the view less link should reset the pages and call getNextPage()', () => {
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
index 11c5ff2917..6832556ff6 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
@@ -4,10 +4,10 @@ import { BitstreamDataService } from '../../../../core/data/bitstream-data.servi
 
 import { Bitstream } from '../../../../core/shared/bitstream.model';
 import { Item } from '../../../../core/shared/item.model';
-import {filter, takeWhile} from 'rxjs/operators';
-import {RemoteData} from '../../../../core/data/remote-data';
-import {hasNoValue, hasValue} from '../../../../shared/empty.util';
-import {PaginatedList} from '../../../../core/data/paginated-list';
+import { filter, takeWhile } from 'rxjs/operators';
+import { RemoteData } from '../../../../core/data/remote-data';
+import { hasNoValue, hasValue } from '../../../../shared/empty.util';
+import { PaginatedList } from '../../../../core/data/paginated-list';
 
 /**
  * This component renders the file section of the item
@@ -33,6 +33,8 @@ export class FileSectionComponent implements OnInit {
 
   isLastPage: boolean;
 
+  pageSize: number = 5;
+
   constructor(
     protected bitstreamDataService: BitstreamDataService
   ) {
@@ -56,7 +58,7 @@ export class FileSectionComponent implements OnInit {
     } else {
       this.currentPage++;
     }
-    this.bitstreamDataService.findAllByItemAndBundleName(this.item, 'ORIGINAL', { currentPage: this.currentPage }).pipe(
+    this.bitstreamDataService.findAllByItemAndBundleName(this.item, 'ORIGINAL', { currentPage: this.currentPage, elementsPerPage: this.pageSize }).pipe(
         filter((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => hasValue(bitstreamsRD)),
         takeWhile((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => hasNoValue(bitstreamsRD.payload) && hasNoValue(bitstreamsRD.error), true)
     ).subscribe((bitstreamsRD: RemoteData<PaginatedList<Bitstream>>) => {

From a38d365bab142d645be0f07559c26561018113c3 Mon Sep 17 00:00:00 2001
From: Raf Ponsaerts <raf.ponsaerts@atmire.com>
Date: Mon, 17 Aug 2020 15:18:25 +0200
Subject: [PATCH 27/29] Updated message for the collapse bitstreams for the
 bitstream pagination on simple item pages

---
 .../field-components/file-section/file-section.component.html | 4 ++--
 .../file-section/file-section.component.spec.ts               | 4 ++--
 src/assets/i18n/en.json5                                      | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.html b/src/app/+item-page/simple/field-components/file-section/file-section.component.html
index 4a53f1d829..1fdee6dc4d 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.html
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.html
@@ -10,8 +10,8 @@
       <div *ngIf="!isLastPage" class="mt-1" id="view-more">
         <a class="bitstream-view-more btn btn-outline-secondary btn-sm" [routerLink]="" (click)="getNextPage()">{{'item.page.bitstreams.view-more' | translate}}</a>
       </div>
-      <div *ngIf="isLastPage && currentPage != 1" class="mt-1" id="view-less">
-        <a class="bitstream-view-less btn btn-outline-secondary btn-sm" [routerLink]="" (click)="currentPage = undefined; getNextPage();">{{'item.page.bitstreams.view-less' | translate}}</a>
+      <div *ngIf="isLastPage && currentPage != 1" class="mt-1" id="collapse">
+        <a class="bitstream-collapse btn btn-outline-secondary btn-sm" [routerLink]="" (click)="currentPage = undefined; getNextPage();">{{'item.page.bitstreams.collapse' | translate}}</a>
       </div>
     </div>
   </ds-metadata-field-wrapper>
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts b/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts
index aac0fa108e..1b7fa75ce5 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.spec.ts
@@ -139,7 +139,7 @@ describe('FileSectionComponent', () => {
         })
 
         it('should contain a view less link', () => {
-            const viewLess = fixture.debugElement.query(By.css('.bitstream-view-less'));
+            const viewLess = fixture.debugElement.query(By.css('.bitstream-collapse'));
             expect(viewLess).toBeDefined();
         })
 
@@ -158,7 +158,7 @@ describe('FileSectionComponent', () => {
                 pageInfo: pageInfo
             });
             bitstreamDataService.findAllByItemAndBundleName.and.returnValue(createSuccessfulRemoteDataObject$(PaginatedList));
-            const viewLess = fixture.debugElement.query(By.css('.bitstream-view-less'));
+            const viewLess = fixture.debugElement.query(By.css('.bitstream-collapse'));
             viewLess.triggerEventHandler('click', null);
             expect(bitstreamDataService.findAllByItemAndBundleName).toHaveBeenCalled();
             expect(comp.currentPage).toBe(1);
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index 409a0d183a..f8221bf657 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -1526,7 +1526,7 @@
 
   "item.page.bitstreams.view-more": "Show more",
 
-  "item.page.bitstreams.view-less": "Show less",
+  "item.page.bitstreams.collapse": "Collapse",
 
   "item.page.filesection.original.bundle" : "Original bundle",
 

From 1247088df963c58d7f32941d68cbf886fefc7484 Mon Sep 17 00:00:00 2001
From: Raf Ponsaerts <raf.ponsaerts@atmire.com>
Date: Mon, 17 Aug 2020 16:29:57 +0200
Subject: [PATCH 28/29] Fixed tslint issues

---
 .../file-section/full-file-section.component.ts                 | 2 +-
 .../field-components/file-section/file-section.component.ts     | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
index f8af73f55b..fdbe662ed9 100644
--- a/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
+++ b/src/app/+item-page/full/field-components/file-section/full-file-section.component.ts
@@ -9,7 +9,7 @@ import { FileSectionComponent } from '../../../simple/field-components/file-sect
 import { PaginationComponentOptions } from '../../../../shared/pagination/pagination-component-options.model';
 import { PaginatedList } from '../../../../core/data/paginated-list';
 import { RemoteData } from '../../../../core/data/remote-data';
-import { switchMap } from "rxjs/operators";
+import { switchMap } from 'rxjs/operators';
 
 /**
  * This component renders the file section of the item
diff --git a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
index 6832556ff6..25b214e200 100644
--- a/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
+++ b/src/app/+item-page/simple/field-components/file-section/file-section.component.ts
@@ -33,7 +33,7 @@ export class FileSectionComponent implements OnInit {
 
   isLastPage: boolean;
 
-  pageSize: number = 5;
+  pageSize = 5;
 
   constructor(
     protected bitstreamDataService: BitstreamDataService

From 0fc757ba4dc8331838031ed41d51310de9ff83e9 Mon Sep 17 00:00:00 2001
From: Tim Donohue <tim.donohue@lyrasis.org>
Date: Thu, 20 Aug 2020 10:09:05 -0500
Subject: [PATCH 29/29] Add link to Code Testing Guide in PR template

---
 .github/pull_request_template.md | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
index 3e727e2bdf..b4063b0550 100644
--- a/.github/pull_request_template.md
+++ b/.github/pull_request_template.md
@@ -21,8 +21,5 @@ _This checklist provides a reminder of what we are going to look for when review
 - [ ] My PR is small in size (e.g. less than 1,000 lines of code, not including comments & specs/tests), or I have provided reasons as to why that's not possible.
 - [ ] My PR passes [TSLint](https://palantir.github.io/tslint/) validation using `yarn run lint`
 - [ ] My PR includes [TypeDoc](https://typedoc.org/) comments for _all new (or modified) public methods and classes_. It also includes TypeDoc for large or complex private methods.
-- [ ] My PR passes all specs/tests and includes new/updated specs for any bug fixes, improvements or new features. A few reminders about what constitutes good tests:
-    * Include tests for different user types (if behavior differs), including: (1) Anonymous user, (2) Logged in user (non-admin), and (3) Administrator.
-    * Include tests for error scenarios, e.g. when errors/warnings should appear (or buttons should be disabled).
-    * For bug fixes, include a test that reproduces the bug and proves it is fixed. For clarity, it may be useful to provide the test in a separate commit from the bug fix.
+- [ ] My PR passes all specs/tests and includes new/updated specs or tests based on the [Code Testing Guide](https://wiki.lyrasis.org/display/DSPACE/Code+Testing+Guide).
 - [ ] If my PR includes new, third-party dependencies (in `package.json`), I've made sure their licenses align with the [DSpace BSD License](https://github.com/DSpace/DSpace/blob/main/LICENSE) based on the [Licensing of Contributions](https://wiki.lyrasis.org/display/DSPACE/Code+Contribution+Guidelines#CodeContributionGuidelines-LicensingofContributions) documentation.