Fix issue reported by Luis. When converting nodes to rectangle, the p…

…lugin was ignoring the other items.

__tests__/altNodes/convertNodesOnRectangle.test.ts

@@ -357,7 +357,8 @@ describe("convert node if child is big rect ", () => {
 
     const convert = convertNodesOnRectangle(node);
 
-    expect(convert.children.length).toEqual(2);
+    // 4, because it should include even those that are not converted.
+    expect(convert.children.length).toEqual(4);
   });
 
   it("invalid when testing without id", () => {

src/altNodes/convertNodesOnRectangle.ts

@@ -24,13 +24,23 @@ export const convertNodesOnRectangle = (
   const colliding = retrieveCollidingItems(node.children);
 
   const parentsKeys = Object.keys(colliding);
-  const updatedChildren: Array<AltSceneNode> = [];
+  // start with all children. This is going to be filtered.
+  let updatedChildren: Array<AltSceneNode> = [...node.children];
+
   parentsKeys.forEach((key) => {
     // dangerous cast, but this is always true
     const parentNode = node.children.find(
       (d) => d.id === key
     ) as AltRectangleNode;
 
+    // retrieve the position. Key should always be at the left side, so even when other items are removed, the index is kept the same.
+    const indexPosition = updatedChildren.findIndex((d) => d.id === key);
+
+    // filter the children to remove those that are being modified
+    updatedChildren = updatedChildren.filter(
+      (d) => !colliding[key].map((dd) => dd.id).includes(d.id) && key !== d.id
+    );
+
     const frameNode = convertRectangleToFrame(parentNode);
 
     // todo when the soon-to-be-parent is larger than its parent, things get weird. Happens, for example, when a large image is used in the background. Should this be handled or is this something user should never do?
@@ -42,10 +52,11 @@ export const convertNodesOnRectangle = (
       d.y = d.y - frameNode.y;
     });
 
-    // try to convert the children to AutoLayout.
-    updatedChildren.push(convertToAutoLayout(frameNode));
+    // try to convert the children to AutoLayout, and insert back at updatedChildren.
+    updatedChildren.splice(indexPosition, 0, convertToAutoLayout(frameNode));
   });
 
+  console.log("node is ", node.children, "updated is ", updatedChildren);
   if (updatedChildren.length > 0) {
     node.children = updatedChildren;
   }