all surrounding handles

Hello

I am trying to build a custom node, with handels surrounding the entire surface. However, it seems like the library cannot handle when calculating handleIds on the run. Is this true or am i missing anything

Code:

 {[...Array(Math.round(containerRef?.current?.offsetWidth / 5) || 0).keys()].map(x => (
        <Handle
          style={{ ...handleStyle, left: 5 * x || 5, top: 0 }}
          type="source"
          id={`top${x}`}
          position={Position.Top}
        />
   ))}

The error occurs in ConnectionLine

Error: Uncaught TypeError: Cannot read property ‘find’ of null at ConnectionLine (ReactFlow.js:8994) at renderWithHooks (react-dom.development.js:14803) at updateFunctionComponent (react-dom.development.js:17034) at beginWork (react-dom.development.js:18610) at HTMLUnknownElement.callCallback (react-dom.development.js:188) at HTMLUnknownElement.wrapped (build.umd.js:956) at Object.invokeGuardedCallbackDev (react-dom.development.js:237) at invokeGuardedCallback (react-dom.development.js:292) at beginWork$1 (react-dom.development.js:23203) at performUnitOfWork (react-dom.development.js:22154)

[Keanottesen]

@jonra1993

You just need to make a custom node that is circular and the put an icon in the middle. The handles I guess should be on the top en button. And if it is like customer.io or something, they all should expand from the same point. So you can just make the handles go across the upper half and the lower half, and be invisible

[andrody]

Same problem, if my array generates two or more handles, no error. But if is only one dynamic handle, this error