Ensure that waiting room cannot be rendered multiple times on the page

miroapp · Dec 13, 2023 · 3a91625 · 3a91625
1 parent 02e9a81
commit 3a91625
Showing 1 changed file with 11 additions and 1 deletion.
diff --git 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>
   );