import {List,ListItemButton,ListItemText} from "@mui/material";import type {Gallery_Captured_Frame} from "../protocol/gallery_types";import {format_nanoseconds} from "../protocol/format";
export function Capture_Frames({frames,selected_frame_id,on_select}:{frames:Gallery_Captured_Frame[];selected_frame_id:number|null;on_select:(id:number)=>void}) {return <List dense sx={{maxHeight:240,overflow:"auto"}}>{frames.map(frame=><ListItemButton key={frame.frame_id} selected={frame.frame_id===selected_frame_id} onClick={()=>on_select(frame.frame_id)}><ListItemText primary={`Frame #${frame.frame_id}`} secondary={`Plan v${frame.render_plan_version} · ${format_nanoseconds(frame.render_duration_ns)}`}/></ListItemButton>)}</List>;}
