support for multiple expressions in textExpression

Author: devhelpr

apps/vps-web/src/app/custom-nodes-v2/form/VanillaFormCore.ts

@@ -7,6 +7,7 @@ import { IFlowCanvasBase } from '@devhelpr/visual-programming-system';
 import {
   getVariablePayloadInputUtils,
   NodeInfo,
+  replaceExpressionScript,
 } from '@devhelpr/web-flow-executor';
 
 interface FormPage extends Page {
@@ -287,20 +288,8 @@ export class VanillaFormCore {
       this.scopeId,
       this.canvasAppInstance
     );
-    const compiledExpression = compileExpressionAsInfo(expression);
-    const expressionFunction = (
-      new Function('payload', `${compiledExpression.script}`) as unknown as (
-        payload?: any
-      ) => any
-    ).bind(compiledExpression.bindings);
-    return (
-      runExpression(
-        expressionFunction,
-        payloadForExpression,
-        false,
-        compiledExpression.payloadProperties
-      ) ?? ''
-    ).toString();
+
+    return replaceExpressionScript(expression, payloadForExpression);
   }
   private getOptonsViaExpression(expression: string) {
     const compiledExpression = compileExpressionAsInfo(expression);

examples-test-flows/learn-swedish2.json

@@ -38,10 +38,10 @@
         },
         {
           "id": "4360f032-9fbf-403b-af9f-f2dec001ddf6",
-          "x": -3856.6332883515397,
-          "y": 441.66501263880014,
-          "width": 239.99985162012172,
-          "height": 367.9999948977943,
+          "x": -3892.511179242742,
+          "y": 531.2552153837826,
+          "width": 240.00000501389866,
+          "height": 392.0003163165241,
           "nodeType": "Shape",
           "nodeInfo": {
             "type": "show-object",
@@ -52,15 +52,15 @@
         },
         {
           "id": "8f99faef-2ab2-4ea9-9bb4-3b26d5dc511e",
-          "x": -3449.472489728539,
-          "y": 351.77912326545294,
-          "width": 483.1329126889236,
-          "height": 490.94379671085414,
+          "x": -3453.459590179823,
+          "y": 249.25551699329014,
+          "width": 485.5518584489778,
+          "height": 648.8295761150445,
           "nodeType": "Shape",
           "nodeInfo": {
             "type": "form",
             "formValues": {
-              "formJson": "{\n  \"app\": {\n    \"title\": \"Basic quiz\",\n    \"pages\": [\n      {\n        \"id\": \"personal-info\",\n        \"title\": \"Personal Information\",\n        \"route\": \"/personal\",\n        \"isEndPage\": true,\n        \"components\": [\n          {\n            \"type\": \"text\",\n            \"id\": \"intro\",\n            \"props\": {\n              \"textExpression\": \"sv\"\n            }\n          },\n          {\n            \"type\": \"radio\",\n            \"id\": \"question\",\n            \"label\": \"Question\",\n            \"props\": {\n              \"optionsExpression\": \"o\"\n            },\n            \"validation\": {\n              \"required\": true\n            }\n          }\n        ]\n      }\n    ]\n  }\n}\n"
+              "formJson": "{\n  \"app\": {\n    \"title\": \"Basic quiz\",\n    \"pages\": [\n      {\n        \"id\": \"personal-info\",\n        \"title\": \"Personal Information\",\n        \"route\": \"/personal\",\n        \"isEndPage\": true,\n        \"components\": [\n          {\n            \"type\": \"text\",\n            \"id\": \"intro\",\n            \"props\": {\n              \"textExpression\": \"{{sv}} {{score}} / {{questionIndex}}\"\n            }\n          },\n          {\n            \"type\": \"radio\",\n            \"id\": \"question\",\n            \"label\": \"Question\",\n            \"props\": {\n              \"optionsExpression\": \"o\"\n            },\n            \"validation\": {\n              \"required\": true\n            }\n          }\n        ]\n      }\n    ]\n  }\n}\n"
             },
             "fillColor": "black",
             "strokeColor": "white",
@@ -73,10 +73,10 @@
         },
         {
           "id": "5d3ca1b6-c787-416c-b5ec-61b3a3c2ddcd",
-          "x": -2807.358803728899,
-          "y": 435.0029362261489,
-          "width": 240.00003696479476,
-          "height": 103.99995423652004,
+          "x": -2821.1193745788464,
+          "y": 442.91646460963153,
+          "width": 239.9998854478763,
+          "height": 104.00003144674852,
           "nodeType": "Shape",
           "nodeInfo": {
             "type": "show-object",
@@ -119,8 +119,8 @@
           "id": "a8e8565b-ea0d-4d23-a36a-8fe11446e943",
           "x": -168.24803602749932,
           "y": 49.0272223505593,
-          "width": 119.99992581006086,
-          "height": 55.99999317972936,
+          "width": 119.99994235782867,
+          "height": 56.00003727553041,
           "nodeType": "Shape",
           "nodeInfo": {
             "type": "show-input",
@@ -230,8 +230,8 @@
           "id": "c9d5b004-6139-470e-8090-9ece55c8e25d",
           "x": -3417.8759889489697,
           "y": -337.8770009511329,
-          "width": 91.5157857661005,
-          "height": 83.99998976959404,
+          "width": 91.5157078781082,
+          "height": 83.99999322521023,
           "nodeType": "Shape",
           "nodeInfo": {
             "type": "variable",
@@ -305,8 +305,8 @@
           "id": "d447f6e0-1f6c-4064-a082-e2a5fcd91928",
           "x": -3153.152793043027,
           "y": -321.09091730623317,
-          "width": 91.51560042142746,
-          "height": 84.00001293767816,
+          "width": 91.515454422619,
+          "height": 83.9999983159156,
           "nodeType": "Shape",
           "nodeInfo": {
             "type": "variable",
@@ -352,15 +352,15 @@
         },
         {
           "id": "25c94012-db83-4783-be5f-517f8f4c40e7",
-          "x": 848.1260001955592,
-          "y": 599.7825363198851,
+          "x": 848.1258801884392,
+          "y": 599.7825713960938,
           "width": 434.81809202725157,
           "height": 294.1138665386298,
           "nodeType": "Shape",
           "nodeInfo": {
             "type": "form",
             "formValues": {
-              "formJson": "{\n  \"app\": {\n    \"title\": \"Basic quiz score\",\n    \"pages\": [\n      {\n        \"id\": \"personal-info\",\n        \"title\": \"Personal Information\",\n        \"route\": \"/personal\",\n        \"isEndPage\": true,\n        \"hasSubmitButtons\" : false,\n        \"hasStepIndicator\" : false,\n        \"components\": [\n          {\n            \"type\": \"text\",\n            \"label\": \"correct\",\n            \"id\": \"score\",\n            \"props\": {\n              \"textExpression\": \"score\"\n            }\n          },\n          {\n            \"type\": \"text\",\n            \"label\": \"questions count\",\n            \"id\": \"count\",\n            \"props\": {\n              \"textExpression\": \"questionIndex\"\n            }\n          }\n        ]\n      }\n    ]\n  }\n}\n"
+              "formJson": "{\n  \"app\": {\n    \"title\": \"Basic quiz score\",\n    \"pages\": [\n      {\n        \"id\": \"personal-info\",\n        \"title\": \"Personal Information\",\n        \"route\": \"/personal\",\n        \"isEndPage\": true,\n        \"hasSubmitButtons\" : false,\n        \"hasStepIndicator\" : false,\n        \"components\": [\n          {\n            \"type\": \"text\",\n            \"label\": \"correct\",\n            \"id\": \"score\",\n            \"props\": {\n              \"textExpression\": \"{{score}}\"\n            }\n          },\n          {\n            \"type\": \"text\",\n            \"label\": \"questions count\",\n            \"id\": \"count\",\n            \"props\": {\n              \"textExpression\": \"{{questionIndex}}\"\n            }\n          }\n        ]\n      }\n    ]\n  }\n}\n"
             },
             "fillColor": "black",
             "strokeColor": "white",
@@ -390,8 +390,8 @@
           "id": "1f985d07-8955-4b8d-9b92-39846c4be941",
           "x": -4028.084945363141,
           "y": 228.69484350289937,
-          "endX": -3856.6332883515397,
-          "endY": 471.66501263880014,
+          "endX": -3892.511179242742,
+          "endY": 561.2552153837826,
           "startNodeId": "75c87169-4c29-476b-8de8-5fd7df6059b6",
           "endNodeId": "4360f032-9fbf-403b-af9f-f2dec001ddf6",
           "startThumbName": "output",
@@ -403,10 +403,10 @@
         },
         {
           "id": "81f7f7e4-c235-4a2c-9120-4099cc25ac54",
-          "x": -3207.906033384077,
-          "y": 597.25102162088,
-          "endX": -2807.358803728899,
-          "endY": 465.0029362261489,
+          "x": -3210.683660955334,
+          "y": 573.6703050508124,
+          "endX": -2821.1193745788464,
+          "endY": 472.91646460963153,
           "startNodeId": "8f99faef-2ab2-4ea9-9bb4-3b26d5dc511e",
           "endNodeId": "5d3ca1b6-c787-416c-b5ec-61b3a3c2ddcd",
           "startThumbName": "input-output",
@@ -508,8 +508,8 @@
         },
         {
           "id": "8a9bf305-2989-4c5b-806b-26d422df2cc7",
-          "x": -2567.3587667641045,
-          "y": 465.0029362261489,
+          "x": -2581.11948913097,
+          "y": 472.91646460963153,
           "endX": -2490.4288625824847,
           "endY": 476.9815596884095,
           "startNodeId": "5d3ca1b6-c787-416c-b5ec-61b3a3c2ddcd",
@@ -553,10 +553,10 @@
         },
         {
           "id": "d4ffa17b-01ae-4a35-b0cc-d31bc3fa9ab5",
-          "x": -3616.633436731418,
-          "y": 471.66501263880014,
-          "endX": -3449.472489728539,
-          "endY": 597.25102162088,
+          "x": -3652.511174228843,
+          "y": 561.2552153837826,
+          "endX": -3453.459590179823,
+          "endY": 573.6703050508124,
           "startNodeId": "4360f032-9fbf-403b-af9f-f2dec001ddf6",
           "endNodeId": "8f99faef-2ab2-4ea9-9bb4-3b26d5dc511e",
           "startThumbName": "output",
@@ -568,7 +568,7 @@
         },
         {
           "id": "8d89234b-0b8f-40bd-a275-898a744cc2b8",
-          "x": -48.248110217438466,
+          "x": -48.24809366967065,
           "y": 79.0272223505593,
           "endX": 57.49521448749903,
           "endY": 942.5097333674655,
@@ -705,8 +705,8 @@
           "id": "bfbaca27-2c2e-4062-8dc9-6e73c72af990",
           "x": 584.0800631666957,
           "y": 940.2958187569535,
-          "endX": 848.1260001955592,
-          "endY": 746.8394695892,
+          "endX": 848.1258801884392,
+          "endY": 746.8395046654086,
           "startNodeId": "74edb67f-3e70-46df-99ff-8d591b0bda56",
           "endNodeId": "25c94012-db83-4783-be5f-517f8f4c40e7",
           "startThumbName": "output",

libs/web-flow-executor/src/index.ts

@@ -9,3 +9,4 @@ export * from './nodes/variable-payload-input-utils/variable-payload-input-utils
 export type { ComputeAsync } from './types/compute-async';
 export * from './interface/flow-engine';
 export * from './consts/llm-keys';
+export * from './utils/replace-expression-script';

libs/web-flow-executor/src/utils/replace-expression-script.ts

@@ -23,9 +23,7 @@ export const replaceExpressionScript = (
         try {
           const result = runExpression(
             expressionFunction,
-            {
-              ...payload,
-            },
+            payload,
             true,
             info.payloadProperties
           );