feat(#682): Add validation for request vars & dynamic vars

packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/index.js

@@ -23,7 +23,7 @@ const EnvironmentVariables = ({ environment, collection }) => {
         enabled: Yup.boolean(),
         name: Yup.string()
           .required('Name cannot be empty')
-          .matches(/^[^\d]\w*$/, 'Name contains invalid characters')
+          .matches(/^(?!\d)\w*$/, 'Name contains invalid characters')
           .trim(),
         secret: Yup.boolean(),
         type: Yup.string(),

packages/bruno-app/src/components/RequestPane/Vars/VarsTable/index.js

@@ -8,6 +8,7 @@ import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collection
 import SingleLineEditor from 'components/SingleLineEditor';
 import Tooltip from 'components/Tooltip';
 import StyledWrapper from './StyledWrapper';
+import toast from 'react-hot-toast';
 
 const VarsTable = ({ item, collection, vars, varType }) => {
   const dispatch = useDispatch();
@@ -29,7 +30,19 @@ const VarsTable = ({ item, collection, vars, varType }) => {
     const _var = cloneDeep(v);
     switch (type) {
       case 'name': {
-        _var.name = e.target.value;
+        const value = e.target.value;
+
+        if (/^(?!\d).*$/.test(value) === false) {
+          toast.error('Variable names must not start with a number!');
+          return;
+        }
+
+        if (/^\w*$/.test(value) === false) {
+          toast.error('Variable contains invalid character! Variables must only contain alpha-numeric characters.');
+          return;
+        }
+
+        _var.name = value;
         break;
       }
       case 'value': {
@@ -88,7 +101,7 @@ const VarsTable = ({ item, collection, vars, varType }) => {
         </thead>
         <tbody>
           {vars && vars.length
-            ? vars.map((_var, index) => {
+            ? vars.map((_var) => {
                 return (
                   <tr key={_var.uid}>
                     <td>

packages/bruno-app/src/components/RequestPane/Vars/index.js

@@ -1,42 +1,12 @@
 import React from 'react';
 import get from 'lodash/get';
-import { useDispatch } from 'react-redux';
-import { updateRequestScript, updateResponseScript } from 'providers/ReduxStore/slices/collections';
-import { sendRequest, saveRequest } from 'providers/ReduxStore/slices/collections/actions';
-import { useTheme } from 'providers/Theme';
 import VarsTable from './VarsTable';
 import StyledWrapper from './StyledWrapper';
 
 const Vars = ({ item, collection }) => {
-  const dispatch = useDispatch();
   const requestVars = item.draft ? get(item, 'draft.request.vars.req') : get(item, 'request.vars.req');
   const responseVars = item.draft ? get(item, 'draft.request.vars.res') : get(item, 'request.vars.res');
 
-  const { storedTheme } = useTheme();
-
-  const onRequestScriptEdit = (value) => {
-    dispatch(
-      updateRequestScript({
-        script: value,
-        itemUid: item.uid,
-        collectionUid: collection.uid
-      })
-    );
-  };
-
-  const onResponseScriptEdit = (value) => {
-    dispatch(
-      updateResponseScript({
-        script: value,
-        itemUid: item.uid,
-        collectionUid: collection.uid
-      })
-    );
-  };
-
-  const onRun = () => dispatch(sendRequest(item, collection.uid));
-  const onSave = () => dispatch(saveRequest(item.uid, collection.uid));
-
   return (
     <StyledWrapper className="w-full flex flex-col">
       <div className="flex-1 mt-2">

packages/bruno-js/src/bru.js

@@ -59,10 +59,24 @@ class Bru {
       throw new Error('Key is required');
     }
 
+    if (/^(?!\d)\w*$/.test(key) === false) {
+      throw new Error(
+        `Variable name: "${key}" contains invalid characters!` +
+          ' Names must only contain alpha-numeric characters and cannot start with a digit.'
+      );
+    }
+
     this.collectionVariables[key] = value;
   }
 
   getVar(key) {
+    if (/^(?!\d)\w*$/.test(key) === false) {
+      throw new Error(
+        `Variable name: "${key}" contains invalid characters!` +
+          ' Names must only contain alpha-numeric characters and cannot start with a digit.'
+      );
+    }
+
     return this.collectionVariables[key];
   }
 }