hyparquet demo: use json viewer for metadata

platypii · platypii · commit 743784320dc4 · 2025-05-13T21:24:11.000-07:00
diff --git a/hightable/eslint.config.js b/hightable/eslint.config.js
@@ -48,6 +48,7 @@ export default tseslint.config(
       eqeqeq: 'error',
       'func-style': ['error', 'declaration'],
       indent: ['error', 2],
+      'key-spacing': 'error',
       'no-constant-condition': 'off',
       'no-extra-parens': 'error',
       'no-multi-spaces': 'error',
diff --git a/hightable/package.json b/hightable/package.json
@@ -21,7 +21,7 @@
   },
   "devDependencies": {
     "@types/react": "19.1.4",
-    "@types/react-dom": "19.1.4",
+    "@types/react-dom": "19.1.5",
     "@vitejs/plugin-react": "4.4.1",
     "@vitest/coverage-v8": "3.1.3",
     "eslint": "9.26.0",
diff --git a/hyparquet/eslint.config.js b/hyparquet/eslint.config.js
@@ -48,6 +48,7 @@ export default tseslint.config(
       eqeqeq: 'error',
       'func-style': ['error', 'declaration'],
       indent: ['error', 2],
+      'key-spacing': 'error',
       'no-constant-condition': 'off',
       'no-extra-parens': 'error',
       'no-multi-spaces': 'error',
diff --git a/hyparquet/package.json b/hyparquet/package.json
@@ -23,7 +23,7 @@
   },
   "devDependencies": {
     "@types/react": "19.1.4",
-    "@types/react-dom": "19.1.4",
+    "@types/react-dom": "19.1.5",
     "@vitejs/plugin-react": "4.4.1",
     "@vitest/coverage-v8": "3.1.3",
     "eslint": "9.26.0",
diff --git a/hyparquet/src/ParquetMetadata.tsx b/hyparquet/src/ParquetMetadata.tsx
@@ -1,5 +1,6 @@
-import { FileMetaData, toJson } from 'hyparquet'
-import { ReactNode } from 'react'
+import type { FileMetaData } from 'hyparquet'
+import { Json } from 'hyperparam'
+import type { ReactNode } from 'react'
 
 interface MetadataProps {
   metadata: FileMetaData
@@ -12,7 +13,7 @@ interface MetadataProps {
  * @returns {ReactNode}
  */
 export default function ParquetMetadata({ metadata }: MetadataProps): ReactNode {
-  return <code className='viewer'>
-    {JSON.stringify(toJson(metadata), null, ' ')}
+  return <code className='viewer json'>
+    <Json json={metadata} />
   </code>
 }
diff --git a/hyparquet/src/index.css b/hyparquet/src/index.css
@@ -311,3 +311,8 @@ input[type="file"] {
   min-width: 0;
   width: 0;
 }
+
+.json {
+  background-color: #22222b;
+  padding-left: 20px;
+}
diff --git a/icebird/eslint.config.js b/icebird/eslint.config.js
@@ -48,6 +48,7 @@ export default tseslint.config(
       eqeqeq: 'error',
       'func-style': ['error', 'declaration'],
       indent: ['error', 2],
+      'key-spacing': 'error',
       'no-constant-condition': 'off',
       'no-extra-parens': 'error',
       'no-multi-spaces': 'error',
diff --git a/icebird/package.json b/icebird/package.json
@@ -22,7 +22,7 @@
   },
   "devDependencies": {
     "@types/react": "19.1.4",
-    "@types/react-dom": "19.1.4",
+    "@types/react-dom": "19.1.5",
     "@vitejs/plugin-react": "4.4.1",
     "@vitest/coverage-v8": "3.1.3",
     "eslint": "9.26.0",

Original file line number	Diff line number	Diff line change
`@@ -311,3 +311,8 @@ input[type="file"] {`
`311`	`311`	`min-width: 0;`
`312`	`312`	`width: 0;`
`313`	`313`	`}`
	`314`	`+`
	`315`	`+.json {`
	`316`	`+ background-color: #22222b;`
	`317`	`+ padding-left: 20px;`
	`318`	`+}`