Merge remote-tracking branch 'remotes/origin/master' into upgrade-angular-7

# Conflicts:
#	src/app/+collection-page/collection-form/collection-form.component.ts
#	src/app/+community-page/community-form/community-form.component.ts
#	src/app/shared/comcol-forms/comcol-form/comcol-form.component.ts

src/app/shared/comcol-forms/comcol-form/comcol-form.component.html

@@ -1,3 +1,38 @@
+<div class="container-fluid">
+  <div class="row">
+    <div class="col-12 d-inline-block">
+      <label>{{type.value + '.edit.logo.label' | translate}}</label>
+    </div>
+    <ng-container *ngVar="(dso?.logo | async)?.payload as logo">
+      <div class="col-12 d-inline-block alert" [ngClass]="{'alert-danger': markLogoForDeletion}" id="logo-section">
+        <div class="row">
+          <div class="col-8 d-inline-block">
+            <ds-comcol-page-logo [logo]="logo"></ds-comcol-page-logo>
+          </div>
+          <div class="col-4 d-inline-block">
+            <div *ngIf="logo" class="btn-group btn-group-sm float-right" role="group">
+              <button *ngIf="!markLogoForDeletion" type="button" class="btn btn-danger" (click)="deleteLogo()">
+                <i class="fas fa-trash" aria-hidden="true"></i>
+              </button>
+              <button *ngIf="markLogoForDeletion" type="button" class="btn btn-warning" (click)="undoDeleteLogo()">
+                <i class="fas fa-undo" aria-hidden="true"></i>
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div *ngIf="!logo" class="col-12 d-inline-block">
+        <ds-uploader  *ngIf="initializedUploaderOptions | async"
+                      [dropMsg]="type.value + '.edit.logo.upload'"
+                      [dropOverDocumentMsg]="type.value + '.edit.logo.upload'"
+                      [enableDragOverDocument]="true"
+                      [uploadFilesOptions]="uploadFilesOptions"
+                      (onCompleteItem)="onCompleteItem()"
+                      (onUploadError)="onUploadError()"></ds-uploader>
+      </div>
+    </ng-container>
+  </div>
+</div>
 <ds-form *ngIf="formModel"
          [formId]="'comcol-form-id'"
          [formModel]="formModel" (submitForm)="onSubmit()" (cancel)="onCancel()"></ds-form>

src/app/shared/comcol-forms/comcol-form/comcol-form.component.spec.ts

@@ -9,6 +9,19 @@ import { Community } from '../../../core/shared/community.model';
 import { ComColFormComponent } from './comcol-form.component';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
 import { hasValue } from '../../empty.util';
+import { VarDirective } from '../../utils/var.directive';
+import { NotificationsService } from '../../notifications/notifications.service';
+import { NotificationsServiceStub } from '../../testing/notifications-service-stub';
+import { AuthService } from '../../../core/auth/auth.service';
+import { AuthServiceMock } from '../../mocks/mock-auth.service';
+import { of as observableOf } from 'rxjs';
+import { RemoteData } from '../../../core/data/remote-data';
+import { RestRequestMethod } from '../../../core/data/rest-request-method';
+import { ErrorResponse, RestResponse } from '../../../core/cache/response.models';
+import { RequestError } from '../../../core/data/request.models';
+import { RequestService } from '../../../core/data/request.service';
+import { ObjectCacheService } from '../../../core/cache/object-cache.service';
+import { By } from '@angular/platform-browser';
 
 describe('ComColFormComponent', () => {
   let comp: ComColFormComponent<DSpaceObject>;
@@ -47,71 +60,264 @@ describe('ComColFormComponent', () => {
     })
   ];
 
+  const logoEndpoint = 'rest/api/logo/endpoint';
+  const dsoService = Object.assign({
+    getLogoEndpoint: () => observableOf(logoEndpoint),
+    deleteLogo: () => observableOf({})
+  });
+  const notificationsService = new NotificationsServiceStub();
+
   /* tslint:disable:no-empty */
   const locationStub = jasmine.createSpyObj('location', ['back']);
   /* tslint:enable:no-empty */
 
+  const requestServiceStub = jasmine.createSpyObj({
+    removeByHrefSubstring: {}
+  });
+  const objectCacheStub = jasmine.createSpyObj({
+    remove: {}
+  });
+
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       imports: [TranslateModule.forRoot(), RouterTestingModule],
-      declarations: [ComColFormComponent],
+      declarations: [ComColFormComponent, VarDirective],
       providers: [
         { provide: Location, useValue: locationStub },
-        { provide: DynamicFormService, useValue: formServiceStub }
+        { provide: DynamicFormService, useValue: formServiceStub },
+        { provide: NotificationsService, useValue: notificationsService },
+        { provide: AuthService, useValue: new AuthServiceMock() },
+        { provide: RequestService, useValue: requestServiceStub },
+        { provide: ObjectCacheService, useValue: objectCacheStub }
       ],
       schemas: [NO_ERRORS_SCHEMA]
     }).compileComponents();
   }));
 
