From ff11aec7fe2752c2b1ea862e5e7e844d777e40fb Mon Sep 17 00:00:00 2001
From: Stephen Abello <stephen.abello@combodo.com>
Date: Mon, 12 Jan 2026 10:34:57 +0100
Subject: [PATCH] Make clone dashlet ask for a rendered dashlet to the backend

---
 js/layouts/dashboard/dashboard-grid.js            | 10 ++++------
 js/layouts/dashboard/dashboard.js                 |  2 +-
 .../base/layouts/dashlet-panel/layout.js.twig     | 15 +++++++++------
 3 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/js/layouts/dashboard/dashboard-grid.js b/js/layouts/dashboard/dashboard-grid.js
index e051e03ba..1ca92b52d 100644
--- a/js/layouts/dashboard/dashboard-grid.js
+++ b/js/layouts/dashboard/dashboard-grid.js
@@ -89,7 +89,7 @@ class IboGrid extends HTMLElement {
 		const oParser = new DOMParser();
 		const oDocument = oParser.parseFromString(sDashlet, 'text/html');
 		const oNewDashlet = oDocument.body.firstChild;
-		debugger;
+
 		// Can't use oNewDashet.sDashletId as it's not in the DOM yet and connectedCallback hasn't been called yet
 		const oExistingDashlet = this.GetDashletElement(oNewDashlet.getAttribute('data-dashlet-id') );
 		oExistingDashlet.replaceWith(oNewDashlet);
@@ -103,11 +103,9 @@ class IboGrid extends HTMLElement {
 				const sWidth = oSlot.iWidth;
 				const sHeight = oSlot.iHeight;
 
-				// TODO 3.3: Should ask a rendered dashlet for its content to avoid duplicating IDs
-				// Still we'll position it automatically and take care of height/width
-
-				const sDashletContent = oSlot.oDashlet.innerHTML;
-				this.AddDashlet(sDashletContent, {
+				// Ask a new rendered dashlet to avoid duplicating IDs
+				// Still we'll copy width and height
+				this.closest('ibo-dashboard')?.AddNewDashlet(oSlot.oDashlet.sType, oSlot.oDashlet.formData, {
 					'w': sWidth,
 					'h': sHeight
 				});
diff --git a/js/layouts/dashboard/dashboard.js b/js/layouts/dashboard/dashboard.js
index 5b10548e4..5d070fa8d 100644
--- a/js/layouts/dashboard/dashboard.js
+++ b/js/layouts/dashboard/dashboard.js
@@ -83,7 +83,7 @@ class IboDashboard extends HTMLElement {
 		}
 	}
 
-	AddNewDashlet(sDashletClass, aDashletOptions = {}) {
+	AddNewDashlet(sDashletClass, sDashletValues, aDashletOptions = {}) {
 		const sNewDashletUrl = GetAbsoluteUrlAppRoot() + '/pages/UI.php?route=dashboard.get_dashlet&dashlet_class='+encodeURIComponent(sDashletClass);
 		fetch(sNewDashletUrl)
 			.then(async data => {
diff --git a/templates/base/layouts/dashlet-panel/layout.js.twig b/templates/base/layouts/dashlet-panel/layout.js.twig
index 2b06b7b60..89afc9944 100644
--- a/templates/base/layouts/dashlet-panel/layout.js.twig
+++ b/templates/base/layouts/dashlet-panel/layout.js.twig
@@ -3,11 +3,14 @@
     $('#{{ oUIBlock.GetId() }} .ibo-dashlet-entry').on('click', (event) => {
         const sDashletClass = event.currentTarget.getAttribute('data-dashlet-class');
         const oDashboard = document.querySelector('ibo-dashboard');
-        oDashboard.AddNewDashlet(sDashletClass, {
-            'minW': event.currentTarget.getAttribute('data-min-width'),
-            'minH': event.currentTarget.getAttribute('data-min-height'),
-            'w': event.currentTarget.getAttribute('data-preferred-width'),
-            'h': event.currentTarget.getAttribute('data-preferred-height')
-        });
+        oDashboard.AddNewDashlet(sDashletClass,
+                {},
+                {
+                    'minW': event.currentTarget.getAttribute('data-min-width'),
+                    'minH': event.currentTarget.getAttribute('data-min-height'),
+                    'w': event.currentTarget.getAttribute('data-preferred-width'),
+                    'h': event.currentTarget.getAttribute('data-preferred-height')
+                }
+        );
     });
 })();
\ No newline at end of file