fix: improve regex of replacer in evaluateDeep (#968)

replace regex replacer with stack implementation for evaluateDeep

Author: sagardspeed2

.changeset/good-chicken-wonder.md

@@ -0,0 +1,5 @@
+---
+"@ensembleui/react-framework": patch
+---
+
+fixed the regression related invokeAPI inputs evaluation

packages/framework/src/shared/__tests__/common.test.ts

@@ -1,3 +1,4 @@
+import { evaluateDeep } from "../../evaluate";
 import { findExpressions, isCompoundExpression } from "../common";
 
 test("find deeply nested expressions", () => {
@@ -82,4 +83,115 @@ describe("isCompoundExpression", () => {
     ).toBe(false);
   });
 });
+
+describe("validate expressions", () => {
+  test("Single placeholder with no additional text", () => {
+    expect(
+      evaluateDeep({ name: "${name}" }, undefined, {
+        name: "Ensemble",
+      }),
+    ).toMatchObject({ name: "Ensemble" });
+  });
+
+  test("Single placeholder with additional text", () => {
+    expect(
+      evaluateDeep({ name: "${name} framework" }, undefined, {
+        name: "Ensemble",
+      }),
+    ).toMatchObject({ name: "Ensemble framework" });
+  });
+
+  test("Multiple placeholders", () => {
+    expect(
+      evaluateDeep({ name: "${name} ${platform}" }, undefined, {
+        name: "Ensemble",
+        platform: "Web",
+      }),
+    ).toMatchObject({ name: "Ensemble Web" });
+  });
+
+  test("Single complex placeholder with expression", () => {
+    expect(
+      evaluateDeep({ name: "${name + platform}" }, undefined, {
+        name: "Ensemble",
+        platform: "Web",
+      }),
+    ).toMatchObject({ name: "EnsembleWeb" });
+  });
+
+  test("Nested template literals (complex case)", () => {
+    expect(
+      evaluateDeep(
+        {
+          name: "${`Ensemble ${platform} platform`}",
+        },
+        undefined,
+        {
+          name: "Ensemble",
+          platform: "Web",
+        },
+      ),
+    ).toMatchObject({ name: "Ensemble Web platform" });
+  });
+
+  test("No placeholders", () => {
+    expect(
+      evaluateDeep(
+        {
+          name: "Ensemble Web",
+        },
+        undefined,
+        {
+          name: "Ensemble",
+          platform: "Web",
+        },
+      ),
+    ).toMatchObject({ name: "Ensemble Web" });
+  });
+
+  test("Placeholder at the start and end", () => {
+    expect(
+      evaluateDeep(
+        {
+          name: "${name} Web ${platform}",
+        },
+        undefined,
+        {
+          name: "Ensemble",
+          platform: "Studio",
+        },
+      ),
+    ).toMatchObject({ name: "Ensemble Web Studio" });
+  });
+
+  test("Placeholder within text", () => {
+    expect(
+      evaluateDeep(
+        {
+          name: "Ensemble ${platform} Studio",
+        },
+        undefined,
+        {
+          name: "Ensemble",
+          platform: "Web",
+        },
+      ),
+    ).toMatchObject({ name: "Ensemble Web Studio" });
+  });
+
+  test("Map loop", () => {
+    expect(
+      evaluateDeep(
+        {
+          name: "${['X', 'Y'].map((c) => { return c.toLowerCase() })}",
+        },
+        undefined,
+        {
+          name: "Ensemble",
+          platform: "Web",
+        },
+      ),
+    ).toMatchObject({ name: ["x", "y"] });
+  });
+});
 /* eslint-enable no-template-curly-in-string */

packages/framework/src/shared/common.ts

@@ -160,16 +160,59 @@ export const error = (value: unknown): void => {
   console.error(value);
 };
 
+export const validateExpressions = (
+  value: string,
+): { isValid: boolean; expressions: string[] } => {
+  const expressions: string[] = [];
+  let currentExpr = "";
+  let nestCount = 0;
+
+  for (let i = 0; i < value.length; i++) {
+    if (value[i] === "$" && value[i + 1] === "{") {
+      if (nestCount === 0) {
+        currentExpr = "";
+      }
+      nestCount++;
+      currentExpr += value.slice(i, i + 2);
+      i++;
+      continue;
+    }
+
+    if (nestCount > 0) {
+      currentExpr += value[i];
+      if (value[i] === "{") {
+        nestCount++;
+      } else if (value[i] === "}") {
+        nestCount--;
+        if (nestCount === 0) {
+          expressions.push(currentExpr);
+        }
+      }
+    }
+  }
+
+  return {
+    isValid: nestCount === 0 && expressions.length > 0,
+    expressions,
+  };
+};
+
 export const replace =
   (replacer: (expr: string) => string) =>
   (val: string): unknown => {
-    const matches = val.match(/\$\{+[^}]+\}+/g);
-    if (matches?.length === 1 && matches[0] === val) {
-      return replacer(val);
+    const { expressions, isValid } = validateExpressions(val);
+    if (isValid) {
+      if (expressions.length === 1 && val === expressions[0]) {
+        return replacer(expressions[0]);
+      }
+
+      let replacedValue = val;
+      expressions.forEach((expr) => {
+        replacedValue = replacedValue.replace(expr, replacer(expr));
+      });
+      return replacedValue;
     }
-    return val.replace(/\$\{+[^}]+\}+/g, (expression) => {
-      return replacer(expression);
-    });
+    return val;
   };
 
 export const visitExpressions = (

packages/runtime/src/runtime/hooks/useEnsembleAction.tsx

@@ -218,8 +218,8 @@ export const useInvokeAPI: EnsembleActionHook<InvokeAPIAction> = (action) => {
             DataFetcher.fetch(
               currentApi,
               {
-                ...evaluatedInputs,
                 ...context,
+                ...evaluatedInputs,
                 ensemble: {
                   env: appContext?.env,
                   secrets: appContext?.secrets,