From bc8c12f53d8685fb154c37fae789d90b8ed76396 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Timoth=C3=A9e=20Alby?= <timothee.alby@gmail.com>
Date: Fri, 8 Jan 2021 11:03:18 +0100
Subject: [PATCH] Merge pull request #3547 from
 overleaf/msm-fix-file-tree-selected-file-scroll

[ReactFileTree] Fixed selected item scroll

GitOrigin-RevId: 36d71b40a86fb8444f9b8501ae9baf1a7a75f019
---
 .../file-tree-item/file-tree-item-inner.js         | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/services/web/frontend/js/features/file-tree/components/file-tree-item/file-tree-item-inner.js b/services/web/frontend/js/features/file-tree/components/file-tree-item/file-tree-item-inner.js
index 7c1db4c6fb..00bccb7e2b 100644
--- a/services/web/frontend/js/features/file-tree/components/file-tree-item/file-tree-item-inner.js
+++ b/services/web/frontend/js/features/file-tree/components/file-tree-item/file-tree-item-inner.js
@@ -21,10 +21,16 @@ function FileTreeItemInner({ id, name, isSelected, icons }) {
   const itemRef = createRef()
 
   useEffect(() => {
-    if (isSelected && itemRef.current) {
-      scrollIntoViewIfNeeded(itemRef.current, {
-        scrollMode: 'if-needed'
-      })
+    const item = itemRef.current
+    if (isSelected && item) {
+      // we found scrolling doesn't happen unless a explicit delay is introduced
+      setTimeout(() => {
+        if (item) {
+          scrollIntoViewIfNeeded(item, {
+            scrollMode: 'if-needed'
+          })
+        }
+      }, 10)
     }
   }, [isSelected, itemRef])