import React from 'react'; import ReplayHeader from '@/components/replay/ReplayHeader'; import DatasetSelector from '@/components/replay/DatasetSelector'; import EpisodePlayer from '@/components/replay/EpisodePlayer'; import ReplayVisualizer from '@/components/replay/ReplayVisualizer'; // Mock data for now, this would be fetched from the backend const mockDatasets = [ { id: 'dataset-1', name: 'Kitchen Task - Day 1' }, { id: 'dataset-2', name: 'Assembly Task - Morning' }, { id: 'dataset-3', name: 'Sorting Cans - Run 4' }, ]; const mockEpisodes = { 'dataset-1': [ { id: 'ep-1', name: 'Episode 1', duration: 62 }, { id: 'ep-2', name: 'Episode 2', duration: 58 }, ], 'dataset-2': [ { id: 'ep-3', name: 'Episode 1', duration: 120 }, ], 'dataset-3': [ { id: 'ep-4', name: 'Episode 1', duration: 45 }, { id: 'ep-5', name: 'Episode 2', duration: 47 }, { id: 'ep-6', name: 'Episode 3', duration: 43 }, ], }; const ReplayDataset = () => { // Normally you would fetch datasets and handle loading/error states const [selectedDataset, setSelectedDataset] = React.useState(mockDatasets.length > 0 ? mockDatasets[0].id : null); const [selectedEpisode, setSelectedEpisode] = React.useState(null); const episodes = selectedDataset ? mockEpisodes[selectedDataset] || [] : []; React.useEffect(() => { // When dataset changes, reset episode selection setSelectedEpisode(null); }, [selectedDataset]); return (
); }; export default ReplayDataset;