diff --git a/src/components/FileExplorer.js b/src/components/FileExplorer.js
index 57ea266..69f753b 100644
--- a/src/components/FileExplorer.js
+++ b/src/components/FileExplorer.js
@@ -194,7 +194,7 @@ export default class List extends preact.Component {
depth={depths.get(node)}
focused={focusedNode === node}
expanded={expandedNodes.has(node)}
- toggleExpand={this.toggleNodeExpand.bind(null, node)}
+ toggleExpand={this.toggleNodeExpand}
/>
))}
diff --git a/src/components/Node.js b/src/components/Node.js
index 18d6bff..0db724b 100644
--- a/src/components/Node.js
+++ b/src/components/Node.js
@@ -1,9 +1,12 @@
import preact from 'preact'
/** @jsx preact.h */
+import PJAX from 'pjax'
import Icon from './Icon'
import cx from '../utils/cx'
+import general from '../utils/general'
+import DOMHelper from '../utils/DOMHelper'
function getIconType(node) {
switch (node.type) {
@@ -14,29 +17,34 @@ function getIconType(node) {
}
}
-export default function Node({ node, depth, expanded, focused, toggleExpand }) {
- const { name, url, type, path } = node
- const item = (
-
-
- {name}
-
- )
- return (
-
- {
- type !== 'tree'
- ? (
-
- { item }
-
- )
- : item
- }
-
- )
+export default class Node extends preact.Component {
+ shouldComponentUpdate(nextProps) {
+ return !general.shallowEqual(this.props, nextProps)
+ }
+
+ onNodeClick = (...args) => {
+ const { node, toggleExpand } = this.props
+ if (node.type === 'tree') {
+ toggleExpand(node, ...args)
+ } else {
+ DOMHelper.loadWithPJAX(node.url)
+ }
+ }
+
+ render() {
+ const { node, depth, expanded, focused, pjax } = this.props
+ const { name, path } = node
+ return (
+
+ )
+ }
}
diff --git a/src/utils/DOMHelper.js b/src/utils/DOMHelper.js
index 09fde50..878172b 100644
--- a/src/utils/DOMHelper.js
+++ b/src/utils/DOMHelper.js
@@ -2,7 +2,7 @@
* this helper helps manipulating DOM
*/
-import pjax from 'pjax'
+import PJAX from 'pjax'
/**
* if should show gitako, then move body right to make space for showing gitako
@@ -61,22 +61,18 @@ function scrollToNodeElement(index) {
})
}
-/**
- * add pjax listeners
- * call this when pjax redirected or page loaded
- */
-function attachPJAX(fields) {
- // TODO: switch for fields
- const elements = [
- '.gitako a.pjax-link', // links in Gitako file tree & list
- '.js-path-segment a', // links in the file navigation bar
- ].join()
- new pjax({
- elements,
+const pjax = new PJAX({
+ elements: '.pjax-link',
selectors: ['.repository-content'],
scrollTo: false,
- analytics: () => {},
- })
+ analytics: false,
+ cacheBust: false,
+ forceCache: true,
+})
+
+function loadWithPJAX(URL) {
+ NProgress.start()
+ pjax.loadUrl(URL)
}
/**
@@ -308,14 +304,13 @@ function clickOnNodeElement(index = 0) {
* a combination of few above functions
*/
function decorateGitHubPageContent() {
- attachPJAX('github')
attachCopyFileBtn()
attachCopySnippet()
}
export default {
- attachPJAX,
+ loadWithPJAX,
attachCopyFileBtn,
attachCopySnippet,
clickOnNodeElement,
diff --git a/src/utils/general.js b/src/utils/general.js
new file mode 100644
index 0000000..27f4b95
--- /dev/null
+++ b/src/utils/general.js
@@ -0,0 +1,18 @@
+function shallowEqual(a, b) {
+ if (a === b) return true
+ if (typeof a === 'object' && typeof a === typeof b) {
+ if (a === null || b === null) return false
+ for (const key in a) {
+ if (a[key] !== b[key]) return false
+ }
+ for (const key in b) {
+ if (!Object.prototype.hasOwnProperty.call(a, key)) return false
+ }
+ return true
+ }
+ return false
+}
+
+export default {
+ shallowEqual,
+}