From 4d27df8fd7accdfb5a8a3db744c195f9c9e7bed5 Mon Sep 17 00:00:00 2001
From: ashfame <mail@ashfame.com>
Date: Tue, 1 Oct 2024 14:15:52 +0400
Subject: [PATCH] prevent double initialization of playground

---
 src/ui/preview/Playground.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/ui/preview/Playground.tsx b/src/ui/preview/Playground.tsx
index 1d6098f..ee5bbc1 100644
--- a/src/ui/preview/Playground.tsx
+++ b/src/ui/preview/Playground.tsx
@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { useEffect, useRef } from 'react';
 import {
 	PlaygroundClient,
 	StartPlaygroundOptions,
@@ -20,16 +20,20 @@ export function Playground( props: {
 } ) {
 	const { slug, className, blogName, onReady } = props;
 
+	const initializationRef = useRef( false );
+
 	useEffect( () => {
 		const iframe = document.getElementById( playgroundIframeId );
 		if ( ! ( iframe instanceof HTMLIFrameElement ) ) {
 			throw Error( 'Playground container element must be an iframe' );
 		}
-		if ( iframe.src !== '' ) {
-			// Playground is already started.
+		if ( iframe.src !== '' || initializationRef.current ) {
+			// Playground is already started or initialization has been attempted.
 			return;
 		}
 
+		initializationRef.current = true;
+
 		initPlayground( iframe, slug, blogName )
 			.then( async ( client: PlaygroundClient ) => {
 				const url = await client.absoluteUrl;
@@ -39,7 +43,7 @@ export function Playground( props: {
 			.catch( ( error ) => {
 				throw error;
 			} );
-	}, [ slug, onReady ] );
+	}, [ slug, onReady, blogName ] );
 
 	return (
 		<iframe