estoy empezando con react y se me presenta un problema y es que tengo dos componentes (padre, hijo) necesito que cuando le de click a un button este mediante useState pase una prop la cual me permita activar una clase y mostrar en pantalla una ventana del SEGUNDO COMPONENTE, pero este segundo componente (hijo) también tiene un button para cerrar la ventana, por lo que si lo hago de la manera como lo enseño en el código tengo que hacer doble click en el button del componente padre para nuevamente mostrar la ventana.
¿Cómo hago para modificar el state de mi componente padre desde el componente hijo cuando le de click al botón?
Si me pueden ayudar se los agradecería mucho.
const ComponentOne = () => {
const [showLogIn, setShowLogIn ] = useState(false);
return(
<>
<button onClick={setShowLogIn(!showLogIn)}>Iniciar Sesión</button>
<ComponentTwo showWindow={showLogIn} />
</>
)
}
const ComponentTwo = (props) => {
const { showWindow } = props;
const [closeLogIn, setCloseLogIn] = useState(showWindow);
const show = closeLogIn ? "active" : "";
return(
<>
<button className="close-window" onClick={setCloseLogIn(!closeLogIn)}></button>
<div className={`formulario-registro ${show}`} >
{/* ... */}
</div>
</>
)
}