fix: add name display for audio files

src/components/video-editor/timeline/Item.tsx

@@ -148,7 +148,7 @@ export default function Item({
               ) : isAudio ? (
                 <>
                   <Music className="w-3.5 h-3.5 shrink-0" />
-                  <span className="text-[11px] font-semibold tracking-tight whitespace-nowrap">
+                  <span className="text-[11px] font-semibold tracking-tight truncate max-w-full">
                     {children}
                   </span>
                 </>

src/components/video-editor/timeline/TimelineEditor.tsx

@@ -1245,13 +1245,16 @@ export default function TimelineEditor({
       variant: 'speed',
     }));
 
-    const audios: TimelineRenderItem[] = audioRegions.map((region, index) => ({
-      id: region.id,
-      rowId: AUDIO_ROW_ID,
-      span: { start: region.startMs, end: region.endMs },
-      label: `Audio ${index + 1}`,
-      variant: 'audio',
-    }));
+    const audios: TimelineRenderItem[] = audioRegions.map((region) => {
+      const fileName = region.audioPath.split(/[\\/]/).pop()?.replace(/\.[^.]+$/, '') || 'Audio';
+      return {
+        id: region.id,
+        rowId: AUDIO_ROW_ID,
+        span: { start: region.startMs, end: region.endMs },
+        label: fileName,
+        variant: 'audio',
+      };
+    });
 
     return [...zooms, ...trims, ...annotations, ...speeds, ...audios];
   }, [zoomRegions, trimRegions, annotationRegions, speedRegions, audioRegions]);