Reaccionar principiante (aprendiendo mediante codificación), aquí tengo diferentes cámaras, estas cámaras se activan cuando se hace clic en el botón como el botón 1 (cámara 1), el botón 2 (cámara 2), cuando hago clic en uno de esos botones, luego comienza a filtrar, lo que luego muestra versión filtrada en <graph>, tengo un gráfico donde mi filteredGraphData afecta, cuando se hace clic en el botón, se filtra, pero luego, cuando se hace clic en el mismo botón por segunda vez, debe desfiltrar o deseleccionar, pero no lo hace, solo lo hace por alguna razón cuando i haga clic en el mismo botón por tercera vez. ¿Alguna idea de por qué no filtra/deselecciona en el tercer clic y no en el segundo clic? He estado atascado con esto durante unas horas ahora
import { Graph } from "react-d3-graph"; const intialState = { extendDetails: false, }; const visualGraph = useSelector((state: RootStateOrAny) => state.graph.graph ); const currentCam = useSelector((state: RootStateOrAny) => state.currentCam ); const [filteredGraphData, setFilteredGraphData] = useState<any>(""); const [toggleSiteCheckmark, setToggleSiteCheckmark] = useState(intialState); useEffect(() => { if (currentCam ) { const filterCamera = () => { let nodes = nodes.filter( (x: any) => x.camera == currentCam.identifier ); let links = links.filter((x: any) => nodes?.map((y: any) => y.id).includes(x.source) ); let sourceNodess = nodes.filter((x: any) => links.map((y: any) => y.target).includes(x.id) ); let allNodes = nodes?.concat(sourceNodess); setFilteredGraphData( toggleSiteCheckmark.extendDetails == false ? { links: links, nodes: allNodes } : visualGraph ); setToggleSiteCheckmark({ ...toggleSiteCheckmark, extendDetails: !toggleSiteCheckmark.extendDetails, }); }; filterCamera(); } }, [currentCam]); console.log("filteredgraphdata", toggleSiteCheckmark.extendDetails); <Graph data={filteredGraphData || visualGraph} />