From 3f45e7b35d1af9f347242561d8dcf104228038bc Mon Sep 17 00:00:00 2001 From: dhrn <14145706+dhrn@users.noreply.github.com> Date: Wed, 25 Mar 2020 16:36:40 +0530 Subject: [PATCH] [ACA-2368] UI Issues while editing Metadata in the Preview Page #1091 (#5562) * [ACA-2368] UI Issues while editing Metadata in the Preview Page #1091 * tslint fxed * [ACA-2368] UI Issues while editing Metadata in the Preview Page #1091 * * revert commits * Revert "* revert commits" This reverts commit fd0e86084cc4ac14870d9008400528f63a681c59. * * unit test added --- .../content-metadata.component.html | 2 ++ .../content-metadata.component.spec.ts | 30 ++++++++++++++++- .../content-metadata.component.ts | 6 ++++ .../components/viewer.component.spec.ts | 33 +++++++++++++++++++ .../viewer/components/viewer.component.ts | 5 ++- 5 files changed, 74 insertions(+), 2 deletions(-) diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html index e59987eb9c..550f78c295 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html @@ -11,6 +11,7 @@ @@ -30,6 +31,7 @@ diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts index 52430368e9..9025822b81 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts @@ -352,7 +352,6 @@ describe('ContentMetadataComponent', () => { expect(defaultProp.componentInstance.expanded).toBeTruthy(); expect(exifProp.componentInstance.expanded).toBeFalsy(); expect(customProp.componentInstance.expanded).toBeFalsy(); - })); it('should not expand anything if input is wrong', async(() => { @@ -370,6 +369,35 @@ describe('ContentMetadataComponent', () => { })); }); + + describe('events', () => { + it('should not propagate the event on left arrows press', () => { + fixture.detectChanges(); + const event = { keyCode: 37, stopPropagation: () => {} }; + spyOn(event, 'stopPropagation').and.stub(); + const element = fixture.debugElement.query(By.css('adf-card-view')); + element.triggerEventHandler('keydown', event); + expect(event.stopPropagation).toHaveBeenCalled(); + }); + + it('should not propagate the event on right arrows press', () => { + fixture.detectChanges(); + const event = { keyCode: 39, stopPropagation: () => {} }; + spyOn(event, 'stopPropagation').and.stub(); + const element = fixture.debugElement.query(By.css('adf-card-view')); + element.triggerEventHandler('keydown', event); + expect(event.stopPropagation).toHaveBeenCalled(); + }); + + it('should propagate the event on other keys press', () => { + fixture.detectChanges(); + const event = { keyCode: 40, stopPropagation: () => {} }; + spyOn(event, 'stopPropagation').and.stub(); + const element = fixture.debugElement.query(By.css('adf-card-view')); + element.triggerEventHandler('keydown', event); + expect(event.stopPropagation).not.toHaveBeenCalled(); + }); + }); }); function queryDom(fixture: ComponentFixture, properties: string = 'properties') { diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts index dfdafda85b..007c3b2e19 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts @@ -174,4 +174,10 @@ export class ContentMetadataComponent implements OnChanges, OnInit, OnDestroy { return !this.expanded || this.displayAspect === 'Properties'; } + keyDown(event: KeyboardEvent) { + if (event.keyCode === 37 || event.keyCode === 39) { // ArrowLeft && ArrowRight + event.stopPropagation(); + } + } + } diff --git a/lib/core/viewer/components/viewer.component.spec.ts b/lib/core/viewer/components/viewer.component.spec.ts index edf32477e8..d1072300cd 100644 --- a/lib/core/viewer/components/viewer.component.spec.ts +++ b/lib/core/viewer/components/viewer.component.spec.ts @@ -377,6 +377,39 @@ describe('ViewerComponent', () => { expect(component.fileTitle).toBe('file2'); })); + it('should update node only if node name changed', fakeAsync(() => { + spyOn(alfrescoApiService.nodesApi, 'getNode').and.returnValues( + Promise.resolve(new NodeEntry({ entry: { name: 'file1', content: {} } })) + ); + spyOn(alfrescoApiService.contentApi, 'getContentUrl').and.returnValues('http://iam-fake.url'); + spyOn(component, 'getViewerTypeByExtension').and.returnValue('pdf'); + + component.urlFile = null; + component.displayName = null; + component.blobFile = null; + component.showViewer = true; + + component.nodeId = 'id1'; + fixture.detectChanges(); + component.ngOnChanges(); + tick(); + + expect(component.fileTitle).toBe('file1'); + + alfrescoApiService.nodeUpdated.next( { id: 'id1', name: 'file2' }); + fixture.detectChanges(); + expect(component.fileTitle).toBe('file2'); + + alfrescoApiService.nodeUpdated.next( { id: 'id1', name: 'file3' }); + fixture.detectChanges(); + expect(component.fileTitle).toBe('file3'); + + alfrescoApiService.nodeUpdated.next( { id: 'id2', name: 'file4' }); + fixture.detectChanges(); + expect(component.fileTitle).toBe('file3'); + expect(component.nodeId).toBe('id1'); + })); + describe('Viewer Example Component Rendering', () => { it('should use custom toolbar', (done) => { diff --git a/lib/core/viewer/components/viewer.component.ts b/lib/core/viewer/components/viewer.component.ts index 077f0db74b..158fd424b1 100644 --- a/lib/core/viewer/components/viewer.component.ts +++ b/lib/core/viewer/components/viewer.component.ts @@ -31,6 +31,7 @@ import { ViewerToolbarComponent } from './viewer-toolbar.component'; import { Subscription } from 'rxjs'; import { ViewUtilService } from '../services/view-util.service'; import { AppExtensionService, ViewerExtensionRef } from '@alfresco/adf-extensions'; +import { filter } from 'rxjs/operators'; @Component({ selector: 'adf-viewer', @@ -249,7 +250,9 @@ export class ViewerComponent implements OnChanges, OnInit, OnDestroy { ngOnInit() { this.subscriptions.push( - this.apiService.nodeUpdated.subscribe((node) => this.onNodeUpdated(node)) + this.apiService.nodeUpdated.pipe( + filter((node) => node && node.id === this.nodeId && node.name !== this.fileName) + ).subscribe((node) => this.onNodeUpdated(node)) ); this.loadExtensions();