From a67c11ae045bcbf17861d9475dc824cb97652f8d Mon Sep 17 00:00:00 2001 From: Thomas Hallock Date: Wed, 26 Nov 2025 14:33:36 -0600 Subject: [PATCH] fix(know-your-world): prevent hint bubble closing when toggling settings MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Use refs for autoHint/autoSpeak/withAccent settings so that changing them doesn't trigger the hint bubble effect. The bubble now stays open when toggling settings - changes only affect behavior on next region. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- .../know-your-world/components/MapRenderer.tsx | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/apps/web/src/arcade-games/know-your-world/components/MapRenderer.tsx b/apps/web/src/arcade-games/know-your-world/components/MapRenderer.tsx index cf383ce0..7687b70e 100644 --- a/apps/web/src/arcade-games/know-your-world/components/MapRenderer.tsx +++ b/apps/web/src/arcade-games/know-your-world/components/MapRenderer.tsx @@ -626,23 +626,31 @@ export function MapRenderer({ // Track previous prompt to detect region changes const prevPromptRef = useRef(null) + // Store autoHint/autoSpeak in refs so we can read current values without triggering effect + const autoHintRef = useRef(autoHint) + const autoSpeakRef = useRef(autoSpeak) + const withAccentRef = useRef(withAccent) + autoHintRef.current = autoHint + autoSpeakRef.current = autoSpeak + withAccentRef.current = withAccent // Handle hint bubble and auto-speak when the prompt changes (new region to find) + // Only runs when currentPrompt changes, not when settings change useEffect(() => { const isNewRegion = prevPromptRef.current !== null && prevPromptRef.current !== currentPrompt prevPromptRef.current = currentPrompt - if (autoHint && hasHint) { + if (autoHintRef.current && hasHint) { setShowHintBubble(true) // If region changed and both auto-hint and auto-speak are enabled, speak immediately // This handles the case where the bubble was already open - if (isNewRegion && autoSpeak && hintText && isSpeechSupported) { - speakHint(hintText, withAccent) + if (isNewRegion && autoSpeakRef.current && hintText && isSpeechSupported) { + speakHint(hintText, withAccentRef.current) } } else { setShowHintBubble(false) } - }, [currentPrompt, autoHint, hasHint, autoSpeak, hintText, isSpeechSupported, speakHint, withAccent]) + }, [currentPrompt, hasHint, hintText, isSpeechSupported, speakHint]) // Configuration const MAX_ZOOM = 1000 // Maximum zoom level (for Gibraltar at 0.08px!)