chore: refactor updateFormalExpression helper into a reusable utility

Author: maff

src/provider/bpmn/properties/AdHocCompletionProps.js

@@ -6,9 +6,8 @@ import {
   TextFieldEntry,
 } from '@bpmn-io/properties-panel';
 
-import { createElement } from '../../../utils/ElementUtil';
-
 import { useService } from '../../../hooks';
+import { createOrUpdateFormalExpression } from '../../../utils/FormalExpressionUtil';
 
 /**
  * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
@@ -52,9 +51,13 @@ function CompletionCondition(props) {
   };
 
   const setValue = (value) => {
-    return commandStack.execute(
-      'element.updateModdleProperties',
-      updateFormalExpression(element, 'completionCondition', value, bpmnFactory)
+    return createOrUpdateFormalExpression(
+      element,
+      getBusinessObject(element),
+      'completionCondition',
+      value,
+      bpmnFactory,
+      commandStack
     );
   };
 
@@ -97,60 +100,4 @@ function CancelRemainingInstances(props) {
     getValue,
     setValue,
   });
-}
-
-// helper ////////////////////////////
-
-// formal expression /////////////////
-
-/**
- * updateFormalExpression - updates a specific formal expression
- *
- * @param {djs.model.Base} element
- * @param {string} propertyName
- * @param {string} newValue
- * @param {BpmnFactory} bpmnFactory
- */
-function updateFormalExpression(element, propertyName, newValue, bpmnFactory) {
-  const businessObject = getBusinessObject(element);
-  const expressionProps = {};
-
-  if (!newValue) {
-
-    // remove formal expression
-    expressionProps[propertyName] = undefined;
-
-    return {
-      element,
-      moddleElement: businessObject,
-      properties: expressionProps,
-    };
-  }
-
-  const existingExpression = businessObject.get(propertyName);
-  if (!existingExpression) {
-
-    // add formal expression
-    expressionProps[propertyName] = createElement(
-      'bpmn:FormalExpression',
-      { body: newValue },
-      businessObject,
-      bpmnFactory
-    );
-
-    return {
-      element,
-      moddleElement: businessObject,
-      properties: expressionProps,
-    };
-  }
-
-  // edit existing formal expression
-  return {
-    element,
-    moddleElement: existingExpression,
-    properties: {
-      body: newValue,
-    },
-  };
-}
+}

src/provider/bpmn/properties/MultiInstanceProps.js

