UI form refactoring

cms-api/src/main/java/com/condation/cms/api/ui/elements/ContentTypes.java

@@ -69,6 +69,9 @@ public Set<SectionTemplate> getSectionTemplates (String section) {
 				.filter(template -> template.section().equals(section))
 				.collect(Collectors.toSet());
 	}
+	public Set<SectionTemplate> getSectionTemplates () {
+		return new HashSet<>(sectionTemplates);
+	}
 
 	public static record PageTemplate(String name, String template, Map<String, Object> data) {
 

modules/ui-module/src/main/java/com/condation/cms/modules/ui/extensionpoints/UiTemplateModelExtension.java

@@ -80,18 +80,9 @@ public String editMeta (String editor, String element, String uri, String toolba
 			);
 		}
 
+
 		public String toolbar (String id, String type, String[] actions) {
-			if (!requestContext.has(IsPreviewFeature.class)) {
-				return "";
-			}
-			Map<String, Object> toolbar = Map.of(
-					"id", id,
-					"type", type,
-					"actions", actions
-			);
-			return " data-cms-toolbar='%s'  ".formatted(
-					JSONUtil.toJson(toolbar)
-			);
+			return toolbar(id, type, actions, Map.of());
 		}
 		public String toolbar (String id, String type, String[] actions, Map<String, Object> additional) {
 			if (!requestContext.has(IsPreviewFeature.class)) {
@@ -109,16 +100,7 @@ public String toolbar (String id, String type, String[] actions, Map<String, Obj
 			);
 		}
 		public String toolbar (String id, String uri) {
-			if (!requestContext.has(IsPreviewFeature.class)) {
-				return "";
-			}
-			Map<String, Object> toolbar = Map.of(
-					"id", id,
-					"uri", uri
-			);
-			return " data-cms-toolbar='%s'  ".formatted(
-					JSONUtil.toJson(toolbar)
-			);
+			return toolbar(id, uri, new String[0]);
 		}
 
 		public String mediaToolbar (String [] actions, Map<String, Object> options) {

modules/ui-module/src/main/java/com/condation/cms/modules/ui/extensionpoints/remotemethods/RemoteManagerEnpoints.java

@@ -33,6 +33,7 @@
 import com.condation.cms.api.ui.rpc.RPCException;
 import com.condation.cms.content.RenderContext;
 import com.condation.cms.modules.ui.utils.TokenUtils;
+import com.google.common.base.Strings;
 import java.time.Duration;
 
 /**
@@ -69,7 +70,11 @@ public Object getMediaFormats (Map<String, Object> parameters) throws RPCExcepti
 	public Object getSectionTemplates(Map<String, Object> parameters) throws RPCException {
 		try {
 			var section = (String) parameters.getOrDefault("section", "");
-			return uiHooks().contentTypes().getSectionTemplates(section);
+			if (!Strings.isNullOrEmpty(section)) {
+				return uiHooks().contentTypes().getSectionTemplates(section);
+			} else {
+				return uiHooks().contentTypes().getSectionTemplates();
+			}
 		} catch (Exception e) {
 			log.error("", e);
 			throw new RPCException(0, e.getMessage());

modules/ui-module/src/main/java/com/condation/cms/modules/ui/services/RemoteMethodService.java

@@ -32,6 +32,7 @@
 import com.condation.cms.api.ui.annotations.RemoteMethod;
 import com.condation.cms.auth.services.AuthorizationService;
 import com.condation.cms.auth.services.User;
+import java.util.Collections;
 import java.util.function.Function;
 import lombok.RequiredArgsConstructor;
 
@@ -76,7 +77,10 @@ public Object execute (final Map<String, Object> parameters, User user) {
 			if (!RemoteMethodService.authorizationService.hasAnyPermission(user, remoteMethodAnnotation.permissions())) {
 				throw new RemoteMethodException("access not allowed");
 			}
-			return function.apply(parameters);
+			if (parameters != null) {
+				return function.apply(parameters);
+			}
+			return function.apply(Collections.emptyMap());
 		};
 	}
 

modules/ui-module/src/main/resources/manager/actions/page/edit-metaattribute-form.d.ts

@@ -0,0 +1,22 @@
+/*-
+ * #%L
+ * ui-module
+ * %%
+ * Copyright (C) 2023 - 2026 CondationCMS
+ * %%
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ * 
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ * 
+ * You should have received a copy of the GNU General Public
+ * License along with this program.  If not, see
+ * <http://www.gnu.org/licenses/gpl-3.0.html>.
+ * #L%
+ */
+export function runAction(params: any): Promise<void>;

modules/ui-module/src/main/resources/manager/actions/page/edit-metaattribute-form.js

@@ -0,0 +1,89 @@
+/*-
+ * #%L
+ * ui-module
+ * %%
+ * Copyright (C) 2023 - 2025 CondationCMS
+ * %%
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public
+ * License along with this program.  If not, see
+ * <http://www.gnu.org/licenses/gpl-3.0.html>.
+ * #L%
+ */
+import { createForm } from '@cms/modules/form/forms.js';
+import { showToast } from '@cms/modules/toast.js';
+import { getPreviewUrl, reloadPreview } from '@cms/modules/preview.utils.js';
+import { buildValuesFromFields, getValueByPath } from '@cms/modules/node.js';
+import { getContentNode, getContent, setMeta } from '@cms/modules/rpc/rpc-content.js';
+import { i18n } from '@cms/modules/localization.js';
+import { openSidebar } from '@cms/modules/sidebar.js';
+import { getPageTemplates, getSectionTemplates } from '@cms/modules/rpc/rpc-manager';
+// hook.js
+export async function runAction(params) {
+    var uri = null;
+    if (params.uri) {
+        uri = params.uri;
+    }
+    else {
+        const contentNode = await getContentNode({
+            url: getPreviewUrl()
+        });
+        uri = contentNode.result.uri;
+    }
+    const getContentResponse = await getContent({
+        uri: uri
+    });
+    var templates = null;
+    if (params.type === "section") {
+        templates = (await getSectionTemplates()).result;
+    }
+    else {
+        templates = (await getPageTemplates()).result;
+    }
+    var selected = templates.filter(item => item.template === getContentResponse?.result?.meta?.template);
+    var attrForm = [];
+    if (selected.length === 1) {
+        attrForm = selected[0].data?.forms[params.form] ? selected[0].data.forms[params.form].fields : [];
+    }
+    //const previewMetaForm = getMetaForm()
+    const fields = [
+        ...attrForm
+    ];
+    const values = {
+        ...buildValuesFromFields(attrForm, getContentResponse?.result?.meta)
+    };
+    const form = createForm({
+        fields: fields,
+        values: values
+    });
+    openSidebar({
+        title: 'Edit meta attribute',
+        body: 'modal body',
+        form: form,
+        resizable: true,
+        onCancel: (event) => { },
+        onOk: async (event) => {
+            var updateData = form.getData();
+            var setMetaResponse = await setMeta({
+                uri: uri,
+                meta: updateData
+            });
+            showToast({
+                title: i18n.t('manager.actions.page.edit-metaattribute-list.toast.title', "MetaData updated"),
+                message: i18n.t('manager.actions.page.edit-metaattribute-list.toast.message', "The metadata has been updated successfully."),
+                type: 'success', // optional: info | success | warning | error
+                timeout: 3000
+            });
+            reloadPreview();
+        }
+    });
+}

modules/ui-module/src/main/resources/manager/actions/page/edit-page-settings.js

@@ -66,7 +66,7 @@ export async function runAction(params) {
     var selected = pageTemplates.filter(pageTemplate => pageTemplate.template === getContentResponse?.result?.meta?.template);
     var pageSettingsForm = [];
     if (selected.length === 1) {
-        pageSettingsForm = selected[0].data?.forms?.settings ? selected[0].data.forms.settings : [];
+        pageSettingsForm = selected[0].data?.forms?.settings ? selected[0].data.forms.settings.fields : [];
     }
     //const previewMetaForm = getMetaForm()
     const fields = [

modules/ui-module/src/main/resources/manager/js/modules/form/field.list.js

@@ -105,12 +105,12 @@ const getItemForm = async (el) => {
     const fieldName = listContainer?.getAttribute('name');
     var itemForm = [];
     if (selected.length === 1) {
-        itemForm = (fieldName && selected[0].data?.forms[fieldName]) ? selected[0].data.forms[fieldName] : [];
+        itemForm = (fieldName && selected[0].data?.forms[fieldName]) ? selected[0].data.forms[fieldName].fields : [];
     }
     if (!itemForm || itemForm.length === 0) {
         let itemTypes = (await getListItemTypes({})).result;
         var selectedItemType = itemTypes.filter(itemType => itemType.name === fieldName);
-        itemForm = (selectedItemType.length === 1) ? selectedItemType[0].data?.form : [];
+        itemForm = (selectedItemType.length === 1) ? selectedItemType[0].data?.form.fields : [];
     }
     return itemForm;
 };

modules/ui-module/src/main/resources/manager/js/modules/form/field.markdown.js

@@ -30,7 +30,7 @@ const createMarkdownField = (options, value = '') => {
     const key = "field." + options.name;
     const title = i18n.t(key, options.title);
     return `
-		<div class="mb-3 cms-form-field flex-grow-1" data-cms-form-field-type="markdown" style="min-height: 0;">
+		<div class="mb-3 cms-form-field flex-grow-1" data-cms-form-field-type="markdown">
 			<label class="form-label" cms-i18n-key="${key}">${title}</label>
 			<div id="${id}" class="cherry-editor-container" style="min-height: ${options.height || '300px'}; border: 1px solid #ccc;"></div>
 			<input type="hidden" name="${options.name}" data-cherry-id="${id}" data-initial-value="${encodeURIComponent(value)}">

modules/ui-module/src/main/resources/manager/js/modules/manager/manager.message.handlers.js

@@ -68,12 +68,14 @@ const initMessageHandlers = () => {
         }
         else if (payload.element === "meta" && payload.editor === "form") {
             var cmd = {
-                "module": window.manager.baseUrl + "/actions/page/edit-metaattribute-list",
+                "module": window.manager.baseUrl + "/actions/page/edit-metaattribute-form",
                 "function": "runAction",
                 "parameters": {
                     "editor": payload.editor,
                     "attributes": payload.metaElements,
-                    "options": payload.options ? payload.options : {}
+                    "options": payload.options ? payload.options : {},
+                    "form": payload.form,
+                    "type": payload.type
                 }
             };
             if (payload.uri) {

modules/ui-module/src/main/resources/manager/js/modules/manager/toolbar.inject.js

@@ -89,25 +89,31 @@ const editAttributes = (event) => {
         type: 'edit',
         payload: {
             editor: "form",
-            element: "meta"
+            element: "meta",
+            form: toolbarDefinition.form ? toolbarDefinition.form : "attributes",
+            type: toolbarDefinition.type
         }
     };
     if (toolbarDefinition.uri) {
         command.payload.uri = toolbarDefinition.uri;
     }
-    var elements = [];
-    toolbar.parentNode.querySelectorAll("[data-cms-editor]").forEach(($elem) => {
+    // legay old style to collect all meta elements for the form editor
+    /*
+    var elements = []
+    toolbar.parentNode.querySelectorAll("[data-cms-editor]").forEach(($elem : HTMLElement) => {
         var toolbar = $elem.dataset.cmsToolbar ? JSON.parse($elem.dataset.cmsToolbar) : {};
         if ($elem.dataset.cmsElement === "meta"
-            && (!toolbar.id || toolbar.id === toolbarDefinition.id)) {
+            && (!toolbar.id || toolbar.id === toolbarDefinition.id)
+        ) {
             elements.push({
                 name: $elem.dataset.cmsMetaElement,
                 editor: $elem.dataset.cmsEditor,
                 options: $elem.dataset.cmsEditorOptions ? JSON.parse($elem.dataset.cmsEditorOptions) : {}
-            });
+            })
         }
-    });
-    command.payload.metaElements = elements;
+    })
+    command.payload.metaElements = elements
+    */
     frameMessenger.send(window.parent, command);
 };
 export const initToolbar = (container) => {

modules/ui-module/src/main/resources/manager/js/modules/rpc/rpc-manager.js

@@ -23,35 +23,35 @@ import { executeRemoteCall } from '@cms/modules/rpc/rpc.js';
 const getSectionTemplates = async (options) => {
     var data = {
         method: "manager.contentTypes.sections",
-        parameters: options
+        parameters: options || {}
     };
     return await executeRemoteCall(data);
 };
 const getPageTemplates = async (options) => {
     var data = {
         method: "manager.contentTypes.pages",
-        parameters: options
+        parameters: options || {}
     };
     return await executeRemoteCall(data);
 };
 const getListItemTypes = async (options) => {
     var data = {
         method: "manager.contentTypes.listItemTypes",
-        parameters: options
+        parameters: options || {}
     };
     return await executeRemoteCall(data);
 };
 const getMediaForm = async (options) => {
     var data = {
         method: "manager.media.form",
-        parameters: options
+        parameters: options || {}
     };
     return await executeRemoteCall(data);
 };
 const createCSRFToken = async (options) => {
     var data = {
         method: "manager.token.createCSRF",
-        parameters: options
+        parameters: options || {}
     };
     return await executeRemoteCall(data);
 };

modules/ui-module/src/main/ts/dist/actions/page/edit-metaattribute-form.d.ts

@@ -0,0 +1 @@
+export function runAction(params: any): Promise<void>;