FORMS-16112 review comment and move fragment template code to server-…

…side
adobe · Nov 13, 2024 · 6c0614f · 6c0614f
1 parent aa04649
commit 6c0614f
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 27 deletions.
diff --git a/...ot/apps/core/fd/components/form/container/v1/container/clientlibs/editor/js/editDialog.js b/...ot/apps/core/fd/components/form/container/v1/container/clientlibs/editor/js/editDialog.js
@@ -234,7 +234,7 @@
         });
     }
 
-    const initialiseDataModel = window.CQ.FormsCoreComponents.Utils.DataModel.initialiseDataModel;
+    const initialiseDataModel = window.CQ.FormsCoreComponents.Utils.DataModel.v2?.initialiseDataModel || window.CQ.FormsCoreComponents.Utils.DataModel.initialiseDataModel;
 
     Utils.initializeEditDialog(EDIT_DIALOG_FORM)(handleAsyncSubmissionAndThankYouOption, handleSubmitAction,
         registerSubmitActionSubDialogClientLibs, registerRestEndPointDialogClientlibs, registerFDMDialogClientlibs, registerEmailDialogClientlibs, initialiseDataModel, registerAutoSaveDialogAction);

diff --git a/...core/fd/components/form/container/v2/container/clientlibs/editorhook/js/componentutils.js b/...core/fd/components/form/container/v2/container/clientlibs/editorhook/js/componentutils.js
@@ -15,6 +15,9 @@
  ******************************************************************************/
 (function (window, author, Coral, channel) {
     "use strict";
+    window.CQ = window.CQ || {};
+    window.CQ.FormsCoreComponents = window.CQ.FormsCoreComponents || {};
+    window.CQ.FormsCoreComponents.editorhooks =  window.CQ.FormsCoreComponents.editorhooks || {};
 
     /**
      * Send a request to replace an existing component
@@ -182,4 +185,23 @@
         return result.responseJSON;
     };
 
+    function getFormContainerFromDom(editable) {
+        let selector = "[data-cmp-is='adaptiveFormContainer']";
+        let elem = $(editable.dom[0]).closest(selector);
+        let path = null;
+        if (elem.length > 0) {
+            path = elem.data("cmp-path");
+        }
+        return path;
+    }
+
+    window.CQ.FormsCoreComponents.editorhooks.getFormContainerPath = (editable) => {
+        let path = editable.dom.find("[data-cmp-adaptiveformcontainer-path]").data("cmpAdaptiveformcontainerPath");
+        if (typeof path !== 'string' || !path) {
+            path = getFormContainerFromDom(editable);
+
+        }
+        return path;
+    }
+
 })(window, Granite.author, Coral, jQuery(document));
diff --git a/.../core/fd/components/form/container/v2/container/clientlibs/editorhook/js/fragmentshook.js b/.../core/fd/components/form/container/v2/container/clientlibs/editorhook/js/fragmentshook.js
@@ -28,20 +28,20 @@
         return fieldType === "panel";
     }
 
-    const fragmentCreationDialogConfig = function (componentPath) {
+    const fragmentCreationDialogConfig = function (editable) {
         const path = `/mnt/overlay/${FRAGMENT_CREATION_DIALOG_PATH}`;
         return {
-            src : path + componentPath + '?resourceType=' + encodeURIComponent(FRAGMENT_CREATION_DIALOG_PATH),
+            src : Granite.HTTP.externalize(path + editable.path + "?formContainerPath=" + window.CQ.FormsCoreComponents.editorhooks.getFormContainerPath(editable)),
             isFloating : false,
             loadingMode : "auto",
             layout : "auto"
         };
     };
 
-    const fragmentCreationDialogDef = (componentPath) =>  {
+    const fragmentCreationDialogDef = (editable) =>  {
         return {
             getConfig : function getConfig() {
-                return fragmentCreationDialogConfig(componentPath);
+                return fragmentCreationDialogConfig(editable);
             },
             getRequestedData : function getRequestedData() {
                 return {
@@ -62,7 +62,7 @@
 
 
     window.CQ.FormsCoreComponents.editorhooks.saveAsFragment = function (editable) {
-        const saveAsFragmentDialog = new ns.ui.Dialog(fragmentCreationDialogDef(editable.path));
+        const saveAsFragmentDialog = new ns.ui.Dialog(fragmentCreationDialogDef(editable));
         ns.DialogFrame.openDialog(function getDialog() {
             saveAsFragmentDialog.editable = editable;
             return saveAsFragmentDialog;

diff --git a/...core/fd/components/form/container/v2/container/clientlibs/editorhook/js/ruleeditorhook.js b/...core/fd/components/form/container/v2/container/clientlibs/editorhook/js/ruleeditorhook.js
@@ -31,11 +31,11 @@
             }
             let ruleEditorFrame = document.createElement('iframe');
             ruleEditorFrame.setAttribute('id', 'af-rule-editor');
-            let formContainerPath = getFormContainerPath(editable);
+            let formContainerPath = window.CQ.FormsCoreComponents.editorhooks.getFormContainerPath (editable);
             if (!formContainerPath) {
                 showAlert();
             } else {
-                const ruleEditorUri = '/aem/af/expeditor.html' + getFormContainerPath(editable) + "?fieldPath=" + editable.path + "&fieldId=" + getFieldId(editable);
+                const ruleEditorUri = '/aem/af/expeditor.html' + window.CQ.FormsCoreComponents.editorhooks.getFormContainerPath(editable) + "?fieldPath=" + editable.path + "&fieldId=" + getFieldId(editable);
                 ruleEditorFrame.setAttribute('src', ruleEditorUri);
                 ruleEditorFrame.setAttribute('title', 'AF Rule Editor');
                 const styles = {
@@ -54,25 +54,6 @@
         }
     }
 
-    function getFormContainerPath(editable) {
-        let path = editable.dom.find("[data-cmp-adaptiveformcontainer-path]").data("cmpAdaptiveformcontainerPath");
-        if (typeof path !== 'string' || !path) {
-            path = getFormContainerFromDom(editable);
-
-        }
-        return path;
-    }
-
-    function getFormContainerFromDom(editable) {
-        let selector = "[data-cmp-is='adaptiveFormContainer']";
-        let elem = $(editable.dom[0]).closest(selector);
-        let path = null;
-        if (elem.length > 0) {
-            path = elem.data("cmp-path");
-        }
-        return path;
-    }
-
     function getFieldId(editable) {
         return editable.dom.find("[data-cmp-adaptiveformcontainer-path]").attr('id');
     }