dev: allow save when Binary Field is required (#27358)

dotCMS · Jan 18, 2024 · b5a86b8 · b5a86b8
1 parent da07e12
commit b5a86b8
Show file tree

Hide file tree

Showing 8 changed files with 44 additions and 58 deletions.
diff --git a/.../edit-content/src/lib/components/dot-edit-content-form/dot-edit-content-form.component.ts b/.../edit-content/src/lib/components/dot-edit-content-form/dot-edit-content-form.component.ts
@@ -79,6 +79,10 @@ export class DotEditContentFormComponent implements OnInit {
     initilizeForm() {
         this.form = this.fb.group({});
 
+        this.form.valueChanges.subscribe((value) => {
+            this.onFormChange(value);
+        });
+
         this.formData.fields.forEach((field) => {
             if (Object.values(FILTERED_TYPES).includes(field.fieldType as FILTERED_TYPES)) {
                 return;
@@ -87,10 +91,6 @@ export class DotEditContentFormComponent implements OnInit {
             const fieldControl = this.initializeFormControl(field);
             this.form.addControl(field.variable, fieldControl);
         });
-
-        this.form.valueChanges.subscribe((value) => {
-            this.onFormChange(value);
-        });
     }
 
     /**

diff --git a/.../lib/fields/dot-edit-content-binary-field/dot-edit-content-binary-field.component.spec.ts b/.../lib/fields/dot-edit-content-binary-field/dot-edit-content-binary-field.component.spec.ts
@@ -33,8 +33,6 @@ import { DotBinaryFieldStore } from './store/binary-field.store';
 import { getUiMessage } from './utils/binary-field-utils';
 import { CONTENTTYPE_FIELDS_MESSAGE_MOCK, FIELD, fileMetaData } from './utils/mock';
 
-import { BINARY_FIELD_CONTENTLET } from '../../utils/mocks';
-
 const TEMP_FILE_MOCK: DotCMSTempFile = {
     fileName: 'image.png',
     folder: '/images',
@@ -62,6 +60,13 @@ const DROP_ZONE_FILE_EVENT: DropZoneFileEvent = {
     validity
 };
 
+const MOCK_DOTCMS_FILE = {
+    ...dotcmsContentletMock,
+    binaryField: '12345',
+    baseType: 'CONTENT',
+    binaryFieldMetaData: fileMetaData
+};
+
 describe('DotEditContentBinaryFieldComponent', () => {
     let spectator: Spectator<DotEditContentBinaryFieldComponent>;
     let store: DotBinaryFieldStore;
@@ -128,11 +133,11 @@ describe('DotEditContentBinaryFieldComponent', () => {
         expect(spyEmit).toHaveBeenCalledWith(TEMP_FILE_MOCK.id);
     });
 
-    it('should not emit new value is is equal to current inode', () => {
-        spectator.setInput('contentlet', BINARY_FIELD_CONTENTLET);
+    it('should not emit new value is is equal to current value', () => {
+        spectator.setInput('contentlet', MOCK_DOTCMS_FILE);
         const spyEmit = jest.spyOn(spectator.component.valueUpdated, 'emit');
         spectator.detectChanges();
-        store.setValue(BINARY_FIELD_CONTENTLET.inode);
+        store.setValue(MOCK_DOTCMS_FILE.binaryField);
         expect(spyEmit).not.toHaveBeenCalled();
     });
 
@@ -368,18 +373,17 @@ describe('DotEditContentBinaryFieldComponent', () => {
                 const spy = jest
                     .spyOn(store, 'setFileFromContentlet')
                     .mockReturnValue(of(null).subscribe());
-                const mockFileAsset = {
-                    ...dotcmsContentletMock,
+                const mock = {
+                    ...MOCK_DOTCMS_FILE,
                     baseType: 'FILEASSET',
-                    metaData: {
-                        ...fileMetaData
-                    }
+                    metaData: fileMetaData
                 };
-                spectator.setInput('contentlet', mockFileAsset);
+                spectator.setInput('contentlet', mock);
                 spectator.detectChanges();
                 expect(spy).toHaveBeenCalledWith({
-                    ...mockFileAsset,
-                    fieldVariable: FIELD.variable
+                    ...mock,
+                    fieldVariable: FIELD.variable,
+                    value: mock[FIELD.variable]
                 });
             });
         });
@@ -389,19 +393,13 @@ describe('DotEditContentBinaryFieldComponent', () => {
                 const spy = jest
                     .spyOn(store, 'setFileFromContentlet')
                     .mockReturnValue(of(null).subscribe());
-                const metaDataKey = `${FIELD.variable}MetaData`;
-                const mockFileAsset = {
-                    ...dotcmsContentletMock,
-                    baseType: 'CONTENT',
-                    [metaDataKey]: {
-                        ...fileMetaData
-                    }
-                };
-                spectator.setInput('contentlet', mockFileAsset);
+                const variable = FIELD.variable;
+                spectator.setInput('contentlet', MOCK_DOTCMS_FILE);
                 spectator.detectChanges();
                 expect(spy).toHaveBeenCalledWith({
-                    ...mockFileAsset,
-                    fieldVariable: FIELD.variable
+                    ...MOCK_DOTCMS_FILE,
+                    fieldVariable: variable,
+                    value: MOCK_DOTCMS_FILE[variable]
                 });
             });
         });

diff --git a/...t/src/lib/fields/dot-edit-content-binary-field/dot-edit-content-binary-field.component.ts b/...t/src/lib/fields/dot-edit-content-binary-field/dot-edit-content-binary-field.component.ts
@@ -118,6 +118,10 @@ export class DotEditContentBinaryFieldComponent
         return isFileAsset ? 'metaData' : this.variable + 'MetaData';
     }
 
+    get value(): string {
+        return this.contentlet?.[this.variable] ?? this.field.defaultValue;
+    }
+
     get maxFileSize(): number {
         return this.DotBinaryFieldValidatorService.maxFileSize;
     }
@@ -140,7 +144,7 @@ export class DotEditContentBinaryFieldComponent
         this.dotBinaryFieldStore.value$
             .pipe(
                 skip(1),
-                filter((value) => value !== this.contentlet?.inode)
+                filter((value) => value !== this.value)
             )
             .subscribe((value) => {
                 this.tempId = value; // If the value changes, it means that a new file was uploaded
@@ -166,20 +170,19 @@ export class DotEditContentBinaryFieldComponent
 
     ngAfterViewInit() {
         this.setFieldVariables();
-        if (this.existFileMetadata()) {
+        if (this.value) {
             this.dotBinaryFieldStore.setFileFromContentlet({
                 ...this.contentlet,
+                value: this.value,
                 fieldVariable: this.variable
             });
         }
 
         this.cd.detectChanges();
     }
 
-    writeValue(): void {
-        /*
-            We can set a value here but we use the fields and contentlet to set the value
-        */
+    writeValue(value: string): void {
+        this.dotBinaryFieldStore.setValue(value);
     }
 
     registerOnChange(fn: (value: string) => void) {
@@ -351,15 +354,4 @@ export class DotEditContentBinaryFieldComponent
 
         this.dotBinaryFieldStore.invalidFile(uiMessage);
     }
-
-    /**
-     * Check if file metadata exist
-     *
-     * @private
-     * @return {*}  {boolean}
-     * @memberof DotEditContentBinaryFieldComponent
-     */
-    private existFileMetadata(): boolean {
-        return !!this.contentlet && !!this.contentlet[this.metaDataKey];
-    }
 }
diff --git a/...dit-content/src/lib/fields/dot-edit-content-binary-field/store/binary-field.store.spec.ts b/...dit-content/src/lib/fields/dot-edit-content-binary-field/store/binary-field.store.spec.ts
@@ -96,7 +96,7 @@ describe('DotBinaryFieldStore', () => {
 
             store.vm$.subscribe((state) => {
                 expect(state.contentlet).toEqual(BINARY_FIELD_CONTENTLET);
-                expect(state.value).toEqual(BINARY_FIELD_CONTENTLET.inode);
+                expect(state.value).toEqual(BINARY_FIELD_CONTENTLET.value);
                 done();
             });
         });

diff --git a/...ibs/edit-content/src/lib/fields/dot-edit-content-binary-field/store/binary-field.store.ts b/...ibs/edit-content/src/lib/fields/dot-edit-content-binary-field/store/binary-field.store.ts
@@ -75,7 +75,7 @@ export class DotBinaryFieldStore extends ComponentStore<BinaryFieldState> {
         ...state,
         contentlet,
         status: BinaryFieldStatus.PREVIEW,
-        value: contentlet.inode
+        value: contentlet?.value || ''
     }));
 
     readonly setTempFile = this.updater<DotCMSTempFile>((state, tempFile) => ({

diff --git a/core-web/libs/edit-content/src/lib/fields/dot-edit-content-binary-field/utils/mock.ts b/core-web/libs/edit-content/src/lib/fields/dot-edit-content-binary-field/utils/mock.ts
@@ -182,11 +182,11 @@ export const FIELD = {
     indexed: false,
     listed: false,
     modDate: 1698153564000,
-    name: 'Binary Field2',
+    name: 'Binary Field',
     readOnly: false,
     required: false,
     searchable: false,
     sortOrder: 2,
     unique: false,
-    variable: 'binaryField2'
+    variable: 'binaryField'
 };
diff --git a/core-web/libs/edit-content/src/lib/utils/mocks.ts b/core-web/libs/edit-content/src/lib/utils/mocks.ts
@@ -605,7 +605,8 @@ export const BINARY_FIELD_CONTENTLET: DotCMSContentlet = {
         '/dA/d135b73a-8c8f-42ce-bd4e-deb3c067cedd/binaryField/Screenshot 2023-11-03 at 11.53.40â\u0080¯AM.png',
     __icon__: 'contentIcon',
     contentTypeIcon: 'event_note',
-    variant: 'DEFAULT'
+    variant: 'DEFAULT',
+    value: '/dA/39de8193694d96c2a6bab783ba9c85b5/binaryField/Screenshot 2023-11-03 at 11.53.40â\u0080¯AM.png'
 };
 
 export const FIELDS_WITH_CONTENTLET_MOCK: {

diff --git a/dotCMS/src/main/webapp/html/portlet/ext/contentlet/field/edit_field.jsp b/dotCMS/src/main/webapp/html/portlet/ext/contentlet/field/edit_field.jsp
@@ -757,6 +757,7 @@
                         }
                     }).then(response => response.json())
                     .then(({ contentlets }) => {
+                        const contentlet = contentlets[0];
                         const field = document.querySelector('#binary-field-input-<%=field.getFieldContentlet()%>ValueField');
                         const variable = "<%=field.getVelocityVarName()%>";
                         const fielData = {
@@ -776,17 +777,11 @@
                         binaryField.setAttribute("fieldName", "<%=field.getVelocityVarName()%>");
 
                         binaryField.field = fielData;
-                        binaryField.contentlet = contentlets[0];
+                        binaryField.contentlet = contentlet;
                         binaryField.imageEditor = true;
 
                         binaryField.addEventListener('valueUpdated', ({ detail }) => {
-                            // If the value is different from the contentlet's inode, then we need to update the value
-                            // Binary field in JSP Expect the current value to be a path to the file.
-                            // Not the inode of the contentlet. Since we have the reference to the contentlet
-                            // We update the value is the inode is different from the contentlet's inode.
-                            if (detail !== contentlets[0].inode) {
-                                field.value = detail;
-                            }
+                            field.value = detail;
                         });
 
                         binaryFieldContainer.innerHTML = '';