Allow variables with dots and keys (#17361)

Fixes https://github.com/twentyhq/private-issues/issues/410#issuecomment-3781085655 Currently, JSON keys with spaces like { "toto toto": 123 } are rejected with "JSON keys cannot contain spaces" error. This is problematic for HTTP requests and webhook triggers where users cannot control the response structure. We use Handlebars to eval variables, segment-literal bracket notation to escape keys with special characters: Normal: {{step.normalKey}} With spaces: `{{step.[key with space]}}` So we simply need to wrap segments with spaces with brackets. This PR: - Create shared path utilities to wrap the variable segments when needed - Use it in all variable generation places - Remove the restrictions This body is now supported: <img width="609" height="457" alt="Capture d’écran 2026-01-22 à 16 10 13" src="https://github.com/user-attachments/assets/e7653c0a-df1e-49af-9c9a-4b7d59a99726" />
2026-01-22 16:06:53 +00:00
parent 29c12c0ffd
commit c008e874e5
14 changed files with 317 additions and 67 deletions
@@ -0,0 +1,70 @@
+// Characters that require bracket escaping in variable paths
+// Spaces, dots, and brackets would break the dot-notation parsing
+const SPECIAL_CHARS_REGEX = /[\s.[]/;
+
+export const needsEscaping = (key: string): boolean =>
+  SPECIAL_CHARS_REGEX.test(key);
+
+export const escapePathSegment = (segment: string): string =>
+  needsEscaping(segment) ? `[${segment}]` : segment;
+
+export const joinVariablePath = (segments: string[]): string =>
+  segments.map(escapePathSegment).join('.');
+
+/**
+ * Parses a variable path string into segments, handling bracket notation.
+ * Examples:
+ *   "step.normal.key" => ["step", "normal", "key"]
+ *   "step.[key with space].value" => ["step", "key with space", "value"]
+ *   "step.[key.with.dots]" => ["step", "key.with.dots"]
+ */
+export const parseVariablePath = (path: string): string[] => {
+  const segments: string[] = [];
+  let current = '';
+  let inBracket = false;
+  let segmentIndex = 0;
+
+  while (segmentIndex < path.length) {
+    const char = path[segmentIndex];
+
+    if (char === '[' && !inBracket) {
+      if (current.length > 0) {
+        segments.push(current);
+        current = '';
+      }
+      inBracket = true;
+      segmentIndex++;
+      continue;
+    }
+
+    if (char === ']' && inBracket) {
+      segments.push(current);
+      current = '';
+      inBracket = false;
+      segmentIndex++;
+      // Skip the following dot if present
+      if (segmentIndex < path.length && path[segmentIndex] === '.') {
+        segmentIndex++;
+      }
+      continue;
+    }
+
+    if (char === '.' && !inBracket) {
+      if (current.length > 0) {
+        segments.push(current);
+        current = '';
+      }
+      segmentIndex++;
+      continue;
+    }
+
+    current += char;
+    segmentIndex++;
+  }
+
+  if (current.length > 0) {
+    segments.push(current);
+  }
+
+  return segments;
+};