In SceneGraph, only scroll node into view if it's not currently visible

3DStreet · Dec 21, 2024 · c2cbbb6 · c2cbbb6
1 parent 2926a00
commit c2cbbb6
Showing 1 changed file with 13 additions and 3 deletions.
diff --git a/src/editor/components/scenegraph/SceneGraph.js b/src/editor/components/scenegraph/SceneGraph.js
@@ -93,9 +93,19 @@ export default class SceneGraph extends React.Component {
         this.setState({ selectedIndex: i });
         setTimeout(() => {
           // wait 500ms to allow user to double click on entity
-          document
-            .getElementById('sgnode' + i)
-            ?.scrollIntoView({ behavior: 'smooth' });
+          const node = document.getElementById('sgnode' + i);
+          const scrollableContainer = document.querySelector(
+            '#scenegraph .layers'
+          );
+          if (!node || !scrollableContainer) return;
+          const containerRect = scrollableContainer.getBoundingClientRect();
+          const nodeRect = node.getBoundingClientRect();
+          const isVisible =
+            nodeRect.top >= containerRect.top &&
+            nodeRect.bottom <= containerRect.bottom;
+          if (!isVisible) {
+            node.scrollIntoView({ behavior: 'smooth' });
+          }
         }, 500);
         // Make sure selected value is visible in scenegraph
         this.expandToRoot(entity);