Integrate Element Templates Runtime Versions

CHANGELOG.md

@@ -12,6 +12,17 @@ ___Note:__ Yet to be released changes appear here._
 * `DEPS`: update to `@bpmn-io/[email protected]`
 * `DEPS`: update to `@camunda/[email protected]`
 * `DEPS`: update to `@camunda/[email protected]`
+* `DEPS`: update to `@camunda/[email protected]`
+* `DEPS`: update to `[email protected]`
+* `DEPS`: update to `[email protected]`
+* `DEPS`: update to `[email protected]`
+
+### BPMN
+
+* `FEAT`: element templates runtime versions ([#4530](https://github.com/camunda/camunda-modeler/issues/4530))
+* `FEAT`: make "Zeebe user task" the default implementation of user task ([camunda/camunda-bpmn-js-behaviors#86](https://github.com/camunda/camunda-bpmn-js-behaviors/pull/86))
+* `FEAT`: rename "Zeebe user task" to "Camunda user task" ([bpmn-io/bpmn-js-properties-panel#1097](https://github.com/bpmn-io/bpmn-js-properties-panel/pull/1097))
+* `FIX`: move template selector right below documentation group ([bpmn-io/bpmn-js-element-templates#130](https://github.com/bpmn-io/bpmn-js-element-templates/pull/130))
 
 ### Forms
 

client/package.json

@@ -29,11 +29,11 @@
     "@sentry/browser": "^8.0.0",
     "@sentry/integrations": "^7.108.0",
     "bpmn-js": "^18.1.1",
-    "bpmn-js-element-templates": "^2.2.1",
-    "bpmn-js-properties-panel": "^5.28.0",
+    "bpmn-js-element-templates": "^2.4.0",
+    "bpmn-js-properties-panel": "^5.30.0",
     "bpmn-js-tracking": "^0.6.0",
     "bpmn-moddle": "^9.0.1",
-    "camunda-bpmn-js": "^5.2.2",
+    "camunda-bpmn-js": "^5.3.0",
     "camunda-bpmn-moddle": "^7.0.1",
     "camunda-cmmn-moddle": "^1.0.0",
     "camunda-dmn-js": "^3.0.0",

client/src/app/tabs/cloud-bpmn/BpmnEditor.js

@@ -82,6 +82,8 @@ export class BpmnEditor extends CachedComponent {
     this.ref = React.createRef();
     this.propertiesPanelRef = React.createRef();
 
+    this.handleEngineProfileChangeDebounced = debounce(this.handleEngineProfileChange);
+
     this.engineProfile = new EngineProfileHelper({
       get: () => {
         const modeler = this.getModeler();
@@ -109,7 +111,10 @@ export class BpmnEditor extends CachedComponent {
         });
       },
       getCached: () => this.getCached(),
-      setCached: (state) => this.setCached(state)
+      setCached: (state) => {
+        this.handleEngineProfileChangeDebounced(state);
+        this.setCached(state);
+      }
     });
 
     this.handleResize = debounce(this.handleResize);
@@ -202,7 +207,6 @@ export class BpmnEditor extends CachedComponent {
 
       propertiesPanel.setLayout(this.props.layout.propertiesPanel);
     }
-
   }
 
   listen(fn) {
@@ -245,6 +249,20 @@ export class BpmnEditor extends CachedComponent {
     });
   }
 
+  handleEngineProfileChange = ({ engineProfile }) => {
+    const { executionPlatformVersion: version } = engineProfile;
+    if (!version) return;
+
+    const elementTemplates = this.getModeler().get('elementTemplates');
+
+    const engines = {
+      ...elementTemplates.getEngines(),
+      camunda: version
+    };
+
+    elementTemplates.setEngines(engines);
+  };
+
   async loadTemplates() {
     const { getConfig } = this.props;
 
@@ -849,6 +867,11 @@ export class BpmnEditor extends CachedComponent {
       elementTemplateChooser: false,
       keyboard: {
         bind: false
+      },
+      elementTemplates: {
+        engines: {
+          camundaDesktopModeler: version
+        }
       }
     });