@@ -10,8 +10,8 @@ import {
 } from '../../../hooks';
 
 import {
-  createElement
-} from '../../../utils/ElementUtil';
+  createOrUpdateFormalExpression
+} from '../../../utils/FormalExpressionUtil';
 
 /**
  * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
@@ -58,9 +58,13 @@ function LoopCardinality(props) {
   };
 
   const setValue = (value) => {
-    return commandStack.execute(
-      'element.updateModdleProperties',
-      updateFormalExpression(element, 'loopCardinality', value, bpmnFactory)
+    return createOrUpdateFormalExpression(
+      element,
+      getLoopCharacteristics(element),
+      'loopCardinality',
+      value,
+      bpmnFactory,
+      commandStack
     );
   };
 
@@ -87,9 +91,13 @@ function CompletionCondition(props) {
   };
 
   const setValue = (value) => {
-    return commandStack.execute(
-      'element.updateModdleProperties',
-      updateFormalExpression(element, 'completionCondition', value, bpmnFactory)
+    return createOrUpdateFormalExpression(
+      element,
+      getLoopCharacteristics(element),
+      'completionCondition',
+      value,
+      bpmnFactory,
+      commandStack
     );
   };
 
@@ -153,68 +161,6 @@ function getLoopCharacteristics(element) {
   return bo.loopCharacteristics;
 }
 
-/**
- * createFormalExpression - creates a 'bpmn:FormalExpression' element.
- *
- * @param {ModdleElement} parent
- * @param {string} body
- * @param {BpmnFactory} bpmnFactory
- *
- * @result {ModdleElement<bpmn:FormalExpression>} a formal expression
- */
-function createFormalExpression(parent, body, bpmnFactory) {
-  return createElement('bpmn:FormalExpression', { body: body }, parent, bpmnFactory);
-}
-
-/**
- * updateFormalExpression - updates a specific formal expression of the loop characteristics.
- *
- * @param {djs.model.Base} element
- * @param {string} propertyName
- * @param {string} newValue
- * @param {BpmnFactory} bpmnFactory
- */
-function updateFormalExpression(element, propertyName, newValue, bpmnFactory) {
-  const loopCharacteristics = getLoopCharacteristics(element);
-
-  const expressionProps = {};
-
-  if (!newValue) {
-
-    // remove formal expression
-    expressionProps[ propertyName ] = undefined;
-
-    return {
-      element,
-      moddleElement: loopCharacteristics,
-      properties: expressionProps
-    };
-  }
-
-  const existingExpression = loopCharacteristics.get(propertyName);
-
-  if (!existingExpression) {
-
-    // add formal expression
-    expressionProps[ propertyName ] = createFormalExpression(loopCharacteristics, newValue, bpmnFactory);
-
-    return {
-      element,
-      moddleElement: loopCharacteristics,
-      properties: expressionProps
-    };
-  }
-
-  // edit existing formal expression
-  return {
-    element,
-    moddleElement: existingExpression,
-    properties: {
-      body: newValue
-    }
-  };
-}
-
 // loopCardinality
 
 /**

src/provider/zeebe/properties/AdHocCompletionProps.js

@@ -4,11 +4,9 @@ import {
   isFeelEntryEdited,
 } from '@bpmn-io/properties-panel';
 
-import { createElement } from '../../../utils/ElementUtil';
-
 import { useService } from '../../../hooks';
-
 import { FeelEntryWithVariableContext } from '../../../entries/FeelEntryWithContext';
+import { createOrUpdateFormalExpression } from '../../../utils/FormalExpressionUtil';
 
 /**
  * @typedef { import('@bpmn-io/properties-panel').EntryDefinition } Entry
@@ -47,9 +45,13 @@ function CompletionCondition(props) {
   };
 
   const setValue = (value) => {
-    return commandStack.execute(
-      'element.updateModdleProperties',
-      updateFormalExpression(element, 'completionCondition', value, bpmnFactory)
+    return createOrUpdateFormalExpression(
+      element,
+      getBusinessObject(element),
+      'completionCondition',
+      value,
+      bpmnFactory,
+      commandStack
     );
   };
 
@@ -62,60 +64,4 @@ function CompletionCondition(props) {
     setValue,
     debounce,
   });
-}
-
-// helper ////////////////////////////
-
-// formal expression /////////////////
-
-/**
- * updateFormalExpression - updates a specific formal expression
- *
- * @param {djs.model.Base} element
- * @param {string} propertyName
- * @param {string} newValue
- * @param {BpmnFactory} bpmnFactory
- */
-function updateFormalExpression(element, propertyName, newValue, bpmnFactory) {
-  const businessObject = getBusinessObject(element);
-  const expressionProps = {};
-
-  if (!newValue) {
-
-    // remove formal expression
-    expressionProps[propertyName] = undefined;
-
-    return {
-      element,
-      moddleElement: businessObject,
-      properties: expressionProps,
-    };
-  }
-
-  const existingExpression = businessObject.get(propertyName);
-  if (!existingExpression) {
-
-    // add formal expression
-    expressionProps[propertyName] = createElement(
-      'bpmn:FormalExpression',
-      { body: newValue },
-      businessObject,
-      bpmnFactory
-    );
-
-    return {
-      element,
-      moddleElement: businessObject,
-      properties: expressionProps,
-    };
-  }
-
-  // edit existing formal expression
-  return {
-    element,
-    moddleElement: existingExpression,
-    properties: {
-      body: newValue,
-    },
-  };
-}
+}

src/provider/zeebe/properties/MultiInstanceProps.js

@@ -14,12 +14,14 @@ import {
 import {
   createElement
 } from '../../../utils/ElementUtil';
+import {
+  createOrUpdateFormalExpression
+} from '../../../utils/FormalExpressionUtil';
 
 import { useService } from '../../../hooks';
 
 import { FeelEntryWithVariableContext } from '../../../entries/FeelEntryWithContext';
 
-
 export function MultiInstanceProps(props) {
   const {
     element
@@ -188,18 +190,14 @@ function CompletionCondition(props) {
   };
 
   const setValue = (value) => {
-    if (value && value !== '') {
-      const loopCharacteristics = getLoopCharacteristics(element);
-      const completionCondition = createElement(
-        'bpmn:FormalExpression',
-        { body: value },
-        loopCharacteristics,
-        bpmnFactory
-      );
-      setCompletionCondition(element, commandStack, completionCondition);
-    } else {
-      setCompletionCondition(element, commandStack, undefined);
-    }
+    return createOrUpdateFormalExpression(
+      element,
+      getLoopCharacteristics(element),
+      'completionCondition',
+      value,
+      bpmnFactory,
+      commandStack
+    );
   };
 
   return FeelEntryWithVariableContext({
@@ -234,16 +232,6 @@ function getCompletionCondition(element) {
   return getLoopCharacteristics(element).get('completionCondition');
 }
 
-function setCompletionCondition(element, commandStack, completionCondition = undefined) {
-  commandStack.execute('element.updateModdleProperties', {
-    element,
-    moddleElement: getLoopCharacteristics(element),
-    properties: {
-      completionCondition
-    }
-  });
-}
-
 function getProperty(element, propertyName) {
   const loopCharacteristics = getLoopCharacteristics(element),
         zeebeLoopCharacteristics = getZeebeLoopCharacteristics(loopCharacteristics);