refactor: retain source name in decoded audio

Author: hi-ogawa-agent

packages/app/src/app.tsx

@@ -110,14 +110,9 @@ export function App() {
         : "";
 
   const handleAudioFileMutation = useMutation({
-    mutationFn: async (file: File | undefined) => {
-      if (file) {
-        return decodeAudioFile(file);
-      }
-      return null;
-    },
+    mutationFn: decodeAudioFile,
   });
-  const decodedAudio = handleAudioFileMutation.data ?? null;
+  const decodedAudio = handleAudioFileMutation.data;
 
   const [runProgress, setRunProgress] = useState<RunProgress | null>(null);
 
@@ -171,9 +166,7 @@ export function App() {
       const durationMs = performance.now() - started;
       const archiveBlob = await createStemArchive(nextOutputs);
       const archive = {
-        name: stemArchiveFilename(
-          handleAudioFileMutation.variables?.name ?? "stems",
-        ),
+        name: stemArchiveFilename(decodedAudio.name),
         url: URL.createObjectURL(archiveBlob),
       };
       outputCleanupRef.current.push(() => URL.revokeObjectURL(archive.url));
@@ -237,9 +230,12 @@ export function App() {
                 type="file"
                 id="file"
                 accept="audio/*"
-                onChange={(event) =>
-                  handleAudioFileMutation.mutate(event.target.files?.[0])
-                }
+                onChange={(event) => {
+                  const file = event.target.files?.[0];
+                  if (file) {
+                    handleAudioFileMutation.mutate(file);
+                  }
+                }}
               />
               {audioFileStatusText && (
                 <p className="text-muted mt-3.5 text-sm" id="audio-status">

packages/app/src/lib/audio/decode.ts

@@ -1,6 +1,7 @@
 import { AUDIO_SAMPLE_RATE } from "./constants";
 
 export interface DecodedAudio {
+  name: string;
   left: Float32Array;
   right: Float32Array;
   duration: number;
@@ -19,6 +20,7 @@ export async function decodeAudioFile(file: File): Promise<DecodedAudio> {
   const right = buffer.numberOfChannels > 1 ? buffer.getChannelData(1) : left;
 
   return {
+    name: file.name,
     left,
     right,
     duration: buffer.duration,