DSC-1111 Synced with main

src/app/collection-page/collection-form/collection-form.component.ts

@@ -23,7 +23,7 @@ import { getFirstSucceededRemoteListPayload } from '../../core/shared/operators'
 import { collectionFormEntityTypeSelectionConfig, collectionFormModels, } from './collection-form.models';
 import { NONE_ENTITY_TYPE } from '../../core/shared/item-relationships/item-type.resource-type';
 import { hasNoValue, isNotNull } from 'src/app/shared/empty.util';
-
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 
 /**
  * Form used for creating and editing collections
@@ -64,8 +64,10 @@ export class CollectionFormComponent extends ComColFormComponent<Collection> imp
                      protected requestService: RequestService,
                      protected objectCache: ObjectCacheService,
                      protected entityTypeService: EntityTypeDataService,
-                     protected chd: ChangeDetectorRef) {
+                     protected chd: ChangeDetectorRef,
-    super(formService, translate, notificationsService, authService, requestService, objectCache);
+                     protected submissionDefinitionService: SubmissionDefinitionsConfigDataService,
+                     protected modalService: NgbModal) {
+    super(formService, translate, notificationsService, authService, requestService, objectCache, modalService);
   }
 
   ngOnInit(): void {

src/app/community-page/community-form/community-form.component.ts

@@ -14,6 +14,7 @@ import { AuthService } from '../../core/auth/auth.service';
 import { RequestService } from '../../core/data/request.service';
 import { ObjectCacheService } from '../../core/cache/object-cache.service';
 import { environment } from '../../../environments/environment';
+import {NgbModal} from '@ng-bootstrap/ng-bootstrap';
 
 /**
  * Form used for creating and editing communities
@@ -78,8 +79,9 @@ export class CommunityFormComponent extends ComColFormComponent<Community> imple
                      protected authService: AuthService,
                      protected dsoService: CommunityDataService,
                      protected requestService: RequestService,
-                     protected objectCache: ObjectCacheService) {
+                     protected objectCache: ObjectCacheService,
-    super(formService, translate, notificationsService, authService, requestService, objectCache);
+                     protected modalService: NgbModal) {
+    super(formService, translate, notificationsService, authService, requestService, objectCache, modalService);
   }
 
   ngOnChanges(changes: SimpleChanges) {

src/app/community-page/edit-community-page/community-metadata/community-metadata.component.html

@@ -1,5 +1,5 @@
 <ds-community-form [dso]="(dsoRD$ | async)?.payload"
                    (submitForm)="onSubmit($event)"
                    (back)="navigateToHomePage()"
-                   (finish)="navigateToHomePage()"></ds-community-form>
+                   (finish)="returnToEdit()"></ds-community-form>
 

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

@@ -4,25 +4,28 @@
       <span>{{type.value + '.edit.logo.label' | translate}}</span>
     </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" *ngIf="logo">
+      <div *ngIf="logo" [ngClass]="{'alert-danger': markLogoForDeletion}" class="col-12 d-inline-block alert"
+           id="logo-section">
         <div class="row">
           <div class="col-8 d-inline-block">
             <ds-comcol-page-logo [alternateText]="type.value + '.logo.alt'" [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"
+              <button (click)="confirmLogoDelete(removeLogo)" *ngIf="!markLogoForDeletion" class="btn btn-danger"
-                      title="{{type.value + '.edit.logo.delete.title' | translate}}"
+                      title="{{type.value + '.edit.logo.delete.title' | translate}}" type="button">
-                      (click)="deleteLogo()">
+                <i aria-hidden="true" class="fas fa-trash"></i>
-                <i class="fas fa-trash" aria-hidden="true"></i>
+                {{ 'community.edit.logo.delete.title' | translate}}
               </button>
-              <button *ngIf="markLogoForDeletion" type="button" class="btn btn-warning"
+              <button *ngIf="!markLogoForDeletion" class="btn btn-info" type="button">
-                      title="{{type.value + '.edit.logo.delete-undo.title' | translate}}"
+                <span>
-                      (click)="undoDeleteLogo()">
+                  <label (keyup.enter)="$event.stopImmediatePropagation(); fileInput.click()" for="inputFileUploader">
-                <i class="fas fa-undo" aria-hidden="true"></i>
+                    <span role="button">
-              </button>
+                      <i aria-hidden="true" class="fas fa-upload"></i>
-              <button *ngIf="markLogoForDeletion" type="button" class="btn btn-primary" (click)="onSubmit()">
+                      {{ 'collection.edit.logo.replace.title' | translate}}
-                <i class="fas fa-square-minus"></i> {{"community.edit.logo.delete.title" | translate}}
+                    </span>
+                  </label>
+                </span>
               </button>
             </div>
           </div>
@@ -41,12 +44,24 @@
     </ng-container>
   </div>
 </div>
-<ds-form *ngIf="formModel"
+<ds-form (submitForm)="onSubmit()" *ngIf="formModel" [displayCancel]="false" [formId]="'comcol-form-id'"
-         [formId]="'comcol-form-id'"
+         [formModel]="formModel">
-         [formModel]="formModel"
+  <button (click)="back.emit()" before class="btn btn-outline-secondary" type="button">
-         [displayCancel]="false"
-         (submitForm)="onSubmit()">
-  <button before (click)="back.emit()" class="btn btn-outline-secondary" type="button">
     <i class="fas fa-arrow-left" aria-hidden="true"></i> {{ type.value + '.edit.return' | translate }}
   </button>
 </ds-form>
+<ng-template #removeLogo let-c="close" let-d="dismiss">
+  <div class="modal-header">
+    <h4 class="modal-title text-info">{{'collection.edit.logo.delete.title' | translate}}</h4>
+  </div>
+  <div class="modal-body">
+    <p>{{'admin.edit-user-agreement.confirm.info' | translate}}</p>
+  </div>
+  <div class="modal-footer">
+    <button (click)="c('delete')" class="btn btn-danger"
+            type="button">{{'collection.edit.logo.delete.title' | translate}}</button>
+    <button (click)="c('cancel')" class="btn btn-warning" type="button">{{'form.cancel' | translate}}</button>
+  </div>
+</ng-template>
+<input #fileInput (change)="handleLogoReplace($event)" [uploader]="uploader" class="d-none" id="inputFileUploader" ng2FileSelect
+       type="file"/>

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

@@ -22,7 +22,7 @@ import { UploaderComponent } from '../../../upload/uploader/uploader.component';
 import { Operation } from 'fast-json-patch';
 import { NoContent } from '../../../../core/shared/NoContent.model';
 import { getFirstCompletedRemoteData } from '../../../../core/shared/operators';
-
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 /**
  * A form for creating and editing Communities or Collections
  */
