`Cannot insert node before itself` on conditional rendering

Current Behavior

When doing a conditional rendering that adds a new child node to a parent that already has children nodes, we get the error.

Uncaught Invariant Violation: Cannot insert node before itself
    invariant invariant.js:26
    insertBefore insertBefore.js:15
    insertOrAppendPlacementNode react-reconciler.development.js:15581
    commitPlacement react-reconciler.development.js:15525
    commitReconciliationEffects react-reconciler.development.js:16308

Expected Behavior

Same behaviour as a normal React renderer - allowing for this kind of case

Steps to Reproduce

const [selectedTool, setSelectedToo] = useState(null);
{/* ... */}
// ERROR
{someArray.map((train, index) => {
  return (
    <pixiContainer key={index} y={index * 100}>
      {/* Throws reconciliation error, when selected tool changes to 'move' */}
      { selectedTool == 'move' &&
        <pixiContainer x={-50}>
            <pixiSprite  eventMode='dynamic' texture={moveIcon}/>
        </pixiContainer>
      }
      {/* SOME OTHER COMPONENTS HERE - parent is never empty */}
    </pixiContainer>
    )
  })
}

Environment

@pixi/react version: *8.0.0-dev.4657710
pixi.js version: ^8.2.1
React version: e.g. ^18.2.0
ReactDOM version: e.g. ^18.2.0

Possible Solution

No response

Additional Information

Wrapping the entire condional rendering in a container seems to resolve the issue

// OK
{someArray.map((train, index) => {
  return (
    <pixiContainer key={index} y={index * 100}>
      {/* Works if I wrap the conditional rendering in a container */}
      <pixiContainer x={-50}>
        { selectedTool == 'move' && 
          <pixiSprite  eventMode='dynamic' texture={moveIcon}/>
        }
      </pixiContainer>
      {/* SOME OTHER COMPONENTS HERE - parent is never empty */}
    </pixiContainer>
    )
  })
}

pixijs / pixi-react

`Cannot insert node before itself` on conditional rendering #495