Hay algunos problemas:

1. No está pasando una función a setInterval , está llamando a setActiveTab y pasando su valor de retorno a setInterval .

2. Si estuviera pasando una función, estaría agregando un nuevo temporizador repetido cada vez que se ejecutara su componente. Consulte la documentación — useEffect :

   De forma predeterminada, los efectos se ejecutan después de cada procesamiento completo...

   Y setInterval :

   El método setInterval() ... llama repetidamente a una función o ejecuta un fragmento de código, con un retraso de tiempo fijo entre cada llamada.

   (mi énfasis)

   Iniciar un nuevo temporizador de repetición cada vez que su componente se vuelve a renderizar crea muchos temporizadores de repetición.

3. Su componente dejará el temporizador de intervalos funcionando si el componente está desmontado. Debería detener el temporizador de intervalos.

Para solucionarlo, pase una función, agregue una matriz de dependencia y agregue una devolución de llamada de limpieza para detener el intervalo:

 const [activeTab, setActiveTab] = useState(0); useEffect(() => { const handle = setInterval(() => { // *** A function setActiveTab(prevTab => { if (prevTab === 3) return 0; console.log("?ghi"); return prevTab += 1; }); }, 1000); return () => { // *** Clear the interval on unmount clearInterval(handle); // *** }; // *** }, []); // *** Empty dependency array = only run on mount

Nota al margen: Suponiendo que no necesita el console.log , la función de devolución de llamada del setter de estado puede ser más simple usando el operador restante:

 setActiveTab(prevTab => (prevTab + 1) % 3);

 useEffect(() => { setInterval(() => { setActiveTab((prevTab) => { if (prevTab !== 3) { return (prevTab += 1); } else { return 0; } // console.log("hi"); }); }, 1000); }, []);