mirror of
https://github.com/EnixCoda/Gitako.git
synced 2026-03-11 08:54:44 +00:00
feat: use pjax-api
This commit is contained in:
parent
b2c4ebf373
commit
fbe2a026be
7 changed files with 45 additions and 36 deletions
|
|
@ -34,6 +34,7 @@
|
|||
"ini": "^1.3.5",
|
||||
"js-base64": "^2.5.1",
|
||||
"nprogress": "^0.2.0",
|
||||
"pjax-api": "^3.30.1",
|
||||
"react": "^16.13.0",
|
||||
"react-dom": "^16.13.0",
|
||||
"react-use": "^13.8.0",
|
||||
|
|
|
|||
|
|
@ -212,7 +212,7 @@ function ListView({
|
|||
if (targetPath) expandTo(targetPath)
|
||||
}, [metaData.branchName])
|
||||
useOnLocationChange(goToCurrentItem)
|
||||
useEvent('pjax:complete', goToCurrentItem, window)
|
||||
useEvent('pjax:ready', goToCurrentItem, document)
|
||||
return (
|
||||
<List
|
||||
ref={listRef}
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@ const RawGitako: React.FC<Props & ConnectorState> = function RawGitako(props) {
|
|||
},
|
||||
[props.metaData?.branchName, configContext.val.intelligentToggle],
|
||||
)
|
||||
useEvent('pjax:complete', updateSideBarVisibility, window)
|
||||
useEvent('pjax:ready', updateSideBarVisibility, document)
|
||||
|
||||
const copyFileButton = configContext.val.copyFileButton
|
||||
useGitHubAttachCopyFileButton(copyFileButton)
|
||||
|
|
|
|||
|
|
@ -172,7 +172,7 @@ export function useGitHubAttachCopySnippetButton(copySnippetButton: boolean) {
|
|||
[copySnippetButton],
|
||||
)
|
||||
React.useEffect(attachCopySnippetButton, [copySnippetButton])
|
||||
useEvent('pjax:complete', attachCopySnippetButton, window)
|
||||
useEvent('pjax:ready', attachCopySnippetButton, document)
|
||||
}
|
||||
|
||||
export function useGitHubAttachCopyFileButton(copyFileButton: boolean) {
|
||||
|
|
@ -184,5 +184,5 @@ export function useGitHubAttachCopyFileButton(copyFileButton: boolean) {
|
|||
[copyFileButton],
|
||||
)
|
||||
React.useEffect(attachCopyFileButton, [copyFileButton])
|
||||
useEvent('pjax:complete', attachCopyFileButton, window)
|
||||
useEvent('pjax:ready', attachCopyFileButton, document)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -173,5 +173,5 @@ export function useGiteeAttachCopySnippetButton(copySnippetButton: boolean) {
|
|||
[copySnippetButton],
|
||||
)
|
||||
React.useEffect(attachCopySnippetButton, [copySnippetButton])
|
||||
useEvent('pjax:complete', attachCopySnippetButton, window)
|
||||
useEvent('pjax:ready', attachCopySnippetButton, document)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,40 +1,43 @@
|
|||
import * as PJAX from 'pjax'
|
||||
import { Config, Pjax } from 'pjax-api'
|
||||
import * as React from 'react'
|
||||
import { useEvent } from 'react-use'
|
||||
import { useProgressBar } from './useProgressBar'
|
||||
|
||||
const config: Config = {
|
||||
areas: [
|
||||
// github
|
||||
'.repository-content',
|
||||
'[data-pjax="#js-repo-pjax-container"]',
|
||||
'.page-content',
|
||||
// gitee
|
||||
'#git-project-content',
|
||||
],
|
||||
update: {
|
||||
css: false,
|
||||
},
|
||||
fetch: {
|
||||
cache(path) {
|
||||
return path
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
export function usePJAX() {
|
||||
// Note: shall not enable below pjax:send listener as there would be dual bar when GitHub PJAX links are triggered
|
||||
// window.addEventListener('pjax:send', () => mountTopProgressBar())
|
||||
const [pjax] = React.useState(
|
||||
() =>
|
||||
new PJAX({
|
||||
elements: 'match-nothing-selector',
|
||||
selectors: [
|
||||
'.repository-content',
|
||||
'title',
|
||||
'[data-pjax="#js-repo-pjax-container"]',
|
||||
'.page-content',
|
||||
'#git-project-content',
|
||||
],
|
||||
scrollTo: false,
|
||||
analytics: false,
|
||||
cacheBust: false,
|
||||
forceCache: true, // TODO: merge namespace, add forceCache
|
||||
}),
|
||||
)
|
||||
const progressBar = useProgressBar()
|
||||
// make history travel work
|
||||
React.useEffect(() => {
|
||||
window.addEventListener('pjax:complete', progressBar.unmount)
|
||||
return () => window.removeEventListener('pjax:complete', progressBar.unmount)
|
||||
new Pjax({
|
||||
...config,
|
||||
filter() {
|
||||
return false
|
||||
},
|
||||
})
|
||||
}, [])
|
||||
|
||||
const loadWithPJAX = React.useCallback(
|
||||
function loadWithPJAX(URL: string) {
|
||||
progressBar.mount()
|
||||
pjax.loadUrl(URL, { scrollTo: 0 })
|
||||
},
|
||||
[pjax],
|
||||
)
|
||||
const progressBar = useProgressBar()
|
||||
useEvent('pjax:fetch', progressBar.mount, window)
|
||||
useEvent('pjax:unload', progressBar.unmount, window)
|
||||
|
||||
return loadWithPJAX
|
||||
return React.useCallback(url => {
|
||||
Pjax.assign(url, config)
|
||||
}, [])
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6925,6 +6925,11 @@ pino@~5.13.0:
|
|||
quick-format-unescaped "^3.0.3"
|
||||
sonic-boom "^0.7.5"
|
||||
|
||||
pjax-api@^3.30.1:
|
||||
version "3.30.1"
|
||||
resolved "https://registry.yarnpkg.com/pjax-api/-/pjax-api-3.30.1.tgz#a263950e15162f339dcddd6a3dd75d17c51e7b12"
|
||||
integrity sha512-yH6SzgvYxHuyJXwn/AXdjL0PB6pdk/W/lyv+numHuDQTbEi9uvjG1N0a8uUtkiMdFfuCpCP7EoxjJzQfO4Z86w==
|
||||
|
||||
pkg-dir@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-3.0.0.tgz#2749020f239ed990881b1f71210d51eb6523bea3"
|
||||
|
|
|
|||
Loading…
Reference in a new issue