From 0e76205a8833c9aae0e2ad14697552baed52da57 Mon Sep 17 00:00:00 2001
From: Kiran Ashok <stepinfwd@gmail.com>
Date: Wed, 22 May 2024 13:21:59 +0530
Subject: [PATCH 1/2] fix : Codehinter crash fix , miscellaneous ui fixes
 (#9814)

* fix : codehinter crash , misc ui fixes

* fixes: codehinter fx option in event manager
---
 frontend/src/Editor/BoxUI.jsx                    |  3 +--
 .../Editor/CodeEditor/MultiLineCodeEditor.jsx    |  6 ++++--
 .../Editor/CodeEditor/SingleLineCodeEditor.jsx   |  8 ++++++--
 frontend/src/Editor/CodeEditor/styles.scss       | 16 ++++++++++++++--
 frontend/src/Editor/Inspector/EventManager.jsx   |  7 ++++---
 frontend/src/_components/DynamicForm.jsx         |  1 +
 6 files changed, 30 insertions(+), 11 deletions(-)

diff --git a/frontend/src/Editor/BoxUI.jsx b/frontend/src/Editor/BoxUI.jsx
index 766339586a..76e52db2b1 100644
--- a/frontend/src/Editor/BoxUI.jsx
+++ b/frontend/src/Editor/BoxUI.jsx
@@ -65,8 +65,7 @@ const BoxUI = (props) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [JSON.stringify(customResolvables), readOnly]);
 
