score:1

Accepted answer
 const [counter, setCounter] = useState(0);
  const counterValid = counter < 60;
  useEffect(() => {
    const intervalId = counterValid && setInterval(() => 
        setCounter((t) => t + 1)
      , 100);
      return () => clearInterval(intervalId)
  }, [counterValid]);

  return (
    <div>
      <div>
        <Circle
          size={250}
          strokeWidth={5}
          percentage={counter*(100/60)}
          color="#229880"
        />
      </div>
    </div>

score:0

// Change this
setCounter((t) => t + 1);

// To this
setCounter(counter + 1);

score:3

useEffect(() => {
  const intervalId = setInterval(() => {
    setCounter((t) => {
      if (t >= 60) clearInterval(intervalId);
      return (t < 60) ? t + 1 : t;
    });
  }, 100);
  return () => clearInterval(intervalId);
}, []);

Related Query

More Query from same tag