Edit Contentlet: Allow File Preview

core-web/libs/contenttype-fields/src/lib/fields/binary-field/binary-field.component.stories.ts

@@ -10,10 +10,7 @@ import { ButtonModule } from 'primeng/button';
 import { DialogModule } from 'primeng/dialog';
 import { InputTextModule } from 'primeng/inputtext';
 
-import { delay } from 'rxjs/operators';
-
 import { DotLicenseService, DotMessageService, DotUploadService } from '@dotcms/data-access';
-import { CoreWebService, CoreWebServiceMock } from '@dotcms/dotcms-js';
 import {
     DotContentThumbnailComponent,
     DotDropZoneComponent,
@@ -58,12 +55,11 @@ export default {
                 DotContentThumbnailComponent
             ],
             providers: [
-                { provide: CoreWebService, useClass: CoreWebServiceMock },
                 DotBinaryFieldStore,
                 {
                     provide: DotLicenseService,
                     useValue: {
-                        isEnterprise: () => of(true).pipe(delay(1000))
+                        isEnterprise: () => of(true)
                     }
                 },
                 {

core-web/libs/contenttype-fields/src/lib/fields/binary-field/components/dot-binary-field-preview/dot-binary-field-preview.component.spec.ts

@@ -27,6 +27,15 @@ const fileText: BinaryFile = {
     inode: '123'
 };
 
+const fileUnknown: BinaryFile = {
+    mimeType: 'unknown',
+    name: 'test.txt',
+    fileSize: 1234,
+    content: 'This is a text file but the mime type is unknown',
+    url: 'http://example.com/test.txt',
+    inode: '123'
+};
+
 describe('DotBinaryFieldPreviewComponent', () => {
     let spectator: Spectator<DotBinaryFieldPreviewComponent>;
     const createComponent = createComponentFactory({
@@ -77,6 +86,35 @@ describe('DotBinaryFieldPreviewComponent', () => {
                 expect(spy).toHaveBeenCalled();
             });
         });
+
+        describe('when file is a unknown file', () => {
+            beforeEach(() => {
+                spectator.setInput('file', fileUnknown);
+                spectator.detectChanges();
+            });
+
+            it('should emit editFile event when edit button is clicked', () => {
+                const spy = jest.spyOn(spectator.component.editFile, 'emit');
+                const editButton = spectator.query(byTestId('edit-button'));
+                spectator.click(editButton);
+                expect(spy).toHaveBeenCalled();
+            });
+
+            it('should have edit button if it has content', () => {
+                const editButton = spectator.query(byTestId('edit-button'));
+                expect(editButton).toBeTruthy();
+            });
+
+            it('should not have edit button if it does not have content', () => {
+                spectator.setInput('file', {
+                    ...fileUnknown,
+                    content: ''
+                });
+                spectator.detectChanges();
+                const editButton = spectator.query(byTestId('edit-button'));
+                expect(editButton).not.toBeTruthy();
+            });
+        });
     });
 
     describe('editableImage', () => {

core-web/libs/contenttype-fields/src/lib/fields/binary-field/components/dot-binary-field-preview/dot-binary-field-preview.component.ts

@@ -22,7 +22,8 @@ import { BinaryFile } from '../../interfaces';
 
 export enum EDITABLE_FILE {
     image = 'image',
-    text = 'text'
+    text = 'text',
+    unknown = 'unknown'
 }
 
 type EDITABLE_FILE_FUNCTION_MAP = {
@@ -54,10 +55,11 @@ export class DotBinaryFieldPreviewComponent implements OnChanges {
 
     private readonly EDITABLE_FILE_FUNCTION_MAP: EDITABLE_FILE_FUNCTION_MAP = {
         [EDITABLE_FILE.image]: () => this.editableImage,
-        [EDITABLE_FILE.text]: () => !!this.file?.content
+        [EDITABLE_FILE.text]: () => !!this.file?.content,
+        [EDITABLE_FILE.unknown]: () => !!this.file?.content
     };
     private contenttype: EDITABLE_FILE;
-    isEditable = true;
+    isEditable = false;
 
     get dotThumbnailOptions(): DotThumbnailOptions {
         return {
@@ -92,7 +94,7 @@ export class DotBinaryFieldPreviewComponent implements OnChanges {
 
     private setIsEditable() {
         const type = this.file.mimeType?.split('/')[0];
-        this.contenttype = EDITABLE_FILE[type];
-        this.isEditable = this.EDITABLE_FILE_FUNCTION_MAP[this.contenttype]?.();
+        this.contenttype = EDITABLE_FILE[type] || EDITABLE_FILE.unknown;
+        this.isEditable = this.EDITABLE_FILE_FUNCTION_MAP[this.contenttype]();
     }
 }