inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-19 17:14:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix bug related to upload button permission (#1838)

Browse Source 
* Add the permission check on the activiti button

* Fix code after unit test

* Add basic documentation

* Improve the code and fix the missing file issue

* Fix unit test after refactoring

* remove duplicate log
This commit is contained in:
Maurizio Vitale 2017-04-24 16:02:44 +01:00 committed by Mario Romano
parent e25b05d991
commit 50abe09edb
4 changed files with 74 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ng2-components/ng2-alfresco-upload/README.md
View File

@ -178,7 +178,7 @@ Attribute | Options | Default | Description | Mandatory
`currentFolderPath` | *string* | '/Sites/swsdp/documentLibrary' | define the path where the files are uploaded |
`versioning` | *boolean* | false | Versioning false is the default uploader behaviour and it rename using an integer suffix if there is a name clash. Versioning true to indicate that a major version should be created |
`staticTitle` | *string* | 'FILE_UPLOAD.BUTTON.UPLOAD_FILE' or 'FILE_UPLOAD.BUTTON.UPLOAD_FOLDER' string in the JSON text file | define the text of the upload button|
`disableWithNoPermission` | *boolean* | false | If the value is true and the user doesn't have the permission to delete the node the button will be disabled |
`disableWithNoPermission` | *boolean* | false | If the value is true and the user doesn't have the permission to delete the node the button will be disabled |
### How to show notification message with no permission
You can show a notification error when the user doesn't have the right permission to perform the action.

10
ng2-components/ng2-alfresco-upload/src/components/upload-button.component.html
View File

@ -1,6 +1,6 @@
<form>
<!--Files Upload-->
<div *ngIf="!uploadFolders" [class.mdl-button--file--disabled]="isDisabled()" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-button--file">
<div *ngIf="!uploadFolders" [class.mdl-button--file--disabled]="isButtonDisabled()" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-button--file">
<md-icon>file_upload</md-icon>
<!--Multiple Files Upload-->
@ -11,7 +11,7 @@
(change)="onFilesAdded($event)"
multiple="multiple"
accept="{{acceptedFilesType}}"
[attr.disabled]="isDisabled()"
[attr.disabled]="isButtonDisabled()"
#uploadFiles>
</span>
@ -22,13 +22,13 @@
<input id="upload-single-file" data-automation-id="upload-single-file" type="file" name="uploadFiles"
(change)="onFilesAdded($event)"
accept="{{acceptedFilesType}}"
[attr.disabled]="isDisabled()"
[attr.disabled]="isButtonDisabled()"
#uploadFiles>
</span>
</div>
<!--Folders Upload-->
<div *ngIf="uploadFolders" [class.mdl-button--file--disabled]="isDisabled()" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-button--file">
<div *ngIf="uploadFolders" [class.mdl-button--file--disabled]="isButtonDisabled()" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored mdl-button--file">
<md-icon>file_upload</md-icon>
<label id="uploadFolder-label" *ngIf="!staticTitle" for="uploadFolder">{{'FILE_UPLOAD.BUTTON.UPLOAD_FOLDER' | translate}}</label>
<label id="uploadFolder-label-static" *ngIf="staticTitle" for="uploadFolder">{{staticTitle}}</label>
@ -36,7 +36,7 @@
(change)="onDirectoryAdded($event)"
multiple="multiple"
accept="{{acceptedFilesType}}"
[attr.disabled]="isDisabled()"
[attr.disabled]="isButtonDisabled()"
webkitdirectory directory
multiple #uploadFolders>
</div>

16
ng2-components/ng2-alfresco-upload/src/components/upload-button.component.spec.ts
View File

@ -17,7 +17,7 @@
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { UploadButtonComponent } from './upload-button.component';
import { DebugElement } from '@angular/core';
import { DebugElement, SimpleChange } from '@angular/core';
import { CoreModule, AlfrescoTranslationService, NotificationService } from 'ng2-alfresco-core';
import { TranslationMock } from '../assets/translation.service.mock';
import { UploadService } from '../services/upload.service';
@ -175,6 +175,7 @@ describe('UploadButtonComponent', () => {
spyOn(uploadService, 'getFolderNode').and.returnValue(Observable.of(fakeFolderNodeWithPermission));
component.ngOnChanges({ rootFolderId: new SimpleChange(null, component.rootFolderId) });
component.onFilesAdded(fakeEvent);
let compiled = fixture.debugElement.nativeElement;
fixture.detectChanges();
@ -188,6 +189,7 @@ describe('UploadButtonComponent', () => {
spyOn(uploadService, 'getFolderNode').and.returnValue(Observable.of(fakeFolderNodeWithPermission));
component.ngOnChanges({ rootFolderId: new SimpleChange(null, component.rootFolderId) });
component.onFilesAdded(fakeEvent);
let compiled = fixture.debugElement.nativeElement;
fixture.detectChanges();
@ -196,11 +198,13 @@ describe('UploadButtonComponent', () => {
});
it('should call uploadFile with the default root folder', () => {
component.rootFolderId = '-root-';
component.currentFolderPath = '/root-fake-/sites-fake/folder-fake';
component.onSuccess = null;
spyOn(uploadService, 'getFolderNode').and.returnValue(Observable.of(fakeFolderNodeWithPermission));
component.ngOnChanges({ rootFolderId: new SimpleChange(null, component.rootFolderId) });
uploadService.uploadFilesInTheQueue = jasmine.createSpy('uploadFilesInTheQueue');
fixture.detectChanges();
@ -215,6 +219,8 @@ describe('UploadButtonComponent', () => {
component.onSuccess = null;
spyOn(uploadService, 'getFolderNode').and.returnValue(Observable.of(fakeFolderNodeWithPermission));
component.ngOnChanges({ rootFolderId: new SimpleChange(null, component.rootFolderId) });
uploadService.uploadFilesInTheQueue = jasmine.createSpy('uploadFilesInTheQueue');
fixture.detectChanges();
@ -224,12 +230,14 @@ describe('UploadButtonComponent', () => {
});
it('should create a folder and emit an File uploaded event', (done) => {
component.rootFolderId = '-my-';
component.currentFolderPath = '/fake-root-path';
fixture.detectChanges();
spyOn(uploadService, 'getFolderNode').and.returnValue(Observable.of(fakeFolderNodeWithPermission));
spyOn(uploadService, 'callApiCreateFolder').and.returnValue(fakeResolvePromise);
component.ngOnChanges({ rootFolderId: new SimpleChange(null, component.rootFolderId) });
fixture.detectChanges();
component.onSuccess.subscribe(e => {
expect(e.value).toEqual('File uploaded');
done();
@ -245,8 +253,12 @@ describe('UploadButtonComponent', () => {
});
it('should emit an onError event when the folder already exist', (done) => {
component.rootFolderId = '-my-';
spyOn(uploadService, 'getFolderNode').and.returnValue(Observable.of(fakeFolderNodeWithPermission));
spyOn(uploadService, 'callApiCreateFolder').and.returnValue(fakeRejectPromise);
component.ngOnChanges({ rootFolderId: new SimpleChange(null, component.rootFolderId) });
component.onError.subscribe(e => {
expect(e.value).toEqual('FILE_UPLOAD.MESSAGES.FOLDER_ALREADY_EXIST');
done();

108
ng2-components/ng2-alfresco-upload/src/components/upload-button.component.ts
View File

@ -15,7 +15,7 @@
* limitations under the License.
*/
import { Component, ElementRef, Input, Output, EventEmitter, OnInit, OnChanges } from '@angular/core';
import { Component, ElementRef, Input, Output, EventEmitter, OnInit, OnChanges, SimpleChanges } from '@angular/core';
import { Subject } from 'rxjs/Rx';
import { AlfrescoTranslationService, LogService, NotificationService } from 'ng2-alfresco-core';
import { UploadService } from '../services/upload.service';
@ -98,7 +98,8 @@ export class UploadButtonComponent implements OnInit, OnChanges {
@Output()
permissionEvent: EventEmitter<PermissionModel> = new EventEmitter<PermissionModel>();
private disableButton: boolean = false;
private hasPermission: boolean = false;
private permissionValue: Subject<boolean> = new Subject<boolean>();
constructor(private el: ElementRef,
@ -111,26 +112,33 @@ export class UploadButtonComponent implements OnInit, OnChanges {
}
}
isDisabled(): boolean {
return this.disabled || this.disableButton;
}
ngOnInit() {
this.permissionValue.subscribe((hasPermission: boolean) => {
if (!hasPermission && this.disableWithNoPermission) {
this.disableButton = true;
} else {
this.disableButton = undefined;
}
this.permissionValue.subscribe((permission: boolean) => {
this.hasPermission = permission;
});
}
ngOnChanges(changes) {
this.checkPermission();
ngOnChanges(changes: SimpleChanges) {
let rootFolderId = changes['rootFolderId'];
if (rootFolderId && rootFolderId.currentValue) {
this.checkPermission();
}
let formFields = this.createFormFields();
this.uploadService.setOptions(formFields, this.versioning);
}
isButtonDisabled(): boolean {
return this.isForceDisable() || this.isDisableWithNoPermission();
}
isForceDisable(): boolean {
return this.disabled ? true : undefined;
}
isDisableWithNoPermission(): boolean {
return !this.hasPermission && this.disableWithNoPermission ? true : undefined;
}
/**
* Method called when files are dropped in the drag area.
*
@ -138,15 +146,12 @@ export class UploadButtonComponent implements OnInit, OnChanges {
*/
onFilesAdded($event: any): void {
let files = $event.currentTarget.files;
this.permissionValue.subscribe((hasPermission: boolean) => {
if (hasPermission) {
this.uploadFiles(this.currentFolderPath, files);
} else {
this.permissionEvent.emit(new PermissionModel({type: 'content', action: 'upload', permission: 'create'}));
}
});
this.checkPermission();
if (this.hasPermission) {
this.uploadFiles(this.currentFolderPath, files);
} else {
this.permissionEvent.emit(new PermissionModel({type: 'content', action: 'upload', permission: 'create'}));
}
// reset the value of the input file
$event.target.value = '';
}
@ -158,39 +163,34 @@ export class UploadButtonComponent implements OnInit, OnChanges {
*/
onDirectoryAdded($event: any): void {
let files = $event.currentTarget.files;
this.permissionValue.subscribe((hasPermission: boolean) => {
if (hasPermission) {
let hashMapDir = this.convertIntoHashMap(files);
if (this.hasPermission) {
let hashMapDir = this.convertIntoHashMap(files);
hashMapDir.forEach((filesDir, directoryPath) => {
let directoryName = this.getDirectoryName(directoryPath);
let absolutePath = this.currentFolderPath + this.getDirectoryPath(directoryPath);
hashMapDir.forEach((filesDir, directoryPath) => {
let directoryName = this.getDirectoryName(directoryPath);
let absolutePath = this.currentFolderPath + this.getDirectoryPath(directoryPath);
this.uploadService.createFolder(absolutePath, directoryName, this.rootFolderId)
.subscribe(
res => {
let relativeDir = this.currentFolderPath + '/' + directoryPath;
this.uploadFiles(relativeDir, filesDir);
},
error => {
let errorMessagePlaceholder = this.getErrorMessage(error.response);
if (errorMessagePlaceholder) {
this.onError.emit({value: errorMessagePlaceholder});
let errorMessage = this.formatString(errorMessagePlaceholder, [directoryName]);
if (errorMessage) {
this._showErrorNotificationBar(errorMessage);
}
this.uploadService.createFolder(absolutePath, directoryName, this.rootFolderId)
.subscribe(
res => {
let relativeDir = this.currentFolderPath + '/' + directoryPath;
this.uploadFiles(relativeDir, filesDir);
},
error => {
let errorMessagePlaceholder = this.getErrorMessage(error.response);
if (errorMessagePlaceholder) {
this.onError.emit({value: errorMessagePlaceholder});
let errorMessage = this.formatString(errorMessagePlaceholder, [directoryName]);
if (errorMessage) {
this._showErrorNotificationBar(errorMessage);
}
this.logService.error(error);
}
);
});
} else {
this.permissionEvent.emit(new PermissionModel({type: 'content', action: 'upload', permission: 'create'}));
}
});
this.checkPermission();
}
);
});
} else {
this.permissionEvent.emit(new PermissionModel({type: 'content', action: 'upload', permission: 'create'}));
}
// reset the value of the input file
$event.target.value = '';
}
@ -320,11 +320,11 @@ export class UploadButtonComponent implements OnInit, OnChanges {
checkPermission() {
if (this.rootFolderId) {
this.uploadService.getFolderNode(this.rootFolderId).subscribe(
res => {
(res) => {
this.permissionValue.next(this.hasCreatePermission(res));
},
error => {
this.logService.error(error);
(error) => {
this.onError.emit(error);
}
);
}