From 579919f14296335a08440b7a211cff8ea75a52b1 Mon Sep 17 00:00:00 2001
From: Tilman Vatteroth <git@tilmanvatteroth.de>
Date: Thu, 6 Oct 2022 22:05:31 +0200
Subject: [PATCH] feat(renderer): Add flag to enable auto height for render
 iframe

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
---
 .../editor-page/renderer-pane/render-iframe.tsx    | 14 +++++++++++---
 src/components/intro-page/intro-custom-content.tsx |  1 +
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/components/editor-page/renderer-pane/render-iframe.tsx b/src/components/editor-page/renderer-pane/render-iframe.tsx
index 0674e890e..ca98a6ad1 100644
--- a/src/components/editor-page/renderer-pane/render-iframe.tsx
+++ b/src/components/editor-page/renderer-pane/render-iframe.tsx
@@ -32,6 +32,7 @@ export interface RenderIframeProps extends RendererProps {
   forcedDarkMode?: boolean
   frameClasses?: string
   onRendererStatusChange?: undefined | ((rendererReady: boolean) => void)
+  adaptFrameHeightToContent?: boolean
 }
 
 const log = new Logger('RenderIframe')
@@ -50,6 +51,7 @@ const log = new Logger('RenderIframe')
  * @param frameClasses CSS classes that should be applied to the iframe
  * @param rendererType The {@link RendererType type} of the renderer to use.
  * @param forcedDarkMode If set, the dark mode will be set to the given value. Otherwise, the dark mode won't be changed.
+ * @param adaptFrameHeightToContent If set, the iframe height will be adjusted to the content height
  * @param onRendererStatusChange Callback that is fired when the renderer in the iframe is ready
  */
 export const RenderIframe: React.FC<RenderIframeProps> = ({
@@ -62,6 +64,7 @@ export const RenderIframe: React.FC<RenderIframeProps> = ({
   frameClasses,
   rendererType,
   forcedDarkMode,
+  adaptFrameHeightToContent,
   onRendererStatusChange
 }) => {
   const [rendererReady, setRendererReady] = useState<boolean>(false)
@@ -113,9 +116,14 @@ export const RenderIframe: React.FC<RenderIframeProps> = ({
 
   useEditorReceiveHandler(
     CommunicationMessageType.ON_HEIGHT_CHANGE,
-    useCallback((values: OnHeightChangeMessage) => {
-      setFrameHeight?.(values.height)
-    }, [])
+    useCallback(
+      (values: OnHeightChangeMessage) => {
+        if (adaptFrameHeightToContent) {
+          setFrameHeight?.(values.height)
+        }
+      },
+      [adaptFrameHeightToContent]
+    )
   )
 
   useEditorReceiveHandler(
diff --git a/src/components/intro-page/intro-custom-content.tsx b/src/components/intro-page/intro-custom-content.tsx
index e3243c89d..f53b672c1 100644
--- a/src/components/intro-page/intro-custom-content.tsx
+++ b/src/components/intro-page/intro-custom-content.tsx
@@ -32,6 +32,7 @@ export const IntroCustomContent: React.FC = () => {
       markdownContentLines={content}
       rendererType={RendererType.INTRO}
       forcedDarkMode={true}
+      adaptFrameHeightToContent={true}
     />
   )
 }