mirror of
https://github.com/DSpace/dspace-angular.git
synced 2025-10-15 14:03:06 +00:00
65240: Marking logo for deletion and request on form submit
This commit is contained in:
@@ -4,14 +4,21 @@
|
||||
<label>{{type.value + '.edit.logo.label' | translate}}</label>
|
||||
</div>
|
||||
<ng-container *ngVar="(dso?.logo | async)?.payload as logo">
|
||||
<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 type="button" class="btn btn-danger" (click)="deleteLogo()">
|
||||
<i class="fas fa-trash" aria-hidden="true"></i>
|
||||
</button>
|
||||
<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">
|
||||
|
@@ -22,8 +22,9 @@ 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', () => {
|
||||
fdescribe('ComColFormComponent', () => {
|
||||
let comp: ComColFormComponent<DSpaceObject>;
|
||||
let fixture: ComponentFixture<ComColFormComponent<DSpaceObject>>;
|
||||
let location: Location;
|
||||
@@ -136,7 +137,8 @@ describe('ComColFormComponent', () => {
|
||||
type: Community.type
|
||||
},
|
||||
),
|
||||
uploader: {}
|
||||
uploader: {},
|
||||
deleteLogo: false
|
||||
}
|
||||
);
|
||||
})
|
||||
@@ -151,7 +153,7 @@ describe('ComColFormComponent', () => {
|
||||
|
||||
describe('onCompleteItem', () => {
|
||||
beforeEach(() => {
|
||||
spyOn(comp.finishUpload, 'emit');
|
||||
spyOn(comp.finish, 'emit');
|
||||
comp.onCompleteItem();
|
||||
});
|
||||
|
||||
@@ -159,8 +161,8 @@ describe('ComColFormComponent', () => {
|
||||
expect(notificationsService.success).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('should emit finishUpload', () => {
|
||||
expect(comp.finishUpload.emit).toHaveBeenCalled();
|
||||
it('should emit finish', () => {
|
||||
expect(comp.finish.emit).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('should remove the object\'s cache', () => {
|
||||
@@ -171,7 +173,7 @@ describe('ComColFormComponent', () => {
|
||||
|
||||
describe('onUploadError', () => {
|
||||
beforeEach(() => {
|
||||
spyOn(comp.finishUpload, 'emit');
|
||||
spyOn(comp.finish, 'emit');
|
||||
comp.onUploadError();
|
||||
});
|
||||
|
||||
@@ -179,8 +181,8 @@ describe('ComColFormComponent', () => {
|
||||
expect(notificationsService.error).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('should emit finishUpload', () => {
|
||||
expect(comp.finishUpload.emit).toHaveBeenCalled();
|
||||
it('should emit finish', () => {
|
||||
expect(comp.finish.emit).toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -219,13 +221,17 @@ describe('ComColFormComponent', () => {
|
||||
expect(comp.uploadFilesOptions.method).toEqual(RestRequestMethod.PUT);
|
||||
});
|
||||
|
||||
describe('deleteLogo', () => {
|
||||
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.deleteLogo();
|
||||
comp.onSubmit();
|
||||
});
|
||||
|
||||
it('should display a success notification', () => {
|
||||
@@ -238,7 +244,7 @@ describe('ComColFormComponent', () => {
|
||||
|
||||
beforeEach(() => {
|
||||
spyOn(dsoService, 'deleteLogo').and.returnValue(observableOf(response));
|
||||
comp.deleteLogo();
|
||||
comp.onSubmit();
|
||||
});
|
||||
|
||||
it('should display an error notification', () => {
|
||||
@@ -246,6 +252,59 @@ describe('ComColFormComponent', () => {
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
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();
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
|
@@ -25,7 +25,6 @@ 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';
|
||||
import { take } from 'rxjs/operators';
|
||||
|
||||
/**
|
||||
* A form for creating and editing Communities or Collections
|
||||
@@ -85,13 +84,14 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
|
||||
*/
|
||||
@Output() submitForm: EventEmitter<{
|
||||
dso: T,
|
||||
uploader: FileUploader
|
||||
uploader: FileUploader,
|
||||
deleteLogo: boolean
|
||||
}> = new EventEmitter();
|
||||
|
||||
/**
|
||||
* Fires an event when the logo has finished uploading (with or without errors)
|
||||
* Fires an event when the logo has finished uploading (with or without errors) or was removed
|
||||
*/
|
||||
@Output() finishUpload: EventEmitter<any> = new EventEmitter();
|
||||
@Output() finish: EventEmitter<any> = new EventEmitter();
|
||||
|
||||
/**
|
||||
* Observable keeping track whether or not the uploader has finished initializing
|
||||
@@ -99,6 +99,11 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
|
||||
*/
|
||||
initializedUploaderOptions = new BehaviorSubject(false);
|
||||
|
||||
/**
|
||||
* Is the logo marked to be deleted?
|
||||
*/
|
||||
markLogoForDeletion = false;
|
||||
|
||||
/**
|
||||
* Array to track all subscriptions and unsubscribe them onDestroy
|
||||
* @type {Array}
|
||||
@@ -160,6 +165,26 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
|
||||
* Checks which new fields were added and sends the updated version of the DSO to the parent component
|
||||
*/
|
||||
onSubmit() {
|
||||
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.finish.emit();
|
||||
});
|
||||
}
|
||||
|
||||
const formMetadata = new Object() as MetadataMap;
|
||||
this.formModel.forEach((fieldModel: DynamicInputModel) => {
|
||||
const value: MetadataValue = {
|
||||
@@ -182,7 +207,8 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
|
||||
});
|
||||
this.submitForm.emit({
|
||||
dso: updatedDSO,
|
||||
uploader: hasValue(this.uploaderComponent) ? this.uploaderComponent.uploader : undefined
|
||||
uploader: hasValue(this.uploaderComponent) ? this.uploaderComponent.uploader : undefined,
|
||||
deleteLogo: this.markLogoForDeletion
|
||||
});
|
||||
}
|
||||
|
||||
@@ -204,27 +230,18 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
|
||||
}
|
||||
|
||||
/**
|
||||
* Mark the logo to be deleted
|
||||
* 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).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.markLogoForDeletion = true;
|
||||
}
|
||||
|
||||
/**
|
||||
* Undo marking the logo to be deleted
|
||||
*/
|
||||
undoDeleteLogo() {
|
||||
this.markLogoForDeletion = false;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -241,7 +258,7 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
|
||||
public onCompleteItem() {
|
||||
this.refreshCache();
|
||||
this.notificationsService.success(null, this.translate.get(this.type.value + '.edit.logo.notifications.add.success'));
|
||||
this.finishUpload.emit();
|
||||
this.finish.emit();
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -249,7 +266,7 @@ export class ComColFormComponent<T extends DSpaceObject> implements OnInit, OnDe
|
||||
*/
|
||||
public onUploadError() {
|
||||
this.notificationsService.error(null, this.translate.get(this.type.value + '.edit.logo.notifications.add.error'));
|
||||
this.finishUpload.emit();
|
||||
this.finish.emit();
|
||||
}
|
||||
|
||||
/**
|
||||
|
Reference in New Issue
Block a user