only fetch commit details if preview is not visible

also prefetch md file preview here, it's kinda ugly but what can you do
brumm · Mar 29, 2020 · 832fef7 · 832fef7
1 parent 49432aa
commit 832fef7
Showing 1 changed file with 46 additions and 52 deletions.
diff --git a/src/App.js b/src/App.js
@@ -87,12 +87,6 @@ const Node = ({ type, name, path, parentCommitmessage, level }) => {
     { user, repo, branch, path },
   ])
 
-  const { data: lastCommitData } = useQuery(
-    ['last-commit', { user, repo, branch, path }],
-    [{ isPrefetch: true }],
-    getLastCommitForNode
-  )
-
   const isExpanded = useStore(state => state.expandedNodes[path] === true)
   const toggleExpandNode = useStore(state => state.toggleExpandNode)
   const selectedFilePath = useStore(state => state.selectedFilePath)
@@ -108,59 +102,59 @@ const Node = ({ type, name, path, parentCommitmessage, level }) => {
 
   const [isHovering, hoverProps] = useHover()
 
-  React.useEffect(
-    () => {
-      const handle = window.requestIdleCallback(() => {
-        if (isHovering) {
-          if (isFolder) {
-            queryCache
-              .prefetchQuery(
-                ['listing', { user, repo, branch, path }],
+  const { data: lastCommitData } = useQuery(
+    selectedFilePath === null && ['last-commit', { user, repo, branch, path }],
+    [{ isPrefetch: true }],
+    getLastCommitForNode
+  )
+
+  useIdleCallback(() => {
+    if (isHovering) {
+      if (isFolder) {
+        queryCache
+          .prefetchQuery(
+            ['listing', { user, repo, branch, path }],
+            [{ isPrefetch: true }],
+            getNode
+          )
+          .then(items => {
+            items.forEach(({ path }) =>
+              queryCache.prefetchQuery(
+                selectedFilePath === null && [
+                  'last-commit',
+                  { user, repo, branch, path },
+                ],
                 [{ isPrefetch: true }],
-                getNode
+                getLastCommitForNode
               )
-              .then(items => {
-                items.forEach(({ path }) =>
-                  queryCache.prefetchQuery(
-                    ['last-commit', { user, repo, branch, path }],
-                    [{ isPrefetch: true }],
-                    getLastCommitForNode
-                  )
-                )
-              })
-          } else {
-            const fileExtension = path
-              .split('.')
-              .slice(-1)[0]
-              .toLowerCase()
+            )
+          })
+      } else {
+        const fileExtension = path.split('.').slice(-1)[0].toLowerCase()
 
-            if (fileExtension === 'md') {
-              queryCache
-                .prefetchQuery(
-                  ['file', { user, repo, branch, path }],
-                  getFileContent
-                )
-                .then(text => {
-                  queryCache.prefetchQuery(
-                    text && ['markdown', { user, repo, text }],
-                    getMarkdown
-                  )
-                })
-            } else {
+        if (fileExtension === 'md') {
+          queryCache
+            .prefetchQuery(
+              ['file', { user, repo, branch, path }],
+              getFileContent
+            )
+            .then(text => {
               queryCache.prefetchQuery(
-                ['file', { user, repo, branch, path }],
+                text && ['markdown', { user, repo, text }],
                 [{ isPrefetch: true }],
-                getFileContent
+                getMarkdown
               )
-            }
-          }
+            })
+        } else {
+          queryCache.prefetchQuery(
+            ['file', { user, repo, branch, path }],
+            [{ isPrefetch: true }],
+            getFileContent
+          )
         }
-      })
-
-      return () => window.cancelIdleCallback(handle)
-    },
-    [isHovering, branch, isFolder, path, repo, user]
-  )
+      }
+    }
+  }, [isHovering, branch, isFolder, path, repo, user])
 
   return (
     <Fragment>