refactor: on PJAX end

src/components/FileExplorer.tsx

@@ -8,12 +8,12 @@ import { FileExplorerCore } from 'driver/core'
 import { ConnectorState, Props } from 'driver/core/FileExplorer'
 import { platform } from 'platforms'
 import * as React from 'react'
-import { useEvent } from 'react-use'
 import { FixedSizeList, ListChildComponentProps } from 'react-window'
 import { cx } from 'utils/cx'
 import { focusFileExplorer } from 'utils/DOMHelper'
 import { isValidRegexpSource } from 'utils/general'
 import { useOnLocationChange } from 'utils/hooks/useOnLocationChange'
+import { useOnPJAXDone } from 'utils/hooks/usePJAX'
 import { VisibleNodes } from 'utils/VisibleNodesGenerator'
 import { Icon } from './Icon'
 import { SizeObserver } from './SizeObserver'
@@ -200,7 +200,8 @@ function ListView({
   }, [metaData.branchName])
 
   useOnLocationChange(goToCurrentItem)
-  useEvent('pjax:ready', goToCurrentItem, document)
+  // `false` for ignoring pjax:end, which could cause unexpected results of history.goBack
+  useOnPJAXDone(goToCurrentItem, false)
 
   const itemData = React.useMemo(
     () => ({

src/components/SideBar.tsx

@@ -16,10 +16,10 @@ import {
   useGitHubAttachCopySnippetButton,
 } from 'platforms/GitHub'
 import * as React from 'react'
-import { useEvent, useUpdateEffect } from 'react-use'
+import { useUpdateEffect } from 'react-use'
 import { cx } from 'utils/cx'
 import { parseURLSearch } from 'utils/general'
-import { usePJAX } from 'utils/hooks/usePJAX'
+import { useOnPJAXDone, usePJAX } from 'utils/hooks/usePJAX'
 import * as keyHelper from 'utils/keyHelper'
 import { Icon } from './Icon'
 
@@ -81,7 +81,7 @@ const RawGitako: React.FC<Props & ConnectorState> = function RawGitako(props) {
     },
     [props.metaData?.branchName, configContext.val.intelligentToggle],
   )
-  useEvent('pjax:ready', updateSideBarVisibility, document)
+  useOnPJAXDone(updateSideBarVisibility)
 
   const copyFileButton = configContext.val.copyFileButton
   useGitHubAttachCopyFileButton(copyFileButton)

src/platforms/GitHub/index.ts

@@ -2,8 +2,8 @@ import { GITHUB_OAUTH } from 'env'
 import { Base64 } from 'js-base64'
 import { platform } from 'platforms'
 import * as React from 'react'
-import { useEvent } from 'react-use'
 import { resolveGitModules } from 'utils/gitSubmodule'
+import { useOnPJAXDone } from 'utils/hooks/usePJAX'
 import { sortFoldersToFront } from 'utils/treeParser'
 import * as API from './API'
 import * as DOMHelper from './DOMHelper'
@@ -298,8 +298,7 @@ export function useGitHubAttachCopySnippetButton(copySnippetButton: boolean) {
     [copySnippetButton],
   )
   React.useEffect(attachCopySnippetButton, [copySnippetButton])
-  useEvent('pjax:ready', attachCopySnippetButton, document)
-  useEvent('pjax:end', attachCopySnippetButton, document) // GitHub emits pjax:end when navigate through its file list
+  useOnPJAXDone(attachCopySnippetButton)
 }
 
 export function useGitHubAttachCopyFileButton(copyFileButton: boolean) {
@@ -311,6 +310,5 @@ export function useGitHubAttachCopyFileButton(copyFileButton: boolean) {
     [copyFileButton],
   )
   React.useEffect(attachCopyFileButton, [copyFileButton])
-  useEvent('pjax:ready', attachCopyFileButton, document)
-  useEvent('pjax:end', attachCopyFileButton, document) // GitHub emits pjax:end when navigate through its file list
+  useOnPJAXDone(attachCopyFileButton)
 }

src/platforms/Gitee/index.ts

@@ -1,8 +1,8 @@
 import { GITEE_OAUTH } from 'env'
 import { platform } from 'platforms'
 import * as React from 'react'
-import { useEvent } from 'react-use'
 import { resolveGitModules } from 'utils/gitSubmodule'
+import { useOnPJAXDone } from 'utils/hooks/usePJAX'
 import { sortFoldersToFront } from 'utils/treeParser'
 import * as API from './API'
 import * as DOMHelper from './DOMHelper'
@@ -162,5 +162,5 @@ export function useGiteeAttachCopySnippetButton(copySnippetButton: boolean) {
     [copySnippetButton],
   )
   React.useEffect(attachCopySnippetButton, [copySnippetButton])
-  useEvent('pjax:ready', attachCopySnippetButton, document)
+  useOnPJAXDone(attachCopySnippetButton)
 }

src/utils/hooks/usePJAX.ts

@@ -45,3 +45,8 @@ export function usePJAX() {
     Pjax.assign(url, config)
   }, [])
 }
+
+export function useOnPJAXDone(callback: () => void, both = true) {
+  useEvent('pjax:ready', callback, document)
+  if (both) useEvent('pjax:end', callback, document) // emit by GitHub
+}