-  beforeEach(() => {
-    fixture = TestBed.createComponent(ComColFormComponent);
-    comp = fixture.componentInstance;
-    comp.formModel = [];
-    comp.dso = new Community();
-    fixture.detectChanges();
-    location = (comp as any).location;
-  });
-
-  describe('onSubmit', () => {
+  describe('when the dso doesn\'t contain an ID (newly created)', () => {
     beforeEach(() => {
-      spyOn(comp.submitForm, 'emit');
-      comp.formModel = formModel;
+      initComponent(new Community());
     });
 
-    it('should emit the new version of the community', () => {
-      comp.dso = Object.assign(
-        new Community(),
-        {
-          metadata: {
-            ...titleMD,
-            ...randomMD
-          }
-        }
-      );
+    it('should initialize the uploadFilesOptions with a placeholder url', () => {
+      expect(comp.uploadFilesOptions.url.length).toBeGreaterThan(0);
+    });
 
-      comp.onSubmit();
+    describe('onSubmit', () => {
+      beforeEach(() => {
+        spyOn(comp.submitForm, 'emit');
+        comp.formModel = formModel;
+      });
 
-      expect(comp.submitForm.emit).toHaveBeenCalledWith(
-        Object.assign(
-          {},
+      it('should emit the new version of the community', () => {
+        comp.dso = Object.assign(
           new Community(),
           {
             metadata: {
-              ...newTitleMD,
-              ...randomMD,
-              ...abstractMD
-            },
-            type: Community.type
-          },
-        )
-      );
-    })
-  });
+              ...titleMD,
+              ...randomMD
+            }
+          }
+        );
 
-  describe('onCancel', () => {
-    it('should call the back method on the Location service', () => {
+        comp.onSubmit();
+
+        expect(comp.submitForm.emit).toHaveBeenCalledWith(
+          {
+            dso: Object.assign(
+              {},
+              new Community(),
+              {
+                metadata: {
+                  ...newTitleMD,
+                  ...randomMD,
+                  ...abstractMD
+                },
+                type: Community.type
+              },
+            ),
+            uploader: {},
+            deleteLogo: false
+          }
+        );
+      })
+    });
+
+    describe('onCancel', () => {
+      it('should call the back method on the Location service', () => {
         comp.onCancel();
         expect(locationStub.back).toHaveBeenCalled();
+      });
+    });
+
+    describe('onCompleteItem', () => {
+      beforeEach(() => {
+        spyOn(comp.finish, 'emit');
+        comp.onCompleteItem();
+      });
+
+      it('should show a success notification', () => {
+        expect(notificationsService.success).toHaveBeenCalled();
+      });
+
+      it('should emit finish', () => {
+        expect(comp.finish.emit).toHaveBeenCalled();
+      });
+
+      it('should remove the object\'s cache', () => {
+        expect(requestServiceStub.removeByHrefSubstring).toHaveBeenCalled();
+        expect(objectCacheStub.remove).toHaveBeenCalled();
+      });
+    });
+
+    describe('onUploadError', () => {
+      beforeEach(() => {
+        spyOn(comp.finish, 'emit');
+        comp.onUploadError();
+      });
+
+      it('should show an error notification', () => {
+        expect(notificationsService.error).toHaveBeenCalled();
+      });
+
+      it('should emit finish', () => {
+        expect(comp.finish.emit).toHaveBeenCalled();
+      });
     });
   });
+
+  describe('when the dso contains an ID (being edited)', () => {
+    describe('and the dso doesn\'t contain a logo', () => {
+      beforeEach(() => {
+        initComponent(Object.assign(new Community(), {
+          id: 'community-id',
+          logo: observableOf(new RemoteData(false, false, true, null, undefined))
+        }));
+      });
+
+      it('should initialize the uploadFilesOptions with the logo\'s endpoint url', () => {
+        expect(comp.uploadFilesOptions.url).toEqual(logoEndpoint);
+      });
+
+      it('should initialize the uploadFilesOptions with a POST method', () => {
+        expect(comp.uploadFilesOptions.method).toEqual(RestRequestMethod.POST);
+      });
+    });
+
+    describe('and the dso contains a logo', () => {
+      beforeEach(() => {
+        initComponent(Object.assign(new Community(), {
+          id: 'community-id',
+          logo: observableOf(new RemoteData(false, false, true, null, {}))
+        }));
+      });
+
+      it('should initialize the uploadFilesOptions with the logo\'s endpoint url', () => {
+        expect(comp.uploadFilesOptions.url).toEqual(logoEndpoint);
+      });
+
+      it('should initialize the uploadFilesOptions with a PUT method', () => {
+        expect(comp.uploadFilesOptions.method).toEqual(RestRequestMethod.PUT);
+      });
+
+      describe('submit with logo marked for deletion', () => {
+        beforeEach(() => {
+          comp.markLogoForDeletion = true;
+        });
+
+        describe('when dsoService.deleteLogo returns a successful response', () => {
+          const response = new RestResponse(true, 200, 'OK');
+
+          beforeEach(() => {
+            spyOn(dsoService, 'deleteLogo').and.returnValue(observableOf(response));
+            comp.onSubmit();
+          });
+
+          it('should display a success notification', () => {
+            expect(notificationsService.success).toHaveBeenCalled();
+          });
+        });
+
+        describe('when dsoService.deleteLogo returns an error response', () => {
+          const response = new ErrorResponse(new RequestError('errorMessage'));
+
+          beforeEach(() => {
+            spyOn(dsoService, 'deleteLogo').and.returnValue(observableOf(response));
+            comp.onSubmit();
+          });
+
+          it('should display an error notification', () => {
+            expect(notificationsService.error).toHaveBeenCalled();
+          });
+        });
+      });
+
+      describe('deleteLogo', () => {
+        beforeEach(() => {
+          comp.deleteLogo();
+          fixture.detectChanges();
+        });
+
+        it('should set markLogoForDeletion to true', () => {
+          expect(comp.markLogoForDeletion).toEqual(true);
+        });
+
+        it('should mark the logo section with a danger alert', () => {
+          const logoSection = fixture.debugElement.query(By.css('#logo-section.alert-danger'));
+          expect(logoSection).toBeTruthy();
+        });
+
+        it('should hide the delete button', () => {
+          const button = fixture.debugElement.query(By.css('#logo-section .btn-danger'));
+          expect(button).not.toBeTruthy();
+        });
+
+        it('should show the undo button', () => {
+          const button = fixture.debugElement.query(By.css('#logo-section .btn-warning'));
+          expect(button).toBeTruthy();
+        });
+      });
+
+      describe('undoDeleteLogo', () => {
+        beforeEach(() => {
+          comp.markLogoForDeletion = true;
+          comp.undoDeleteLogo();
+          fixture.detectChanges();
+        });
+
+        it('should set markLogoForDeletion to false', () => {
+          expect(comp.markLogoForDeletion).toEqual(false);
+        });
+
+        it('should disable the danger alert on the logo section', () => {
+          const logoSection = fixture.debugElement.query(By.css('#logo-section.alert-danger'));
+          expect(logoSection).not.toBeTruthy();
+        });
+
+        it('should show the delete button', () => {
+          const button = fixture.debugElement.query(By.css('#logo-section .btn-danger'));
+          expect(button).toBeTruthy();
+        });
+
+        it('should hide the undo button', () => {
+          const button = fixture.debugElement.query(By.css('#logo-section .btn-warning'));
+          expect(button).not.toBeTruthy();
+        });
+      });
+    });
+  });
+
+  function initComponent(dso: Community) {
+    fixture = TestBed.createComponent(ComColFormComponent);
+    comp = fixture.componentInstance;
+    comp.formModel = [];
+    comp.dso = dso;
+    (comp as any).type = Community.type;
+    comp.uploaderComponent = Object.assign({
+      uploader: {}
+    });
+    (comp as any).dsoService = dsoService;
+    fixture.detectChanges();
+    location = (comp as any).location;
+  }
 });

