fixes

robert3005 · robert3005 · commit c2fd5e0825e4 · 2026-06-29T15:30:43.000+01:00
Signed-off-by: Robert Kruszewski &lt;github@robertk.io&gt;
diff --git a/vortex-web/src/components/DataTable.tsx b/vortex-web/src/components/DataTable.tsx
@@ -329,28 +329,26 @@ export function DataTable({
           <span className="text-vortex-grey-dark tabular-nums">{info.row.index}</span>
         ),
       },
-      ...columns.map(
-        (col): ColumnDef<Record<string, unknown>> => ({
-          accessorKey: col,
-          header: () => (
-            <ColumnHeader name={col} stats={columnStats[col]} approximate={approximate} />
-          ),
-          cell: (info) => {
-            const renderer = cellRenderers?.[col];
-            if (renderer) {
-              return renderer(info.getValue(), info.row.original);
-            }
-            const val = info.getValue();
-            if (val == null) {
-              return <span className="text-vortex-grey-dark italic">null</span>;
-            }
-            return formatCell(val);
-          },
-          sortingFn: 'auto',
-        }),
-      ),
+      ...columns.map((col): ColumnDef<Record<string, unknown>> => ({
+        accessorKey: col,
+        header: () => (
+          <ColumnHeader name={col} stats={columnStats[col]} approximate={approximate} />
+        ),
+        cell: (info) => {
+          const renderer = cellRenderers?.[col];
+          if (renderer) {
+            return renderer(info.getValue(), info.row.original);
+          }
+          const val = info.getValue();
+          if (val == null) {
+            return <span className="text-vortex-grey-dark italic">null</span>;
+          }
+          return formatCell(val);
+        },
+        sortingFn: 'auto',
+      })),
     ],
