From 3edf4a25bee45ca73ba8e710e8d2591c62ec80d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Sun, 10 May 2026 21:55:33 -0500
Subject: [PATCH] impossible inspect element

---
 packages/website/src/components/Guesser.tsx | 24 +++++++++++++++------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/packages/website/src/components/Guesser.tsx b/packages/website/src/components/Guesser.tsx
index 62ff27553..292025229 100644
--- a/packages/website/src/components/Guesser.tsx
+++ b/packages/website/src/components/Guesser.tsx
@@ -58,12 +58,14 @@ export function Guesser() {
   const [results, setResults] = useState<TankDefinition[] | null>(null);
   const [selected, setSelected] = useState<TankDefinition | null>(null);
   const tiers = Guess.use((state) => state.tiers);
+  const status = useRef<HTMLSpanElement>(null);
 
   const requestSearch = useCallback(() => {
     setSelected(null);
     setSearching(true);
     search();
   }, []);
+
   const search = useCallback(
     debounce(() => {
       if (!input.current) return;
@@ -92,6 +94,20 @@ export function Guesser() {
     if (guessState !== GuessState.NotGuessed) setSelected(null);
   }, [guessState]);
 
+  useEffect(() => {
+    const interval = setInterval(() => {
+      if (!status.current) return;
+
+      status.current.innerText = literals(strings.website.tools.guess.stats, {
+        correct: correctGuesses,
+        total: totalGuesses,
+        streak: streak,
+      });
+    }, 1000 / 60);
+
+    return () => clearInterval(interval);
+  }, [correctGuesses, totalGuesses, streak]);
+
   return (
     <Flex
       direction="column"
@@ -158,13 +174,7 @@ export function Guesser() {
       </Box>
 
       <Flex justify="center" style={{ userSelect: "none" }}>
-        <Text>
-          {literals(strings.website.tools.guess.stats, {
-            correct: correctGuesses,
-            total: totalGuesses,
-            streak: streak,
-          })}
-        </Text>
+        <Text ref={status} />
       </Flex>
 
       <Flex gap={{ initial: "2", sm: "3" }}>