-  let exposedVariables = !_.isEmpty(currentState?.component) ? currentState?.components[component.name] ?? {} : {};
-
+  let exposedVariables = !_.isEmpty(currentState?.components) ? currentState?.components[component.name] ?? {} : {};
   const fireEvent = (eventName, options) => {
     if (mode === 'edit' && eventName === 'onClick') {
       onComponentClick(id, component);
diff --git a/frontend/src/Editor/CodeEditor/MultiLineCodeEditor.jsx b/frontend/src/Editor/CodeEditor/MultiLineCodeEditor.jsx
index 881462018f..507a15a550 100644
--- a/frontend/src/Editor/CodeEditor/MultiLineCodeEditor.jsx
+++ b/frontend/src/Editor/CodeEditor/MultiLineCodeEditor.jsx
@@ -63,7 +63,9 @@ const MultiLineCodeEditor = (props) => {
   }, []);
 
   const handleOnBlur = () => {
-    onChange(currentValue);
+    setTimeout(() => {
+      onChange(currentValue);
+    }, 100);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   };
 
@@ -215,7 +217,7 @@ const MultiLineCodeEditor = (props) => {
           callgpt={null}
         >
           <ErrorBoundary>
-            <div className="codehinter-container w-100 " data-cy={`${cyLabel}-input-field`}>
+            <div className="codehinter-container w-100 " data-cy={`${cyLabel}-input-field`} style={{ height: '100%' }}>
               <CodeMirror
                 value={currentValue}
                 placeholder={placeholder}
diff --git a/frontend/src/Editor/CodeEditor/SingleLineCodeEditor.jsx b/frontend/src/Editor/CodeEditor/SingleLineCodeEditor.jsx
index 87a9b273a4..5d0cf5ce5e 100644
--- a/frontend/src/Editor/CodeEditor/SingleLineCodeEditor.jsx
+++ b/frontend/src/Editor/CodeEditor/SingleLineCodeEditor.jsx
@@ -304,7 +304,7 @@ const DynamicEditorBridge = (props) => {
     initialValue,
     type,
     fxActive,
-    paramType,
+    paramType = 'code',
     paramLabel,
     paramName,
     fieldMeta,
@@ -341,7 +341,11 @@ const DynamicEditorBridge = (props) => {
         <div className={`${(paramType ?? 'code') === 'code' ? 'd-none' : ''} flex-grow-1`}>
           <div
             style={{ marginBottom: codeShow ? '0.5rem' : '0px' }}
-            className="d-flex align-items-center justify-content-end "
+            className={`d-flex align-items-center ${
+              paramLabel !== ' ' && !HIDDEN_CODE_HINTER_LABELS.includes(paramLabel)
+                ? 'justify-content-end'
+                : 'justify-content-start'
+            }`}
           >
             {paramLabel !== 'Type' && isFxNotRequired === undefined && (
               <div className="col-auto pt-0 fx-common fx-button-container">
diff --git a/frontend/src/Editor/CodeEditor/styles.scss b/frontend/src/Editor/CodeEditor/styles.scss
index f18d9a7e94..e63c817f2e 100644
--- a/frontend/src/Editor/CodeEditor/styles.scss
+++ b/frontend/src/Editor/CodeEditor/styles.scss
@@ -201,7 +201,7 @@
     }
 }
 
-.ͼ1 .cm-placeholder{
+.ͼ1 .cm-placeholder {
     vertical-align: middle;
 }
 
@@ -248,8 +248,19 @@
 }
 
 
+.modal-body {
+    .codehinter-multi-line-input {
+        .cm-editor {
+            height: 100%;
+        }
+    }
+}
+
 .codehinter-multi-line-input {
+    height: 100%;
+
     .cm-editor {
+        min-height: 300px;
         height: 300px;
         max-height: fit-content !important;
 
@@ -478,6 +489,7 @@
 
 .cm-content {
     max-width: 98%;
+    flex-shrink: 1 !important;
 }
 
 .cm-line {
@@ -519,4 +531,4 @@
             max-width: 100% !important;
         }
     }
-}
+}
\ No newline at end of file
diff --git a/frontend/src/Editor/Inspector/EventManager.jsx b/frontend/src/Editor/Inspector/EventManager.jsx
index 1dce8f8846..099e33f70e 100644
--- a/frontend/src/Editor/Inspector/EventManager.jsx
+++ b/frontend/src/Editor/Inspector/EventManager.jsx
@@ -898,17 +898,18 @@ export const EventManager = ({
                       ) : (
                         <div
                           className={`${
-                            param?.type ? 'col-7' : 'col-9 fx-container-eventmanager-code'
-                          } fx-container-eventmanager ${param.type == 'select' && 'component-action-select'}`}
+                            param?.type ? '' : 'fx-container-eventmanager-code'
+                          } col-9 fx-container-eventmanager ${param.type == 'select' && 'component-action-select'}`}
                           data-cy="action-options-text-input-field"
                         >
                           <CodeHinter
-                            type="basic"
+                            type="fxEditor"
                             initialValue={valueForComponentSpecificActionHandle(event, param)}
                             onChange={(value) => {
                               onChangeHandlerForComponentSpecificActionHandle(value, index, param, event);
                             }}
                             paramType={param?.type}
+                            paramLabel={' '}
                             fieldMeta={{ options: param?.options }}
                             cyLabel={`event-${param.displayName}`}
                             component={component}
diff --git a/frontend/src/_components/DynamicForm.jsx b/frontend/src/_components/DynamicForm.jsx
index 765a046771..13971b9735 100644
--- a/frontend/src/_components/DynamicForm.jsx
+++ b/frontend/src/_components/DynamicForm.jsx
@@ -489,6 +489,7 @@ const DynamicForm = ({
                   'flex-grow-1': isHorizontalLayout && !isSpecificComponent,
                   'w-100': isHorizontalLayout && type !== 'codehinter',
                 })}
+                style={{ width: '100%' }}
               >
                 <Element
                   {...getElementProps(obj[key])}

From 7a6068d7be3d875a612b0d088f0231df8fa2af19 Mon Sep 17 00:00:00 2001
From: Muhsin Shah <muhsinshah21@gmail.com>
Date: Thu, 23 May 2024 19:32:02 +0530
Subject: [PATCH 2/2] Changed currentState update func to the not reset
 constants state

---
 frontend/src/_stores/currentStateStore.js | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/frontend/src/_stores/currentStateStore.js b/frontend/src/_stores/currentStateStore.js
index c111f77311..98201873f2 100644
--- a/frontend/src/_stores/currentStateStore.js
+++ b/frontend/src/_stores/currentStateStore.js
@@ -55,7 +55,14 @@ export const useCurrentStateStore = create(
         },
         setEditorReady: (isEditorReady) => set({ isEditorReady }),
         initializeCurrentStateOnVersionSwitch: () => {
-          set({ ...initialState }, false, { type: 'INITIALIZE_CURRENT_STATE_ON_VERSION_SWITCH', initialState });
+          const newInitialState = {
+            ...initialState,
+            constants: get().constants,
+          };
+          set({ ...newInitialState }, false, {
+            type: 'INITIALIZE_CURRENT_STATE_ON_VERSION_SWITCH',
+            newInitialState,
+          });
         },
       },
     }),