MC-3052: Architectural Review for MC-2294

- Updated with feedback

Author: nathanjosiah

app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/banner/preview.js

@@ -97,39 +97,12 @@ export default class Preview extends BasePreview {
 
             // Create uploader
             this.uploader = new Uploader(
-                this.parent.id,
                 "imageuploader_" + this.parent.id,
-                Object.assign({}, this.config.additional_data.uploaderConfig, {
-                    value: initialImageValue,
-                }),
+                this.config.additional_data.uploaderConfig,
+                this.parent.id,
+                this.parent.dataStore,
+                (initialImageValue as object[]),
             );
-
-            // Register listener when image gets uploaded from uploader UI component
-            this.uploader.onUploaded(this.onImageUploaded.bind(this));
-            // Register listener when image gets deleted from uploader UI component
-            this.uploader.onDeleted(this.onImageDeleted.bind(this));
         });
     }
-
-    /**
-     * Update image data inside data store
-     *
-     * @param {Array} data - list of each files' data
-     */
-    private onImageUploaded(data: object[]) {
-        this.parent.dataStore.update(
-            data,
-            this.config.additional_data.uploaderConfig.dataScope,
-        );
-    }
-
-    /**
-     * Remove image data
-     */
-    private onImageDeleted() {
-        this.parent.dataStore.update(
-            "",
-            this.config.additional_data.uploaderConfig.dataScope,
-        );
-    }
 }

app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/image/preview.js

@@ -45,39 +45,12 @@ export default class Preview extends BasePreview {
 
             // Create uploader
             this.uploader = new Uploader(
-                this.parent.id,
                 "imageuploader_" + this.parent.id,
-                Object.assign({}, this.config.additional_data.uploaderConfig, {
-                    value: initialImageValue,
-                }),
+                this.config.additional_data.uploaderConfig,
+                this.parent.id,
+                this.parent.dataStore,
+                (initialImageValue as object[]),
             );
-
-            // Register listener when image gets uploaded from uploader UI component
-            this.uploader.onUploaded(this.onImageUploaded.bind(this));
-            // Register listener when image gets deleted from uploader UI component
-            this.uploader.onDeleted(this.onImageDeleted.bind(this));
         });
     }
-
-    /**
-     * Update image data inside data store
-     *
-     * @param {Array} data - list of each files' data
-     */
-    private onImageUploaded(data: object[]) {
-        this.parent.dataStore.update(
-            data,
-            this.config.additional_data.uploaderConfig.dataScope,
-        );
-    }
-
-    /**
-     * Remove image data
-     */
-    private onImageDeleted() {
-        this.parent.dataStore.update(
-            "",
-            this.config.additional_data.uploaderConfig.dataScope,
-        );
-    }
 }

app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/slide/preview.js

@@ -407,17 +407,12 @@ export default class Preview extends BasePreview {
 
             // Create uploader
             this.uploader = new Uploader(
-                this.parent.id,
                 "imageuploader_" + this.parent.id,
-                Object.assign({}, this.config.additional_data.uploaderConfig, {
-                    value: initialImageValue,
-                }),
+                this.config.additional_data.uploaderConfig,
+                this.parent.id,
+                this.parent.dataStore,
+                initialImageValue,
             );
-
-            // Register listener when image gets uploaded from uploader UI component
-            this.uploader.onUploaded(this.onImageUploaded.bind(this));
-            // Register listener when image gets deleted from uploader UI component
-            this.uploader.onDeleted(this.onImageDeleted.bind(this));
         });
     }
 
@@ -436,26 +431,4 @@ export default class Preview extends BasePreview {
         }
         return styles;
     }
-
-    /**
-     * Update image data inside data store
-     *
-     * @param {Array} data - list of each files' data
-     */
-    private onImageUploaded(data: object[]) {
-        this.parent.dataStore.update(
-            data,
-            this.config.additional_data.uploaderConfig.dataScope,
-        );
-    }
-
-    /**
-     * Remove image data
-     */
-    private onImageDeleted() {
-        this.parent.dataStore.update(
-            "",
-            this.config.additional_data.uploaderConfig.dataScope,
-        );
-    }
 }