From 328a04f9bb80464f2dbf876ce3ecfb3b5e86966b Mon Sep 17 00:00:00 2001
From: EnixCoda <enixcoda@gmail.com>
Date: Sat, 20 Jun 2020 19:18:50 +0800
Subject: [PATCH] refactor: handle hash links natively

---
 src/components/FileExplorer.tsx |  2 +-
 src/components/Node.tsx         |  5 ++---
 src/driver/core/FileExplorer.ts | 15 +++++++++++++--
 3 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/src/components/FileExplorer.tsx b/src/components/FileExplorer.tsx
index 778acf1..565f86e 100644
--- a/src/components/FileExplorer.tsx
+++ b/src/components/FileExplorer.tsx
@@ -175,7 +175,7 @@ function ListView({
   width: number
   focusedNode: TreeNode | null
   searchKey: string
-  onNodeClick(node: TreeNode): void
+  onNodeClick(event: React.MouseEvent<HTMLElement, MouseEvent>, node: TreeNode): void
   renderActions?(node: TreeNode): React.ReactNode
   visibleNodes: VisibleNodes
 } & Pick<Props, 'metaData'> &
diff --git a/src/components/Node.tsx b/src/components/Node.tsx
index 58d9c89..b2a2355 100644
--- a/src/components/Node.tsx
+++ b/src/components/Node.tsx
@@ -19,7 +19,7 @@ function getIconType(node: TreeNode) {
 
 type Props = {
   node: TreeNode
-  onClick(node: TreeNode): void
+  onClick(event: React.MouseEvent<HTMLElement, MouseEvent>, node: TreeNode): void
   depth: number
   expanded: boolean
   focused: boolean
@@ -49,9 +49,8 @@ export function Node({
           // The default behavior, open in new tab
           return
         }
-        event.preventDefault()
 
-        onClick(node)
+        onClick(event, node)
       }}
       className={cx(`node-item`, { focused, disabled: node.accessDenied, expanded })}
       style={{ ...style, paddingLeft: `${10 + 20 * depth}px` }}
diff --git a/src/driver/core/FileExplorer.ts b/src/driver/core/FileExplorer.ts
index cf0f4df..c73f9da 100644
--- a/src/driver/core/FileExplorer.ts
+++ b/src/driver/core/FileExplorer.ts
@@ -230,18 +230,29 @@ export const focusNode: BoundMethodCreator<[TreeNode | null, boolean]> = dispatc
   dispatch.call(updateVisibleNodes)
 }
 
-export const onNodeClick: BoundMethodCreator<[TreeNode]> = dispatch => node => {
+export const onNodeClick: BoundMethodCreator<[
+  React.MouseEvent<HTMLElement, MouseEvent>,
+  TreeNode,
+]> = dispatch => (event, node) => {
+  let preventDefault = true
   if (node.type === 'tree') {
     dispatch.call(toggleNodeExpansion, node, true)
   } else if (node.type === 'blob') {
     const [, { loadWithPJAX }] = dispatch.get()
     dispatch.call(focusNode, node, true)
-    if (node.url) loadWithPJAX(node.url)
+    if (node.url) {
+      if (node.url.startsWith('#')) {
+        preventDefault = false
+      } else {
+        loadWithPJAX(node.url)
+      }
+    }
   } else if (node.type === 'commit') {
     if (node.url) {
       window.open(node.url, '_blank')
     }
   }
+  if (preventDefault) event.preventDefault()
 }
 
 export const expandTo: BoundMethodCreator<[string[]]> = dispatch => currentPath => {