Display While condition expression

src/designer/elsa-workflows-studio/src/plugins/while-plugin.tsx

@@ -0,0 +1,24 @@
+import {ElsaPlugin} from "../services/elsa-plugin";
+import {eventBus} from '../services/event-bus';
+import {ActivityDefinitionProperty, ActivityDesignDisplayContext, EventTypes} from "../models";
+import {h} from "@stencil/core";
+
+export class WhilePlugin implements ElsaPlugin {
+  constructor() {
+    eventBus.on(EventTypes.ActivityDesignDisplaying, this.onActivityDesignDisplaying);
+  }
+
+  onActivityDesignDisplaying(context: ActivityDesignDisplayContext) {
+    const activityModel = context.activityModel;
+
+    if (activityModel.type !== 'While')
+      return;
+
+    const props = activityModel.properties || [];
+    const condition: ActivityDefinitionProperty = props.find(x => x.name == 'Condition') || { name: 'Condition', expressions: {'Literal': ''}, syntax: 'Literal' };
+    const expression = condition.expressions[condition.syntax] || '';
+    const description = activityModel.description;
+    const bodyText = description && description.length > 0 ? description : expression;
+    context.bodyDisplay = <p>{bodyText}</p>;
+  }
+}

src/designer/elsa-workflows-studio/src/services/plugin-manager.ts

@@ -9,6 +9,7 @@ import {ForkPlugin} from "../plugins/fork-plugin";
 import {RunJavascriptPlugin} from "../plugins/run-javascript-plugin";
 import {ActivityIconProviderPlugin} from "../plugins/activity-icon-provider-plugin";
 import {SwitchPlugin} from "../plugins/switch-plugin";
+import {WhilePlugin} from "../plugins/while-plugin";
 
 export class PluginManager {
 
@@ -19,6 +20,7 @@ export class PluginManager {
       new DefaultDriversPlugin(),
       new ActivityIconProviderPlugin(),
       new IfPlugin(),
+      new WhilePlugin(),
       new ForkPlugin(),
       new SwitchPlugin(),
       new HttpEndpointPlugin(),