From 827df18c627e5ad1b0ffeb01f409136c585e6819 Mon Sep 17 00:00:00 2001
From: Its-treason <39559178+Its-treason@users.noreply.github.com>
Date: Wed, 25 Oct 2023 23:13:37 +0200
Subject: [PATCH] feat(#682): Add validation for request vars & dynamic vars

---
 .../EnvironmentVariables/index.js             |  2 +-
 .../RequestPane/Vars/VarsTable/index.js       | 17 +++++++++--
 .../src/components/RequestPane/Vars/index.js  | 30 -------------------
 packages/bruno-js/src/bru.js                  | 14 +++++++++
 4 files changed, 30 insertions(+), 33 deletions(-)

diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/index.js
index 6ac7f8e4c..dfd93be33 100644
--- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/index.js
+++ b/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(),
diff --git a/packages/bruno-app/src/components/RequestPane/Vars/VarsTable/index.js b/packages/bruno-app/src/components/RequestPane/Vars/VarsTable/index.js
index 6ee760978..77785e47a 100644
--- a/packages/bruno-app/src/components/RequestPane/Vars/VarsTable/index.js
+++ b/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>
diff --git a/packages/bruno-app/src/components/RequestPane/Vars/index.js b/packages/bruno-app/src/components/RequestPane/Vars/index.js
index b63c08801..500ebb25b 100644
--- a/packages/bruno-app/src/components/RequestPane/Vars/index.js
+++ b/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">
diff --git a/packages/bruno-js/src/bru.js b/packages/bruno-js/src/bru.js
index 3cd9e8f5f..5eaae4cca 100644
--- a/packages/bruno-js/src/bru.js
+++ b/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];
   }
 }