fix(video): surface audio stream language/title metadata in indexed streams and UI

backend/video/serializers.py

@@ -58,6 +58,8 @@ class StreamItemSerializer(serializers.Serializer):
     codec = serializers.CharField()
     height = serializers.IntegerField(required=False)
     index = serializers.IntegerField()
+    language = serializers.CharField(required=False, allow_null=True)
+    title = serializers.CharField(required=False, allow_null=True)
     type = serializers.ChoiceField(choices=["video", "audio"])
     width = serializers.IntegerField(required=False)
 

backend/video/src/media_streams.py

@@ -65,11 +65,14 @@ class MediaStreamExtractor:
 
     def _extract_audio_metadata(self, stream) -> None:
         """extract audio metadata"""
+        tags = stream.get("tags") or {}
         self.metadata.append(
             {
                 "bitrate": int(stream.get("bit_rate", 0)),
                 "codec": stream.get("codec_name", "undefined"),
                 "index": stream["index"],
+                "language": tags.get("language"),
+                "title": tags.get("title"),
                 "type": "audio",
             }
         )

frontend/src/pages/Home.tsx

@@ -44,6 +44,8 @@ export type StreamType = {
   type: string;
   index: number;
   codec: string;
+  language?: string | null;
+  title?: string | null;
   width?: number;
   height?: number;
   bitrate: number;

frontend/src/pages/Video.tsx

@@ -465,6 +465,10 @@ const Video = () => {
 
             {video.streams &&
               video.streams.map(stream => {
+                const languageLabel = stream.language?.trim();
+                const titleLabel = stream.title?.trim();
+                const streamTags = [languageLabel, titleLabel].filter(Boolean).join(' | ');
+
                 return (
                   <p key={stream.index}>
                     {capitalizeFirstLetter(stream.type)}: {stream.codec}{' '}
@@ -473,6 +477,11 @@ const Video = () => {
                       <>
                         <span className="space-carrot">|</span> {stream.width}x{stream.height}
                       </>
+                    )}
+                    {streamTags && (
+                      <>
+                        <span className="space-carrot">|</span> {streamTags}
+                      </>
                     )}{' '}
                   </p>
                 );