From 34481513da1702e24eba70535b5f1a66d6174142 Mon Sep 17 00:00:00 2001
From: Tilman Vatteroth <git@tilmanvatteroth.de>
Date: Sat, 8 Oct 2022 17:31:29 +0200
Subject: [PATCH] feat(render-iframe): show wait spinner until renderer is
 ready

Signed-off-by: Tilman Vatteroth <git@tilmanvatteroth.de>
---
 src/components/editor-page/renderer-pane/render-iframe.tsx | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/components/editor-page/renderer-pane/render-iframe.tsx b/src/components/editor-page/renderer-pane/render-iframe.tsx
index ca98a6ad1..e48592937 100644
--- a/src/components/editor-page/renderer-pane/render-iframe.tsx
+++ b/src/components/editor-page/renderer-pane/render-iframe.tsx
@@ -26,6 +26,8 @@ import { useEffectOnRenderTypeChange } from './hooks/use-effect-on-render-type-c
 import { cypressAttribute, cypressId } from '../../../utils/cypress-attribute'
 import { getGlobalState } from '../../../redux'
 import { ORIGIN, useBaseUrl } from '../../../hooks/common/use-base-url'
+import { ShowIf } from '../../common/show-if/show-if'
+import { WaitSpinner } from '../../common/wait-spinner/wait-spinner'
 
 export interface RenderIframeProps extends RendererProps {
   rendererType: RendererType
@@ -168,6 +170,9 @@ export const RenderIframe: React.FC<RenderIframeProps> = ({
   return (
     <Fragment>
       <CommunicatorImageLightbox />
+      <ShowIf condition={!rendererReady}>
+        <WaitSpinner />
+      </ShowIf>
       <iframe
         style={{ height: `${frameHeight}px` }}
         {...cypressId('documentIframe')}