Middle click to open cell in new tab

Author: platypii

package.json

@@ -23,7 +23,7 @@
   },
   "dependencies": {
     "highlight.js": "11.10.0",
-    "hightable": "0.6.0",
+    "hightable": "0.6.1",
     "hyparquet": "1.5.0",
     "hyparquet-compressors": "0.1.4"
   },
@@ -34,7 +34,7 @@
     "@rollup/plugin-terser": "0.4.4",
     "@rollup/plugin-typescript": "12.1.1",
     "@testing-library/react": "16.0.1",
-    "@types/node": "22.7.9",
+    "@types/node": "22.8.1",
     "@types/react": "18.3.12",
     "@types/react-dom": "18.3.1",
     "@vitejs/plugin-react": "4.3.3",

public/build/app.min.js

@@ -61,6 +61,14 @@ export default function ParquetView({ file, setProgress, setError }: ViewerProps
     location.href = '/files?key=' + file + '&row=' + row + '&col=' + col
   }, [file])
 
+  const onMouseDownCell = useCallback((event: React.MouseEvent, col: number, row: number) => {
+    if (event.button === 1) {
+      // Middle click open in new tab
+      event.preventDefault()
+      window.open('/files?key=' + file + '&row=' + row + '&col=' + col, '_blank')
+    }
+  }, [file])
+
   const headers = <>
     {content?.dataframe && <span>{content.dataframe.numRows.toLocaleString()} rows</span>}
   </>
@@ -70,6 +78,7 @@ export default function ParquetView({ file, setProgress, setError }: ViewerProps
       cacheKey={url}
       data={content.dataframe}
       onDoubleClickCell={onDoubleClickCell}
+      onMouseDownCell={onMouseDownCell}
       onError={setError} />}
 
     {loading && <Spinner className='center' />}