diff --git a/docs/core/components/viewer.component.md b/docs/core/components/viewer.component.md index e05fd3ed625..6597e20d046 100644 --- a/docs/core/components/viewer.component.md +++ b/docs/core/components/viewer.component.md @@ -70,6 +70,7 @@ See the [Custom layout](#custom-layout) section for full details of all availabl | canNavigateNext | `boolean` | true | Toggles the next (">") button. Requires `allowNavigate` to be enabled. | | fileName | `string` | | Override Content filename. | | mimeType | `string` | | Overload mimeType | +| originalMimeType | `string` | | Overload originalMimeType | | overlayMode | `boolean` | false | If `true` then show the Viewer as a full page over the current content. Otherwise fit inside the parent div. | | readOnly | `boolean` | true | Enable when where is possible the editing functionalities | | showLeftSidebar | `boolean` | false | Toggles left sidebar visibility. Requires `allowLeftSidebar` to be set to `true`. | @@ -113,6 +114,7 @@ You can provide custom file parameters, for example a value for the `mimeType` o [fileName]="fileName" [allowGoBack]="false" [mimeType]="mimeType" + [originalMimeType]="originalMimeType" [urlFile]="fileUrl"> ``` diff --git a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.html b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.html index e16d5f09f09..2103fb55c00 100644 --- a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.html +++ b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.html @@ -18,6 +18,7 @@ [sidebarLeftTemplateContext]="sidebarLeftTemplateContext" [fileName]="fileName" [mimeType]="mimeType" + [originalMimeType]="originalMimeType" [urlFile]="urlFileContent" [tracks]="tracks" [readOnly]="readOnly" diff --git a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.spec.ts b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.spec.ts index 62aafd0f364..70130e0ffc0 100644 --- a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.spec.ts +++ b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.spec.ts @@ -476,6 +476,42 @@ describe('AlfrescoViewerComponent', () => { // }); + describe('originalMimeType', () => { + it('should set originalMimeType based on nodeData content', async () => { + const defaultNode: Node = { + id: 'mock-id', + name: 'Mock Node', + nodeType: 'cm:content', + isFolder: false, + isFile: true, + modifiedAt: new Date(), + modifiedByUser: { id: 'user123', displayName: 'John Doe' }, + createdAt: new Date(), + createdByUser: { id: 'user456', displayName: 'Jane Doe' }, + properties: { 'cm:versionLabel': 'mock-version-label' } + }; + component.nodeEntry = { entry: defaultNode }; + component.nodeId = '123'; + spyOn(renditionService, 'getNodeRendition').and.returnValue( + Promise.resolve({ + url: '', + mimeType: '' + }) + ); + + fixture.detectChanges(); + nodesApiService.nodeUpdated.next({ + id: '123', + name: 'file2', + content: { + mimeType: 'application/msWord' + } + } as any); + await fixture.whenStable(); + expect(component.originalMimeType).toEqual('application/msWord'); + }); + }); + describe('Toolbar', () => { it('should show only next file button', async () => { component.allowNavigate = true; diff --git a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts index ca168c66076..edc4a313c79 100644 --- a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts +++ b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts @@ -192,6 +192,7 @@ export class AlfrescoViewerComponent implements OnChanges, OnInit, OnDestroy { urlFileContent: string; fileName: string; mimeType: string; + originalMimeType: string; nodeEntry: NodeEntry; tracks: Track[] = []; readOnly: boolean = true; @@ -328,6 +329,7 @@ export class AlfrescoViewerComponent implements OnChanges, OnInit, OnDestroy { if (nodeRendition) { urlFileContent = nodeRendition.url; mimeType = nodeRendition.mimeType; + this.originalMimeType = nodeData?.content?.mimeType; } } else if (viewerType === 'media') { this.tracks = await this.renditionService.generateMediaTracksRendition(this.nodeId); diff --git a/lib/core/src/lib/viewer/components/viewer.component.html b/lib/core/src/lib/viewer/components/viewer.component.html index b8fdccfd22b..343485d8ca6 100644 --- a/lib/core/src/lib/viewer/components/viewer.component.html +++ b/lib/core/src/lib/viewer/components/viewer.component.html @@ -44,8 +44,8 @@ navigate_before {{ fileName }} diff --git a/lib/core/src/lib/viewer/components/viewer.component.spec.ts b/lib/core/src/lib/viewer/components/viewer.component.spec.ts index 7a44cf1c6c8..1784e1a753b 100644 --- a/lib/core/src/lib/viewer/components/viewer.component.spec.ts +++ b/lib/core/src/lib/viewer/components/viewer.component.spec.ts @@ -115,6 +115,38 @@ describe('ViewerComponent', () => { }); + describe('originalMimeType', () => { + const getMimeTypeIconElement = () => fixture.nativeElement.querySelector('.adf-viewer__mimeicon'); + + it('should set alt attribute to originalMimeType when originalMimeType is provided', () => { + component.originalMimeType = 'image/png'; + fixture.detectChanges(); + const altAttribute: string = getMimeTypeIconElement().getAttribute('alt'); + expect(altAttribute).toBe('image/png'); + }); + + it('should set src attribute based on originalMimeType when originalMimeType is provided', () => { + component.originalMimeType = 'image'; + fixture.detectChanges(); + const srcAttribute: string = getMimeTypeIconElement().getAttribute('src'); + expect(srcAttribute).toContain('image'); + }); + + it('should set alt attribute to mimeType when originalMimeType is not provided', () => { + component.mimeType = 'application/pdf'; + fixture.detectChanges(); + const altAttribute: string = getMimeTypeIconElement().getAttribute('alt'); + expect(altAttribute).toBe('application/pdf'); + }); + + it('should set src attribute based on mimeType when originalMimeType is not provided', () => { + component.mimeType = 'image'; + fixture.detectChanges(); + const srcAttribute: string = getMimeTypeIconElement().getAttribute('src'); + expect(srcAttribute).toContain('image'); + }); + }); + describe('File Name Test', () => { it('should fileName be set by urlFile input if the fileName is not provided as Input', () => { diff --git a/lib/core/src/lib/viewer/components/viewer.component.ts b/lib/core/src/lib/viewer/components/viewer.component.ts index 75955ceec7e..b4ce06dfe23 100644 --- a/lib/core/src/lib/viewer/components/viewer.component.ts +++ b/lib/core/src/lib/viewer/components/viewer.component.ts @@ -160,6 +160,10 @@ export class ViewerComponent implements OnDestroy, OnInit, OnChanges { @Input() mimeType: string; + /** Overload originalMimeType*/ + @Input() + originalMimeType: string; + /** * Context object available for binding by the local sidebarRightTemplate with let declarations. */