Funciona perfecto gracias brandovidal

[tribal spruce]

por nada @olive tundra, realmente me puse a probar tu codigo en local, para terminar de entender lo que faltaba, asi note que al useEffect necesita como dependencia a showContent (e inclusive a showContentListener).

Por otro lado como estabas usando querySelector tambien me enfoque en realizar la solucion con eso mismo, y habia que detectar tambien al boton.

Asimismo como usabas un listener del window, cuando se da click a un elemento (que esta contenido dentro de otro), el elemento final que le damos click suele ser el ultimo hijo, y esto no suele ser lo que queremos, poreso uso el metodo closest, porque en nuestro caso queremos identificar a un elemento padre, para no modificar erroneamente el valor de showContent.

Y claro esta debe ser una solucion de muchas, no se suele usar **querySelector ** por eficiencia por ejemplo (se podria intentar con useRef), pero voy al punto que lo primero es dar con la solucion despues uno ya piensa en mejorar el codigo, solamente usando hooks de React, pero esta bonito entender e intentarlo con js.

Bueno sin mas un gusto haberte ayudado, para eso estamos. 😌

[olive tundra]

Muy bien explicado y toda la razon con lo de que primero es dar con la solucion.

Yo entiendo que useRef es mas eficiente, pero como no funcionaba cuando lo estaba usando decidi probar con querySelector, entonces me quedo asi el codigo ya en el momento que decidi hacer la pregunta, sin mas. Precisamente por eso, porque estaba buscando una solucion.

Muchas gracias de nuevo!