How to create a decision table in the DRD view programmatically [dmn js]

[qduchesneau]

Hello team,

I am looking to create a new blank decision table in the DRD programmatically. My first attempt was to use createShape with the drd provider active. Something like below:

const createShape = React.useCallback(() => {
    if(editorRef.current) {
      if (typeof editorRef.current.getActiveViewer().get === 'function') {
        let views = editorRef.current.getViews();
        
        let modeling = editorRef.current.getActiveViewer().get('modeling');
        console.info(modeling);

        let canvas = editorRef.current.getActiveViewer().get('canvas');
        console.info(canvas);

        let rootElement = canvas.getRootElement();
        console.info(root);

        let drdFactory = editorRef.current.getActiveViewer().get('drdFactory');
        console.info(drdFactory);

        let elementFactory = editorRef.current.getActiveViewer().get('elementFactory');
        console.info(elementFactory);

        let businessObject = drdFactory.create('dmn:Decision', {
          name: 'Season'
        });
        let decision = elementFactory.createShape({
          type: 'dmn:Decision',
          businessObject: businessObject
        });
        console.info(decision);
        console.info(decision['decisionLogic']);

        modeling.createShape(decision, { x: 100, y: 100 }, rootElement);

        console.info('Shape created?');
      } else {
        console.info('dmnEditor.get is not a function...');
      }
    } else {
      console.info('dmnEditor has not been initialized...');
    }
  }, [editorRef]);

CreateShape is linked to a button on our webpage. This function created the decision node with “Season” as text. However, there was no decision table associated to it. What would the next steps be? And any recommendations on how to improve the above code is appreciated. Thanks!

[barmac]

Hi,

The decision table can be added to a decision via decisionLogic property. Check out how it’s done at https://github.com/bpmn-io/dmn-js/blob/develop/packages/dmn-js-drd/src/features/replace/DrdReplace.js#L35

[qduchesneau]

@barmac

dmn-js/packages/dmn-js-drd/src/features/replace/DrdReplace.js at develop · bpmn-io/dmn-js · GitHub

Got it! Thank you very much. I am able to create decisionTable and literalExpression programmatically now.

For others future reference:

      let drdReplace = editorRef.current.getActiveViewer().get('drdReplace');
      let decisionNode = modeling.createShape(decision, { x: 200, y: 200 }, rootElement);
      let newElementData = {type: 'dmn:Decision', table: true, expression: false};
      let newDecisionNode = drdReplace.replaceElement(decisionNode, newElementData);