🐛 Fix parseVariables when preceding with a dollar sign

apps/builder/src/components/inputs/VariableSearchInput.tsx

@@ -179,6 +179,7 @@ export const VariableSearchInput = ({
             onFocus={onOpen}
             onKeyDown={handleKeyUp}
             placeholder={inputProps.placeholder ?? 'Select a variable'}
+            autoComplete="off"
             {...inputProps}
           />
         </PopoverAnchor>

apps/viewer/src/features/variables/parseVariables.ts

@@ -22,30 +22,34 @@ export const parseVariables =
   (text: string | undefined): string => {
     if (!text || text === '') return ''
     // Capture {{variable}} and ${{{variable}}} (variables in template litterals)
-    const pattern = /\{\{([^{}]+)\}\}|\$\{\{([^{}]+)\}\}/g
+    const pattern = /\{\{([^{}]+)\}\}|(\$)\{\{([^{}]+)\}\}/g
     return text.replace(
       pattern,
-      (_, nameInCurlyBraces, nameInTemplateLitteral) => {
+      (_full, nameInCurlyBraces, _dollarSign, nameInTemplateLitteral) => {
+        const dollarSign = _dollarSign ?? ''
         const matchedVarName = nameInCurlyBraces ?? nameInTemplateLitteral
         const variable = variables.find((variable) => {
           return (
             matchedVarName === variable.name &&
             (options.fieldToParse === 'id' || isDefined(variable.value))
           )
         }) as VariableWithValue | undefined
-        if (!variable) return ''
-        if (options.fieldToParse === 'id') return variable.id
+        if (!variable) return dollarSign + ''
+        if (options.fieldToParse === 'id') return dollarSign + variable.id
         const { value } = variable
         if (options.escapeForJson)
-          return jsonParse(
-            typeof value !== 'string' ? JSON.stringify(value) : value
+          return (
+            dollarSign +
+            jsonParse(typeof value !== 'string' ? JSON.stringify(value) : value)
+          )
+        const parsedValue =
+          dollarSign +
+          safeStringify(
+            options.takeLatestIfList && Array.isArray(value)
+              ? value[value.length - 1]
+              : value
           )
-        const parsedValue = safeStringify(
-          options.takeLatestIfList && Array.isArray(value)
-            ? value[value.length - 1]
-            : value
-        )
-        if (!parsedValue) return ''
+        if (!parsedValue) return dollarSign + ''
         return parsedValue
       }
     )