fix(prompts): trim leading and trailing whitespace from mustache temp…

…late variables (#6357)

Co-authored-by: Tony Powell <[email protected]>

app/src/components/templateEditor/language/__tests__/languageUtils.test.ts

@@ -38,6 +38,10 @@ can you help with this json?
         input: `{"name": "{{{name}}}"}`,
         expected: ["{name}"],
       },
+      {
+        input: `{"name": "{{  name  }}"}`,
+        expected: ["name"],
+      },
     ] as const;
     tests.forEach(({ input, expected }) => {
       expect(
@@ -129,6 +133,11 @@ can you help with this json?
         variables: { name: "John", age: 30 },
         expected: `{"name": "{{name}}", "age": "{{age\\}}"}`,
       },
+      {
+        input: `{"name": "{{  name  }}"}`,
+        variables: { name: "John" },
+        expected: `{"name": "John"}`,
+      },
     ] as const;
     tests.forEach(({ input, variables, expected }) => {
       expect(formatMustacheLike({ text: input, variables })).toEqual(expected);

app/src/components/templateEditor/language/languageUtils.ts

@@ -24,7 +24,8 @@ export const extractVariables = ({
   const cur = tree.cursor();
   do {
     if (cur.name === "Variable") {
-      variables.push(text.slice(cur.node.from, cur.node.to));
+      const variable = text.slice(cur.node.from, cur.node.to).trim();
+      variables.push(variable);
     }
   } while (cur.next());
   return variables;
@@ -74,12 +75,12 @@ export const format = ({
   let cur = tree.cursor();
   do {
     if (cur.name === "Variable") {
-      // grab the content inside of the braces
-      const variable = result.slice(cur.node.from, cur.node.to);
+      // grab the content inside of the braces, ignoring whitespace
+      const variable = result.slice(cur.node.from, cur.node.to).trim();
       // grab the position of the content including the braces
       const Template = cur.node.parent!;
       if (variable in variables) {
-        // replace the content (including braces) with the variable value
+        // replace the content (including braces and whitespace) with the variable value
         result = `${result.slice(0, Template.from)}${variables[variable]}${result.slice(Template.to)}`;
         // reparse the result so that positions are updated
         tree = parser.parse(result);