fix: set maxHeight on TextEditor TinyMce widget [FC-0090] (#2024) (#2030)

Sets a max_height=500px for the TinyMCE editor when editing a Text/Html component.
This prevents the autoresize plugin from expanding the editor textarea beyond the bounds of the editor modal.

⚠️ Because the max height can only be a numeric pixel value, we can't use clever settings like vh or %, and so we're forced to limit the height of the editor to a fixed size for all screen sizes in order to address this issue.

(cherry picked from commit c5f7d0c)

Author: pomegranited

src/editors/containers/TextEditor/__snapshots__/index.test.jsx.snap

@@ -50,13 +50,13 @@ exports[`TextEditor snapshots block failed to load, Toast is shown 1`] = `
       }
       editorType="text"
       enableImageUpload={true}
-      height="100%"
       id={null}
       images={{}}
       initializeEditor={[MockFunction args.intializeEditor]}
       isLibrary={null}
       learningContextId="course+org+run"
       lmsEndpointUrl=""
+      maxHeight={500}
       minHeight={500}
       onChange={[Function]}
       setEditorRef={[MockFunction hooks.prepareEditorRef.setEditorRef]}
@@ -226,13 +226,13 @@ exports[`TextEditor snapshots renders as expected with default behavior 1`] = `
       }
       editorType="text"
       enableImageUpload={true}
-      height="100%"
       id={null}
       images={{}}
       initializeEditor={[MockFunction args.intializeEditor]}
       isLibrary={null}
       learningContextId="course+org+run"
       lmsEndpointUrl=""
+      maxHeight={500}
       minHeight={500}
       onChange={[Function]}
       setEditorRef={[MockFunction hooks.prepareEditorRef.setEditorRef]}
@@ -292,13 +292,13 @@ exports[`TextEditor snapshots renders static images with relative paths 1`] = `
       }
       editorType="text"
       enableImageUpload={true}
-      height="100%"
       id={null}
       images={{}}
       initializeEditor={[MockFunction args.intializeEditor]}
       isLibrary={null}
       learningContextId="course+org+run"
       lmsEndpointUrl=""
+      maxHeight={500}
       minHeight={500}
       onChange={[Function]}
       setEditorRef={[MockFunction hooks.prepareEditorRef.setEditorRef]}

src/editors/containers/TextEditor/index.jsx

@@ -65,7 +65,7 @@ const TextEditor = ({
         editorContentHtml={editorContent}
         setEditorRef={setEditorRef}
         minHeight={500}
-        height="100%"
+        maxHeight={500}
         initializeEditor={initializeEditor}
         {...{
           images,

src/editors/sharedComponents/TinyMceWidget/hooks.js

@@ -304,6 +304,7 @@ export const editorConfig = ({
   updateContent,
   content,
   minHeight,
+  maxHeight,
   learningContextId,
   staticRootUrl,
   enableImageUpload,
@@ -335,6 +336,7 @@ export const editorConfig = ({
       content_css: false,
       content_style: tinyMCEStyles + a11ycheckerCss,
       min_height: minHeight,
+      max_height: maxHeight,
       contextmenu: 'link table',
       directionality: isLocaleRtl ? 'rtl' : 'ltr',
       document_base_url: baseURL,