From db0de416dc04d9297e38a02fe625dd30b1cd81c5 Mon Sep 17 00:00:00 2001
From: EnixCoda <enixcoda@gmail.com>
Date: Fri, 13 Nov 2020 22:38:41 +0800
Subject: [PATCH] fix: emit pjax end

---
 src/components/FileExplorer.tsx |  3 +--
 src/components/SideBar.tsx      |  5 +++--
 src/platforms/GitHub/index.ts   |  4 ++--
 src/platforms/Gitee/index.ts    |  2 +-
 src/utils/hooks/usePJAX.ts      | 20 +++++++++++++++++---
 5 files changed, 24 insertions(+), 10 deletions(-)

diff --git a/src/components/FileExplorer.tsx b/src/components/FileExplorer.tsx
index faa8bf0..7c19391 100644
--- a/src/components/FileExplorer.tsx
+++ b/src/components/FileExplorer.tsx
@@ -200,8 +200,7 @@ function ListView({
   }, [metaData.branchName])
 
   useOnLocationChange(goToCurrentItem)
-  // `false` for ignoring pjax:end, which could cause unexpected results of history.goBack
-  useOnPJAXDone(goToCurrentItem, false)
+  useOnPJAXDone(goToCurrentItem)
 
   const itemData = React.useMemo(
     () => ({
diff --git a/src/components/SideBar.tsx b/src/components/SideBar.tsx
index 58a6dcd..a889a20 100644
--- a/src/components/SideBar.tsx
+++ b/src/components/SideBar.tsx
@@ -19,12 +19,13 @@ import * as React from 'react'
 import { useUpdateEffect } from 'react-use'
 import { cx } from 'utils/cx'
 import { parseURLSearch } from 'utils/general'
-import { loadWithPJAX, useOnPJAXDone, usePJAX } from 'utils/hooks/usePJAX'
+import { loadWithPJAX, useOnPJAXDone, usePJAX, useRedirectedEvents } from 'utils/hooks/usePJAX'
 import { useProgressBar } from 'utils/hooks/useProgressBar'
 import * as keyHelper from 'utils/keyHelper'
 import { Icon } from './Icon'
 
 const RawGitako: React.FC<Props & ConnectorState> = function RawGitako(props) {
+  useRedirectedEvents(document, 'pjax:ready', 'pjax:end')
   const configContext = useConfigs()
   const accessToken = props.configContext.val.access_token
   const [baseSize] = React.useState(() => configContext.val.sideBarWidth)
@@ -82,7 +83,7 @@ const RawGitako: React.FC<Props & ConnectorState> = function RawGitako(props) {
     },
     [props.metaData?.branchName, configContext.val.intelligentToggle],
   )
-  useOnPJAXDone(updateSideBarVisibility)
+  useOnPJAXDone(updateSideBarVisibility, true)
 
   const copyFileButton = configContext.val.copyFileButton
   useGitHubAttachCopyFileButton(copyFileButton)
diff --git a/src/platforms/GitHub/index.ts b/src/platforms/GitHub/index.ts
index 9aba232..52e8920 100644
--- a/src/platforms/GitHub/index.ts
+++ b/src/platforms/GitHub/index.ts
@@ -293,7 +293,7 @@ export function useGitHubAttachCopySnippetButton(copySnippetButton: boolean) {
     [copySnippetButton],
   )
   React.useEffect(attachCopySnippetButton, [copySnippetButton])
-  useOnPJAXDone(attachCopySnippetButton)
+  useOnPJAXDone(attachCopySnippetButton, true)
 }
 
 export function useGitHubAttachCopyFileButton(copyFileButton: boolean) {
@@ -305,5 +305,5 @@ export function useGitHubAttachCopyFileButton(copyFileButton: boolean) {
     [copyFileButton],
   )
   React.useEffect(attachCopyFileButton, [copyFileButton])
-  useOnPJAXDone(attachCopyFileButton)
+  useOnPJAXDone(attachCopyFileButton, true)
 }
diff --git a/src/platforms/Gitee/index.ts b/src/platforms/Gitee/index.ts
index 14c8da1..74b46a9 100644
--- a/src/platforms/Gitee/index.ts
+++ b/src/platforms/Gitee/index.ts
@@ -173,5 +173,5 @@ export function useGiteeAttachCopySnippetButton(copySnippetButton: boolean) {
     [copySnippetButton],
   )
   React.useEffect(attachCopySnippetButton, [copySnippetButton])
-  useOnPJAXDone(attachCopySnippetButton)
+  useOnPJAXDone(attachCopySnippetButton, true)
 }
diff --git a/src/utils/hooks/usePJAX.ts b/src/utils/hooks/usePJAX.ts
index 71e0fb3..002f8b0 100644
--- a/src/utils/hooks/usePJAX.ts
+++ b/src/utils/hooks/usePJAX.ts
@@ -40,7 +40,21 @@ export const loadWithPJAX = (url: string) => {
   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
+export function useOnPJAXDone(callback: () => void, legacy?: boolean) {
+  useEvent(legacy ? 'pjax:end' : 'pjax:ready', callback, document)
+}
+
+export function useRedirectedEvents(
+  originalTarget: Window | Document | Element,
+  originalEvent: string,
+  redirectedEvent: string,
+  redirectToTarget = originalTarget,
+) {
+  useEvent(
+    originalEvent,
+    () => {
+      redirectToTarget.dispatchEvent(new Event(redirectedEvent))
+    },
+    originalTarget,
+  )
 }