@@ -118,12 +118,15 @@ export class ComColFormComponent<T extends Collection | Community> implements On
    */
   protected dsoService: ComColDataService<Community | Collection>;
 
+  public uploader = new FileUploader(this.uploadFilesOptions);
+
   public constructor(protected formService: DynamicFormService,
                      protected translate: TranslateService,
                      protected notificationsService: NotificationsService,
                      protected authService: AuthService,
                      protected requestService: RequestService,
-                     protected objectCache: ObjectCacheService) {
+                     protected objectCache: ObjectCacheService,
+                     protected modalService: NgbModal) {
   }
 
   ngOnInit(): void {
@@ -265,6 +268,30 @@ export class ComColFormComponent<T extends Collection | Community> implements On
     this.markLogoForDeletion = false;
   }
 
+  openModal(content: any) {
+    this.modalService.open(content);
+  }
+
+  confirmLogoDelete(removeLogo: any) {
+    this.modalService.open(removeLogo).result.then( (result) => {
+      if (result === 'delete') {
+        this.deleteLogo();
+        this.onSubmit();
+      } else if (result === 'cancel') {
+        return;
+      }
+    });
+  }
+
+  handleLogoReplace(event: Event) {
+    const fileInput = event.target as HTMLInputElement;
+    if (fileInput.files && fileInput.files.length > 0) {
+      this.markLogoForDeletion = true;
+      this.onSubmit();
+      this.uploader.uploadAll();
+    }
+  }
+
   /**
    * Refresh the object's cache to ensure the latest version
    */

src/app/shared/comcol/comcol-forms/edit-comcol-page/comcol-metadata/comcol-metadata.component.ts

@@ -88,6 +88,15 @@ export class ComcolMetadataComponent<TDomain extends Community | Collection> imp
       take(1)
     ).subscribe((dsoRD: RemoteData<TDomain>) => {
       this.router.navigate([this.frontendURL + dsoRD.payload.id]);
-      });
+    });
+  }
+
+  returnToEdit() {
+    this.dsoRD$.pipe(
+      getFirstSucceededRemoteData(),
+      take(1)
+    ).subscribe((dsoRD: RemoteData<TDomain>) => {
+      this.router.navigate([this.frontendURL + dsoRD.payload.id + '/edit/metadata']);
+    });
   }
 }

src/assets/i18n/en.json5

@@ -978,6 +978,8 @@
 
   "collection.edit.item-mapper.tabs.map": "Map new items",
 
+  "collection.edit.logo.replace.title": "Replace logo",
+
   "collection.edit.logo.delete.title": "Delete logo",
 
   "collection.edit.logo.delete-undo.title": "Undo delete",