Tengo el siguiente problema, configuro la opacidad de un elemento según el estado de uso, pero si tomo otra ruta, la opacidad vuelve a 0

 const [phoneVisible, setPhoneVisible] = useState(false); useLayoutEffect(() => { if (toggleEvent !== "undefined") { setTimeout(() => { animatePhone(phoneRef, toggleEvent); setPhoneVisible(toggleEvent); }, 100); } }, [phoneRef, toggleEvent]); return ( <> <div ref={phoneRef} style={{ opacity: phoneVisible ? 1 : 0 }} className="relative w-screen h-screen" > ... </div> </> );

se me acabaron las ideas, gracias por tu ayuda