From aca84b3b2b2d0aa4f527ab2f114a6f3e15ae40fb Mon Sep 17 00:00:00 2001
From: EnixCoda <enixcoda@gmail.com>
Date: Mon, 18 Nov 2019 18:11:47 +0800
Subject: [PATCH] refactor: remove pjax listener

---
 src/components/SideBar.tsx | 28 +++++++++++-----------------
 1 file changed, 11 insertions(+), 17 deletions(-)

diff --git a/src/components/SideBar.tsx b/src/components/SideBar.tsx
index 8fc853b..83c01b9 100644
--- a/src/components/SideBar.tsx
+++ b/src/components/SideBar.tsx
@@ -11,6 +11,7 @@ import { SideBarCore } from 'driver/core'
 import { ConnectorState, Props } from 'driver/core/SideBar'
 import { oauth } from 'env'
 import * as React from 'react'
+import { useLocation } from 'react-use'
 import { cx } from 'utils/cx'
 import * as DOMHelper from 'utils/DOMHelper'
 import { JSONRequest, parseURLSearch } from 'utils/general'
@@ -56,19 +57,19 @@ const RawGitako: React.FC<Props & ConnectorState> = function RawGitako(props) {
     DOMHelper.unmountTopProgressBar()
     props.setMetaData({ ...props.metaData, ...URLHelper.parse() })
   }, [props.disabled, props.metaData, configContext.val])
-  useOnPJAXComplete(updateMeta)
+  useOnLocationChange(updateMeta)
 
   const attachCopyFileButton = React.useCallback(() => {
     if (props.disabled) return
     if (configContext.val.copyFileButton) return DOMHelper.attachCopyFileBtn()
   }, [props.disabled, configContext.val.copyFileButton])
-  useOnPJAXComplete(attachCopyFileButton)
+  useOnLocationChange(attachCopyFileButton)
 
   const attachCopySnippetButton = React.useCallback(() => {
     if (props.disabled) return
     if (configContext.val.copySnippetButton) return DOMHelper.attachCopySnippet()
   }, [props.disabled, configContext.val.copySnippetButton])
-  useOnPJAXComplete(attachCopySnippetButton)
+  useOnLocationChange(attachCopySnippetButton)
 
   React.useEffect(() => {
     if (configContext.val.intelligentToggle === null) {
@@ -143,20 +144,6 @@ RawGitako.defaultProps = {
 
 export const SideBar = connect(SideBarCore)(RawGitako)
 
-function useEvent<
-  T extends {
-    addEventListener: Function
-    removeEventListener: Function
-  }
->(target: T, event: string, callback: () => void, deps: React.DependencyList = []) {
-  React.useEffect(() => {
-    target.addEventListener(event, callback)
-    return () => target.removeEventListener(event, callback)
-  }, [callback, ...deps])
-}
-
-const useOnPJAXComplete = useEvent.bind(null, window, 'pjax:complete')
-
 function renderAccessDeniedError() {
   return (
     <div className={'description'}>
@@ -197,3 +184,10 @@ async function trySetUpAccessTokenWithCode() {
     raiseError(err)
   }
 }
+
+function useOnLocationChange(callback: () => void) {
+  const { href, pathname, search } = useLocation()
+  useDidUpdate(() => {
+    callback()
+  }, [href, pathname, search])
+}