feat: add RPA editor to Camunda Modeler

camunda · Feb 18, 2025 · debd030 · debd030
1 parent 78d71aa
commit debd030
Show file tree

Hide file tree

Showing 26 changed files with 2,201 additions and 169 deletions.
diff --git a/app/lib/zeebe-api/zeebe-api.js b/app/lib/zeebe-api/zeebe-api.js
@@ -667,6 +667,12 @@ function getResource(parameters, contents, resourceName) {
   } else if (resourceType === RESOURCE_TYPES.DMN) {
     resource.decision = contents;
   } else if (resourceType === RESOURCE_TYPES.FORM) {
+    resource.form = contents;
+  } else {
+
+    // Fallback for unknown resource, cf.
+    // https://github.com/camunda-community-hub/zeebe-client-node-js/blob/7969ce1808c96a87519cb1a3f279287f30637c4b/src/zb/ZBClient.ts#L873-L886
+
     resource.form = contents;
   }
 

diff --git a/client/karma.config.js b/client/karma.config.js
@@ -98,7 +98,7 @@ module.exports = function(karma) {
                 use: 'react-svg-loader'
               },
               {
-                test: /\.(css|bpmn|cmmn|dmn|less|xml|png|svg|form)$/,
+                test: /\.(css|bpmn|cmmn|dmn|less|xml|png|svg|form|rpa)$/,
                 type: 'asset/source'
               }
             ]

diff --git a/client/package.json b/client/package.json
@@ -19,6 +19,8 @@
     "@camunda/form-playground": "^0.20.0",
     "@camunda/improved-canvas": "^1.7.6",
     "@camunda/linting": "^3.31.0",
+    "@camunda/rpa-integration": "0.1.0",
+    "@carbon/icons-react": "^11.53.0",
     "@codemirror/commands": "^6.6.2",
     "@codemirror/lang-json": "^6.0.1",
     "@codemirror/lang-xml": "^6.1.0",