-    [columns, columnStats],
+    [approximate, cellRenderers, columns, columnStats],
   );
 
   const table = useReactTable({
diff --git a/vortex-web/src/components/ThemePicker.tsx b/vortex-web/src/components/ThemePicker.tsx
@@ -2,7 +2,7 @@
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
 import type React from 'react';
-import { useTheme, type ThemeChoice } from '../contexts/ThemeContext';
+import { useTheme, type ThemeChoice } from '../contexts/ThemeContextCore';
 
 const cycle: ThemeChoice[] = ['dark', 'light', 'system'];
 
diff --git a/vortex-web/src/components/detail/BuffersPane.tsx b/vortex-web/src/components/detail/BuffersPane.tsx
@@ -4,7 +4,7 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import type { LayoutTreeNode } from '../swimlane/types';
 import { formatBytes, parseArrayNodeId } from '../swimlane/utils';
-import { useVortexFile } from '../../contexts/VortexFileContext';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
 
 interface BuffersPaneProps {
   node: LayoutTreeNode;
diff --git a/vortex-web/src/components/detail/DetailPanel.tsx b/vortex-web/src/components/detail/DetailPanel.tsx
@@ -2,8 +2,8 @@
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
 import { useMemo, useState } from 'react';
-import { useVortexFile } from '../../contexts/VortexFileContext';
-import { useSelection } from '../../contexts/SelectionContext';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
+import { useSelection } from '../../contexts/SelectionContextCore';
 import {
   getNodeDisplayName,
   findPathToNode,
diff --git a/vortex-web/src/components/detail/EncodingPane.tsx b/vortex-web/src/components/detail/EncodingPane.tsx
@@ -2,7 +2,7 @@
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
 import { useEffect, useState } from 'react';
-import { useVortexFile } from '../../contexts/VortexFileContext';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
 import type { LayoutTreeNode, ArrayEncodingNode } from '../swimlane/types';
 import { shortEncoding, formatBytes } from '../swimlane/utils';
 
diff --git a/vortex-web/src/components/detail/SegmentsPane.tsx b/vortex-web/src/components/detail/SegmentsPane.tsx
@@ -4,8 +4,8 @@
 import { useCallback, useMemo } from 'react';
 import type { LayoutTreeNode, SegmentMapEntry } from '../swimlane/types';
 import { collectSubtreeSegments, findPathToNode, getNodeDisplayName } from '../swimlane/utils';
-import { useVortexFile } from '../../contexts/VortexFileContext';
-import { useSelection } from '../../contexts/SelectionContext';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
+import { useSelection } from '../../contexts/SelectionContextCore';
 import { DataTable, type CellRenderer } from '../DataTable';
 
 interface SegmentsPaneProps {
diff --git a/vortex-web/src/components/explorer/BlockTreemap.tsx b/vortex-web/src/components/explorer/BlockTreemap.tsx
@@ -16,7 +16,7 @@ import {
   formatBytes,
   DTYPE_COLORS,
 } from '../swimlane/utils';
-import { useTheme } from '../../contexts/ThemeContext';
+import { useTheme } from '../../contexts/ThemeContextCore';
 import {
   nodePhysicalStats,
   arraySubtreeBytes,
diff --git a/vortex-web/src/components/explorer/DataPreview.tsx b/vortex-web/src/components/explorer/DataPreview.tsx
@@ -3,8 +3,8 @@
 
 import { useEffect, useMemo, useState } from 'react';
 import { tableFromIPC } from 'apache-arrow';
-import { useSelection } from '../../contexts/SelectionContext';
-import { useVortexFile } from '../../contexts/VortexFileContext';
+import { useSelection } from '../../contexts/SelectionContextCore';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
 import { parseArrayNodeId } from '../swimlane/utils';
 import { DataTable } from '../DataTable';
 
diff --git a/vortex-web/src/components/explorer/FileHeader.tsx b/vortex-web/src/components/explorer/FileHeader.tsx
@@ -1,7 +1,7 @@
 // SPDX-License-Identifier: Apache-2.0
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
-import { useVortexFile } from '../../contexts/VortexFileContext';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
 import { ThemePicker } from '../ThemePicker';
 
 interface FileHeaderProps {
diff --git a/vortex-web/src/components/explorer/FileMap.tsx b/vortex-web/src/components/explorer/FileMap.tsx
@@ -3,8 +3,8 @@
 
 import { useRef, useEffect, useMemo, useState, useCallback } from 'react';
 import { collectSubtreeSegments, formatBytes } from '../swimlane/utils';
-import { useVortexFile } from '../../contexts/VortexFileContext';
-import { useSelection } from '../../contexts/SelectionContext';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
+import { useSelection } from '../../contexts/SelectionContextCore';
 import type { SegmentMapEntry } from '../swimlane/types';
 
 /**
diff --git a/vortex-web/src/components/explorer/StatusBar.tsx b/vortex-web/src/components/explorer/StatusBar.tsx
@@ -2,8 +2,8 @@
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
 import { useMemo } from 'react';
-import { useVortexFile } from '../../contexts/VortexFileContext';
-import { useSelection } from '../../contexts/SelectionContext';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
+import { useSelection } from '../../contexts/SelectionContextCore';
 import { formatBytes, formatRowCount, collectSubtreeSegments } from '../swimlane/utils';
 
 export function StatusBar() {
diff --git a/vortex-web/src/components/explorer/TimelineTab.tsx b/vortex-web/src/components/explorer/TimelineTab.tsx
@@ -2,8 +2,8 @@
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
 import { useState } from 'react';
-import { useVortexFile } from '../../contexts/VortexFileContext';
-import { useSelection } from '../../contexts/SelectionContext';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
+import { useSelection } from '../../contexts/SelectionContextCore';
 import { LayoutSwimlane } from '../swimlane/LayoutSwimlane';
 
 export function TimelineTab() {
diff --git a/vortex-web/src/components/explorer/TreePanel.tsx b/vortex-web/src/components/explorer/TreePanel.tsx
@@ -2,8 +2,8 @@
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
 import { useState, useCallback, useMemo, useEffect, useRef } from 'react';
-import { useVortexFile } from '../../contexts/VortexFileContext';
-import { useSelection } from '../../contexts/SelectionContext';
+import { useVortexFile } from '../../contexts/VortexFileContextCore';
+import { useSelection } from '../../contexts/SelectionContextCore';
 import {
   flattenTree,
   filterTreeBySearch,
diff --git a/vortex-web/src/components/swimlane/types.ts b/vortex-web/src/components/swimlane/types.ts
@@ -83,14 +83,7 @@ export interface FlattenedRow {
 
 // Retained from original types
 export type DtypeCategory =
-  | 'bool'
-  | 'int'
-  | 'float'
-  | 'utf8'
-  | 'datetime'
-  | 'struct'
-  | 'list'
-  | 'other';
+  'bool' | 'int' | 'float' | 'utf8' | 'datetime' | 'struct' | 'list' | 'other';
 
 export interface Split {
   id: string;
diff --git a/vortex-web/src/contexts/SelectionContext.tsx b/vortex-web/src/contexts/SelectionContext.tsx
@@ -1,9 +1,10 @@
 // SPDX-License-Identifier: Apache-2.0
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
-import { createContext, useContext, useReducer, useCallback, type ReactNode } from 'react';
+import { useReducer, useCallback, type ReactNode } from 'react';
 import type { LayoutTreeNode } from '../components/swimlane/types';
 import { findNodeById } from '../components/swimlane/utils';
+import { SelectionContext } from './SelectionContextCore';
 
 export interface SelectionState {
   selectedNodeId: string | null;
@@ -58,7 +59,7 @@ const initialState: SelectionState = {
   selectedSegmentIndex: null,
 };
 
-interface SelectionContextValue {
+export interface SelectionContextValue {
   state: SelectionState;
   selectNode: (nodeId: string | null) => void;
   hoverNode: (nodeId: string | null) => void;
@@ -67,8 +68,6 @@ interface SelectionContextValue {
   clearSelection: () => void;
 }
 
-const SelectionContext = createContext<SelectionContextValue | null>(null);
-
 export function SelectionProvider({
   tree,
   children,
@@ -108,11 +107,3 @@ export function SelectionProvider({
     </SelectionContext.Provider>
   );
 }
-
-export function useSelection(): SelectionContextValue {
-  const ctx = useContext(SelectionContext);
-  if (!ctx) throw new Error('useSelection must be used within SelectionProvider');
-  return ctx;
-}
-
-export { SelectionContext };
diff --git a/vortex-web/src/contexts/SelectionContextCore.ts b/vortex-web/src/contexts/SelectionContextCore.ts
@@ -0,0 +1,13 @@
+// SPDX-License-Identifier: Apache-2.0
+// SPDX-FileCopyrightText: Copyright the Vortex contributors
+
+import { createContext, useContext } from 'react';
+import type { SelectionContextValue } from './SelectionContext';
+
+export const SelectionContext = createContext<SelectionContextValue | null>(null);
+
+export function useSelection(): SelectionContextValue {
+  const ctx = useContext(SelectionContext);
+  if (!ctx) throw new Error('useSelection must be used within SelectionProvider');
+  return ctx;
+}
diff --git a/vortex-web/src/contexts/ThemeContext.tsx b/vortex-web/src/contexts/ThemeContext.tsx
@@ -1,17 +1,16 @@
 // SPDX-License-Identifier: Apache-2.0
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
-import { createContext, useCallback, useContext, useEffect, useState, type ReactNode } from 'react';
+import { useCallback, useEffect, useState, type ReactNode } from 'react';
+import { ThemeContext } from './ThemeContextCore';
 
 export type ThemeChoice = 'light' | 'dark' | 'system';
 
-interface ThemeContextValue {
+export interface ThemeContextValue {
   theme: ThemeChoice;
   setTheme: (theme: ThemeChoice) => void;
 }
 
-const ThemeContext = createContext<ThemeContextValue | null>(null);
-
 const STORAGE_KEY = 'vortex-theme';
 
 function applyTheme(choice: ThemeChoice) {
@@ -55,11 +54,3 @@ export function ThemeProvider({ children }: { children: ReactNode }) {
 
   return <ThemeContext.Provider value={{ theme, setTheme }}>{children}</ThemeContext.Provider>;
 }
-
-export function useTheme(): ThemeContextValue {
-  const ctx = useContext(ThemeContext);
-  if (!ctx) throw new Error('useTheme must be used within a ThemeProvider');
-  return ctx;
-}
-
-export { ThemeContext };
diff --git a/vortex-web/src/contexts/ThemeContextCore.ts b/vortex-web/src/contexts/ThemeContextCore.ts
@@ -0,0 +1,15 @@
+// SPDX-License-Identifier: Apache-2.0
+// SPDX-FileCopyrightText: Copyright the Vortex contributors
+
+import { createContext, useContext } from 'react';
+import type { ThemeContextValue } from './ThemeContext';
+
+export type { ThemeChoice, ThemeContextValue } from './ThemeContext';
+
+export const ThemeContext = createContext<ThemeContextValue | null>(null);
+
+export function useTheme(): ThemeContextValue {
+  const ctx = useContext(ThemeContext);
+  if (!ctx) throw new Error('useTheme must be used within a ThemeProvider');
+  return ctx;
+}
diff --git a/vortex-web/src/contexts/VortexFileContext.tsx b/vortex-web/src/contexts/VortexFileContext.tsx
@@ -1,13 +1,14 @@
 // SPDX-License-Identifier: Apache-2.0
 // SPDX-FileCopyrightText: Copyright the Vortex contributors
 
-import { createContext, useContext } from 'react';
+import type { ReactNode } from 'react';
 import type {
   LayoutTreeNode,
   SegmentMapEntry,
   FileStructureInfo,
   ArrayEncodingNode,
 } from '../components/swimlane/types';
+import { VortexFileContext } from './VortexFileContextCore';
 
 export interface VortexFileState {
   fileName: string;
@@ -39,22 +40,12 @@ export interface VortexFileContextValue extends VortexFileState {
   ) => Promise<Uint8Array>;
 }
 
-const VortexFileContext = createContext<VortexFileContextValue | null>(null);
-
 export function VortexFileProvider({
   value,
   children,
 }: {
   value: VortexFileContextValue;
-  children: React.ReactNode;
+  children: ReactNode;
 }) {
   return <VortexFileContext.Provider value={value}>{children}</VortexFileContext.Provider>;
 }
-
-export function useVortexFile(): VortexFileContextValue {
-  const ctx = useContext(VortexFileContext);
-  if (!ctx) throw new Error('useVortexFile must be used within VortexFileProvider');
-  return ctx;
-}
-
-export { VortexFileContext };
diff --git a/vortex-web/src/contexts/VortexFileContextCore.ts b/vortex-web/src/contexts/VortexFileContextCore.ts
@@ -0,0 +1,13 @@
+// SPDX-License-Identifier: Apache-2.0
+// SPDX-FileCopyrightText: Copyright the Vortex contributors
+
+import { createContext, useContext } from 'react';
+import type { VortexFileContextValue } from './VortexFileContext';
+
+export const VortexFileContext = createContext<VortexFileContextValue | null>(null);
+
+export function useVortexFile(): VortexFileContextValue {
+  const ctx = useContext(VortexFileContext);
+  if (!ctx) throw new Error('useVortexFile must be used within VortexFileProvider');
+  return ctx;
+}
