Merge branch 'fix/codemirror/responsive-height' into 'release'

Fix non responsive height for dynamic code editor

See merge request theappsmith/internal-tools-client!218

app/client/src/components/editorComponents/DynamicAutocompleteInput.tsx

@@ -129,7 +129,7 @@ interface ReduxStateProps {
 export type DynamicAutocompleteInputProps = {
   placeholder?: string;
   leftIcon?: Function;
-  initialHeight: number;
+  height?: number;
   theme?: THEME;
   meta?: Partial<WrappedFieldMetaProps>;
   showLineNumbers?: boolean;
@@ -172,7 +172,9 @@ class DynamicAutocompleteInput extends Component<Props> {
         completeSingle: false,
         globalScope: this.props.dynamicData,
       });
-      this.editor.setSize(0, this.props.initialHeight);
+      if (this.props.height) {
+        this.editor.setSize(0, this.props.height);
+      }
       this.editor.eachLine(this.highlightBindings);
     }
   }

app/client/src/components/editorComponents/form/fields/KeyValueFieldArray.tsx

@@ -32,16 +32,8 @@ const KeyValueRow = (props: Props & WrappedFieldArrayProps) => {
       {props.fields.map((field: any, index: number) => (
         <FormRowWithLabel key={index}>
           {index === 0 && <FormLabel>{props.label}</FormLabel>}
-          <DynamicTextField
-            name={`${field}.key`}
-            placeholder="Key"
-            initialHeight={32}
-          />
-          <DynamicTextField
-            name={`${field}.value`}
-            placeholder="Value"
-            initialHeight={32}
-          />
+          <DynamicTextField name={`${field}.key`} placeholder="Key" />
+          <DynamicTextField name={`${field}.value`} placeholder="Value" />
           {index === props.fields.length - 1 ? (
             <Icon
               icon="plus"

app/client/src/components/propertyControls/CodeEditorControl.tsx

@@ -12,7 +12,6 @@ class CodeEditorControl extends BaseControl<ControlProps> {
         <DynamicAutocompleteInput
           theme={"DARK"}
           input={{ value: this.props.propertyValue, onChange: this.onChange }}
-          initialHeight={32}
         />
       </ControlWrapper>
     );

app/client/src/components/propertyControls/InputTextControl.tsx

@@ -23,7 +23,6 @@ class InputTextControl extends BaseControl<InputControlProps> {
               touched: true,
             }}
             theme={"DARK"}
-            initialHeight={32}
           />
         </StyledDynamicInput>
       </ControlWrapper>

app/client/src/pages/Editor/APIEditor/Form.tsx

@@ -146,7 +146,6 @@ const ApiEditorForm: React.FC<Props> = (props: Props) => {
             placeholder="v1/method"
             name="actionConfiguration.path"
             leftIcon={FormIcons.SLASH_ICON}
-            initialHeight={32}
           />
         </FormRow>
       </MainConfiguration>
@@ -166,7 +165,7 @@ const ApiEditorForm: React.FC<Props> = (props: Props) => {
               <JSONEditorFieldWrapper>
                 <DynamicTextField
                   name="actionConfiguration.body"
-                  initialHeight={300}
+                  height={300}
                   showLineNumbers
                   allowTabIndent
                 />