Fix bbox issue

inspector/src/components/sceneExplorer/entities/meshTreeItemComponent.tsx

@@ -32,6 +32,18 @@ export class MeshTreeItemComponent extends React.Component<IMeshTreeItemComponen
             }
             mesh.metadata.previousParent = mesh.parent;
 
+            if (mesh.metadata.previousParent) {
+                if (!mesh.metadata.previousParent.metadata) {
+                    mesh.metadata.previousParent.metadata = {};
+                }
+
+                if (!mesh.metadata.previousParent.metadata.detachedChildren) {
+                    mesh.metadata.previousParent.metadata.detachedChildren = [];
+                }
+
+                mesh.metadata.previousParent.metadata.detachedChildren.push(mesh);
+            }
+
             // Connect to gizmo
             const dummy = BABYLON.BoundingBoxGizmo.MakeNotPickableAndWrapInBoundingBox(mesh as Mesh);
             dummy.metadata = { hidden: true };
@@ -55,13 +67,18 @@ export class MeshTreeItemComponent extends React.Component<IMeshTreeItemComponen
             return;
         }
 
-
+        const previousParent = mesh.metadata.previousParent;
         mesh.removeBehavior(mesh.metadata.pointerDragBehavior);
         mesh.metadata.gizmo.dispose();
         mesh.metadata.gizmo = null;
-        mesh.setParent(mesh.metadata.previousParent);
+        mesh.setParent(previousParent);
         mesh.metadata.dummy.dispose();
         mesh.metadata.dummy = null;
+
+        if (previousParent && previousParent.metadata) {
+            previousParent.metadata.detachedChildren = null;
+        }
+
         mesh.metadata.previousParent = null;
         mesh.metadata.pointerDragBehavior = null;
 

inspector/src/components/sceneExplorer/sceneExplorerComponent.tsx

@@ -73,13 +73,16 @@ export class SceneExplorerComponent extends React.Component<ISceneExplorerCompon
         this.setState({ filter: filter });
     }
 
-    findSiblings(items: any[], target: any, goNext: boolean, data: { previousOne?: any, found?: boolean }): boolean {
-        if (!items || items.length === 0) {
+    findSiblings(parent: any, items: any[], target: any, goNext: boolean, data: { previousOne?: any, found?: boolean }): boolean {
+        if (!items) {
             return false;
         }
 
-        const sortedItems = Tools.SortAndFilter(items);
+        const sortedItems = Tools.SortAndFilter(parent, items);
 
+        if (!items || sortedItems.length === 0) {
+            return false;
+        }
 
         for (var item of sortedItems) {
             if (item === target) { // found the current selection!
@@ -99,7 +102,7 @@ export class SceneExplorerComponent extends React.Component<ISceneExplorerCompon
             }
 
             if (item.getChildren && item.metadata && item.metadata.isExpanded) {
-                if (this.findSiblings(item.getChildren(), target, goNext, data)) {
+                if (this.findSiblings(item, item.getChildren(), target, goNext, data)) {
                     return true;
                 }
             }
@@ -146,9 +149,9 @@ export class SceneExplorerComponent extends React.Component<ISceneExplorerCompon
         keyEvent.preventDefault();
 
         let data = {};
-        if (!this.findSiblings(scene.rootNodes, this.state.selectedEntity, goNext, data)) {
-            if (!this.findSiblings(scene.materials, this.state.selectedEntity, goNext, data)) {
-                this.findSiblings(scene.textures, this.state.selectedEntity, goNext, data);
+        if (!this.findSiblings(null, scene.rootNodes, this.state.selectedEntity, goNext, data)) {
+            if (!this.findSiblings(null, scene.materials, this.state.selectedEntity, goNext, data)) {
+                this.findSiblings(null, scene.textures, this.state.selectedEntity, goNext, data);
             }
         }
 

inspector/src/components/sceneExplorer/treeItemComponent.tsx

@@ -126,7 +126,7 @@ export class TreeItemComponent extends React.Component<ITreeItemComponentProps,
             )
         }
 
-        const sortedItems = Tools.SortAndFilter(items);
+        const sortedItems = Tools.SortAndFilter(null, items);
 
         return (
             <div>

inspector/src/components/sceneExplorer/treeItemSelectableComponent.tsx

@@ -86,7 +86,7 @@ export class TreeItemSelectableComponent extends React.Component<ITreeItemSelect
             return null;
         }
 
-        const children = Tools.SortAndFilter(entity.getChildren ? entity.getChildren() : entity.children);
+        const children = Tools.SortAndFilter(entity, entity.getChildren ? entity.getChildren() : entity.children);
         return (
             children.map(item => {
 
@@ -104,7 +104,7 @@ export class TreeItemSelectableComponent extends React.Component<ITreeItemSelect
         const entity = this.props.entity;
 
         const chevron = this.state.isExpanded ? <FontAwesomeIcon icon={faMinus} /> : <FontAwesomeIcon icon={faPlus} />
-        const children = Tools.SortAndFilter(entity.getChildren ? entity.getChildren() : entity.children);
+        const children = Tools.SortAndFilter(entity, entity.getChildren ? entity.getChildren() : entity.children);
         const hasChildren = children.length > 0;
 
         if (!entity.metadata) {

inspector/src/tools.ts

@@ -16,11 +16,18 @@ export class Tools {
         return false;
     }
 
-    public static SortAndFilter(items: any[]): any[] {
+    public static SortAndFilter(parent: any, items: any[]): any[] {
         if (!items) {
             return [];
         }
-        return items.filter((i) => !i.metadata || !i.metadata.hidden).sort((a: any, b: any) => {
+
+        const finalArray = items.filter((i) => !i.metadata || !i.metadata.hidden);
+
+        if (parent && parent.metadata && parent.metadata.detachedChildren) {
+            finalArray.push(...parent.metadata.detachedChildren);
+        }
+
+        return finalArray.sort((a: any, b: any) => {
             const lowerCaseA = (a.name || "").toLowerCase();
             const lowerCaseB = (b.name || "").toLowerCase();