Function IterationNode

packages/ui/src/views/agentflowsv2/IterationNode.jsx:51–419

({ data })

// ===========================|| ITERATION NODE ||=========================== //

const IterationNode = ({ data }) => {
    const theme = useTheme()
    const customization = useSelector((state) => state.customization)
    const ref = useRef(null)
    const reactFlowWrapper = useRef(null)

    const updateNodeInternals = useUpdateNodeInternals()
    // eslint-disable-next-line
    const [position, setPosition] = useState(0)
    const [isHovered, setIsHovered] = useState(false)
    const { deleteNode, duplicateNode, reactFlowInstance } = useContext(flowContext)
    const [showInfoDialog, setShowInfoDialog] = useState(false)
    const [infoDialogProps, setInfoDialogProps] = useState({})

    const [cardDimensions, setCardDimensions] = useState({
        width: '300px',
        height: '250px'
    })

    // Add useEffect to update dimensions when reactFlowInstance becomes available
    useEffect(() => {
        if (reactFlowInstance) {
            const node = reactFlowInstance.getNodes().find((node) => node.id === data.id)
            if (node && node.width && node.height) {
                setCardDimensions({
                    width: `${node.width}px`,
                    height: `${node.height}px`
                })
            }
        }
    }, [reactFlowInstance, data.id])

    const defaultColor = '#666666' // fallback color if data.color is not present
    const nodeColor = data.color || defaultColor

    // Get different shades of the color based on state
    const getStateColor = () => {
        if (data.selected) return nodeColor
        if (isHovered) return alpha(nodeColor, 0.8)
        return alpha(nodeColor, 0.5)
    }

    const getOutputAnchors = () => {
        return data.outputAnchors ?? []
    }

    const getAnchorPosition = (index) => {
        const currentHeight = ref.current?.clientHeight || 0
        const spacing = currentHeight / (getOutputAnchors().length + 1)
        const position = spacing * (index + 1)

        // Update node internals when we get a non-zero position
        if (position > 0) {
            updateNodeInternals(data.id)
        }

        return position
    }