import { Scene } from '../pages/script-overview';
import { SceneCard } from './scene-card';

interface SceneCardListProps {
  scenes: Scene[];
  selectedSceneId?: string;
  onSceneUpdate: (sceneId: string, updates: Partial<Scene>) => void;
  onSceneDelete: (sceneId: string) => void;
  onSceneDuplicate: (sceneId: string) => void;
}

export function SceneCardList({
  scenes,
  selectedSceneId,
  onSceneUpdate,
  onSceneDelete,
  onSceneDuplicate
}: SceneCardListProps) {
  return (
    <div className="flex gap-6 overflow-x-auto hide-scrollbar h-full overflow-y-hidden transition-colors duration-300 rounded-xl p-2">
      {scenes.map((scene, index) => (
        <SceneCard
          key={scene.id}
          scene={scene}
          index={index}
          isSelected={scene.id === selectedSceneId}
          onUpdate={(updates) => onSceneUpdate(scene.id, updates)}
          onDelete={() => onSceneDelete(scene.id)}
          onDuplicate={() => onSceneDuplicate(scene.id)}
        />
      ))}
    </div>
  );
} 