#BUG: Only one SetNode call in series triggered by UseEffect takes effect

1 messages · Page 1 of 1 (latest)

jolly linden
#
    useEffect(() => {
      console.log("Current node: ", currID, "untattachedID: ", unattachedNodeID)
      const toggleNodes = unattachedNodeID === currID
      const showHideNodes = getNodes()
        .map((node) => {
          return children.some((child) => child.id === node.id && child.type === NodeType.UnattachedNode)
            ? {
              ...node,
              hidden: !toggleNodes
            }
            : node
        })
    
      const showHideEdges = getEdges()
        .map((edge) => {
          return children.some((child) => child.id === edge.target && child.type === NodeType.UnattachedNode)
          ? {
            ...edge,
            hidden: !toggleNodes
          }
          : edge
        })

      setNodes(showHideNodes);
      setEdges(showHideEdges);

      console.log(showHideNodes.filter((node) => !node.hidden))
    }, [unattachedNodeID, currID, children, getNodes, setNodes, getEdges, setEdges])

#

The hook should show all of the nodes attached children

#

I think this picture captures well whats wrong. See how the first console log (prints only node with hidden: false) prints the updated node state from the parent, but the second setNode seems to override it, even though in the code its only asked to make toggle the hidden state of its own children and return every other node as is

#

From this, I conclude that between:
parent:getNodes -> parent:setNodes() -> child:getNodes() -> child:setNodes(), the value of getNodes is not being updated