diff --git a/frontend/src/components/VideoListItemTable.tsx b/frontend/src/components/VideoListItemTable.tsx index 83edb39a..3542406c 100644 --- a/frontend/src/components/VideoListItemTable.tsx +++ b/frontend/src/components/VideoListItemTable.tsx @@ -6,6 +6,11 @@ import humanFileSize from '../functions/humanFileSize'; import { FileSizeUnits } from '../api/actions/updateUserConfig'; import { useUserConfigStore } from '../stores/UserConfigStore'; +const StreamsTypeEmun = { + Video: 'video', + Audio: 'audio', +}; + type VideoListItemProps = { videoList: VideoType[] | undefined; viewStyle: ViewStylesType; @@ -35,7 +40,8 @@ const VideoListItemTable = ({ videoList, viewStyle }: VideoListItemProps) => { {videoList?.map(({ youtube_id, title, channel, vid_type, media_size, streams }) => { - const [videoStream, audioStream] = streams; + const videoStream = streams?.find(s => s.type === StreamsTypeEmun.Video); + const audioStream = streams?.find(s => s.type === StreamsTypeEmun.Audio); return ( @@ -46,12 +52,12 @@ const VideoListItemTable = ({ videoList, viewStyle }: VideoListItemProps) => { {title} {vid_type} - {`${videoStream.width}x${videoStream.height}`} + {`${videoStream?.width || '-'}x${videoStream?.height || '-'}`} {humanFileSize(media_size, useSiUnits)} - {videoStream.codec || 'unknown'} - {humanFileSize(videoStream.bitrate, useSiUnits)} - {audioStream.codec || 'unknown'} - {humanFileSize(audioStream.bitrate, useSiUnits)} + {videoStream?.codec || '-'} + {humanFileSize(videoStream?.bitrate || 0, useSiUnits)} + {audioStream?.codec || '-'} + {humanFileSize(audioStream?.bitrate || 0, useSiUnits)} ); })} diff --git a/frontend/src/pages/Home.tsx b/frontend/src/pages/Home.tsx index 67fb7fac..291725a6 100644 --- a/frontend/src/pages/Home.tsx +++ b/frontend/src/pages/Home.tsx @@ -69,7 +69,7 @@ export type VideoType = { sponsorblock?: SponsorBlockType; playlist: string[]; stats: StatsType; - streams: StreamType[]; + streams: StreamType[] | undefined; subtitles: Subtitles[]; tags: string[]; title: string;