Form CSA not working as expected (#9822)

* fix : broken csa in form component

* fix: switch page and go to app query params are not saving due to mutation

* added an extra check if envs refs are undefined

---------

Co-authored-by: Kavin Venkatachalam <kavin.saratha@gmail.com>

frontend/src/Editor/Components/DropDown.jsx

@@ -60,7 +60,10 @@ export const DropDown = function DropDown({
 
   const setExposedItem = (value, index, onSelectFired = false) => {
     setCurrentValue(value);
-    onSelectFired ? setExposedVariable('value', value).then(fireEvent('onSelect')) : setExposedVariable('value', value);
+    if (onSelectFired) {
+      setExposedVariable('value', value);
+      fireEvent('onSelect');
+    } else setExposedVariable('value', value);
     setExposedVariable('selectedOptionLabel', index === undefined ? undefined : display_values?.[index]);
   };
 

frontend/src/Editor/Components/NumberInput.jsx

@@ -198,10 +198,12 @@ export const NumberInput = function NumberInput({
     setValue(Number(parseFloat(e.target.value)));
     if (e.target.value == '') {
       setValue(null);
-      setExposedVariable('value', null).then(fireEvent('onChange'));
+      setExposedVariable('value', null);
+      fireEvent('onChange');
     }
     if (!isNaN(Number(parseFloat(e.target.value)))) {
-      setExposedVariable('value', Number(parseFloat(e.target.value))).then(fireEvent('onChange'));
+      setExposedVariable('value', Number(parseFloat(e.target.value)));
+      fireEvent('onChange');
     }
   };
   useEffect(() => {
@@ -223,7 +225,8 @@ export const NumberInput = function NumberInput({
     const newValue = (value || 0) + 1;
     setValue(newValue);
     if (!isNaN(newValue)) {
-      setExposedVariable('value', newValue).then(fireEvent('onChange'));
+      setExposedVariable('value', newValue);
+      fireEvent('onChange');
     }
   };
   const handleDecrement = (e) => {
@@ -231,7 +234,8 @@ export const NumberInput = function NumberInput({
     const newValue = (value || 0) - 1;
     setValue(newValue);
     if (!isNaN(newValue)) {
-      setExposedVariable('value', newValue).then(fireEvent('onChange'));
+      setExposedVariable('value', newValue);
+      fireEvent('onChange');
     }
   };
   useEffect(() => {
@@ -245,13 +249,15 @@ export const NumberInput = function NumberInput({
       if (text) {
         const newValue = Number(parseFloat(text));
         setValue(newValue);
-        setExposedVariable('value', text).then(fireEvent('onChange'));
+        setExposedVariable('value', text);
+        fireEvent('onChange');
       }
     });
 
     setExposedVariable('clear', async function () {
       setValue('');
-      setExposedVariable('value', '').then(fireEvent('onChange'));
+      setExposedVariable('value', '');
+      fireEvent('onChange');
     });
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);

frontend/src/Editor/Components/PasswordInput.jsx

@@ -168,11 +168,13 @@ export const PasswordInput = function PasswordInput({
   useEffect(() => {
     setExposedVariable('setText', async function (text) {
       setPasswordValue(text);
-      setExposedVariable('value', text).then(fireEvent('onChange'));
+      setExposedVariable('value', text);
+      fireEvent('onChange');
     });
     setExposedVariable('clear', async function () {
       setPasswordValue('');
-      setExposedVariable('value', '').then(fireEvent('onChange'));
+      setExposedVariable('value', '');
+      fireEvent('onChange');
     });
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [setPasswordValue]);

frontend/src/Editor/Components/TextInput.jsx

@@ -180,11 +180,13 @@ export const TextInput = function TextInput({
     const exposedVariables = {
       setText: async function (text) {
         setValue(text);
-        setExposedVariable('value', text).then(fireEvent('onChange'));
+        setExposedVariable('value', text);
+        fireEvent('onChange');
       },
       clear: async function () {
         setValue('');
-        setExposedVariable('value', '').then(fireEvent('onChange'));
+        setExposedVariable('value', '');
+        fireEvent('onChange');
       },
     };
     setExposedVariables(exposedVariables);

frontend/src/Editor/Inspector/EventManager.jsx

@@ -520,7 +520,7 @@ export const EventManager = ({
 
             {event.actionId === 'go-to-app' && (
               <GotoApp
-                event={event}
+                event={_.cloneDeep(event)}
                 handlerChanged={handlerChanged}
                 eventIndex={index}
                 getAllApps={getAllApps}
@@ -823,7 +823,7 @@ export const EventManager = ({
             )}
             {event.actionId === 'switch-page' && (
               <SwitchPage
-                event={event}
+                event={_.cloneDeep(event)}
                 handlerChanged={handlerChanged}
                 eventIndex={index}
                 getPages={() => getPageOptions(event)}