fix playback and typing

src/app/[org]/[dataset]/[episode]/episode-viewer.tsx

@@ -9,7 +9,7 @@ import PlaybackBar from "@/components/playback-bar";
 import { TimeProvider, useTime } from "@/context/time-context";
 import Sidebar from "@/components/side-nav";
 import Loading from "@/components/loading-component";
-import { getAdjacentEpisodesVideoInfo } from "./fetch-data";
+import { getAdjacentEpisodesVideoInfo, type EpisodeData } from "./fetch-data";
 
 export default function EpisodeViewer({
   data,
@@ -17,7 +17,7 @@ export default function EpisodeViewer({
   org,
   dataset,
 }: {
-  data?: any;
+  data?: EpisodeData;
   error?: string;
   org?: string;
   dataset?: string;
@@ -33,13 +33,13 @@ export default function EpisodeViewer({
     );
   }
   return (
-    <TimeProvider duration={data.duration}>
-      <EpisodeViewerInner data={data} org={org} dataset={dataset} />
+    <TimeProvider duration={data!.duration}>
+      <EpisodeViewerInner data={data!} org={org} dataset={dataset} />
     </TimeProvider>
   );
 }
 
-function EpisodeViewerInner({ data, org, dataset }: { data: any; org?: string; dataset?: string; }) {
+function EpisodeViewerInner({ data, org, dataset }: { data: EpisodeData; org?: string; dataset?: string }) {
   const {
     datasetInfo,
     episodeId,
@@ -53,6 +53,13 @@ function EpisodeViewerInner({ data, org, dataset }: { data: any; org?: string; d
   const [chartsReady, setChartsReady] = useState(false);
   const isLoading = !videosReady || !chartsReady;
 
+  const loadStartRef = useRef(performance.now());
+  useEffect(() => {
+    if (!isLoading) {
+      console.log(`[perf] Loading complete in ${(performance.now() - loadStartRef.current).toFixed(0)}ms (videos: ${videosReady ? '✓' : '…'}, charts: ${chartsReady ? '✓' : '…'})`);
+    }
+  }, [isLoading]);
+
   const router = useRouter();
   const searchParams = useSearchParams();
 
@@ -84,7 +91,7 @@ function EpisodeViewerInner({ data, org, dataset }: { data: any; org?: string; d
             link.href = v.url;
             document.head.appendChild(link);
             links.push(link);
-          }
+      }
         }
       })
       .catch(() => {});
@@ -244,7 +251,7 @@ function EpisodeViewerInner({ data, org, dataset }: { data: any; org?: string; d
               <span className="font-semibold text-slate-100">Language Instruction:</span>
             </p>
             <div className="mt-2 text-slate-300">
-              {task.split('\n').map((instruction, index) => (
+              {task.split('\n').map((instruction: string, index: number) => (
                 <p key={index} className="mb-1">
                   {instruction}
                 </p>

src/app/[org]/[dataset]/[episode]/fetch-data.ts

@@ -9,25 +9,105 @@ import { getDatasetVersionAndInfo, buildVersionedUrl } from "@/utils/versionUtil
 
 const SERIES_NAME_DELIMITER = " | ";
 
+export type VideoInfo = {
+  filename: string;
+  url: string;
+  isSegmented?: boolean;
+  segmentStart?: number;
+  segmentEnd?: number;
+  segmentDuration?: number;
+};
+
+export type DatasetDisplayInfo = {
+  repoId: string;
+  total_frames: number;
+  total_episodes: number;
+  fps: number;
+};
+
+export type ChartRow = Record<string, number | Record<string, number>>;
+
+export type EpisodeData = {
+  datasetInfo: DatasetDisplayInfo;
+  episodeId: number;
+  videosInfo: VideoInfo[];
+  chartDataGroups: ChartRow[][];
+  episodes: number[];
+  ignoredColumns: string[];
+  duration: number;
+  task?: string;
+};
+
+type EpisodeMetadataV3 = {
+  episode_index: number;
+  data_chunk_index: number;
+  data_file_index: number;
+  dataset_from_index: number;
+  dataset_to_index: number;
+  video_chunk_index: number;
+  video_file_index: number;
+  video_from_timestamp: number;
+  video_to_timestamp: number;
+  length: number;
+  [key: string]: string | number;
+};
+
+type ColumnDef = {
+  key: string;
+  value: string[];
+};
+
+function groupRowBySuffix(row: Record<string, number>): ChartRow {
+  const result: ChartRow = {};
+  const suffixGroups: Record<string, Record<string, number>> = {};
+  for (const [key, value] of Object.entries(row)) {
+    if (key === "timestamp") {
+      result["timestamp"] = value;
+      continue;
+    }
+    const parts = key.split(SERIES_NAME_DELIMITER);
+    if (parts.length === 2) {
+      const [prefix, suffix] = parts;
+      if (!suffixGroups[suffix]) suffixGroups[suffix] = {};
+      suffixGroups[suffix][prefix] = value;
+    } else {
+      result[key] = value;
+    }
+  }
+  for (const [suffix, group] of Object.entries(suffixGroups)) {
+    const keys = Object.keys(group);
+    if (keys.length === 1) {
+      const fullName = `${keys[0]}${SERIES_NAME_DELIMITER}${suffix}`;
+      result[fullName] = group[keys[0]];
+    } else {
+      result[suffix] = group;
+    }
+  }
+  return result;
+}
+
 export async function getEpisodeData(
   org: string,
   dataset: string,
   episodeId: number,
-) {
+): Promise<EpisodeData> {
   const repoId = `${org}/${dataset}`;
   try {
+    console.time(`[perf] getDatasetVersionAndInfo`);
     const { version, info: rawInfo } = await getDatasetVersionAndInfo(repoId);
+    console.timeEnd(`[perf] getDatasetVersionAndInfo`);
     const info = rawInfo as unknown as DatasetMetadata;
 
     if (info.video_path === null) {
       throw new Error("Only videos datasets are supported in this visualizer.\nPlease use Rerun visualizer for images datasets.");
     }
 
-    if (version === "v3.0") {
-      return await getEpisodeDataV3(repoId, version, info, episodeId);
-    } else {
-      return await getEpisodeDataV2(repoId, version, info, episodeId);
-    }
+    console.time(`[perf] getEpisodeData (${version})`);
+    const result = version === "v3.0"
+      ? await getEpisodeDataV3(repoId, version, info, episodeId)
+      : await getEpisodeDataV2(repoId, version, info, episodeId);
+    console.timeEnd(`[perf] getEpisodeData (${version})`);
+    return result;
   } catch (err) {
     console.error("Error loading episode data:", err);
     throw err;
@@ -46,7 +126,7 @@ export async function getAdjacentEpisodesVideoInfo(
     const info = rawInfo as unknown as DatasetMetadata;
     
     const totalEpisodes = info.total_episodes;
-    const adjacentVideos: Array<{episodeId: number; videosInfo: any[]}> = [];
+    const adjacentVideos: Array<{episodeId: number; videosInfo: VideoInfo[]}> = [];
     
     // Calculate adjacent episode IDs
     for (let offset = -radius; offset <= radius; offset++) {
@@ -55,7 +135,7 @@ export async function getAdjacentEpisodesVideoInfo(
       const episodeId = currentEpisodeId + offset;
       if (episodeId >= 0 && episodeId < totalEpisodes) {
         try {
-          let videosInfo: any[] = [];
+          let videosInfo: VideoInfo[] = [];
           
           if (version === "v3.0") {
             const episodeMetadata = await loadEpisodeMetadataV3Simple(repoId, version, episodeId);
@@ -98,7 +178,7 @@ async function getEpisodeDataV2(
   version: string,
   info: DatasetMetadata,
   episodeId: number,
-) {
+): Promise<EpisodeData> {
   const episode_chunk = Math.floor(0 / 1000);
 
   // Dataset information
@@ -162,16 +242,16 @@ async function getEpisodeDataV2(
     ...filteredColumns.map((column) => column.key),
   ];
 
-  const columns = filteredColumns.map(({ key }) => {
-    let column_names = info.features[key].names;
-    while (typeof column_names === "object") {
+  const columns: ColumnDef[] = filteredColumns.map(({ key }) => {
+    let column_names: unknown = info.features[key].names;
+    while (typeof column_names === "object" && column_names !== null) {
       if (Array.isArray(column_names)) break;
-      column_names = Object.values(column_names ?? {})[0];
+      column_names = Object.values(column_names)[0];
     }
     return {
       key,
       value: Array.isArray(column_names)
-        ? column_names.map((name) => `${key}${SERIES_NAME_DELIMITER}${name}`)
+        ? column_names.map((name: string) => `${key}${SERIES_NAME_DELIMITER}${name}`)
         : Array.from(
             { length: columnNames.find((c) => c.key === key)?.length ?? 1 },
             (_, i) => `${key}${SERIES_NAME_DELIMITER}${i}`,
@@ -198,13 +278,13 @@ async function getEpisodeDataV2(
     const firstRow = allData[0];
     const languageInstructions: string[] = [];
     
-    if (firstRow.language_instruction) {
+    if (typeof firstRow.language_instruction === 'string') {
       languageInstructions.push(firstRow.language_instruction);
     }
     
     let instructionNum = 2;
-    while (firstRow[`language_instruction_${instructionNum}`]) {
-      languageInstructions.push(firstRow[`language_instruction_${instructionNum}`]);
+    while (typeof firstRow[`language_instruction_${instructionNum}`] === 'string') {
+      languageInstructions.push(firstRow[`language_instruction_${instructionNum}`] as string);
       instructionNum++;
     }
     
@@ -213,7 +293,7 @@ async function getEpisodeDataV2(
     }
   }
   
-  if (!task && allData.length > 0 && allData[0].task) {
+  if (!task && allData.length > 0 && typeof allData[0].task === 'string') {
     task = allData[0].task;
   }
   
@@ -251,13 +331,13 @@ async function getEpisodeDataV2(
 
   const chartData = allData.map((row) => {
     const obj: Record<string, number> = {};
-    obj["timestamp"] = row.timestamp;
+    obj["timestamp"] = Number(row.timestamp);
     for (const col of columns) {
       const rawVal = row[col.key];
       if (Array.isArray(rawVal)) {
-        rawVal.forEach((v: any, i: number) => {
+        rawVal.forEach((v: unknown, i: number) => {
           if (i < col.value.length) obj[col.value[i]] = Number(v);
-        });
+    });
       } else if (rawVal !== undefined) {
         obj[col.value[0]] = Number(rawVal);
       }
@@ -351,37 +431,6 @@ async function getEpisodeDataV2(
 
   const duration = chartData[chartData.length - 1].timestamp;
 
-  // Utility: group row keys by suffix
-  function groupRowBySuffix(row: Record<string, number>): Record<string, any> {
-    const result: Record<string, any> = {};
-    const suffixGroups: Record<string, Record<string, number>> = {};
-    for (const [key, value] of Object.entries(row)) {
-      if (key === "timestamp") {
-        result["timestamp"] = value;
-        continue;
-      }
-      const parts = key.split(SERIES_NAME_DELIMITER);
-      if (parts.length === 2) {
-        const [prefix, suffix] = parts;
-        if (!suffixGroups[suffix]) suffixGroups[suffix] = {};
-        suffixGroups[suffix][prefix] = value;
-      } else {
-        result[key] = value;
-      }
-    }
-    for (const [suffix, group] of Object.entries(suffixGroups)) {
-      const keys = Object.keys(group);
-      if (keys.length === 1) {
-        // Use the full original name as the key
-        const fullName = `${keys[0]}${SERIES_NAME_DELIMITER}${suffix}`;
-        result[fullName] = group[keys[0]];
-      } else {
-        result[suffix] = group;
-      }
-    }
-    return result;
-  }
-
   const chartDataGroups = chartGroups.map((group) =>
     chartData.map((row) => groupRowBySuffix(pick(row, [...group, "timestamp"])))
   );
@@ -404,7 +453,7 @@ async function getEpisodeDataV3(
   version: string,
   info: DatasetMetadata,
   episodeId: number,
-) {
+): Promise<EpisodeData> {
   // Create dataset info structure (like v2.x)
   const datasetInfo = {
     repoId,
@@ -446,8 +495,8 @@ async function loadEpisodeDataV3(
   repoId: string,
   version: string,
   info: DatasetMetadata,
-  episodeMetadata: any,
-): Promise<{ chartDataGroups: any[]; ignoredColumns: string[]; task?: string }> {
+  episodeMetadata: EpisodeMetadataV3,
+): Promise<{ chartDataGroups: ChartRow[][]; ignoredColumns: string[]; task?: string }> {
   // Build data file path using chunk and file indices
   const dataChunkIndex = episodeMetadata.data_chunk_index || 0;
   const dataFileIndex = episodeMetadata.data_file_index || 0;
@@ -486,72 +535,54 @@ async function loadEpisodeDataV3(
     // First check for language_instruction fields in the data (preferred)
     let task: string | undefined;
     if (episodeData.length > 0) {
-      const firstRow = episodeData[0];
       const languageInstructions: string[] = [];
       
-      // Check for language_instruction field
-      if (firstRow.language_instruction) {
-        languageInstructions.push(firstRow.language_instruction);
-      }
-      
-      // Check for numbered language_instruction fields
-      let instructionNum = 2;
-      while (firstRow[`language_instruction_${instructionNum}`]) {
-        languageInstructions.push(firstRow[`language_instruction_${instructionNum}`]);
-        instructionNum++;
-      }
+      const extractInstructions = (row: Record<string, unknown>) => {
+        if (typeof row.language_instruction === 'string') {
+          languageInstructions.push(row.language_instruction);
+        }
+        let num = 2;
+        while (typeof row[`language_instruction_${num}`] === 'string') {
+          languageInstructions.push(row[`language_instruction_${num}`] as string);
+          num++;
+        }
+      };
+
+      extractInstructions(episodeData[0]);
       
-      // If no instructions found in first row, check a few more rows
+      // If no instructions in first row, check middle and last rows
       if (languageInstructions.length === 0 && episodeData.length > 1) {
-        const middleIndex = Math.floor(episodeData.length / 2);
-        const lastIndex = episodeData.length - 1;
-        
-        [middleIndex, lastIndex].forEach((idx) => {
-          const row = episodeData[idx];
-          
-          if (row.language_instruction && languageInstructions.length === 0) {
-            // Use this row's instructions
-            if (row.language_instruction) {
-              languageInstructions.push(row.language_instruction);
-            }
-            let num = 2;
-            while (row[`language_instruction_${num}`]) {
-              languageInstructions.push(row[`language_instruction_${num}`]);
-              num++;
-            }
-          }
-        });
+        for (const idx of [Math.floor(episodeData.length / 2), episodeData.length - 1]) {
+          extractInstructions(episodeData[idx]);
+          if (languageInstructions.length > 0) break;
+        }
       }
       
-      // Join all instructions with line breaks
       if (languageInstructions.length > 0) {
         task = languageInstructions.join('\n');
       }
     }
     
-    // If no language instructions found, fall back to tasks metadata
-    if (!task) {
+    // Fall back to tasks metadata parquet
+    if (!task && episodeData.length > 0) {
       try {
-        // Load tasks metadata
         const tasksUrl = buildVersionedUrl(repoId, version, "meta/tasks.parquet");
         const tasksArrayBuffer = await fetchParquetFile(tasksUrl);
         const tasksData = await readParquetAsObjects(tasksArrayBuffer, []);
         
-        if (episodeData.length > 0 && tasksData && tasksData.length > 0) {
+        if (tasksData.length > 0) {
           const taskIndex = episodeData[0].task_index;
+          const taskIndexNum = typeof taskIndex === 'bigint' ? Number(taskIndex) : 
+                               typeof taskIndex === 'number' ? taskIndex : undefined;
           
-          // Convert BigInt to number for comparison
-          const taskIndexNum = typeof taskIndex === 'bigint' ? Number(taskIndex) : taskIndex;
-          
-          // Look up task by index
           if (taskIndexNum !== undefined && taskIndexNum < tasksData.length) {
             const taskData = tasksData[taskIndexNum];
-            // Extract task from __index_level_0__ field
-            task = taskData.__index_level_0__ || taskData.task || taskData['task'] || taskData[0];
+            const rawTask = taskData.__index_level_0__ ?? taskData.task;
+            task = typeof rawTask === 'string' ? rawTask : undefined;
           }
         }
-      } catch (error) {
-        // Could not load tasks metadata - dataset might not have language tasks
+      } catch {
+        // Could not load tasks metadata
       }
     }
     
@@ -563,10 +594,10 @@ async function loadEpisodeDataV3(
 
 // Process episode data for charts (v3.0 compatible)
 function processEpisodeDataForCharts(
-  episodeData: any[],
+  episodeData: Record<string, unknown>[],
   info: DatasetMetadata,
-  episodeMetadata?: any,
-): { chartDataGroups: any[]; ignoredColumns: string[] } {
+  episodeMetadata?: EpisodeMetadataV3,
+): { chartDataGroups: ChartRow[][]; ignoredColumns: string[] } {
   
   // Get numeric column features
   const columnNames = Object.entries(info.features)
@@ -612,22 +643,22 @@ function processEpisodeDataForCharts(
   const excludedColumns = ['index', 'task_index', 'episode_index', 'frame_index', 'next.done'];
 
   // Create columns structure similar to V2.1 for proper hierarchical naming
-  const columns = Object.entries(info.features)
+  const columns: ColumnDef[] = Object.entries(info.features)
     .filter(([key, value]) => 
       ["float32", "int32"].includes(value.dtype) && 
       value.shape.length === 1 && 
       !excludedColumns.includes(key)
     )
     .map(([key, feature]) => {
-      let column_names = feature.names;
-      while (typeof column_names === "object") {
+      let column_names: unknown = feature.names;
+      while (typeof column_names === "object" && column_names !== null) {
         if (Array.isArray(column_names)) break;
-        column_names = Object.values(column_names ?? {})[0];
+        column_names = Object.values(column_names)[0];
       }
       return {
         key,
         value: Array.isArray(column_names)
-          ? column_names.map((name) => `${key}${SERIES_NAME_DELIMITER}${name}`)
+          ? column_names.map((name: string) => `${key}${SERIES_NAME_DELIMITER}${name}`)
           : Array.from(
               { length: feature.shape[0] || 1 },
               (_, i) => `${key}${SERIES_NAME_DELIMITER}${i}`,
@@ -819,42 +850,10 @@ function processEpisodeDataForCharts(
       return [merged];
     });
 
-  // Utility function to group row keys by suffix (same as V2.1)
-  function groupRowBySuffix(row: Record<string, number>): Record<string, any> {
-    const result: Record<string, any> = {};
-    const suffixGroups: Record<string, Record<string, number>> = {};
-    for (const [key, value] of Object.entries(row)) {
-      if (key === "timestamp") {
-        result["timestamp"] = value;
-        continue;
-      }
-      const parts = key.split(SERIES_NAME_DELIMITER);
-      if (parts.length === 2) {
-        const [prefix, suffix] = parts;
-        if (!suffixGroups[suffix]) suffixGroups[suffix] = {};
-        suffixGroups[suffix][prefix] = value;
-      } else {
-        result[key] = value;
-      }
-    }
-    for (const [suffix, group] of Object.entries(suffixGroups)) {
-      const keys = Object.keys(group);
-      if (keys.length === 1) {
-        // Use the full original name as the key
-        const fullName = `${keys[0]}${SERIES_NAME_DELIMITER}${suffix}`;
-        result[fullName] = group[keys[0]];
-      } else {
-        result[suffix] = group;
-      }
-    }
-    return result;
-  }
-
   const chartDataGroups = chartGroups.map((group) =>
     chartData.map((row) => groupRowBySuffix(pick(row, [...group, "timestamp"])))
   );
 
-
   return { chartDataGroups, ignoredColumns };
 }
 
@@ -864,8 +863,8 @@ function extractVideoInfoV3WithSegmentation(
   repoId: string,
   version: string,
   info: DatasetMetadata,
-  episodeMetadata: any,
-): any[] {
+  episodeMetadata: EpisodeMetadataV3,
+): VideoInfo[] {
   // Get video features from dataset info
   const videoFeatures = Object.entries(info.features)
     .filter(([, value]) => value.dtype === "video");
@@ -876,18 +875,16 @@ function extractVideoInfoV3WithSegmentation(
       key.startsWith(`videos/${videoKey}/`)
     );
     
-    let chunkIndex, fileIndex, segmentStart, segmentEnd;
+    let chunkIndex: number, fileIndex: number, segmentStart: number, segmentEnd: number;
     
+    const toNum = (v: string | number): number => typeof v === 'string' ? parseFloat(v) || 0 : v;
+
     if (cameraSpecificKeys.length > 0) {
-      // Use camera-specific metadata
-      const chunkValue = episodeMetadata[`videos/${videoKey}/chunk_index`];
-      const fileValue = episodeMetadata[`videos/${videoKey}/file_index`];
-      chunkIndex = typeof chunkValue === 'bigint' ? Number(chunkValue) : (chunkValue || 0);
-      fileIndex = typeof fileValue === 'bigint' ? Number(fileValue) : (fileValue || 0);
-      segmentStart = episodeMetadata[`videos/${videoKey}/from_timestamp`] || 0;
-      segmentEnd = episodeMetadata[`videos/${videoKey}/to_timestamp`] || 30;
+      chunkIndex = toNum(episodeMetadata[`videos/${videoKey}/chunk_index`]);
+      fileIndex = toNum(episodeMetadata[`videos/${videoKey}/file_index`]);
+      segmentStart = toNum(episodeMetadata[`videos/${videoKey}/from_timestamp`]) || 0;
+      segmentEnd = toNum(episodeMetadata[`videos/${videoKey}/to_timestamp`]) || 30;
     } else {
-      // Fallback to generic video metadata
       chunkIndex = episodeMetadata.video_chunk_index || 0;
       fileIndex = episodeMetadata.video_file_index || 0;
       segmentStart = episodeMetadata.video_from_timestamp || 0;
@@ -916,7 +913,7 @@ async function loadEpisodeMetadataV3Simple(
   repoId: string,
   version: string,
   episodeId: number,
-): Promise<any> {
+): Promise<EpisodeMetadataV3> {
   // Pattern: meta/episodes/chunk-{chunk_index:03d}/file-{file_index:03d}.parquet
   // Most datasets have all episodes in chunk-000/file-000, but episodes can be split across files
   
@@ -964,72 +961,76 @@ async function loadEpisodeMetadataV3Simple(
 }
 
 // Simple parser for episode row - focuses on key fields for episodes
-function parseEpisodeRowSimple(row: any): any {
+function parseEpisodeRowSimple(row: Record<string, unknown>): EpisodeMetadataV3 {
   // v3.0 uses named keys in the episode metadata
   if (row && typeof row === 'object') {
     // Check if this is v3.0 format with named keys
     if ('episode_index' in row) {
       // v3.0 format - use named keys
       // Convert BigInt values to numbers
-      const toBigIntSafe = (value: any) => {
+      const toBigIntSafe = (value: unknown): number => {
         if (typeof value === 'bigint') return Number(value);
         if (typeof value === 'number') return value;
-        return parseInt(value) || 0;
+        if (typeof value === 'string') return parseInt(value) || 0;
+        return 0;
       };
       
-      const episodeData: any = {
+      const toNumSafe = (value: unknown): number => {
+        if (typeof value === 'number') return value;
+        if (typeof value === 'bigint') return Number(value);
+        if (typeof value === 'string') return parseFloat(value) || 0;
+        return 0;
+      };
+
+      // Handle video metadata - look for video-specific keys
+      const videoKeys = Object.keys(row).filter(key => key.includes('videos/') && key.includes('/chunk_index'));
+      let videoChunkIndex = 0, videoFileIndex = 0, videoFromTs = 0, videoToTs = 30;
+      if (videoKeys.length > 0) {
+        const videoBaseName = videoKeys[0].replace('/chunk_index', '');
+        videoChunkIndex = toBigIntSafe(row[`${videoBaseName}/chunk_index`]);
+        videoFileIndex = toBigIntSafe(row[`${videoBaseName}/file_index`]);
+        videoFromTs = toNumSafe(row[`${videoBaseName}/from_timestamp`]);
+        videoToTs = toNumSafe(row[`${videoBaseName}/to_timestamp`]) || 30;
+      }
+
+      const episodeData: EpisodeMetadataV3 = {
         episode_index: toBigIntSafe(row['episode_index']),
         data_chunk_index: toBigIntSafe(row['data/chunk_index']),
         data_file_index: toBigIntSafe(row['data/file_index']),
         dataset_from_index: toBigIntSafe(row['dataset_from_index']),
         dataset_to_index: toBigIntSafe(row['dataset_to_index']),
         length: toBigIntSafe(row['length']),
+        video_chunk_index: videoChunkIndex,
+        video_file_index: videoFileIndex,
+        video_from_timestamp: videoFromTs,
+        video_to_timestamp: videoToTs,
       };
       
-      // Handle video metadata - look for video-specific keys
-      const videoKeys = Object.keys(row).filter(key => key.includes('videos/') && key.includes('/chunk_index'));
-      if (videoKeys.length > 0) {
-        // Use the first video stream for basic info
-        const firstVideoKey = videoKeys[0];
-        const videoBaseName = firstVideoKey.replace('/chunk_index', '');
-        
-        episodeData.video_chunk_index = toBigIntSafe(row[`${videoBaseName}/chunk_index`]);
-        episodeData.video_file_index = toBigIntSafe(row[`${videoBaseName}/file_index`]);
-        episodeData.video_from_timestamp = row[`${videoBaseName}/from_timestamp`] || 0;
-        episodeData.video_to_timestamp = row[`${videoBaseName}/to_timestamp`] || 0;
-      } else {
-        // Fallback video values
-        episodeData.video_chunk_index = 0;
-        episodeData.video_file_index = 0;
-        episodeData.video_from_timestamp = 0;
-        episodeData.video_to_timestamp = 30;
-      }
-      
-      // Store the raw row data to preserve per-camera metadata
-      // This allows extractVideoInfoV3WithSegmentation to access camera-specific timestamps
+      // Store per-camera metadata for extractVideoInfoV3WithSegmentation
       Object.keys(row).forEach(key => {
         if (key.startsWith('videos/')) {
-          episodeData[key] = row[key];
+          const val = row[key];
+          episodeData[key] = typeof val === 'bigint' ? Number(val) : (typeof val === 'number' || typeof val === 'string' ? val : 0);
         }
       });
       
       return episodeData;
     } else {
       // Fallback to numeric keys for compatibility
-      const episodeData = {
-        episode_index: row['0'] || 0,
-        data_chunk_index: row['1'] || 0,
-        data_file_index: row['2'] || 0,
-        dataset_from_index: row['3'] || 0,
-        dataset_to_index: row['4'] || 0,
-        video_chunk_index: row['5'] || 0,
-        video_file_index: row['6'] || 0,
-        video_from_timestamp: row['7'] || 0,
-        video_to_timestamp: row['8'] || 30,
-        length: row['9'] || 30,
+      const toNum = (v: unknown, fallback = 0): number =>
+        typeof v === 'number' ? v : typeof v === 'bigint' ? Number(v) : fallback;
+      return {
+        episode_index: toNum(row['0']),
+        data_chunk_index: toNum(row['1']),
+        data_file_index: toNum(row['2']),
+        dataset_from_index: toNum(row['3']),
+        dataset_to_index: toNum(row['4']),
+        video_chunk_index: toNum(row['5']),
+        video_file_index: toNum(row['6']),
+        video_from_timestamp: toNum(row['7']),
+        video_to_timestamp: toNum(row['8'], 30),
+        length: toNum(row['9'], 30),
       };
-      
-      return episodeData;
     }
   }
   
@@ -1058,12 +1059,12 @@ export async function getEpisodeDataSafe(
   org: string,
   dataset: string,
   episodeId: number,
-): Promise<{ data?: any; error?: string }> {
+): Promise<{ data?: EpisodeData; error?: string }> {
   try {
     const data = await getEpisodeData(org, dataset, episodeId);
     return { data };
-  } catch (err: any) {
-    // Only expose the error message, not stack or sensitive info
-    return { error: err?.message || String(err) || "Unknown error" };
+  } catch (err: unknown) {
+    const message = err instanceof Error ? err.message : String(err);
+    return { error: message || "Unknown error" };
   }
 }

src/app/explore/page.tsx

@@ -12,7 +12,7 @@ export default async function ExplorePage({
 }: {
   searchParams: { p?: string };
 }) {
-  let datasets: any[] = [];
+  let datasets: { id: string }[] = [];
   let currentPage = 1;
   let totalPages = 1;
   try {
@@ -42,7 +42,7 @@ export default async function ExplorePage({
   // Fetch episode 0 data for each dataset
   const datasetWithVideos = (
     await Promise.all(
-      datasets.map(async (ds: any) => {
+      datasets.map(async (ds) => {
         try {
           const [org, dataset] = ds.id.split("/");
           const repoId = `${org}/${dataset}`;

src/app/page.tsx

@@ -4,6 +4,13 @@ import Link from "next/link";
 import { useRouter } from "next/navigation";
 import { useSearchParams } from "next/navigation";
 
+declare global {
+  interface Window {
+    YT?: { Player: new (id: string, config: Record<string, unknown>) => { destroy?: () => void } };
+    onYouTubeIframeAPIReady?: () => void;
+  }
+}
+
 export default function Home() {
   return (
     <Suspense fallback={null}>
@@ -53,18 +60,19 @@ function HomeInner() {
     }
   }, [searchParams, router]);
 
-  const playerRef = useRef<any>(null);
+  const playerRef = useRef<{ destroy?: () => void } | null>(null);
 
   useEffect(() => {
     // Load YouTube IFrame API if not already present
-    if (!(window as any).YT) {
+    if (!window.YT) {
       const tag = document.createElement("script");
       tag.src = "https://www.youtube.com/iframe_api";
       document.body.appendChild(tag);
     }
     let interval: NodeJS.Timeout;
-    (window as any).onYouTubeIframeAPIReady = () => {
-      playerRef.current = new (window as any).YT.Player("yt-bg-player", {
+    window.onYouTubeIframeAPIReady = () => {
+      if (!window.YT) return;
+      playerRef.current = new window.YT.Player("yt-bg-player", {
         videoId: "Er8SPJsIYr0",
         playerVars: {
           autoplay: 1,
@@ -79,7 +87,7 @@ function HomeInner() {
           start: 0,
         },
         events: {
-          onReady: (event: any) => {
+          onReady: (event: { target: { playVideo: () => void; mute: () => void; seekTo: (t: number) => void; getCurrentTime: () => number } }) => {
             event.target.playVideo();
             event.target.mute();
             interval = setInterval(() => {
@@ -101,7 +109,7 @@ function HomeInner() {
 
   const inputRef = useRef<HTMLInputElement>(null);
 
-  const handleGo = (e: React.FormEvent) => {
+  const handleGo = (e: { preventDefault: () => void }) => {
     e.preventDefault();
     const value = inputRef.current?.value.trim();
     if (value) {
@@ -138,9 +146,8 @@ function HomeInner() {
             className="px-4 py-2 rounded-md text-base text-white border-white border-1 focus:outline-none min-w-[220px] shadow-md"
             onKeyDown={(e) => {
               if (e.key === "Enter") {
-                // Prevent double submission if form onSubmit also fires
                 e.preventDefault();
-                handleGo(e as any);
+                handleGo(e);
               }
             }}
           />

src/components/data-recharts.tsx

@@ -12,8 +12,10 @@ import {
   Tooltip,
 } from "recharts";
 
+type ChartRow = Record<string, number | Record<string, number>>;
+
 type DataGraphProps = {
-  data: Array<Array<Record<string, number>>>;
+  data: ChartRow[][];
   onChartsReady?: () => void;
 };
 
@@ -57,12 +59,12 @@ const SingleDataGraph = React.memo(
     hoveredTime,
     setHoveredTime,
   }: {
-    data: Array<Record<string, number>>;
+    data: ChartRow[];
     hoveredTime: number | null;
     setHoveredTime: (t: number | null) => void;
   }) => {
     const { currentTime, setCurrentTime } = useTime();
-    function flattenRow(row: Record<string, any>, prefix = ""): Record<string, number> {
+    function flattenRow(row: Record<string, number | Record<string, number>>, prefix = ""): Record<string, number> {
       const result: Record<string, number> = {};
       for (const [key, value] of Object.entries(row)) {
         // Special case: if this is a group value that is a primitive, assign to prefix.key
@@ -77,8 +79,7 @@ const SingleDataGraph = React.memo(
           Object.assign(result, flattenRow(value, prefix ? `${prefix}${SERIES_NAME_DELIMITER}${key}` : key));
         }
       }
-      // Always keep timestamp at top level if present
-      if ("timestamp" in row) {
+      if ("timestamp" in row && typeof row["timestamp"] === "number") {
         result["timestamp"] = row["timestamp"];
       }
       return result;
@@ -132,10 +133,9 @@ const SingleDataGraph = React.memo(
       setHoveredTime(null);
     };
 
-    const handleClick = (data: any) => {
-      if (data && data.activePayload && data.activePayload.length) {
-        const timeValue = data.activePayload[0].payload.timestamp;
-        setCurrentTime(timeValue);
+    const handleClick = (data: { activePayload?: { payload: { timestamp: number } }[] } | null) => {
+      if (data?.activePayload?.length) {
+        setCurrentTime(data.activePayload[0].payload.timestamp);
       }
     };
 
@@ -256,12 +256,9 @@ const SingleDataGraph = React.memo(
               syncId="episode-sync"
               margin={{ top: 24, right: 16, left: 0, bottom: 16 }}
               onClick={handleClick}
-              onMouseMove={(state: any) => {
-                setHoveredTime(
-                  state?.activePayload?.[0]?.payload?.timestamp ??
-                    state?.activeLabel ??
-                    null,
-                );
+              onMouseMove={(state) => {
+                const payload = state?.activePayload?.[0]?.payload as { timestamp?: number } | undefined;
+                setHoveredTime(payload?.timestamp ?? null);
               }}
               onMouseLeave={handleMouseLeave}
             >

src/components/playback-bar.tsx

@@ -10,8 +10,6 @@ import {
   FaArrowUp,
 } from "react-icons/fa";
 
-import { debounce } from "@/utils/debounce";
-
 const PlaybackBar: React.FC = () => {
   const { duration, isPlaying, setIsPlaying, currentTime, setCurrentTime } =
     useTime();
@@ -27,14 +25,11 @@ const PlaybackBar: React.FC = () => {
     }
   }, [currentTime]);
 
-  const updateTime = debounce((t: number) => {
-    setCurrentTime(t);
-  }, 200);
-
   const handleSliderChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     const t = Number(e.target.value);
     setSliderValue(t);
-    updateTime(t);
+    // Seek videos immediately while dragging (no debounce)
+    setCurrentTime(t);
   };
 
   const handleSliderMouseDown = () => {
@@ -45,11 +40,11 @@ const PlaybackBar: React.FC = () => {
 
   const handleSliderMouseUp = () => {
     sliderActiveRef.current = false;
-    setCurrentTime(sliderValue); // Snap to final value
+    // Final seek to exact slider position
+    setCurrentTime(sliderValue);
     if (wasPlayingRef.current) {
       setIsPlaying(true);
     }
-    // If it was paused before, keep it paused
   };
 
   return (

src/components/side-nav.tsx

@@ -3,10 +3,12 @@
 import Link from "next/link";
 import React from "react";
 
+import type { DatasetDisplayInfo } from "@/app/[org]/[dataset]/[episode]/fetch-data";
+
 interface SidebarProps {
-  datasetInfo: any;
-  paginatedEpisodes: any[];
-  episodeId: any;
+  datasetInfo: DatasetDisplayInfo;
+  paginatedEpisodes: number[];
+  episodeId: number;
   totalPages: number;
   currentPage: number;
   prevPage: () => void;
@@ -53,7 +55,7 @@ const Sidebar: React.FC<SidebarProps> = ({
         aria-label="Sidebar navigation"
       >
         <ul>
-          <li>Number of samples/frames: {datasetInfo.total_frames}</li>
+          <li>Number of frames: {datasetInfo.total_frames}</li>
           <li>Number of episodes: {datasetInfo.total_episodes}</li>
           <li>Frames per second: {datasetInfo.fps}</li>
         </ul>

src/components/simple-videos-player.tsx

@@ -3,21 +3,15 @@
 import React, { useEffect, useRef } from "react";
 import { useTime } from "../context/time-context";
 import { FaExpand, FaCompress, FaTimes, FaEye } from "react-icons/fa";
-
-type VideoInfo = {
-  filename: string;
-  url: string;
-  isSegmented?: boolean;
-  segmentStart?: number;
-  segmentEnd?: number;
-  segmentDuration?: number;
-};
+import type { VideoInfo } from "@/app/[org]/[dataset]/[episode]/fetch-data";
 
 type VideoPlayerProps = {
   videosInfo: VideoInfo[];
   onVideosReady?: () => void;
 };
 
+const videoEventCleanup = new WeakMap<HTMLVideoElement, () => void>();
+
 export const SimpleVideosPlayer = ({
   videosInfo,
   onVideosReady,
@@ -33,6 +27,10 @@ export const SimpleVideosPlayer = ({
     (video) => !hiddenVideos.includes(video.filename)
   );
 
+  // Tracks the last time value set by the primary video's onTimeUpdate.
+  // If currentTime differs from this, an external source (slider/chart click) changed it.
+  const lastVideoTimeRef = useRef(0);
+
   // Initialize video refs array
   useEffect(() => {
     videoRefs.current = videoRefs.current.slice(0, videosInfo.length);
@@ -78,11 +76,10 @@ export const SimpleVideosPlayer = ({
           video.addEventListener('timeupdate', handleTimeUpdate);
           video.addEventListener('loadeddata', handleLoadedData);
           
-          // Store cleanup
-          (video as any)._segmentHandlers = () => {
+          videoEventCleanup.set(video, () => {
             video.removeEventListener('timeupdate', handleTimeUpdate);
             video.removeEventListener('loadeddata', handleLoadedData);
-          };
+          });
         } else {
           // For non-segmented videos, handle end of video
           const handleEnded = () => {
@@ -95,18 +92,20 @@ export const SimpleVideosPlayer = ({
           video.addEventListener('ended', handleEnded);
           video.addEventListener('canplaythrough', checkReady, { once: true });
           
-          // Store cleanup
-          (video as any)._segmentHandlers = () => {
+          videoEventCleanup.set(video, () => {
             video.removeEventListener('ended', handleEnded);
-          };
+          });
         }
       }
     });
 
     return () => {
       videoRefs.current.forEach((video) => {
-        if (video && (video as any)._segmentHandlers) {
-          (video as any)._segmentHandlers();
+        if (!video) return;
+        const cleanup = videoEventCleanup.get(video);
+        if (cleanup) {
+          cleanup();
+          videoEventCleanup.delete(video);
         }
       });
     };
@@ -131,25 +130,32 @@ export const SimpleVideosPlayer = ({
     });
   }, [isPlaying, videosReady, hiddenVideos, videosInfo]);
 
-  // Sync video times
+  // Sync all video times when currentTime changes.
+  // For the primary video, only seek when the change came from an external source
+  // (slider drag, chart click, etc.) — detected by comparing against lastVideoTimeRef.
   useEffect(() => {
     if (!videosReady) return;
+
+    const isExternalSeek = Math.abs(currentTime - lastVideoTimeRef.current) > 0.3;
     
     videoRefs.current.forEach((video, index) => {
-      if (video && !hiddenVideos.includes(videosInfo[index].filename)) {
-        const info = videosInfo[index];
-        let targetTime = currentTime;
-        
-        if (info.isSegmented) {
-          targetTime = (info.segmentStart || 0) + currentTime;
-        }
-        
-        if (Math.abs(video.currentTime - targetTime) > 0.2) {
-          video.currentTime = targetTime;
-        }
+      if (!video) return;
+      if (hiddenVideos.includes(videosInfo[index].filename)) return;
+
+      // Skip the primary video unless the time was changed externally
+      if (index === firstVisibleIdx && !isExternalSeek) return;
+
+      const info = videosInfo[index];
+      let targetTime = currentTime;
+      if (info.isSegmented) {
+        targetTime = (info.segmentStart || 0) + currentTime;
+      }
+      
+      if (Math.abs(video.currentTime - targetTime) > 0.2) {
+        video.currentTime = targetTime;
       }
     });
-  }, [currentTime, videosInfo, videosReady, hiddenVideos]);
+  }, [currentTime, videosInfo, videosReady, hiddenVideos, firstVisibleIdx]);
 
   // Handle time update from first visible video
   const handleTimeUpdate = (e: React.SyntheticEvent<HTMLVideoElement>) => {
@@ -162,6 +168,7 @@ export const SimpleVideosPlayer = ({
       if (info.isSegmented) {
         globalTime = video.currentTime - (info.segmentStart || 0);
       }
+      lastVideoTimeRef.current = globalTime;
       setCurrentTime(globalTime);
     }
   };
@@ -247,12 +254,12 @@ export const SimpleVideosPlayer = ({
                 </span>
               </p>
               <video
-                ref={el => videoRefs.current[idx] = el}
+                ref={(el: HTMLVideoElement | null) => { videoRefs.current[idx] = el; }}
                 className={`w-full object-contain ${
                   isEnlarged ? "max-h-[90vh] max-w-[90vw]" : ""
                 }`}
                 muted
-                preload={isFirstVisible ? "auto" : "metadata"}
+                preload="auto"
                 onPlay={(e) => handlePlay(e.currentTarget, info)}
                 onTimeUpdate={isFirstVisible ? handleTimeUpdate : undefined}
               >

src/components/videos-player.tsx

@@ -3,21 +3,16 @@
 import { useEffect, useRef, useState } from "react";
 import { useTime } from "../context/time-context";
 import { FaExpand, FaCompress, FaTimes, FaEye } from "react-icons/fa";
-
-type VideoInfo = {
-  filename: string;
-  url: string;
-  isSegmented?: boolean;
-  segmentStart?: number;
-  segmentEnd?: number;
-  segmentDuration?: number;
-};
+import type { VideoInfo } from "@/app/[org]/[dataset]/[episode]/fetch-data";
 
 type VideoPlayerProps = {
   videosInfo: VideoInfo[];
   onVideosReady?: () => void;
 };
 
+const videoCleanupHandlers = new WeakMap<HTMLVideoElement, () => void>();
+const videoReadyHandlers = new WeakMap<HTMLVideoElement, EventListener>();
+
 export const VideosPlayer = ({
   videosInfo,
   onVideosReady,
@@ -43,6 +38,10 @@ export const VideosPlayer = ({
   const showHiddenBtnRef = useRef<HTMLButtonElement | null>(null);
   const [videoCodecError, setVideoCodecError] = useState(false);
 
+  // Tracks the last time value set by the primary video's onTimeUpdate.
+  // If currentTime differs from this, an external source (slider/chart click) changed it.
+  const lastVideoTimeRef = useRef(0);
+
   // Initialize video refs
   useEffect(() => {
     videoRefs.current = videoRefs.current.slice(0, videosInfo.length);
@@ -146,45 +145,47 @@ export const VideosPlayer = ({
     }
   }, [hiddenVideos, showHiddenMenu, enlargedVideo]);
 
-  // Sync video times (with segment awareness)
+  // Sync all video times when currentTime changes.
+  // For the primary video, only seek when the change came from an external source
+  // (slider drag, chart click, etc.) — detected by comparing against lastVideoTimeRef.
   useEffect(() => {
+    const isExternalSeek = Math.abs(currentTime - lastVideoTimeRef.current) > 0.3;
+
     videoRefs.current.forEach((video, index) => {
-      if (video && Math.abs(video.currentTime - currentTime) > 0.2) {
-        const videoInfo = videosInfo[index];
-        
-        if (videoInfo?.isSegmented) {
-          // For segmented videos, map the global time to segment time
-          const segmentStart = videoInfo.segmentStart || 0;
-          const segmentDuration = videoInfo.segmentDuration || 0;
-          
-          if (segmentDuration > 0) {
-            // Map currentTime (0 to segmentDuration) to video time (segmentStart to segmentEnd)
-            const segmentTime = segmentStart + currentTime;
-            video.currentTime = segmentTime;
-          }
-        } else {
-          // For non-segmented videos, use direct time mapping
+      if (!video) return;
+
+      // Skip the primary video unless the time was changed externally
+      if (index === firstVisibleIdx && !isExternalSeek) return;
+
+      const videoInfo = videosInfo[index];
+      if (videoInfo?.isSegmented) {
+        const segmentStart = videoInfo.segmentStart || 0;
+        const segmentTime = segmentStart + currentTime;
+        if (Math.abs(video.currentTime - segmentTime) > 0.2) {
+          video.currentTime = segmentTime;
+        }
+      } else {
+        if (Math.abs(video.currentTime - currentTime) > 0.2) {
           video.currentTime = currentTime;
         }
       }
     });
-  }, [currentTime, videosInfo]);
+  }, [currentTime, videosInfo, firstVisibleIdx]);
 
   // Handle time update
   const handleTimeUpdate = (e: React.SyntheticEvent<HTMLVideoElement>) => {
     const video = e.target as HTMLVideoElement;
     if (video && video.duration) {
-      // Find the video info for this video element
       const videoIndex = videoRefs.current.findIndex(ref => ref === video);
       const videoInfo = videosInfo[videoIndex];
       
       if (videoInfo?.isSegmented) {
-        // For segmented videos, map the video time back to global time (0 to segmentDuration)
         const segmentStart = videoInfo.segmentStart || 0;
         const globalTime = Math.max(0, video.currentTime - segmentStart);
+        lastVideoTimeRef.current = globalTime;
         setCurrentTime(globalTime);
       } else {
-        // For non-segmented videos, use direct time mapping
+        lastVideoTimeRef.current = video.currentTime;
         setCurrentTime(video.currentTime);
       }
     }
@@ -220,10 +221,9 @@ export const VideosPlayer = ({
         
         video.addEventListener('timeupdate', handleTimeUpdate);
         
-        // Store cleanup function
-        (video as any)._segmentCleanup = () => {
+        videoCleanupHandlers.set(video, () => {
           video.removeEventListener('timeupdate', handleTimeUpdate);
-        };
+        });
       }
       
       videosReadyCount += 1;
@@ -243,22 +243,23 @@ export const VideosPlayer = ({
         } else {
           const readyHandler = () => onCanPlayThrough(index);
           video.addEventListener("canplaythrough", readyHandler);
-          (video as any)._readyHandler = readyHandler;
+          videoReadyHandlers.set(video, readyHandler);
         }
       }
     });
 
     return () => {
       videoRefs.current.forEach((video) => {
-        if (video) {
-          // Remove ready handler
-          if ((video as any)._readyHandler) {
-            video.removeEventListener("canplaythrough", (video as any)._readyHandler);
-          }
-          // Remove segment handler
-          if ((video as any)._segmentCleanup) {
-            (video as any)._segmentCleanup();
-          }
+        if (!video) return;
+        const readyHandler = videoReadyHandlers.get(video);
+        if (readyHandler) {
+          video.removeEventListener("canplaythrough", readyHandler);
+          videoReadyHandlers.delete(video);
+        }
+        const cleanup = videoCleanupHandlers.get(video);
+        if (cleanup) {
+          cleanup();
+          videoCleanupHandlers.delete(video);
         }
       });
     };
@@ -395,7 +396,7 @@ export const VideosPlayer = ({
                 }}
                 muted
                 loop
-                preload={idx === firstVisibleIdx ? "auto" : "metadata"}
+                preload="auto"
                 className={`w-full object-contain ${isEnlarged ? "max-h-[90vh] max-w-[90vw]" : ""}`}
                 onTimeUpdate={
                   idx === firstVisibleIdx ? handleTimeUpdate : undefined

src/utils/debounce.ts

@@ -1,4 +1,5 @@
-export function debounce<F extends (...args: any[]) => any>(
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function debounce<F extends (...args: any[]) => void>(
   func: F,
   waitFor: number,
 ): (...args: Parameters<F>) => void {

src/utils/parquetUtils.ts

@@ -17,9 +17,9 @@ export interface DatasetMetadata {
     string,
     {
       dtype: string;
-      shape: any[];
-      names: any[] | Record<string, any> | null;
-      info?: Record<string, any>;
+      shape: number[];
+      names: string[] | Record<string, unknown> | null;
+      info?: Record<string, unknown>;
     }
   >;
 }
@@ -36,7 +36,7 @@ export async function fetchJson<T>(url: string): Promise<T> {
 
 export function formatStringWithVars(
   format: string,
-  vars: Record<string, any>,
+  vars: Record<string, string>,
 ): string {
   return format.replace(/{(\w+)(?::\d+d)?}/g, (_, key) => vars[key]);
 }
@@ -56,13 +56,13 @@ export async function fetchParquetFile(url: string): Promise<ArrayBuffer> {
 export async function readParquetColumn(
   fileBuffer: ArrayBuffer,
   columns: string[],
-): Promise<any[]> {
+): Promise<unknown[][]> {
   return new Promise((resolve, reject) => {
     try {
       parquetRead({
         file: fileBuffer,
-        columns: columns.length > 0 ? columns : undefined, // Let hyparquet read all columns if empty array
-        onComplete: (data: any[]) => {
+        columns: columns.length > 0 ? columns : undefined,
+        onComplete: (data: unknown[][]) => {
           resolve(data);
         }
       });
@@ -72,15 +72,14 @@ export async function readParquetColumn(
   });
 }
 
-// Read parquet file and return objects with column names as keys
 export async function readParquetAsObjects(
   fileBuffer: ArrayBuffer,
   columns: string[] = [],
-): Promise<Record<string, any>[]> {
+): Promise<Record<string, unknown>[]> {
   return parquetReadObjects({
     file: fileBuffer,
     columns: columns.length > 0 ? columns : undefined,
-  });
+  }) as Promise<Record<string, unknown>[]>;
 }
 
 // Convert a 2D array to a CSV string
@@ -88,8 +87,9 @@ export function arrayToCSV(data: (number | string)[][]): string {
   return data.map((row) => row.join(",")).join("\n");
 }
 
-// Get rows from the current frame data
-export function getRows(currentFrameData: any[], columns: any[]) {
+type ColumnInfo = { key: string; value: string[] };
+
+export function getRows(currentFrameData: unknown[], columns: ColumnInfo[]) {
   if (!currentFrameData || currentFrameData.length === 0) {
     return [];
   }

src/utils/versionUtils.ts

@@ -7,7 +7,14 @@ const DATASET_URL = process.env.DATASET_URL || "https://huggingface.co/datasets"
 /**
  * Dataset information structure from info.json
  */
-interface DatasetInfo {
+type FeatureInfo = {
+  dtype: string;
+  shape: number[];
+  names: string[] | Record<string, unknown> | null;
+  info?: Record<string, unknown>;
+};
+
+export interface DatasetInfo {
   codebase_version: string;
   robot_type: string | null;
   total_episodes: number;
@@ -20,7 +27,7 @@ interface DatasetInfo {
   splits: Record<string, string>;
   data_path: string;
   video_path: string;
-  features: Record<string, any>;
+  features: Record<string, FeatureInfo>;
 }
 
 // In-memory cache for dataset info (5 min TTL)
@@ -30,8 +37,10 @@ const CACHE_TTL_MS = 5 * 60 * 1000;
 export async function getDatasetInfo(repoId: string): Promise<DatasetInfo> {
   const cached = datasetInfoCache.get(repoId);
   if (cached && Date.now() < cached.expiry) {
+    console.log(`[perf] getDatasetInfo cache HIT for ${repoId}`);
     return cached.data;
   }
+  console.log(`[perf] getDatasetInfo cache MISS for ${repoId} — fetching`);
 
   try {
     const testUrl = `${DATASET_URL}/${repoId}/resolve/main/meta/info.json`;
@@ -77,7 +86,6 @@ const SUPPORTED_VERSIONS = ["v3.0", "v2.1", "v2.0"];
  */
 export async function getDatasetVersionAndInfo(repoId: string): Promise<{ version: string; info: DatasetInfo }> {
   const info = await getDatasetInfo(repoId);
-
   const version = info.codebase_version;
   if (!version) {
     throw new Error("Dataset info.json does not contain codebase_version");
@@ -89,7 +97,6 @@ export async function getDatasetVersionAndInfo(repoId: string): Promise<{ versio
       "Please use a compatible dataset version."
     );
   }
-
   return { version, info };
 }