src/app/shared/comcol-forms/comcol-form/comcol-form.component.ts

@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnDestroy, OnInit, Output, ViewChild } from '@angular/core';
 import { Location } from '@angular/common';
 import {
   DynamicFormControlModel,
@@ -11,8 +11,24 @@ import { TranslateService } from '@ngx-translate/core';
 import { DSpaceObject } from '../../../core/shared/dspace-object.model';
 import { MetadataMap, MetadataValue } from '../../../core/shared/metadata.models';
 import { ResourceType } from '../../../core/shared/resource-type';
-import { isNotEmpty } from '../../empty.util';
+import { hasValue, isNotEmpty } from '../../empty.util';
+import { UploaderOptions } from '../../uploader/uploader-options.model';
+import { NotificationsService } from '../../notifications/notifications.service';
+import { ComColDataService } from '../../../core/data/comcol-data.service';
+import { Subscription } from 'rxjs/internal/Subscription';
+import { AuthService } from '../../../core/auth/auth.service';
 import { Community } from '../../../core/shared/community.model';
+import { Collection } from '../../../core/shared/collection.model';
+import { UploaderComponent } from '../../uploader/uploader.component';
+import { FileUploader } from 'ng2-file-upload';
+import { ErrorResponse, RestResponse } from '../../../core/cache/response.models';
+import { BehaviorSubject } from 'rxjs/internal/BehaviorSubject';
+import { RemoteData } from '../../../core/data/remote-data';
+import { Bitstream } from '../../../core/shared/bitstream.model';
+import { combineLatest as observableCombineLatest } from 'rxjs';
+import { RestRequestMethod } from '../../../core/data/rest-request-method';
+import { RequestService } from '../../../core/data/request.service';
+import { ObjectCacheService } from '../../../core/cache/object-cache.service';
 
 /**
  * A form for creating and editing Communities or Collections
@@ -22,7 +38,13 @@ import { Community } from '../../../core/shared/community.model';
   styleUrls: ['./comcol-form.component.scss'],
   templateUrl: './comcol-form.component.html'
 })
-export class ComColFormComponent<T extends DSpaceObject> implements OnInit {
+export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDestroy {
+
+  /**
+   * The logo uploader component
+   */
+  @ViewChild(UploaderComponent) uploaderComponent: UploaderComponent;
+
   /**
    * DSpaceObject that the form represents
    */
@@ -31,7 +53,7 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit {
   /**
    * Type of DSpaceObject that the form represents
    */
-  protected type: ResourceType;
+  type: ResourceType;
 
   /**
    * @type {string} Key prefix used to generate form labels
@@ -54,14 +76,56 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit {
   formGroup: FormGroup;
 
   /**
-   * Emits DSO when the form is submitted
-   * @type {EventEmitter<any>}
+   * The uploader configuration options
+   * @type {UploaderOptions}
    */
-  @Output() submitForm: EventEmitter<any> = new EventEmitter();
+  uploadFilesOptions: UploaderOptions = Object.assign(new UploaderOptions(), {
+    autoUpload: false
+  });
 
-  public constructor(private location: Location,
-                     private formService: DynamicFormService,
-                     private translate: TranslateService) {
+  /**
+   * Emits DSO and Uploader when the form is submitted
+   */
+  @Output() submitForm: EventEmitter<{
+    dso: T,
+    uploader: FileUploader,
+    deleteLogo: boolean
+  }> = new EventEmitter();
+
+  /**
+   * Fires an event when the logo has finished uploading (with or without errors) or was removed
+   */
+  @Output() finish: EventEmitter<any> = new EventEmitter();
+
+  /**
+   * Observable keeping track whether or not the uploader has finished initializing
+   * Used to start rendering the uploader component
+   */
+  initializedUploaderOptions = new BehaviorSubject(false);
+
+  /**
+   * Is the logo marked to be deleted?
+   */
+  markLogoForDeletion = false;
+
+  /**
+   * Array to track all subscriptions and unsubscribe them onDestroy
+   * @type {Array}
+   */
+  protected subs: Subscription[] = [];
+
+  /**
+   * The service used to fetch from or send data to
+   */
+  protected dsoService: ComColDataService<Community | Collection>;
+
+  public constructor(protected location: Location,
+                     protected formService: DynamicFormService,
+                     protected translate: TranslateService,
+                     protected notificationsService: NotificationsService,
+                     protected authService: AuthService,
+                     protected requestService: RequestService,
+                     protected objectCache: ObjectCacheService) {
   }
 
   ngOnInit(): void {
@@ -77,13 +141,56 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit {
       .subscribe(() => {
         this.updateFieldTranslations();
       });
+
+    if (hasValue(this.dso.id)) {
+      this.subs.push(
+        observableCombineLatest(
+          this.dsoService.getLogoEndpoint(this.dso.id),
+          (this.dso as any).logo
+        ).subscribe(([href, logoRD]: [string, RemoteData<Bitstream>]) => {
+          this.uploadFilesOptions.url = href;
+          this.uploadFilesOptions.authToken = this.authService.buildAuthHeader();
+          // If the object already contains a logo, send out a PUT request instead of POST for setting a new logo
+          if (hasValue(logoRD.payload)) {
+            this.uploadFilesOptions.method = RestRequestMethod.PUT;
+          }
+          this.initializedUploaderOptions.next(true);
+        })
+      );
+    } else {
+      // Set a placeholder URL to not break the uploader component. This will be replaced once the object is created.
+      this.uploadFilesOptions.url = 'placeholder';
+      this.uploadFilesOptions.authToken = this.authService.buildAuthHeader();
+      this.initializedUploaderOptions.next(true);
+    }
   }
 
   /**
    * Checks which new fields were added and sends the updated version of the DSO to the parent component
    */
   onSubmit() {
-    const formMetadata = {} as MetadataMap;
+    if (this.markLogoForDeletion && hasValue(this.dso.id)) {
+      this.dsoService.deleteLogo(this.dso).subscribe((response: RestResponse) => {
+        if (response.isSuccessful) {
+          this.notificationsService.success(
+            this.translate.get(this.type.value + '.edit.logo.notifications.delete.success.title'),
+            this.translate.get(this.type.value + '.edit.logo.notifications.delete.success.content')
+          );
+        } else {
+          const errorResponse = response as ErrorResponse;
+          this.notificationsService.error(
+            this.translate.get(this.type.value + '.edit.logo.notifications.delete.error.title'),
+            errorResponse.errorMessage
+          );
+        }
+        (this.dso as any).logo = undefined;
+        this.uploadFilesOptions.method = RestRequestMethod.POST;
+        this.refreshCache();
+        this.finish.emit();
+      });
+    }
+
+    const formMetadata = {}  as MetadataMap;
     this.formModel.forEach((fieldModel: DynamicInputModel) => {
       const value: MetadataValue = {
           value: fieldModel.value as string,
@@ -103,7 +210,11 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit {
       },
       type: Community.type
     });
-    this.submitForm.emit(updatedDSO);
+    this.submitForm.emit({
+      dso: updatedDSO,
+      uploader: hasValue(this.uploaderComponent) ? this.uploaderComponent.uploader : undefined,
+      deleteLogo: this.markLogoForDeletion
+    });
   }
 
   /**
@@ -123,7 +234,59 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit {
     );
   }
 
+  /**
+   * Mark the logo to be deleted
+   * Send out a delete request to remove the logo from the community/collection and display notifications
+   */
+  deleteLogo() {
+    this.markLogoForDeletion = true;
+  }
+
+  /**
+   * Undo marking the logo to be deleted
+   */
+  undoDeleteLogo() {
+    this.markLogoForDeletion = false;
+  }
+
+  /**
+   * Refresh the object's cache to ensure the latest version
+   */
+  private refreshCache() {
+    this.requestService.removeByHrefSubstring(this.dso.self);
+    this.objectCache.remove(this.dso.self);
+  }
+
+  /**
+   * The request was successful, display a success notification
+   */
+  public onCompleteItem() {
+    this.refreshCache();
+    this.notificationsService.success(null, this.translate.get(this.type.value + '.edit.logo.notifications.add.success'));
+    this.finish.emit();
+  }
+
+  /**
+   * The request was unsuccessful, display an error notification
+   */
+  public onUploadError() {
+    this.notificationsService.error(null, this.translate.get(this.type.value + '.edit.logo.notifications.add.error'));
+    this.finish.emit();
+  }
+
+  /**
+   * Cancel the form and return to the previous page
+   */
   onCancel() {
     this.location.back();
   }
+
+  /**
+   * Unsubscribe from open subscriptions
+   */
+  ngOnDestroy(): void {
+    this.subs
+      .filter((subscription) => hasValue(subscription))
+      .forEach((subscription) => subscription.unsubscribe());
+  }
 }