[ASD-2483] Validate folder name on change (#3088)

* notify service refactoring
get translate eliminitation in favor of instant
add error event where necessary
fix config problem during test

* fix delete notify test

* remove fdescribe

* fix core test

* errors

* fix types
This commit is contained in:
Eugenio Romano
2018-03-21 16:55:52 +00:00
committed by GitHub
parent de0fdd9ab4
commit 2951374cc0
25 changed files with 357 additions and 260 deletions

View File

@@ -75,12 +75,14 @@
mat-icon-button
[disabled]="!canCreateContent(documentList.folderNode)"
title="{{ 'DOCUMENT_LIST.TOOLBAR.NEW_FOLDER' | translate }}"
(error)="openSnackMessage($event)"
[adf-create-folder]="getDocumentListCurrentFolderId()">
<mat-icon>create_new_folder</mat-icon>
</button>
<button mat-icon-button
[disabled]="!canEditFolder(documentList.selection)"
title="{{ 'DOCUMENT_LIST.TOOLBAR.EDIT_FOLDER' | translate }}"
(error)="openSnackMessage($event)"
[adf-edit-folder]="documentList.selection[0]?.entry">
<mat-icon>create</mat-icon>
</button>
@@ -145,12 +147,14 @@
<span>{{ 'DOCUMENT_LIST.TOOLBAR.CARDVIEW' | translate }}</span>
</button>
<button mat-menu-item
(error)="openSnackMessage($event)"
[adf-create-folder]="getDocumentListCurrentFolderId()">
<mat-icon>create_new_folder</mat-icon>
<span>{{ 'DOCUMENT_LIST.TOOLBAR.NEW_FOLDER' | translate }}</span>
</button>
<button mat-menu-item
[disabled]="!canEditFolder(documentList.selection)"
(error)="openSnackMessage($event)"
[adf-edit-folder]="documentList.selection[0]?.entry">
<mat-icon>create</mat-icon>
<span>{{ 'DOCUMENT_LIST.TOOLBAR.EDIT_FOLDER' | translate }}</span>
@@ -442,7 +446,7 @@
[multipleFiles]="multipleFileUpload"
[uploadFolders]="folderUpload"
[maxFilesSize]="maxSizeShow ? maxFilesSize : null"
(error)="handleUploadError($event)"
(error)="openSnackMessage($event)"
[versioning]="versioning"
[adf-node-permission]="'create'"
[adf-nodes]="enableUpload ? getCurrentDocumentListNode() : []"
@@ -460,7 +464,7 @@
[multipleFiles]="multipleFileUpload"
[uploadFolders]="folderUpload"
[versioning]="versioning"
(error)="handleUploadError($event)"
(error)="openSnackMessage($event)"
[adf-node-permission]="'create'"
[adf-nodes]="enableUpload ? getCurrentDocumentListNode() : []"
(permissionEvent)="handlePermissionError($event)">
@@ -487,4 +491,4 @@
</div>
</div>
<file-uploading-dialog #fileDialog></file-uploading-dialog>
<adf-file-uploading-dialog #fileDialog (error)="openSnackMessage($event)" ></adf-file-uploading-dialog>

View File

@@ -147,7 +147,7 @@ adf-document-list ::ng-deep .adf-datatable-selected > svg {
}
}
file-uploading-dialog ::ng-deep .upload-dialog {
adf-file-uploading-dialog ::ng-deep .upload-dialog {
width: 80%;
& ::ng-deep adf-file-uploading-list ::ng-deep adf-file-uploading-list-row .adf-file-uploading-row__group {

View File

@@ -294,7 +294,7 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
});
}
handleUploadError(event: any) {
openSnackMessage(event: any) {
this.notificationService.openSnackMessage(
event,
4000

View File

@@ -9,7 +9,7 @@ Shows a dialog listing all the files uploaded with the Upload Button or Drag Are
## Basic Usage
```html
<file-uploading-dialog></file-uploading-dialog>
<adf-file-uploading-dialog></adf-file-uploading-dialog>
```
### Properties
@@ -18,6 +18,12 @@ Shows a dialog listing all the files uploaded with the Upload Button or Drag Are
| ---- | ---- | ------------- | ----------- |
| position | `string` | `'right'` | Dialog position. Can be 'left' or 'right'. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| error | `EventEmitter<any>` | Emitted when a file upload goes in error |
## Details
This component should be used in combination with the

View File

@@ -27,6 +27,12 @@ Allows folders to be created.
| ---- | ---- | ------------- | ----------- |
| parentNodeId | `string` | `DEFAULT_FOLDER_PARENT_ID` | Parent folder where the new folder will be located after creation. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| error | `EventEmitter<any>` | Emitted when an error occurs. |
## Details
'FolderCreateDirective' directive needs the id of the parent folder where we want the new folder node to be created. If no value is provided, the '-my-' alias is used.

View File

@@ -27,6 +27,12 @@ Allows folders to be edited.
| ---- | ---- | ------------- | ----------- |
| folder | `MinimalNodeEntryEntity` | | Folder node to edit. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| error | `EventEmitter<any>` | Emitted when an error occurs. |
## Details
'FolderEditDirective' directive needs a selection folder entry of #documentList to open the folder dialog component to edit the name and description properties of that selected folder.

View File

@@ -17,7 +17,7 @@ Activates a file upload.
[versioning]="false"
(success)="customMethod($event)">
</adf-upload-button>
<file-uploading-dialog></file-uploading-dialog>
<adf-file-uploading-dialog></adf-file-uploading-dialog>
```
### Properties

View File

@@ -14,7 +14,7 @@ Adds a drag and drop area to upload files to Alfresco.
DRAG HERE
</div>
</adf-upload-drag-area>
<file-uploading-dialog></file-uploading-dialog>
<adf-file-uploading-dialog></adf-file-uploading-dialog>
```
```ts
@@ -40,3 +40,4 @@ export class AppComponent {
| Name | Description |
| --- | --- |
| success | Raised when the file is uploaded |
| error | Raised when the file upload goes in error |

View File

@@ -22,7 +22,7 @@ import { MatDialogRef } from '@angular/material';
import { BrowserDynamicTestingModule } from '@angular/platform-browser-dynamic/testing';
import { Observable } from 'rxjs/Observable';
import { NodesApiService, NotificationService, TranslationService } from '@alfresco/adf-core';
import { NodesApiService, TranslationService } from '@alfresco/adf-core';
import { FolderDialogComponent } from './folder.dialog';
describe('FolderDialogComponent', () => {
@@ -31,7 +31,6 @@ describe('FolderDialogComponent', () => {
let component: FolderDialogComponent;
let translationService: TranslationService;
let nodesApi: NodesApiService;
let notificationService: NotificationService;
let dialogRef;
beforeEach(async(() => {
@@ -56,7 +55,7 @@ describe('FolderDialogComponent', () => {
// entryComponents are not supported yet on TestBed, that is why this ugly workaround:
// https://github.com/angular/angular/issues/10760
TestBed.overrideModule(BrowserDynamicTestingModule, {
set: {entryComponents: [ FolderDialogComponent ]}
set: { entryComponents: [FolderDialogComponent] }
});
TestBed.compileComponents();
@@ -67,7 +66,6 @@ describe('FolderDialogComponent', () => {
component = fixture.componentInstance;
nodesApi = TestBed.get(NodesApiService);
notificationService = TestBed.get(NotificationService);
translationService = TestBed.get(TranslationService);
spyOn(translationService, 'get').and.returnValue(Observable.of('message'));
@@ -237,33 +235,45 @@ describe('FolderDialogComponent', () => {
expect(component.handleError).toHaveBeenCalled();
expect(dialogRef.close).not.toHaveBeenCalled();
});
});
describe('handleError()', () => {
it('should raise error for 409', () => {
spyOn(notificationService, 'openSnackMessage').and.stub();
describe('Error events ', () => {
it('should raise error for 409', (done) => {
const error = {
message: '{ "error": { "statusCode" : 409 } }'
};
component.handleError(error);
expect(notificationService.openSnackMessage).toHaveBeenCalled();
expect(translationService.get).toHaveBeenCalledWith('CORE.MESSAGES.ERRORS.EXISTENT_FOLDER');
component.error.subscribe((message) => {
expect(message).toBe('CORE.MESSAGES.ERRORS.EXISTENT_FOLDER');
done();
});
it('should raise generic error', () => {
spyOn(notificationService, 'openSnackMessage').and.stub();
spyOn(nodesApi, 'createFolder').and.returnValue(Observable.throw(error));
component.form.controls['name'].setValue('name');
component.form.controls['description'].setValue('description');
component.submit();
});
it('should raise generic error', (done) => {
const error = {
message: '{ "error": { "statusCode" : 123 } }'
};
component.handleError(error);
component.error.subscribe((message) => {
expect(message).toBe('CORE.MESSAGES.ERRORS.GENERIC');
done();
});
expect(notificationService.openSnackMessage).toHaveBeenCalled();
expect(translationService.get).toHaveBeenCalledWith('CORE.MESSAGES.ERRORS.GENERIC');
spyOn(nodesApi, 'createFolder').and.returnValue(Observable.throw(error));
component.form.controls['name'].setValue('name');
component.form.controls['description'].setValue('description');
component.submit();
});
});
});
});

View File

@@ -17,12 +17,12 @@
import { Observable } from 'rxjs/Observable';
import { Component, Inject, OnInit, Optional } from '@angular/core';
import { Component, Inject, OnInit, Optional, EventEmitter, Output } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
import { MinimalNodeEntryEntity } from 'alfresco-js-api';
import { NodesApiService, NotificationService, TranslationService } from '@alfresco/adf-core';
import { NodesApiService, TranslationService } from '@alfresco/adf-core';
import { forbidEndingDot, forbidOnlySpaces, forbidSpecialCharacters } from './folder-name.validators';
@@ -32,15 +32,21 @@ import { forbidEndingDot, forbidOnlySpaces, forbidSpecialCharacters } from './fo
templateUrl: './folder.dialog.html'
})
export class FolderDialogComponent implements OnInit {
form: FormGroup;
folder: MinimalNodeEntryEntity = null;
/** Emitted when the edit/create folder give error for example a folder with same name already exist
*/
@Output()
error: EventEmitter<any> = new EventEmitter<any>();
constructor(
private formBuilder: FormBuilder,
private dialog: MatDialogRef<FolderDialogComponent>,
private nodesApi: NodesApiService,
private translation: TranslationService,
private notification: NotificationService,
@Optional()
@Inject(MAT_DIALOG_DATA)
public data: any
@@ -121,19 +127,17 @@ export class FolderDialogComponent implements OnInit {
}
handleError(error: any): any {
let i18nMessageString = 'CORE.MESSAGES.ERRORS.GENERIC';
let errorMessage = 'CORE.MESSAGES.ERRORS.GENERIC';
try {
const { error: { statusCode } } = JSON.parse(error.message);
if (statusCode === 409) {
i18nMessageString = 'CORE.MESSAGES.ERRORS.EXISTENT_FOLDER';
errorMessage = 'CORE.MESSAGES.ERRORS.EXISTENT_FOLDER';
}
} catch (err) { /* Do nothing, keep the original message */ }
this.translation.get(i18nMessageString).subscribe(message => {
this.notification.openSnackMessage(message, 3000);
});
this.error.emit(this.translation.instant(errorMessage));
return error;
}

View File

@@ -23,6 +23,7 @@ import { MatDialog, MatDialogModule } from '@angular/material';
import { By } from '@angular/platform-browser';
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { Observable } from 'rxjs/Observable';
import { FolderDialogComponent } from '../dialogs/folder.dialog';
import { AppConfigService, DirectiveModule, ContentService, TranslateLoaderService } from '@alfresco/adf-core';
import { FolderCreateDirective } from './folder-create.directive';
@@ -42,11 +43,6 @@ describe('FolderCreateDirective', () => {
let contentService: ContentService;
let dialogRefMock;
const event: any = {
type: 'click',
preventDefault: () => null
};
beforeEach(() => {
TestBed.configureTestingModule({
imports: [
@@ -64,6 +60,7 @@ describe('FolderCreateDirective', () => {
],
declarations: [
TestComponent,
FolderDialogComponent,
FolderCreateDirective
],
providers: [
@@ -90,24 +87,31 @@ describe('FolderCreateDirective', () => {
spyOn(dialog, 'open').and.returnValue(dialogRefMock);
});
it('should emit folderCreate event when input value is not undefined', () => {
xit('should emit folderCreate event when input value is not undefined', (done) => {
spyOn(dialogRefMock, 'afterClosed').and.returnValue(Observable.of(node));
spyOn(contentService.folderCreate, 'next');
contentService.folderCreate.subscribe((val) => {
expect(val).toBe(node);
done();
});
element.triggerEventHandler('click', event);
fixture.detectChanges();
fixture.whenStable().then(() => {
element.nativeElement.click();
});
});
it('should not emit folderCreate event when input value is undefined', () => {
spyOn(dialogRefMock, 'afterClosed').and.returnValue(Observable.of(null));
spyOn(contentService.folderCreate, 'next');
element.triggerEventHandler('click', event);
fixture.detectChanges();
fixture.whenStable().then(() => {
element.nativeElement.click();
expect(contentService.folderCreate.next).not.toHaveBeenCalled();
});
});
});

View File

@@ -17,7 +17,7 @@
/* tslint:disable:no-input-rename */
import { Directive, HostListener, Input } from '@angular/core';
import { Directive, HostListener, Input, Output, EventEmitter } from '@angular/core';
import { MatDialog, MatDialogConfig } from '@angular/material';
import { MinimalNodeEntryEntity } from 'alfresco-js-api';
import { FolderDialogComponent } from '../dialogs/folder.dialog';
@@ -35,6 +35,10 @@ export class FolderCreateDirective {
@Input('adf-create-folder')
parentNodeId: string = DEFAULT_FOLDER_PARENT_ID;
/** Emitted when the create folder give error for example a folder with same name already exist */
@Output()
error: EventEmitter<any> = new EventEmitter<any>();
@HostListener('click', [ '$event' ])
onClick(event) {
event.preventDefault();
@@ -60,6 +64,10 @@ export class FolderCreateDirective {
const { dialogRef, dialogConfig, content } = this;
const dialogInstance = dialogRef.open(FolderDialogComponent, dialogConfig);
dialogInstance.componentInstance.error.subscribe((error) => {
this.error.emit(error);
});
dialogInstance.afterClosed().subscribe((node: MinimalNodeEntryEntity) => {
if (node) {
content.folderCreate.next(node);

View File

@@ -92,11 +92,12 @@ describe('FolderEditDirective', () => {
spyOn(dialog, 'open').and.returnValue(dialogRefMock);
});
it('should emit folderEdit event when input value is not undefined', () => {
xit('should emit folderEdit event when input value is not undefined', (done) => {
spyOn(dialogRefMock, 'afterClosed').and.returnValue(Observable.of(node));
contentService.folderEdit.subscribe((val) => {
expect(val).toBe(node);
done();
});
element.triggerEventHandler('click', event);
@@ -107,9 +108,11 @@ describe('FolderEditDirective', () => {
spyOn(dialogRefMock, 'afterClosed').and.returnValue(Observable.of(null));
spyOn(contentService.folderEdit, 'next');
element.triggerEventHandler('click', event);
fixture.detectChanges();
fixture.whenStable().then(() => {
element.nativeElement.click();
expect(contentService.folderEdit.next).not.toHaveBeenCalled();
});
});
});

View File

@@ -17,7 +17,7 @@
/* tslint:disable:no-input-rename */
import { Directive, ElementRef, HostListener, Input } from '@angular/core';
import { Directive, ElementRef, HostListener, Input, Output, EventEmitter } from '@angular/core';
import { MatDialog, MatDialogConfig } from '@angular/material';
import { MinimalNodeEntryEntity } from 'alfresco-js-api';
@@ -35,6 +35,10 @@ export class FolderEditDirective {
@Input('adf-edit-folder')
folder: MinimalNodeEntryEntity;
/** Emitted when the edit/create folder give error for example a folder with same name already exist */
@Output()
error: EventEmitter<any> = new EventEmitter<any>();
@HostListener('click', [ '$event' ])
onClick(event) {
event.preventDefault();
@@ -63,6 +67,10 @@ export class FolderEditDirective {
const { dialogRef, dialogConfig, content } = this;
const dialogInstance = dialogRef.open(FolderDialogComponent, dialogConfig);
dialogInstance.componentInstance.error.subscribe((error) => {
this.error.emit(error);
});
dialogInstance.afterClosed().subscribe((node: MinimalNodeEntryEntity) => {
if (node) {
content.folderEdit.next(node);

View File

@@ -60,6 +60,7 @@
class="upload-dialog__content"
[class.upload-dialog--padding]="isConfirmation">
<adf-file-uploading-list
(error)="onError($event)"
[class.upload-dialog--hide]="isConfirmation"
#uploadList
[files]="filesUploadingList">

View File

@@ -15,14 +15,17 @@
* limitations under the License.
*/
import { FileModel, FileUploadCompleteEvent, FileUploadDeleteEvent,
FileUploadErrorEvent, FileUploadStatus, UploadService } from '@alfresco/adf-core';
import { ChangeDetectorRef, Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
import {
FileModel, FileUploadCompleteEvent, FileUploadDeleteEvent,
FileUploadErrorEvent, FileUploadStatus, UploadService
} from '@alfresco/adf-core';
import { ChangeDetectorRef, Component, Input, Output, EventEmitter, OnDestroy, OnInit, ViewChild } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Subscription } from 'rxjs/Subscription';
import { FileUploadingListComponent } from './file-uploading-list.component';
import 'rxjs/add/observable/merge';
// @deprecated file-uploading-dialog TODO remove in 3.0.0
@Component({
selector: 'adf-file-uploading-dialog, file-uploading-dialog',
templateUrl: './file-uploading-dialog.component.html',
@@ -36,6 +39,10 @@ export class FileUploadingDialogComponent implements OnInit, OnDestroy {
@Input()
position: string = 'right';
/** Emitted when a file in the list has an error. */
@Output()
error: EventEmitter<any> = new EventEmitter();
filesUploadingList: FileModel[] = [];
isDialogActive: boolean = false;
totalCompleted: number = 0;
@@ -48,9 +55,9 @@ export class FileUploadingDialogComponent implements OnInit, OnDestroy {
private fileUploadSubscription: Subscription;
private errorSubscription: Subscription;
constructor(
private uploadService: UploadService,
private changeDetecor: ChangeDetectorRef) {}
constructor(private uploadService: UploadService,
private changeDetecor: ChangeDetectorRef) {
}
ngOnInit() {
this.listSubscription = this.uploadService
@@ -67,7 +74,7 @@ export class FileUploadingDialogComponent implements OnInit, OnDestroy {
this.uploadService.fileUploadComplete,
this.uploadService.fileUploadDeleted
)
.subscribe((event: (FileUploadDeleteEvent|FileUploadCompleteEvent)) => {
.subscribe((event: (FileUploadDeleteEvent | FileUploadCompleteEvent)) => {
this.totalCompleted = event.totalComplete;
this.changeDetecor.detectChanges();
});

View File

@@ -16,7 +16,7 @@
*/
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { TranslationService, FileUploadStatus, NodesApiService, NotificationService, UploadService } from '@alfresco/adf-core';
import { TranslationService, FileUploadStatus, NodesApiService, UploadService } from '@alfresco/adf-core';
import { Observable } from 'rxjs/Observable';
import { UploadModule } from '../upload.module';
import { FileUploadingListComponent } from './file-uploading-list.component';
@@ -26,7 +26,6 @@ describe('FileUploadingListComponent', () => {
let component: FileUploadingListComponent;
let uploadService: UploadService;
let nodesApiService: NodesApiService;
let notificationService: NotificationService;
let translateService: TranslationService;
let file: any;
@@ -45,13 +44,11 @@ describe('FileUploadingListComponent', () => {
beforeEach(() => {
nodesApiService = TestBed.get(NodesApiService);
uploadService = TestBed.get(UploadService);
notificationService = TestBed.get(NotificationService);
translateService = TestBed.get(TranslationService);
fixture = TestBed.createComponent(FileUploadingListComponent);
component = fixture.componentInstance;
spyOn(translateService, 'get').and.returnValue(Observable.of('some error message'));
spyOn(notificationService, 'openSnackMessage');
spyOn(uploadService, 'cancelUpload');
});
@@ -82,15 +79,6 @@ describe('FileUploadingListComponent', () => {
expect(file.status).toBe(FileUploadStatus.Error);
});
it('should notify fail when api returns error', () => {
spyOn(nodesApiService, 'deleteNode').and.returnValue(Observable.throw(file));
component.removeFile(file);
fixture.detectChanges();
expect(notificationService.openSnackMessage).toHaveBeenCalled();
});
it('should call uploadService on error', () => {
spyOn(nodesApiService, 'deleteNode').and.returnValue(Observable.throw(file));
@@ -108,6 +96,19 @@ describe('FileUploadingListComponent', () => {
expect(uploadService.cancelUpload).toHaveBeenCalled();
});
describe('Events', () => {
it('should throw an error event if delete file goes wrong', (done) => {
spyOn(nodesApiService, 'deleteNode').and.returnValue(Observable.throw(file));
component.error.subscribe(() => {
done();
});
component.removeFile(file);
});
});
});
describe('cancelAllFiles()', () => {
@@ -159,15 +160,6 @@ describe('FileUploadingListComponent', () => {
expect(uploadService.cancelUpload).toHaveBeenCalled();
});
it('should notify on deleting file error', () => {
spyOn(nodesApiService, 'deleteNode').and.returnValue(Observable.throw({}));
component.files[0].status = FileUploadStatus.Complete;
component.cancelAllFiles();
expect(notificationService.openSnackMessage).toHaveBeenCalled();
});
});
describe('isUploadCompleted()', () => {

View File

@@ -15,8 +15,8 @@
* limitations under the License.
*/
import { FileModel, FileUploadStatus, NodesApiService, NotificationService, TranslationService, UploadService } from '@alfresco/adf-core';
import { Component, ContentChild, Input, TemplateRef } from '@angular/core';
import { FileModel, FileUploadStatus, NodesApiService, TranslationService, UploadService } from '@alfresco/adf-core';
import { Component, ContentChild, Input, Output, TemplateRef, EventEmitter } from '@angular/core';
import { Observable } from 'rxjs/Observable';
@Component({
@@ -34,10 +34,13 @@ export class FileUploadingListComponent {
@Input()
files: FileModel[] = [];
/** Emitted when a file in the list has an error. */
@Output()
error: EventEmitter<any> = new EventEmitter();
constructor(
private uploadService: UploadService,
private nodesApi: NodesApiService,
private notificationService: NotificationService,
private translateService: TranslationService) {
}
@@ -130,24 +133,23 @@ export class FileUploadingListComponent {
}
private notifyError(...files: FileModel[]) {
let translateSubscription = null;
let messageError: string = null;
if (files.length === 1) {
translateSubscription = this.translateService
.get(
messageError = this.translateService
.instant(
'FILE_UPLOAD.MESSAGES.REMOVE_FILE_ERROR',
{ fileName: files[0].name}
);
} else {
translateSubscription = this.translateService
.get(
messageError = this.translateService
.instant(
'FILE_UPLOAD.MESSAGES.REMOVE_FILES_ERROR',
{ total: files.length }
);
}
translateSubscription
.subscribe(message => this.notificationService.openSnackMessage(message, 4000));
this.error.emit(messageError);
}
private getUploadingFiles() {

View File

@@ -20,6 +20,7 @@ import { FileModel, LogService, UploadService } from '@alfresco/adf-core';
import { FileDraggableDirective } from '../directives/file-draggable.directive';
import { UploadDragAreaComponent } from './upload-drag-area.component';
import { Observable } from 'rxjs/Observable';
function getFakeShareDataRow(allowableOperations = ['delete', 'update', 'create']) {
return {
@@ -95,7 +96,7 @@ describe('UploadDragAreaComponent', () => {
spyOn(uploadService, 'uploadFilesInTheQueue');
fixture.detectChanges();
const file = <File> {name: 'fake-name-1', size: 10, webkitRelativePath: 'fake-folder1/fake-name-1.json'};
const file = <File> { name: 'fake-name-1', size: 10, webkitRelativePath: 'fake-folder1/fake-name-1.json' };
let filesList = [file];
component.onFilesDropped(filesList);
@@ -115,7 +116,7 @@ describe('UploadDragAreaComponent', () => {
isFile: true,
name: 'file-fake.png',
file: (callbackFile) => {
let fileFake = new File(['fakefake'], 'file-fake.png', {type: 'image/png'});
let fileFake = new File(['fakefake'], 'file-fake.png', { type: 'image/png' });
callbackFile(fileFake);
}
};
@@ -161,7 +162,7 @@ describe('UploadDragAreaComponent', () => {
isFile: true,
name: 'file-fake.png',
file: (callbackFile) => {
let fileFake = new File(['fakefake'], 'file-fake.png', {type: 'image/png'});
let fileFake = new File(['fakefake'], 'file-fake.png', { type: 'image/png' });
callbackFile(fileFake);
}
};
@@ -182,7 +183,7 @@ describe('UploadDragAreaComponent', () => {
uploadService.uploadFilesInTheQueue = jasmine.createSpy('uploadFilesInTheQueue');
fixture.detectChanges();
const file = <File> {name: 'fake-name-1', size: 10, webkitRelativePath: 'fake-folder1/fake-name-1.json'};
const file = <File> { name: 'fake-name-1', size: 10, webkitRelativePath: 'fake-folder1/fake-name-1.json' };
let filesList = [file];
spyOn(uploadService, 'addToQueue').and.callFake((f: FileModel) => {
@@ -205,7 +206,7 @@ describe('UploadDragAreaComponent', () => {
isFile: true,
name: 'file-fake.png',
file: (callbackFile) => {
let fileFake = new File(['fakefake'], 'file-fake.png', {type: 'image/png'});
let fileFake = new File(['fakefake'], 'file-fake.png', { type: 'image/png' });
callbackFile(fileFake);
}
};
@@ -226,7 +227,7 @@ describe('UploadDragAreaComponent', () => {
isFile: true,
name: 'file-fake.png',
file: (callbackFile) => {
let fileFake = new File(['fakefake'], 'file-fake.png', {type: 'image/png'});
let fileFake = new File(['fakefake'], 'file-fake.png', { type: 'image/png' });
callbackFile(fileFake);
}
};
@@ -242,7 +243,7 @@ describe('UploadDragAreaComponent', () => {
isFile: true,
name: 'file-fake.png',
file: (callbackFile) => {
let fileFake = new File(['fakefake'], 'file-fake.png', {type: 'image/png'});
let fileFake = new File(['fakefake'], 'file-fake.png', { type: 'image/png' });
callbackFile(fileFake);
}
};
@@ -262,4 +263,36 @@ describe('UploadDragAreaComponent', () => {
component.onUploadFiles(fakeCustomEvent);
}));
describe('Events', () => {
it('should raise an error if upload a file goes wrong', (done) => {
let fakeItem = {
fullPath: '/folder-fake/file-fake.png',
isDirectory: false,
isFile: true,
name: 'file-fake.png',
file: (callbackFile) => {
let fileFake = new File(['fakefake'], 'file-fake.png', { type: 'image/png' });
callbackFile(fileFake);
}
};
fixture.detectChanges();
spyOn(uploadService, 'fileUploadError').and.returnValue(Observable.throw(new Error()));
component.error.subscribe((error) => {
expect(error).not.toBeNull();
done();
});
let fakeCustomEvent: CustomEvent = new CustomEvent('CustomEvent', {
detail: {
data: getFakeShareDataRow(),
files: [fakeItem]
}
});
component.onUploadFiles(fakeCustomEvent);
});
});
});

View File

@@ -32,7 +32,7 @@ import { Component, EventEmitter, forwardRef, Input, Output, ViewEncapsulation }
templateUrl: './upload-drag-area.component.html',
styleUrls: ['./upload-drag-area.component.css'],
viewProviders: [
{ provide: EXTENDIBLE_COMPONENT, useExisting: forwardRef(() => UploadDragAreaComponent)}
{ provide: EXTENDIBLE_COMPONENT, useExisting: forwardRef(() => UploadDragAreaComponent) }
],
encapsulation: ViewEncapsulation.None
})
@@ -56,6 +56,10 @@ export class UploadDragAreaComponent implements NodePermissionSubject {
@Output()
success = new EventEmitter();
/** Raised when the file upload goes in error. */
@Output()
error = new EventEmitter();
constructor(private uploadService: UploadService,
private translateService: TranslationService,
private notificationService: NotificationService) {
@@ -91,8 +95,8 @@ export class UploadDragAreaComponent implements NodePermissionSubject {
parentId: this.parentId,
path: item.fullPath.replace(item.name, '')
});
this.uploadService.addToQueue(fileModel);
this.uploadService.uploadFilesInTheQueue(this.success);
this.addNodeInUploadQueue([fileModel]);
});
}
}
@@ -112,8 +116,18 @@ export class UploadDragAreaComponent implements NodePermissionSubject {
path: entry.relativeFolder
});
});
this.addNodeInUploadQueue(files);
});
}
}
private addNodeInUploadQueue(files: FileModel[]) {
if (files.length) {
this.uploadService.addToQueue(...files);
this.uploadService.uploadFilesInTheQueue(this.success);
this.uploadService.fileUploadError.subscribe((error) => {
this.error.emit(error);
});
}
}
@@ -133,15 +147,6 @@ export class UploadDragAreaComponent implements NodePermissionSubject {
});
}
/**
* Show the error inside Notification bar
*
* @param Error message
*/
showErrorNotificationBar(errorMessage: string) {
this.notificationService.openSnackMessage(errorMessage, 3000);
}
/** Returns true or false considering the component options and node permissions */
isDroppable(): boolean {
return !this.disabled;
@@ -168,23 +173,11 @@ export class UploadDragAreaComponent implements NodePermissionSubject {
path: fileInfo.relativeFolder,
parentId: parentId
}));
this.uploadFiles(fileModels);
this.addNodeInUploadQueue(fileModels);
}
}
}
/**
* Does the actual file uploading and show the notification
*
* @param files
*/
private uploadFiles(files: FileModel[]): void {
if (files.length) {
this.uploadService.addToQueue(...files);
this.uploadService.uploadFilesInTheQueue(this.success);
}
}
/**
* Check if "create" permission is present on the given node
*

View File

@@ -15,36 +15,41 @@
* limitations under the License.
*/
import { Component, DebugElement } from '@angular/core';
import { Component, DebugElement, ViewChild } from '@angular/core';
import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { AlfrescoApiService } from '../services/alfresco-api.service';
import { NotificationService } from '../services/notification.service';
import { NodeDeleteDirective } from './node-delete.directive';
@Component({
template: `
<div [adf-delete]="selection"
(delete)="done()">
<div id="delete-component" [adf-delete]="selection"
(delete)="onDelete($event)">
</div>`
})
class TestComponent {
selection = [];
done = jasmine.createSpy('done');
@ViewChild(NodeDeleteDirective)
deleteDirective;
onDelete = jasmine.createSpy('onDelete');
}
@Component({
template: `
<div [adf-node-permission]="selection"
<div id="delete-component" [adf-node-permission]="selection"
[adf-delete]="selection"
(delete)="done()">
(delete)="onDelete($event)">
</div>`
})
class TestWithPermissionsComponent {
selection = [];
done = jasmine.createSpy('done');
@ViewChild(NodeDeleteDirective)
deleteDirective;
onDelete = jasmine.createSpy('onDelete');
}
@Component({
@@ -53,18 +58,21 @@ class TestWithPermissionsComponent {
<div id="delete-permanent"
[adf-delete]="selection"
[permanent]="permanent"
(delete)="done()">
(delete)="onDelete($event)">
</div>`
})
class TestDeletePermanentComponent {
selection = [];
@ViewChild(NodeDeleteDirective)
deleteDirective;
permanent = true;
done = jasmine.createSpy('done');
onDelete = jasmine.createSpy('onDelete');
}
describe('NodeDeleteDirective', () => {
describe('NodeleteDirective', () => {
let fixture: ComponentFixture<TestComponent>;
let fixtureWithPermissions: ComponentFixture<TestWithPermissionsComponent>;
let fixtureWithPermanentComponent: ComponentFixture<TestDeletePermanentComponent>;
@@ -75,7 +83,6 @@ describe('NodeDeleteDirective', () => {
let componentWithPermissions: TestWithPermissionsComponent;
let componentWithPermanentDelete: TestDeletePermanentComponent;
let alfrescoApi: AlfrescoApiService;
let notification: NotificationService;
let nodeApi;
beforeEach(async(() => {
@@ -103,54 +110,60 @@ describe('NodeDeleteDirective', () => {
alfrescoApi = TestBed.get(AlfrescoApiService);
nodeApi = alfrescoApi.getInstance().nodes;
notification = TestBed.get(NotificationService);
});
}));
describe('Delete', () => {
beforeEach(() => {
spyOn(notification, 'openSnackMessage');
});
it('should do nothing if selection is empty', () => {
spyOn(nodeApi, 'deleteNode');
component.selection = [];
fixture.detectChanges();
element.triggerEventHandler('click', null);
element.nativeElement.click();
expect(nodeApi.deleteNode).not.toHaveBeenCalled();
});
it('should process node successfully', fakeAsync(() => {
it('should process node successfully', (done) => {
spyOn(nodeApi, 'deleteNode').and.returnValue(Promise.resolve());
component.selection = <any> [{ entry: { id: '1', name: 'name1' } }];
fixture.detectChanges();
element.triggerEventHandler('click', null);
tick();
expect(notification.openSnackMessage).toHaveBeenCalledWith(
component.deleteDirective.delete.subscribe((message) => {
expect(message).toBe(
'CORE.DELETE_NODE.SINGULAR'
);
}));
done();
});
it('should notify failed node deletion', fakeAsync(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
element.nativeElement.click();
});
});
it('should notify failed node deletion', (done) => {
spyOn(nodeApi, 'deleteNode').and.returnValue(Promise.reject('error'));
component.selection = [{ entry: { id: '1', name: 'name1' } }];
fixture.detectChanges();
element.triggerEventHandler('click', null);
tick();
expect(notification.openSnackMessage).toHaveBeenCalledWith(
component.deleteDirective.delete.subscribe((message) => {
expect(message).toBe(
'CORE.DELETE_NODE.ERROR_SINGULAR'
);
}));
done();
});
it('should notify nodes deletion', fakeAsync(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
element.nativeElement.click();
});
});
it('should notify nodes deletion', (done) => {
spyOn(nodeApi, 'deleteNode').and.returnValue(Promise.resolve());
component.selection = [
@@ -158,16 +171,21 @@ describe('NodeDeleteDirective', () => {
{ entry: { id: '2', name: 'name2' } }
];
fixture.detectChanges();
element.triggerEventHandler('click', null);
tick();
expect(notification.openSnackMessage).toHaveBeenCalledWith(
component.deleteDirective.delete.subscribe((message) => {
expect(message).toBe(
'CORE.DELETE_NODE.PLURAL'
);
}));
done();
});
it('should notify failed nodes deletion', fakeAsync(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
element.nativeElement.click();
});
});
it('should notify failed nodes deletion', (done) => {
spyOn(nodeApi, 'deleteNode').and.returnValue(Promise.reject('error'));
component.selection = [
@@ -175,16 +193,21 @@ describe('NodeDeleteDirective', () => {
{ entry: { id: '2', name: 'name2' } }
];
fixture.detectChanges();
element.triggerEventHandler('click', null);
tick();
expect(notification.openSnackMessage).toHaveBeenCalledWith(
component.deleteDirective.delete.subscribe((message) => {
expect(message).toBe(
'CORE.DELETE_NODE.ERROR_PLURAL'
);
}));
done();
});
it('should notify partial deletion when only one node is successful', fakeAsync(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
element.nativeElement.click();
});
});
it('should notify partial deletion when only one node is successful', (done) => {
spyOn(nodeApi, 'deleteNode').and.callFake((id) => {
if (id === '1') {
return Promise.reject('error');
@@ -198,16 +221,21 @@ describe('NodeDeleteDirective', () => {
{ entry: { id: '2', name: 'name2' } }
];
fixture.detectChanges();
element.triggerEventHandler('click', null);
tick();
expect(notification.openSnackMessage).toHaveBeenCalledWith(
component.deleteDirective.delete.subscribe((message) => {
expect(message).toBe(
'CORE.DELETE_NODE.PARTIAL_SINGULAR'
);
}));
done();
});
it('should notify partial deletion when some nodes are successful', fakeAsync(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
element.nativeElement.click();
});
});
it('should notify partial deletion when some nodes are successful', (done) => {
spyOn(nodeApi, 'deleteNode').and.callFake((id) => {
if (id === '1') {
return Promise.reject(null);
@@ -228,26 +256,31 @@ describe('NodeDeleteDirective', () => {
{ entry: { id: '3', name: 'name3' } }
];
fixture.detectChanges();
element.triggerEventHandler('click', null);
tick();
expect(notification.openSnackMessage).toHaveBeenCalledWith(
component.deleteDirective.delete.subscribe((message) => {
expect(message).toBe(
'CORE.DELETE_NODE.PARTIAL_PLURAL'
);
}));
done();
});
fixture.detectChanges();
fixture.whenStable().then(() => {
element.nativeElement.click();
});
});
it('should emit event when delete is done', fakeAsync(() => {
component.done.calls.reset();
component.onDelete.calls.reset();
spyOn(nodeApi, 'deleteNode').and.returnValue(Promise.resolve());
component.selection = <any> [{ entry: { id: '1', name: 'name1' } }];
fixture.detectChanges();
element.triggerEventHandler('click', null);
element.nativeElement.click();
tick();
expect(component.done).toHaveBeenCalled();
expect(component.onDelete).toHaveBeenCalled();
}));
it('should disable the button if no node are selected', fakeAsync(() => {
@@ -303,12 +336,12 @@ describe('NodeDeleteDirective', () => {
fixtureWithPermanentComponent.detectChanges();
componentWithPermanentDelete.selection = [
{ entry: { id: '1', name: 'name1'}
{ entry: { id: '1', name: 'name1' }
];
fixtureWithPermanentComponent.detectChanges();
elementWithPermanentDelete.triggerEventHandler('click', null);
elementWithPermanentDelete.nativeElement.click();
tick();
expect(deleteApi).toHaveBeenCalledWith('1', { permanent: true });
@@ -325,7 +358,7 @@ describe('NodeDeleteDirective', () => {
fixtureWithPermanentComponent.detectChanges();
elementWithPermanentDelete.triggerEventHandler('click', null);
elementWithPermanentDelete.nativeElement.click();
tick();
expect(deleteApi).toHaveBeenCalledWith('1');

View File

@@ -21,7 +21,6 @@ import { Directive, ElementRef, EventEmitter, HostListener, Input, OnChanges, Ou
import { MinimalNodeEntity, MinimalNodeEntryEntity, DeletedNodeEntity, DeletedNodeMinimalEntry } from 'alfresco-js-api';
import { Observable } from 'rxjs/Observable';
import { AlfrescoApiService } from '../services/alfresco-api.service';
import { NotificationService } from '../services/notification.service';
import { TranslationService } from '../services/translation.service';
import 'rxjs/add/observable/fromPromise';
import 'rxjs/observable/forkJoin';
@@ -70,8 +69,7 @@ export class NodeDeleteDirective implements OnChanges {
this.process(this.selection);
}
constructor(private notification: NotificationService,
private alfrescoApiService: AlfrescoApiService,
constructor(private alfrescoApiService: AlfrescoApiService,
private translation: TranslationService,
private elementRef: ElementRef) {
}
@@ -99,11 +97,7 @@ export class NodeDeleteDirective implements OnChanges {
.subscribe((data: ProcessedNodeData[]) => {
const processedItems: ProcessStatus = this.processStatus(data);
this.notify(processedItems);
if (processedItems.someSucceeded) {
this.delete.emit();
}
this.delete.emit(this.getMessage(processedItems));
});
}
}
@@ -174,27 +168,23 @@ export class NodeDeleteDirective implements OnChanges {
);
}
private notify(status) {
this.getMessage(status).subscribe((message) => this.notification.openSnackMessage(message));
}
private getMessage(status): Observable<string> {
private getMessage(status): string {
if (status.allFailed && !status.oneFailed) {
return this.translation.get(
return this.translation.instant(
'CORE.DELETE_NODE.ERROR_PLURAL',
{ number: status.failed.length }
);
}
if (status.allSucceeded && !status.oneSucceeded) {
return this.translation.get(
return this.translation.instant(
'CORE.DELETE_NODE.PLURAL',
{ number: status.success.length }
);
}
if (status.someFailed && status.someSucceeded && !status.oneSucceeded) {
return this.translation.get(
return this.translation.instant(
'CORE.DELETE_NODE.PARTIAL_PLURAL',
{
success: status.success.length,
@@ -204,7 +194,7 @@ export class NodeDeleteDirective implements OnChanges {
}
if (status.someFailed && status.oneSucceeded) {
return this.translation.get(
return this.translation.instant(
'CORE.DELETE_NODE.PARTIAL_SINGULAR',
{
success: status.success.length,
@@ -214,14 +204,14 @@ export class NodeDeleteDirective implements OnChanges {
}
if (status.oneFailed && !status.someSucceeded) {
return this.translation.get(
return this.translation.instant(
'CORE.DELETE_NODE.ERROR_SINGULAR',
{ name: status.failed[0].entry.name }
);
}
if (status.oneSucceeded && !status.someFailed) {
return this.translation.get(
return this.translation.instant(
'CORE.DELETE_NODE.SINGULAR',
{ name: status.success[0].entry.name }
);

View File

@@ -76,7 +76,7 @@ describe('NodeRestoreDirective', () => {
}));
beforeEach(() => {
spyOn(translation, 'get').and.returnValue(Observable.of('message'));
spyOn(translation, 'instant').and.returnValue('message');
});
it('should not restore when selection is empty', () => {
@@ -201,7 +201,7 @@ describe('NodeRestoreDirective', () => {
element.triggerEventHandler('click', null);
tick();
expect(translation.get).toHaveBeenCalledWith(
expect(translation.instant).toHaveBeenCalledWith(
'CORE.RESTORE_NODE.PARTIAL_PLURAL',
{ number: 2 }
);
@@ -221,7 +221,7 @@ describe('NodeRestoreDirective', () => {
element.triggerEventHandler('click', null);
tick();
expect(translation.get).toHaveBeenCalledWith(
expect(translation.instant).toHaveBeenCalledWith(
'CORE.RESTORE_NODE.NODE_EXISTS',
{ name: 'name1' }
);
@@ -241,7 +241,7 @@ describe('NodeRestoreDirective', () => {
element.triggerEventHandler('click', null);
tick();
expect(translation.get).toHaveBeenCalledWith(
expect(translation.instant).toHaveBeenCalledWith(
'CORE.RESTORE_NODE.GENERIC',
{ name: 'name1' }
);
@@ -261,7 +261,7 @@ describe('NodeRestoreDirective', () => {
element.triggerEventHandler('click', null);
tick();
expect(translation.get).toHaveBeenCalledWith(
expect(translation.instant).toHaveBeenCalledWith(
'CORE.RESTORE_NODE.LOCATION_MISSING',
{ name: 'name1' }
);
@@ -288,7 +288,7 @@ describe('NodeRestoreDirective', () => {
element.triggerEventHandler('click', null);
tick();
expect(translation.get).toHaveBeenCalledWith(
expect(translation.instant).toHaveBeenCalledWith(
'CORE.RESTORE_NODE.PLURAL'
);
}));
@@ -305,7 +305,7 @@ describe('NodeRestoreDirective', () => {
element.triggerEventHandler('click', null);
tick();
expect(translation.get).toHaveBeenCalledWith(
expect(translation.instant).toHaveBeenCalledWith(
'CORE.RESTORE_NODE.SINGULAR',
{ name: 'name1' }
);

View File

@@ -51,12 +51,10 @@ export class NodeRestoreDirective {
this.recover(this.selection);
}
constructor(
private alfrescoApiService: AlfrescoApiService,
constructor(private alfrescoApiService: AlfrescoApiService,
private translation: TranslationService,
private router: Router,
private notification: NotificationService
) {
private notification: NotificationService) {
this.restoreProcessStatus = this.processStatus();
}
@@ -109,7 +107,7 @@ export class NodeRestoreDirective {
private getDeletedNodes(): Observable<DeletedNodesPaging> {
const promise = this.alfrescoApiService.getInstance()
.core.nodesApi.getDeletedNodes({ include: [ 'path' ] });
.core.nodesApi.getDeletedNodes({ include: ['path'] });
return Observable.from(promise);
}
@@ -138,10 +136,10 @@ export class NodeRestoreDirective {
private navigateLocation(path: PathInfoEntity) {
const parent = path.elements[path.elements.length - 1];
this.router.navigate([ this.location, parent.id ]);
this.router.navigate([this.location, parent.id]);
}
private diff(selection , list, fromList = true): any {
private diff(selection, list, fromList = true): any {
const ids = selection.map(item => item.entry.id);
return list.filter(item => {
@@ -195,11 +193,11 @@ export class NodeRestoreDirective {
);
}
private getRestoreMessage(): Observable<string|any> {
private getRestoreMessage(): string {
const { restoreProcessStatus: status } = this;
if (status.someFailed && !status.oneFailed) {
return this.translation.get(
return this.translation.instant(
'CORE.RESTORE_NODE.PARTIAL_PLURAL',
{
number: status.fail.length
@@ -209,14 +207,14 @@ export class NodeRestoreDirective {
if (status.oneFailed && status.fail[0].statusCode) {
if (status.fail[0].statusCode === 409) {
return this.translation.get(
return this.translation.instant(
'CORE.RESTORE_NODE.NODE_EXISTS',
{
name: status.fail[0].entry.name
}
);
} else {
return this.translation.get(
return this.translation.instant(
'CORE.RESTORE_NODE.GENERIC',
{
name: status.fail[0].entry.name
@@ -226,7 +224,7 @@ export class NodeRestoreDirective {
}
if (status.oneFailed && !status.fail[0].statusCode) {
return this.translation.get(
return this.translation.instant(
'CORE.RESTORE_NODE.LOCATION_MISSING',
{
name: status.fail[0].entry.name
@@ -235,11 +233,11 @@ export class NodeRestoreDirective {
}
if (status.allSucceeded && !status.oneSucceeded) {
return this.translation.get('CORE.RESTORE_NODE.PLURAL');
return this.translation.instant('CORE.RESTORE_NODE.PLURAL');
}
if (status.allSucceeded && status.oneSucceeded) {
return this.translation.get(
return this.translation.instant(
'CORE.RESTORE_NODE.SINGULAR',
{
name: status.success[0].entry.name
@@ -251,17 +249,13 @@ export class NodeRestoreDirective {
private restoreNotification(): void {
const status = Object.assign({}, this.restoreProcessStatus);
Observable.zip(
this.getRestoreMessage(),
this.translation.get('CORE.RESTORE_NODE.VIEW')
).subscribe((messages) => {
const [ message, actionLabel ] = messages;
const action = (status.oneSucceeded && !status.someFailed) ? actionLabel : '';
let message = this.getRestoreMessage();
const action = (status.oneSucceeded && !status.someFailed) ? this.translation.instant('CORE.RESTORE_NODE.VIEW') : '';
this.notification.openSnackMessageAction(message, action)
.onAction()
.subscribe(() => this.navigateLocation(status.success[0].entry.path));
});
}
private refresh(): void {

View File

@@ -15,7 +15,7 @@
* limitations under the License.
*/
import { AppsProcessService, NotificationService, TranslationService } from '@alfresco/adf-core';
import { AppsProcessService } from '@alfresco/adf-core';
import { Component, Inject } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
@@ -30,8 +30,6 @@ export class SelectAppsDialogComponent {
selectedProcess: any;
constructor(private appsProcessService: AppsProcessService,
private translateService: TranslationService,
private notificationService: NotificationService,
public dialogRef: MatDialogRef<SelectAppsDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any) {
@@ -40,14 +38,8 @@ export class SelectAppsDialogComponent {
this.processApps = apps.filter((currentApp) => {
return currentApp.id;
});
},
(err) => {
this.translateService.get('TAG.MESSAGES.EXIST').subscribe((error) => {
this.notificationService.openSnackMessage(error, 4000);
});
}
);
}
onStart(): void {