[ACS-8863] Add nodeMimeType to keep proper file icon when renditions are generated (#10508)

* [ACS-8863] Add nodeMimeType to keep proper file icon when renditions are generated

* [ACS-8863] Small fix
This commit is contained in:
MichalKinas 2024-12-23 09:56:13 +01:00 committed by GitHub
parent dc7e5c2215
commit d45155bcb2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 44 additions and 5 deletions

View File

@ -89,6 +89,7 @@ See the [Custom layout](#custom-layout) section for full details of all availabl
| urlFile | `string` | "" | If you want to load an external file that does not come from ACS you can use this URL to specify where to load the file from. |
| viewerExtensions | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | Template containing ViewerExtensionDirective instances providing different viewer extensions based on supported file extension. |
| nodeId | `string` | null | Identifier of a node opened by a viewer. |
| nodeMimeType | `string` | undefined | Original node mime type, should be provided when renditiona mime type is different. |
### Events

View File

@ -20,6 +20,7 @@
[hideInfoButton]="hideInfoButton"
[fileName]="fileName"
[mimeType]="mimeType"
[nodeMimeType]="nodeMimeType"
[urlFile]="urlFileContent"
[tracks]="tracks"
[readOnly]="readOnly"

View File

@ -466,7 +466,7 @@ describe('AlfrescoViewerComponent', () => {
});
describe('mimeType', () => {
it('should set mime type based on renditionMimeType rather then nodeData', async () => {
it('should set mime type based on renditionMimeType rather then nodeData and keep proper nodeMimeType', async () => {
const defaultNode: Node = {
id: 'mock-id',
name: 'Mock Node',
@ -499,6 +499,7 @@ describe('AlfrescoViewerComponent', () => {
await fixture.whenStable();
expect(component.mimeType).toEqual('application/pdf');
expect(component.nodeMimeType).toEqual('application/msWord');
});
});

View File

@ -211,6 +211,7 @@ export class AlfrescoViewerComponent implements OnChanges, OnInit {
urlFileContent: string;
fileName: string;
mimeType: string;
nodeMimeType: string;
nodeEntry: NodeEntry;
tracks: Track[] = [];
readOnly: boolean = true;
@ -317,6 +318,7 @@ export class AlfrescoViewerComponent implements OnChanges, OnInit {
private async setUpNodeFile(nodeData: Node, versionData?: Version): Promise<void> {
this.readOnly = !this.contentService.hasAllowableOperations(nodeData, 'update');
let mimeType: string;
let nodeMimeType: string;
let urlFileContent: string;
if (versionData?.content) {
@ -324,6 +326,7 @@ export class AlfrescoViewerComponent implements OnChanges, OnInit {
} else if (nodeData.content) {
mimeType = nodeData.content.mimeType;
}
nodeMimeType = mimeType;
const currentFileVersion = this.nodeEntry?.entry?.properties?.['cm:versionLabel']
? encodeURI(this.nodeEntry?.entry?.properties['cm:versionLabel'])
@ -333,7 +336,6 @@ export class AlfrescoViewerComponent implements OnChanges, OnInit {
urlFileContent = urlFileContent + '&' + currentFileVersion;
const fileExtension = this.viewUtilService.getFileExtension(versionData ? versionData.name : nodeData.name);
this.fileName = versionData ? versionData.name : nodeData.name;
const viewerType = this.viewUtilService.getViewerType(fileExtension, mimeType);
if (viewerType === 'unknown') {
@ -346,7 +348,7 @@ export class AlfrescoViewerComponent implements OnChanges, OnInit {
if (nodeRendition) {
urlFileContent = nodeRendition.url;
const nodeMimeType = nodeData?.content?.mimeType;
nodeMimeType = nodeData?.content?.mimeType;
const renditionMimeType = nodeRendition.mimeType;
mimeType = renditionMimeType || nodeMimeType;
}
@ -355,6 +357,8 @@ export class AlfrescoViewerComponent implements OnChanges, OnInit {
}
this.mimeType = mimeType;
this.nodeMimeType = nodeMimeType;
this.fileName = versionData ? versionData.name : nodeData.name;
this.urlFileContent = urlFileContent + (this.cacheBusterNumber ? '&' + this.cacheBusterNumber : '');
this.sidebarRightTemplateContext.node = nodeData;
this.sidebarLeftTemplateContext.node = nodeData;

View File

@ -35,6 +35,7 @@ import { ViewerWithCustomSidebarComponent } from './mock/adf-viewer-container-si
import { ViewerWithCustomToolbarActionsComponent } from './mock/adf-viewer-container-toolbar-actions.component.mock';
import { ViewerWithCustomToolbarComponent } from './mock/adf-viewer-container-toolbar.component.mock';
import { ViewerComponent } from './viewer.component';
import { ThumbnailService } from '@alfresco/adf-core';
@Component({
selector: 'adf-dialog-dummy',
@ -49,6 +50,7 @@ describe('ViewerComponent', () => {
let dialog: MatDialog;
let viewUtilService: ViewUtilService;
let appConfigService: AppConfigService;
let thumbnailService: ThumbnailService;
beforeEach(() => {
TestBed.configureTestingModule({
@ -72,6 +74,7 @@ describe('ViewerComponent', () => {
dialog = TestBed.inject(MatDialog);
viewUtilService = TestBed.inject(ViewUtilService);
appConfigService = TestBed.inject(AppConfigService);
thumbnailService = TestBed.inject(ThumbnailService);
component.fileName = 'test-file.pdf';
appConfigService.config = {
@ -97,6 +100,27 @@ describe('ViewerComponent', () => {
expect(component.mimeType).toBe('image/png');
});
it('should set mimeTypeIconUrl when mimeType changes and no nodeMimeType is provided', () => {
spyOn(thumbnailService, 'getMimeTypeIcon').and.returnValue('image/png');
const mockSimpleChanges: any = { mimeType: { currentValue: 'image/png' }, nodeMimeType: undefined };
component.ngOnChanges(mockSimpleChanges);
expect(thumbnailService.getMimeTypeIcon).toHaveBeenCalledWith('image/png');
expect(component.mimeTypeIconUrl).toBe('image/png');
});
it('should set mimeTypeIconUrl when nodeMimeType changes', () => {
spyOn(thumbnailService, 'getMimeTypeIcon').and.returnValue('application/pdf');
const mockSimpleChanges: any = { mimeType: { currentValue: 'image/png' }, nodeMimeType: { currentValue: 'application/pdf' } };
component.ngOnChanges(mockSimpleChanges);
fixture.detectChanges();
expect(thumbnailService.getMimeTypeIcon).toHaveBeenCalledWith('application/pdf');
expect(component.mimeTypeIconUrl).toBe('application/pdf');
});
});
describe('File Name Test', () => {

View File

@ -244,6 +244,10 @@ export class ViewerComponent<T> implements OnDestroy, OnInit, OnChanges {
@Input()
nodeId: string = null;
/** Original node mime type, should be provided when renditiona mime type is different. */
@Input()
nodeMimeType: string = undefined;
/**
* Enable dialog box to allow user to download the previewed file, in case the preview is not responding for a set period of time.
*/
@ -303,7 +307,7 @@ export class ViewerComponent<T> implements OnDestroy, OnInit, OnChanges {
) {}
ngOnChanges(changes: SimpleChanges) {
const { blobFile, urlFile, mimeType } = changes;
const { blobFile, urlFile, mimeType, nodeMimeType } = changes;
if (blobFile?.currentValue) {
this.mimeType = blobFile.currentValue.type;
@ -314,9 +318,13 @@ export class ViewerComponent<T> implements OnDestroy, OnInit, OnChanges {
this.fileName ||= this.viewUtilsService.getFilenameFromUrl(urlFile.currentValue);
}
if (mimeType?.currentValue) {
if (mimeType?.currentValue && !nodeMimeType?.currentValue) {
this.mimeTypeIconUrl = this.thumbnailService.getMimeTypeIcon(mimeType.currentValue);
}
if (nodeMimeType?.currentValue) {
this.mimeTypeIconUrl = this.thumbnailService.getMimeTypeIcon(nodeMimeType.currentValue);
}
}
ngOnInit(): void {