65240: Delete logo button and service method

resources/i18n/en.json5

@@ -131,8 +131,11 @@
   "collection.edit.delete": "Delete this collection",
   "collection.edit.head": "Edit Collection",
   "collection.edit.logo.label": "Collection logo",
-  "collection.edit.logo.notifications.error": "Uploading Collection logo failed. Please verify the content before retrying.",
+  "collection.edit.logo.notifications.add.error": "Uploading Collection logo failed. Please verify the content before retrying.",
-  "collection.edit.logo.notifications.success": "Upload Collection logo successful.",
+  "collection.edit.logo.notifications.add.success": "Upload Collection logo successful.",
+  "collection.edit.logo.notifications.delete.success.title": "Logo deleted",
+  "collection.edit.logo.notifications.delete.success.content": "Successfully deleted the collection's logo",
+  "collection.edit.logo.notifications.delete.error.title": "Error deleting logo",
   "collection.edit.logo.upload": "Drop a Collection Logo to upload",
   "collection.form.abstract": "Short Description",
   "collection.form.description": "Introductory text (HTML)",
@@ -158,8 +161,11 @@
   "community.edit.delete": "Delete this community",
   "community.edit.head": "Edit Community",
   "community.edit.logo.label": "Community logo",
-  "community.edit.logo.notifications.error": "Uploading Community logo failed. Please verify the content before retrying.",
+  "community.edit.logo.notifications.add.error": "Uploading Community logo failed. Please verify the content before retrying.",
-  "community.edit.logo.notifications.success": "Upload Community logo successful.",
+  "community.edit.logo.notifications.add.success": "Upload Community logo successful.",
+  "community.edit.logo.notifications.delete.success.title": "Logo deleted",
+  "community.edit.logo.notifications.delete.success.content": "Successfully deleted the community's logo",
+  "community.edit.logo.notifications.delete.error.title": "Error deleting logo",
   "community.edit.logo.upload": "Drop a Community Logo to upload",
   "community.form.abstract": "Short Description",
   "community.form.description": "Introductory text (HTML)",

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

@@ -6,10 +6,11 @@ import { ObjectCacheService } from '../cache/object-cache.service';
 import { CommunityDataService } from './community-data.service';
 
 import { DataService } from './data.service';
-import { FindAllOptions, FindByIDRequest } from './request.models';
+import { DeleteRequest, FindAllOptions, FindByIDRequest, RestRequest } from './request.models';
 import { HALEndpointService } from '../shared/hal-endpoint.service';
-import { getResponseFromEntry } from '../shared/operators';
+import { configureRequest, getResponseFromEntry } from '../shared/operators';
 import { CacheableObject } from '../cache/object-cache.reducer';
+import { RestResponse } from '../cache/response.models';
 
 export abstract class ComColDataService<T extends CacheableObject> extends DataService<T> {
   protected abstract cds: CommunityDataService;
@@ -67,4 +68,17 @@ export abstract class ComColDataService<T extends CacheableObject> extends DataS
       switchMap((href: string) => this.halService.getEndpoint('logo', `${href}/${id}`))
     )
   }
+
+  /**
+   * Delete the logo from the community or collection
+   * @param id  The community or collection's ID
+   */
+  public deleteLogo(id: string): Observable<RestResponse> {
+    return this.getLogoEndpoint(id).pipe(
+      map((href: string) =>  new DeleteRequest(this.requestService.generateRequestId(), href)),
+      configureRequest(this.requestService),
+      switchMap((restRequest: RestRequest) => this.requestService.getByUUID(restRequest.uuid)),
+      getResponseFromEntry()
+    );
+  }
 }

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

@@ -1,7 +1,14 @@
 <div class="container-fluid">
   <label>{{type.value + '.edit.logo.label' | translate}}</label>
-  <ds-comcol-page-logo [logo]="(dso?.logo | async)?.payload"></ds-comcol-page-logo>
+  <ng-container *ngVar="(dso?.logo | async)?.payload as logo">
-  <ds-uploader  *ngIf="uploadFilesOptions.url"
+    <ds-comcol-page-logo [logo]="logo"></ds-comcol-page-logo>
+    <div *ngIf="logo" class="btn-group btn-group-sm float-right" role="group">
+      <button type="button" class="btn btn-danger" (click)="deleteLogo()">
+        <i class="fas fa-trash" aria-hidden="true"></i>
+      </button>
+    </div>
+  </ng-container>
+  <ds-uploader  *ngIf="initializedUploaderOptions | async"
                 [dropMsg]="type.value + '.edit.logo.upload'"
                 [dropOverDocumentMsg]="type.value + '.edit.logo.upload'"
                 [enableDragOverDocument]="true"

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

@@ -20,6 +20,8 @@ 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';
 
 /**
  * A form for creating and editing Communities or Collections
@@ -91,6 +93,12 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
    */
   @Output() finishUpload: EventEmitter<any> = new EventEmitter();
 
+  /**
+   * Observable keeping track whether or not the uploader has finished initializing
+   * Used to start rendering the uploader component
+   */
+  private initializedUploaderOptions = new BehaviorSubject(false);
+
   /**
    * Array to track all subscriptions and unsubscribe them onDestroy
    * @type {Array}
@@ -128,12 +136,14 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
         this.dsoService.getLogoEndpoint(this.dso.id).subscribe((href: string) => {
           this.uploadFilesOptions.url = href;
           this.uploadFilesOptions.authToken = this.authService.buildAuthHeader();
+          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);
     }
   }
 
@@ -184,11 +194,33 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
     );
   }
 
+  /**
+   * Send out a delete request to remove the logo from the community/collection and display notifications
+   */
+  deleteLogo() {
+    if (hasValue(this.dso.id)) {
+      this.dsoService.deleteLogo(this.dso.id).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
+          );
+        }
+      });
+    }
+  }
+
   /**
    * The request was successful, display a success notification
    */
   public onCompleteItem() {
-    this.notificationsService.success(null, this.translate.get(this.type.value + '.edit.logo.notifications.success'));
+    this.notificationsService.success(null, this.translate.get(this.type.value + '.edit.logo.notifications.add.success'));
     this.finishUpload.emit();
   }
 
@@ -196,7 +228,7 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
    * The request was unsuccessful, display an error notification
    */
   public onUploadError() {
-    this.notificationsService.error(null, this.translate.get(this.type.value + '.edit.logo.notifications.error'));
+    this.notificationsService.error(null, this.translate.get(this.type.value + '.edit.logo.notifications.add.error'));
     this.finishUpload.emit();
   }