diff --git a/client/src/app/TabsProvider.js b/client/src/app/TabsProvider.js
@@ -18,6 +18,8 @@ import {
 
 import replaceIds from '@bpmn-io/replace-ids';
 
+import { Bot } from '@carbon/icons-react';
+
 import { Linter as BpmnLinter } from '@camunda/linting';
 import { FormLinter } from '@camunda/form-linting/lib/FormLinter';
 
@@ -28,6 +30,7 @@ import dmnDiagram from './tabs/dmn/diagram.dmn';
 import cloudDmnDiagram from './tabs/cloud-dmn/diagram.dmn';
 import form from './tabs/form/initial.form';
 import cloudForm from './tabs/form/initial-cloud.form';
+import rpaScript from './tabs/rpa/resources/initial.rpa';
 
 import {
   ENGINES
@@ -56,7 +59,8 @@ import Flags, {
   DISABLE_PLATFORM,
   DISABLE_CMMN,
   DISABLE_HTTL_HINT,
-  DEFAULT_HTTL
+  DEFAULT_HTTL,
+  DISABLE_RPA
 } from '../util/Flags';
 
 import BPMNIcon from '../../resources/icons/file-types/BPMN.svg';
@@ -490,6 +494,43 @@ export default class TabsProvider {
         getLinter() {
           return formLinter;
         }
+      },
+      'rpa': {
+        name: 'RPA',
+        encoding: 'utf8',
+        exports: {},
+        extensions: [ 'rpa' ],
+        canOpen(file) {
+          return file.name.endsWith('.rpa');
+        },
+        getComponent(options) {
+          return import('./tabs/rpa');
+        },
+        getIcon() {
+          return Bot;
+        },
+        getInitialContents() {
+          return rpaScript;
+        },
+        getInitialFilename(suffix) {
+          return `script_${suffix}.rpa`;
+        },
+        getHelpMenu() {
+          return [];
+        },
+        getNewFileMenu() {
+          return [ {
+            label: 'RPA script',
+            group: 'Camunda 8',
+            action: 'create-diagram',
+            options: {
+              type: 'rpa'
+            }
+          } ];
+        },
+        getLinter() {
+          return null;
+        }
       }
     };
 
@@ -518,9 +559,12 @@ export default class TabsProvider {
       this.providersByFileType.bpmn = this.providersByFileType.bpmn.filter(p => p !== this.providers['cloud-bpmn']);
       this.providersByFileType.dmn = this.providersByFileType.dmn.filter(p => p !== this.providers['cloud-dmn']);
       this.providersByFileType.form = this.providersByFileType.form.filter(p => p !== this.providers['cloud-form']);
+      this.providersByFileType.rpa = [];
+
       delete this.providers['cloud-bpmn'];
       delete this.providers['cloud-dmn'];
       delete this.providers['cloud-form'];
+      delete this.providers['rpa'];
     }
 
     if (Flags.get(DISABLE_PLATFORM)) {
@@ -552,6 +596,11 @@ export default class TabsProvider {
       delete this.providers['cloud-form'];
       delete this.providersByFileType.form;
     }
+
+    if (Flags.get(DISABLE_RPA)) {
+      delete this.providers.rpa;
+      delete this.providersByFileType.rpa;
+    }
   }
 
   getProviderNames() {

diff --git a/client/src/app/__tests__/EmptyTabSpec.js b/client/src/app/__tests__/EmptyTabSpec.js
@@ -39,11 +39,12 @@ describe('<EmptyTab>', function() {
       buttons.forEach(wrapper => wrapper.simulate('click'));
 
       // then
-      expect(onAction).to.have.callCount(6);
+      expect(onAction).to.have.callCount(7);
       expect(onAction.args).to.eql([
         [ 'create-cloud-bpmn-diagram', undefined ],
         [ 'create-cloud-dmn-diagram', undefined ],
         [ 'create-cloud-form', undefined ],
+        [ 'create-diagram', { type: 'rpa' } ],
         [ 'create-bpmn-diagram', undefined ],
         [ 'create-dmn-diagram', undefined ],
         [ 'create-form', undefined ]

diff --git a/client/src/app/__tests__/TabsProviderSpec.js b/client/src/app/__tests__/TabsProviderSpec.js
@@ -18,7 +18,8 @@ import Flags, {
   CLOUD_ENGINE_VERSION,
   PLATFORM_ENGINE_VERSION,
   DISABLE_HTTL_HINT,
-  DEFAULT_HTTL
+  DEFAULT_HTTL,
+  DISABLE_RPA
 } from '../../util/Flags';
 
 import {
@@ -473,6 +474,21 @@ describe('TabsProvider', function() {
           // then
           expect(contents).to.include(`"executionPlatformVersion": "${ expectedPlatformVersion }"`);
         });
+
+
+        it('should replace version placeholder with actual latest version (RPA)', function() {
+
+          // given
+          const tabsProvider = new TabsProvider();
+
+          const expectedPlatformVersion = getLatestStablePlatformVersion(ENGINES.CLOUD);
+
+          // when
+          const { file: { contents } } = tabsProvider.createTab('rpa');
+
+          // then
+          expect(contents).to.include(`"executionPlatformVersion": "${ expectedPlatformVersion }"`);
+        });
       });
     });
 
@@ -556,6 +572,7 @@ describe('TabsProvider', function() {
     expect(tabsProvider.createTab('dmn')).to.exist;
     expect(tabsProvider.createTab('cloud-dmn')).to.exist;
     expect(tabsProvider.createTab('form')).to.exist;
+    expect(tabsProvider.createTab('rpa')).to.exist;
   });
 
 
@@ -870,6 +887,7 @@ describe('TabsProvider', function() {
     expect(providers['cmmn']).to.exist;
     expect(providers['dmn']).to.exist;
     expect(providers['cloud-dmn']).to.exist;
+    expect(providers['rpa']).to.exist;
     expect(providers['empty']).to.exist;
   });
 
@@ -886,7 +904,7 @@ describe('TabsProvider', function() {
       const providerNames = tabsProvider.getProviderNames();
 
       // then
-      expect(providerNames).to.eql([ 'BPMN', 'DMN', 'FORM' ]);
+      expect(providerNames).to.eql([ 'BPMN', 'DMN', 'FORM', 'RPA' ]);
 
     });
 
@@ -903,7 +921,7 @@ describe('TabsProvider', function() {
       const providerNames = tabsProvider.getProviderNames();
 
       // then
-      expect(providerNames).to.eql([ 'BPMN', 'CMMN', 'DMN', 'FORM' ]);
+      expect(providerNames).to.eql([ 'BPMN', 'CMMN', 'DMN', 'FORM', 'RPA' ]);
 
     });
 
@@ -920,7 +938,7 @@ describe('TabsProvider', function() {
       const providerNames = tabsProvider.getProviderNames();
 
       // then
-      expect(providerNames).to.eql([ 'BPMN', 'DMN', 'FORM' ]);
+      expect(providerNames).to.eql([ 'BPMN', 'DMN', 'FORM', 'RPA' ]);
 
     });
 
@@ -1165,6 +1183,21 @@ describe('TabsProvider', function() {
     });
 
 
+    it('should disable RPA', function() {
+
+      // given
+      Flags.init({
+        [DISABLE_RPA]: true
+      });
+
+      // when
+      const tabsProvider = new TabsProvider();
+
+      // then
+      expect(tabsProvider.hasProvider('rpa')).to.be.false;
+    });
+
+
     it('should disable HTTL hint', async function() {
 
       // given
@@ -1242,7 +1275,8 @@ describe('TabsProvider', function() {
       'dmn',
       'cloud-dmn',
       'form',
-      'cloud-form'
+      'cloud-form',
+      'rpa'
     ].forEach((type) => {
 
       it(`should have icon <${type}>`, function() {