From 3a91625e0a655f8f7a81228f0733a5f00f018363 Mon Sep 17 00:00:00 2001
From: Daniel Fosco <daniel.pe@miro.com>
Date: Wed, 13 Dec 2023 13:19:13 +0100
Subject: [PATCH] Ensure that waiting room cannot be rendered multiple times on
 the page

---
 examples/breakout-rooms/src/app.tsx | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/examples/breakout-rooms/src/app.tsx b/examples/breakout-rooms/src/app.tsx
index 67e5cc4d2..cbd7efc5f 100644
--- a/examples/breakout-rooms/src/app.tsx
+++ b/examples/breakout-rooms/src/app.tsx
@@ -11,13 +11,23 @@ import { ErrorBoundary } from "./components/ErrorBoundary";
 
 const App: React.FC = () => {
   const { isFacilitator, breakout } = useBreakout();
+  const [waitingRoomRendered, setWaitingRoomRendered] = React.useState(false);
 
   const areYouReady = isFacilitator || !breakout;
 
+  const renderWaitingRoom = () => {
+    if (!waitingRoomRendered) {
+      setWaitingRoomRendered(true);
+    }
+  };
+
   return (
     <ErrorBoundary>
       <MiroProvider>
-        {areYouReady ? <BreakoutManager /> : <WaitingRoom />}
+        {areYouReady ? <BreakoutManager /> : null}
+        {!areYouReady && !waitingRoomRendered ? (
+          <WaitingRoom onRender={renderWaitingRoom} />
+        ) : null}
       </MiroProvider>
     </ErrorBoundary>
   );