add --force-reinstall --no-deps to torchaudio CUDA install

Move audio validation and saving to thread pool so librosa/ffmpeg decoding
doesn't block the async event loop. Combine validate + load into a single
pass to avoid decoding the file twice. Add 50 MB upload limit and chunked
reads to prevent unbounded memory allocation.

Closes #278

.github/workflows/release.yml

@@ -189,10 +189,10 @@ jobs:
           pip install -r backend/requirements.txt
           pip install --no-deps chatterbox-tts
 
-      - name: Install PyTorch with CUDA 12.1
+      - name: Install PyTorch with CUDA 12.6
         run: |
-          pip install torch --index-url https://download.pytorch.org/whl/cu121 --force-reinstall --no-deps
-          pip install torchaudio --index-url https://download.pytorch.org/whl/cu121
+          pip install torch --index-url https://download.pytorch.org/whl/cu126 --force-reinstall --no-deps
+          pip install torchaudio --index-url https://download.pytorch.org/whl/cu126 --force-reinstall --no-deps
 
       - name: Verify CUDA support in torch
         run: |

.gitignore

@@ -50,6 +50,7 @@ logs/
 app/openapi.json
 tauri/src-tauri/binaries/*
 tauri/src-tauri/gen/Assets.car
+tauri/src-tauri/gen/voicebox.icns
 
 # Temporary
 tmp/

Dockerfile

@@ -31,6 +31,8 @@ RUN apt-get update && apt-get install -y --no-install-recommends \
     build-essential \
     && rm -rf /var/lib/apt/lists/*
 
+RUN pip install --no-cache-dir --upgrade pip
+
 COPY backend/requirements.txt .
 RUN pip install --no-cache-dir --prefix=/install -r requirements.txt
 RUN pip install --no-cache-dir --prefix=/install \

app/src/components/AudioPlayer/AudioPlayer.tsx

@@ -17,7 +17,6 @@ export function AudioPlayer() {
     audioUrl,
     audioId,
     profileId,
-    title,
     isPlaying,
     currentTime,
     duration,
@@ -63,7 +62,7 @@ export function AudioPlayer() {
     );
 
     return shouldUseNative;
-  }, [profileChannels, channels, profileId]);
+  }, [profileChannels, channels, platform.metadata.isTauri]);
 
   const waveformRef = useRef<HTMLDivElement>(null);
   const wavesurferRef = useRef<WaveSurfer | null>(null);
@@ -73,31 +72,21 @@ export function AudioPlayer() {
   const isUsingNativePlaybackRef = useRef(false);
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
+  const [wsReady, setWsReady] = useState(false);
 
-  // Initialize WaveSurfer (only when audioUrl exists and container is ready)
+  // Create WaveSurfer once when the player becomes visible (audioUrl is set).
+  // This instance is reused for all subsequent audio loads - never destroyed until unmount.
   useEffect(() => {
-    // Don't initialize if no audioUrl or already initialized
-    if (!audioUrl) {
-      return;
-    }
+    if (!audioUrl) return;
+    if (wavesurferRef.current) return; // already created
 
-    if (wavesurferRef.current) {
-      debug.log('WaveSurfer already initialized, skipping');
-      return;
-    }
-
-    debug.log('Creating NEW WaveSurfer instance');
-
-    // Wait for container to be properly rendered
     const initWaveSurfer = () => {
       const container = waveformRef.current;
       if (!container) {
-        // Container not ready yet, retry
         setTimeout(initWaveSurfer, 50);
         return;
       }
 
-      // Check if container has dimensions and is visible
       const rect = container.getBoundingClientRect();
       const style = window.getComputedStyle(container);
       const isVisible =
@@ -107,412 +96,221 @@ export function AudioPlayer() {
         style.visibility !== 'hidden';
 
       if (!isVisible) {
-        // Retry after a short delay
         setTimeout(initWaveSurfer, 50);
         return;
       }
 
-      debug.log('Initializing WaveSurfer...', {
-        container,
+      debug.log('Creating WaveSurfer instance', {
         width: rect.width,
         height: rect.height,
       });
 
       try {
-        // Get computed CSS variable values
         const root = document.documentElement;
         const getCSSVar = (varName: string) => {
           const value = getComputedStyle(root).getPropertyValue(varName).trim();
           return value ? `hsl(${value})` : '';
         };
 
-        const waveColor = getCSSVar('--muted');
-        const progressColor = getCSSVar('--accent');
-        const cursorColor = getCSSVar('--accent');
-
         const wavesurfer = WaveSurfer.create({
-          container: container,
-          waveColor: waveColor,
-          progressColor: progressColor,
-          cursorColor: cursorColor,
+          container,
+          waveColor: getCSSVar('--muted'),
+          progressColor: getCSSVar('--accent'),
+          cursorColor: getCSSVar('--accent'),
+          cursorWidth: 3,
           barWidth: 2,
           barRadius: 2,
           height: 80,
           normalize: true,
-          // Use MediaElement backend (default). Unlike the WebAudio backend,
-          // MediaElement uses a standard <audio> element for playback which
-          // benefits from the browser/webview's built-in audio session recovery.
-          // This prevents audio loss when another app steals audio output or
-          // the system audio session is interrupted.
-          interact: true, // Enable interaction (click to seek)
-          mediaControls: false, // Don't show native controls
+          interact: true,
+          dragToSeek: { debounceTime: 0 },
+          mediaControls: false,
+          backend: 'WebAudio',
         });
 
-        wavesurferRef.current = wavesurfer;
-        debug.log('WaveSurfer created successfully');
-      } catch (error) {
-        debug.error('Failed to create WaveSurfer:', error);
-        setError(
-          `Failed to initialize waveform: ${error instanceof Error ? error.message : String(error)}`,
-        );
-        return;
-      }
+        // Wire up event handlers (these persist for the lifetime of the instance)
+        wavesurfer.on('timeupdate', (time) => {
+          const dur = usePlayerStore.getState().duration;
+          if (dur > 0 && time >= dur) {
+            setCurrentTime(dur);
+            const loop = usePlayerStore.getState().isLooping;
+            if (loop) {
+              wavesurfer.seekTo(0);
+              wavesurfer.play().catch((err) => debug.error('Loop play failed:', err));
+            } else {
+              wavesurfer.pause();
+              setIsPlaying(false);
+            }
+            return;
+          }
+          setCurrentTime(time);
+        });
 
-      const wavesurfer = wavesurferRef.current;
-      if (!wavesurfer) return;
+        wavesurfer.on('ready', () => {
+          const dur = wavesurfer.getDuration();
+          setDuration(dur);
+          loadingRef.current = false;
+          setIsLoading(false);
+          setError(null);
+          debug.log('Audio ready, duration:', dur);
 
-      // Update store when time changes, stop if past duration
-      wavesurfer.on('timeupdate', (time) => {
-        const dur = usePlayerStore.getState().duration;
-        if (dur > 0 && time >= dur) {
-          setCurrentTime(dur);
+          wavesurfer.setVolume(usePlayerStore.getState().volume);
+          wavesurfer.setMuted(false);
+
+          // Auto-play if the flag is set (story mode advance or explicit play)
+          const shouldAutoPlayNow = usePlayerStore.getState().shouldAutoPlay;
+          if (shouldAutoPlayNow) {
+            usePlayerStore.getState().clearAutoPlayFlag();
+            wavesurfer.play().catch((err) => {
+              debug.error('Failed to autoplay:', err);
+            });
+          } else {
+            debug.log('Skipping auto-play - shouldAutoPlay is false');
+          }
+        });
+
+        wavesurfer.on('play', () => setIsPlaying(true));
+        wavesurfer.on('pause', () => {
+          setIsPlaying(false);
+          setCurrentTime(wavesurfer.getCurrentTime());
+        });
+
+        wavesurfer.on('seeking', (time) => setCurrentTime(time));
+
+        // Mute audio during drag-to-seek to prevent popping from the WebAudio
+        // backend's hard stop/start cycle on each seek. Unmute with a short
+        // fade-in when the drag ends.
+        const seekMedia = wavesurfer.getMediaElement() as any;
+        const seekGain: GainNode | null = seekMedia?.getGainNode?.() ?? null;
+        if (seekGain) {
+          const ctx = seekGain.context as AudioContext;
+          wavesurfer.on('dragstart', () => {
+            seekGain.gain.cancelScheduledValues(ctx.currentTime);
+            seekGain.gain.setTargetAtTime(0, ctx.currentTime, 0.002);
+          });
+          wavesurfer.on('dragend', () => {
+            seekGain.gain.cancelScheduledValues(ctx.currentTime);
+            seekGain.gain.setTargetAtTime(1, ctx.currentTime, 0.01);
+          });
+        }
+        wavesurfer.on('finish', () => {
           const loop = usePlayerStore.getState().isLooping;
           if (loop) {
             wavesurfer.seekTo(0);
-            wavesurfer.play();
+            wavesurfer.play().catch((err) => debug.error('Loop play failed:', err));
           } else {
-            wavesurfer.pause();
             setIsPlaying(false);
+            const onFinish = usePlayerStore.getState().onFinish;
+            if (onFinish) onFinish();
           }
-          return;
-        }
-        setCurrentTime(time);
-      });
-
-      // Update store when duration is loaded
-      wavesurfer.on('ready', async () => {
-        const dur = wavesurfer.getDuration();
-        setDuration(dur);
-        loadingRef.current = false;
-        setIsLoading(false);
-        setError(null);
-        debug.log('Audio ready, duration:', dur);
-        debug.log('Waveform should be visible now');
-
-        // Ensure volume is set
-        const currentVolume = usePlayerStore.getState().volume;
-        wavesurfer.setVolume(currentVolume);
-
-        // Auto-play when ready - check if we should use native playback
-        // Get current values from the store and queries at runtime (not captured closure values)
-        const currentAudioUrl = usePlayerStore.getState().audioUrl;
-        const currentProfileId = usePlayerStore.getState().profileId;
-
-        debug.log('Auto-play check - capturing runtime values...');
-
-        // Fetch profile channels at runtime (not using captured value)
-        let runtimeProfileChannels = null;
-        let runtimeChannels = null;
-
-        if (platform.metadata.isTauri && currentProfileId) {
-          try {
-            runtimeProfileChannels = await apiClient.getProfileChannels(currentProfileId);
-            debug.log('Runtime profileChannels:', runtimeProfileChannels);
-
-            if (runtimeProfileChannels && runtimeProfileChannels.channel_ids.length > 0) {
-              runtimeChannels = await apiClient.listChannels();
-              debug.log('Runtime channels:', runtimeChannels);
-            }
-          } catch (error) {
-            debug.error('Failed to fetch runtime channel data:', error);
-          }
-        }
-
-        debug.log('Auto-play check:', {
-          isTauri: platform.metadata.isTauri,
-          currentAudioUrl,
-          currentProfileId,
-          hasProfileChannels: !!runtimeProfileChannels,
-          hasChannels: !!runtimeChannels,
         });
 
-        if (
-          platform.metadata.isTauri &&
-          currentAudioUrl &&
-          currentProfileId &&
-          runtimeProfileChannels &&
-          runtimeChannels
-        ) {
-          debug.log('Attempting native audio playback...');
-
-          // Stop any existing native playback first
-          if (isUsingNativePlaybackRef.current) {
-            try {
-              platform.audio.stopPlayback();
-              debug.log('Stopped existing native playback before starting new one');
-            } catch (error) {
-              debug.error('Failed to stop existing playback:', error);
-            }
-          }
-
-          try {
-            // Collect all device IDs from assigned channels
-            const assignedChannels = runtimeChannels.filter((ch: any) =>
-              runtimeProfileChannels.channel_ids.includes(ch.id),
-            );
-            debug.log('Assigned channels for playback:', assignedChannels);
-
-            // Check if any assigned channel has non-default devices
-            const shouldUseNative = assignedChannels.some(
-              (ch: any) => ch.device_ids.length > 0 && !ch.is_default,
-            );
-            debug.log('Should use native playback:', shouldUseNative);
-
-            if (!shouldUseNative) {
-              debug.log('No custom devices assigned, using standard playback');
-              isUsingNativePlaybackRef.current = false;
-            } else {
-              const deviceIds = assignedChannels.flatMap((ch: any) => ch.device_ids);
-              debug.log('Device IDs to play to:', deviceIds);
-
-              if (deviceIds.length > 0) {
-                debug.log('Fetching audio data from:', currentAudioUrl);
-                // Fetch audio data
-                const response = await fetch(currentAudioUrl);
-                const audioData = new Uint8Array(await response.arrayBuffer());
-                debug.log('Audio data size:', audioData.length);
-
-                // Play via native audio
-                debug.log('Invoking play_audio_to_devices...');
-                try {
-                  await platform.audio.playToDevices(audioData, deviceIds);
-                  debug.log('play_audio_to_devices completed successfully');
-
-                  // Mark that we're using native playback
-                  isUsingNativePlaybackRef.current = true;
-
-                  // Mute WaveSurfer's audio output — native handles the actual sound
-                  // Keep WaveSurfer running for waveform visualization
-                  wavesurfer.setVolume(0);
-                  wavesurfer.setMuted(true);
-
-                  // Start WaveSurfer playback for visualization (muted)
-                  wavesurfer.play().catch((error) => {
-                    debug.error('Failed to start WaveSurfer visualization:', error);
-                  });
-
-                  setIsPlaying(true);
-                  debug.log('Auto-playing via native audio routing - SUCCESS');
-                  return;
-                } catch (invokeError) {
-                  debug.error('play_audio_to_devices invoke failed:', invokeError);
-                  throw invokeError;
-                }
-              } else {
-                debug.log('No device IDs found, falling back to WaveSurfer');
-              }
-            }
-          } catch (error) {
-            debug.error(
-              'Native playback failed during auto-play, falling back to WaveSurfer:',
-              error,
-            );
-            isUsingNativePlaybackRef.current = false;
-            // Fall through to WaveSurfer playback
-          }
-        }
-
-        // Standard playback path — ensure WaveSurfer is unmuted
-        if (!isUsingNativePlaybackRef.current) {
-          wavesurfer.setMuted(false);
-          wavesurfer.setVolume(usePlayerStore.getState().volume);
-        }
-
-        // Only auto-play if shouldAutoPlay flag is set (user explicitly clicked to play)
-        const shouldAutoPlayNow = usePlayerStore.getState().shouldAutoPlay;
-        if (shouldAutoPlayNow) {
-          // Clear the flag first
-          usePlayerStore.getState().clearAutoPlayFlag();
-
-          // Use a small delay to ensure audio element is fully ready
-          setTimeout(() => {
-            wavesurfer.play().catch((error) => {
-              debug.error('Failed to autoplay:', error);
-              // Don't show error for autoplay failures (browser restrictions)
-            });
-          }, 100);
-        } else {
-          debug.log('Skipping auto-play - shouldAutoPlay is false');
-        }
-      });
-
-      // Handle play/pause
-      wavesurfer.on('play', () => {
-        setIsPlaying(true);
-      });
-      wavesurfer.on('pause', () => setIsPlaying(false));
-      wavesurfer.on('finish', () => {
-        // Check loop state from store
-        const loop = usePlayerStore.getState().isLooping;
-        if (loop) {
-          wavesurfer.seekTo(0);
-          wavesurfer.play();
-        } else {
-          setIsPlaying(false);
-          // Trigger finish callback if set
-          const onFinish = usePlayerStore.getState().onFinish;
-          if (onFinish) {
-            onFinish();
-          }
-        }
-      });
-
-      // Handle errors
-      wavesurfer.on('error', (error) => {
-        debug.error('WaveSurfer error:', error);
-        setIsLoading(false);
-        setError(`Audio error: ${error instanceof Error ? error.message : String(error)}`);
-      });
-
-      // Handle loading
-      wavesurfer.on('loading', (percent) => {
-        setIsLoading(true);
-        if (percent === 100) {
+        wavesurfer.on('error', (err) => {
+          debug.error('WaveSurfer error:', err);
           setIsLoading(false);
-        }
-      });
+          setError(`Audio error: ${err instanceof Error ? err.message : String(err)}`);
+        });
 
-      // Load audio immediately if audioUrl is already set
-      if (audioUrl) {
-        debug.log('WaveSurfer ready, loading audio:', audioUrl);
-        loadingRef.current = true;
-        setIsLoading(true);
-        // Stop any current playback before loading new audio
-        if (wavesurfer.isPlaying()) {
-          wavesurfer.pause();
-        }
-        wavesurfer
-          .load(audioUrl)
-          .then(() => {
-            debug.log('Audio loaded into WaveSurfer');
-            loadingRef.current = false;
-          })
-          .catch((error) => {
-            debug.error('Failed to load audio into WaveSurfer:', error);
-            loadingRef.current = false;
-            setIsLoading(false);
-            setError(
-              `Failed to load audio: ${error instanceof Error ? error.message : String(error)}`,
-            );
-          });
+        wavesurfer.on('loading', (percent) => {
+          setIsLoading(true);
+          if (percent === 100) setIsLoading(false);
+        });
+
+        wavesurferRef.current = wavesurfer;
+        setWsReady(true);
+        debug.log('WaveSurfer created successfully');
+      } catch (err) {
+        debug.error('Failed to create WaveSurfer:', err);
+        setError(
+          `Failed to initialize waveform: ${err instanceof Error ? err.message : String(err)}`,
+        );
       }
     };
 
-    // Use double requestAnimationFrame to ensure DOM is fully rendered
-    let rafId1: number;
-    let rafId2: number;
-    let timeoutId: number | null = null;
-
-    rafId1 = requestAnimationFrame(() => {
-      rafId2 = requestAnimationFrame(() => {
-        // Add a small delay to ensure container is fully laid out
-        timeoutId = setTimeout(() => {
-          initWaveSurfer();
-        }, 10);
-      });
+    let rafId: number;
+    rafId = requestAnimationFrame(() => {
+      initWaveSurfer();
     });
 
     return () => {
-      debug.log('Cleaning up WaveSurfer initialization effect');
-      if (rafId1) cancelAnimationFrame(rafId1);
-      if (rafId2) cancelAnimationFrame(rafId2);
-      if (timeoutId) clearTimeout(timeoutId);
+      cancelAnimationFrame(rafId);
+    };
+    // Only run on mount-like conditions. audioUrl is here so we create the instance
+    // when the player first appears, but we guard against re-creation above.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [audioUrl, setIsPlaying, setDuration, setCurrentTime]);
+
+  // Destroy WaveSurfer only on unmount
+  useEffect(() => {
+    return () => {
       if (wavesurferRef.current) {
-        debug.log('Destroying WaveSurfer instance');
+        debug.log('Destroying WaveSurfer instance (unmount)');
         try {
           wavesurferRef.current.destroy();
-        } catch (error) {
-          debug.error('Error destroying WaveSurfer:', error);
+        } catch (err) {
+          debug.error('Error destroying WaveSurfer:', err);
         }
         wavesurferRef.current = null;
+        setWsReady(false);
       }
     };
-  }, [audioUrl, setIsPlaying, setCurrentTime, setDuration]);
+  }, []);
 
-  // Load audio when URL changes (only if WaveSurfer is already initialized)
+  // Load audio when URL changes (reuses the existing WaveSurfer instance)
   useEffect(() => {
     const wavesurfer = wavesurferRef.current;
+    if (!wavesurfer || !wsReady) return;
 
-    if (!audioUrl || !wavesurfer) {
-      // Reset state when no audio or WaveSurfer not ready
-      if (!audioUrl && wavesurfer) {
-        wavesurfer.pause();
-        wavesurfer.seekTo(0);
-        loadingRef.current = false;
-        setIsLoading(false);
-        setDuration(0);
-        setCurrentTime(0);
-        setError(null);
-        // Reset native playback flag
-        isUsingNativePlaybackRef.current = false;
-      }
+    if (!audioUrl) {
+      // No audio - pause and reset
+      wavesurfer.pause();
+      wavesurfer.seekTo(0);
+      loadingRef.current = false;
+      setIsLoading(false);
+      setDuration(0);
+      setCurrentTime(0);
+      setError(null);
+      isUsingNativePlaybackRef.current = false;
       return;
     }
 
-    // Stop native playback if it was active
-    if (isUsingNativePlaybackRef.current && platform.metadata.isTauri) {
-      try {
-        platform.audio.stopPlayback();
-        debug.log('Stopped native audio playback');
-      } catch (error) {
-        debug.error('Failed to stop native playback:', error);
-      }
-    }
-
-    // Reset native playback flag when loading new audio
-    // Unmute WaveSurfer if it was muted for native playback
-    if (isUsingNativePlaybackRef.current) {
-      wavesurfer.setMuted(false);
-      wavesurfer.setVolume(usePlayerStore.getState().volume);
-    }
+    // Reset native playback state
     isUsingNativePlaybackRef.current = false;
+    wavesurfer.setMuted(false);
+    wavesurfer.setVolume(usePlayerStore.getState().volume);
 
-    // CRITICAL: Force stop any current playback and cancel any pending loads
-    // This must happen BEFORE any early returns
-    debug.log('Audio URL changed to:', audioUrl);
-
-    // COMPLETELY stop and destroy the current audio
+    // Stop current playback and reset position before loading new audio.
+    // With the WebAudio backend, pause() accumulates playedDuration internally.
+    // seekTo(0) resets it so the new track starts from the beginning.
+    debug.log('Loading new audio URL:', audioUrl);
     try {
-      // First pause if playing
       if (wavesurfer.isPlaying()) {
-        debug.log('Pausing current playback');
         wavesurfer.pause();
       }
-
-      // Use empty() to completely destroy the waveform and reset media
-      debug.log('Calling wavesurfer.empty() to destroy audio');
-      wavesurfer.empty();
-    } catch (error) {
-      debug.error('Error stopping previous audio:', error);
-      // Continue anyway to load new audio
+      wavesurfer.seekTo(0);
+    } catch (err) {
+      debug.error('Error resetting before load:', err);
     }
 
-    // Reset loading state to allow new load (cancel any pending loads)
-    loadingRef.current = false;
-
-    // Now start the new load
     loadingRef.current = true;
     setIsLoading(true);
     setError(null);
     setCurrentTime(0);
     setDuration(0);
 
-    // Load new audio
-    debug.log('Starting new audio load for:', audioUrl);
     wavesurfer
       .load(audioUrl)
       .then(() => {
-        debug.log('Audio load promise resolved');
-        // Don't set loading to false here - wait for 'ready' event
+        debug.log('Audio loaded into WaveSurfer');
+        loadingRef.current = false;
       })
-      .catch((error) => {
-        debug.error('Failed to load audio:', error);
-        debug.error('Audio URL:', audioUrl);
+      .catch((err) => {
+        debug.error('Failed to load audio:', err);
         loadingRef.current = false;
         setIsLoading(false);
-        setError(`Failed to load audio: ${error instanceof Error ? error.message : String(error)}`);
+        setError(`Failed to load audio: ${err instanceof Error ? err.message : String(err)}`);
       });
-  }, [audioUrl, setCurrentTime, setDuration]);
+  }, [audioUrl, wsReady, setCurrentTime, setDuration]);
 
   // Sync play/pause state (only when user clicks play/pause button, not auto-sync)
   // This effect is kept for external state changes but should be minimal
@@ -520,7 +318,6 @@ export function AudioPlayer() {
     if (!wavesurferRef.current || duration === 0) return;
 
     if (isPlaying && wavesurferRef.current.isPlaying() === false) {
-      // Only auto-play if audio is ready
       wavesurferRef.current.play().catch((error) => {
         debug.error('Failed to play:', error);
         setIsPlaying(false);
@@ -534,14 +331,7 @@ export function AudioPlayer() {
   // Sync volume
   useEffect(() => {
     if (wavesurferRef.current) {
-      // If using native playback, keep WaveSurfer muted regardless of volume setting
-      if (isUsingNativePlaybackRef.current) {
-        wavesurferRef.current.setVolume(0);
-        debug.log('Volume sync: Using native playback, keeping WaveSurfer muted');
-      } else {
-        wavesurferRef.current.setVolume(volume);
-        debug.log('Volume synced:', volume);
-      }
+      wavesurferRef.current.setVolume(volume);
     }
   }, [volume]);
 
@@ -566,7 +356,6 @@ export function AudioPlayer() {
       return;
     }
 
-    // Reset to beginning and play
     debug.log('Restarting current audio from beginning');
     wavesurfer.seekTo(0);
     wavesurfer.play().catch((error) => {
@@ -575,34 +364,35 @@ export function AudioPlayer() {
       setError(`Playback error: ${error instanceof Error ? error.message : String(error)}`);
     });
 
-    // Clear the restart flag
     clearRestartFlag();
   }, [shouldRestart, duration, setIsPlaying, clearRestartFlag]);
 
-  // Handle shouldAutoPlay flag - for story mode auto-advance
-  const shouldAutoPlay = usePlayerStore((state) => state.shouldAutoPlay);
-  const clearAutoPlayFlag = usePlayerStore((state) => state.clearAutoPlayFlag);
+  // Auto-play is handled exclusively in the WaveSurfer 'ready' event handler.
+  // A separate effect here would race with the ready event since the WebAudio
+  // backend needs to fully decode the audio before play() works correctly.
 
+  // Spacebar to play/pause (capture phase so it fires before focused elements)
   useEffect(() => {
-    const wavesurfer = wavesurferRef.current;
-    if (!wavesurfer || !shouldAutoPlay || duration === 0) {
-      return;
-    }
-
-    // Auto-play the newly loaded audio
-    debug.log('Auto-playing next track in story mode');
-    wavesurfer.seekTo(0);
-    wavesurfer.play().catch((error) => {
-      debug.error('Failed to auto-play:', error);
-      setIsPlaying(false);
-      setError(`Playback error: ${error instanceof Error ? error.message : String(error)}`);
-    });
-
-    // Clear the auto-play flag
-    clearAutoPlayFlag();
-  }, [shouldAutoPlay, duration, setIsPlaying, clearAutoPlayFlag]);
-
-  // Handle loop - WaveSurfer handles this via the 'finish' event
+    const onKeyDown = (e: KeyboardEvent) => {
+      if (e.code !== 'Space') return;
+      // Ignore if user is typing in an input/textarea
+      const tag = (e.target as HTMLElement)?.tagName;
+      if (tag === 'INPUT' || tag === 'TEXTAREA' || (e.target as HTMLElement)?.isContentEditable) {
+        return;
+      }
+      if (audioUrl && duration > 0 && wavesurferRef.current) {
+        e.preventDefault();
+        e.stopPropagation();
+        if (wavesurferRef.current.isPlaying()) {
+          wavesurferRef.current.pause();
+        } else {
+          wavesurferRef.current.play().catch((err) => debug.error('Spacebar play failed:', err));
+        }
+      }
+    };
+    document.addEventListener('keydown', onKeyDown, true);
+    return () => document.removeEventListener('keydown', onKeyDown, true);
+  }, [audioUrl, duration]);
 
   const handlePlayPause = async () => {
     // Standard WaveSurfer playback (works for both normal and native playback modes)
@@ -741,32 +531,32 @@ export function AudioPlayer() {
             size="icon"
             onClick={handlePlayPause}
             disabled={isLoading || duration === 0}
-            className="shrink-0"
+            className={`shrink-0 -mt-2 ${isPlaying ? 'bg-accent text-accent-foreground' : ''}`}
             title={duration === 0 && !isLoading ? 'Audio not loaded' : ''}
             aria-label={
               duration === 0 && !isLoading ? 'Audio not loaded' : isPlaying ? 'Pause' : 'Play'
             }
           >
-            {isPlaying ? <Pause className="h-5 w-5" /> : <Play className="h-5 w-5" />}
+            {isPlaying ? (
+              <Pause className="h-5 w-5 fill-current" />
+            ) : (
+              <Play className="h-5 w-5 fill-current" />
+            )}
           </Button>
 
           {/* Waveform */}
           <div className="flex-1 min-w-0 flex flex-col gap-1">
-            <div ref={waveformRef} className="w-full min-h-[80px]" />
-            {duration > 0 && (
-              <Slider
-                value={duration > 0 ? [(currentTime / duration) * 100] : [0]}
-                onValueChange={handleSeek}
-                max={100}
-                step={0.1}
-                className="w-full"
-                aria-label="Playback position"
-                aria-valuetext={`${formatAudioDuration(currentTime)} of ${formatAudioDuration(duration)}`}
-              />
-            )}
-            {isLoading && (
-              <div className="text-xs text-muted-foreground text-center py-2">Loading audio...</div>
-            )}
+            <div ref={waveformRef} className="w-full min-h-[80px] select-none" />
+            <Slider
+              value={duration > 0 ? [(currentTime / duration) * 100] : [0]}
+              onValueChange={handleSeek}
+              max={100}
+              step={0.1}
+              className="w-full"
+              aria-label="Playback position"
+              aria-valuetext={`${formatAudioDuration(currentTime)} of ${formatAudioDuration(duration)}`}
+            />
+
             {error && <div className="text-xs text-destructive text-center py-2">{error}</div>}
           </div>
 
@@ -777,19 +567,12 @@ export function AudioPlayer() {
             <span className="font-mono">{formatAudioDuration(duration)}</span>
           </div>
 
-          {/* Title */}
-          {title && (
-            <div className="text-sm font-medium truncate max-w-[200px] shrink-0 hidden lg:block">
-              {title}
-            </div>
-          )}
-
           {/* Loop Button */}
           <Button
             variant="ghost"
             size="icon"
             onClick={toggleLoop}
-            className={isLooping ? 'text-primary' : ''}
+            className={isLooping ? 'bg-accent text-accent-foreground' : ''}
             title="Toggle loop"
             aria-label={isLooping ? 'Stop looping' : 'Loop'}
           >

app/src/components/History/HistoryTable.tsx

@@ -64,7 +64,7 @@ function AudioBars({ mode }: { mode: 'idle' | 'generating' | 'playing' }) {
     <div className="flex items-center gap-[2px] h-5">
       {[0, 1, 2, 3, 4].map((i) => (
         <motion.div
-          key={i}
+          key={`${mode}-${i}`}
           className={`w-[3px] rounded-full ${barColor}`}
           animate={
             mode === 'generating'
@@ -153,7 +153,9 @@ export function HistoryTable() {
     }
   }, [historyData, page]);
 
-  // Reset to page 0 when deletions or imports occur
+  // Reset to page 0 when deletions, imports, or generation completions occur
+  const pendingCount = useGenerationStore((state) => state.pendingGenerationIds.size);
+  const prevPendingCountRef = useRef(pendingCount);
   useEffect(() => {
     if (deleteGeneration.isSuccess || importGeneration.isSuccess) {
       setPage(0);
@@ -161,6 +163,19 @@ export function HistoryTable() {
     }
   }, [deleteGeneration.isSuccess, importGeneration.isSuccess]);
 
+  useEffect(() => {
+    // A generation finished (pending count decreased) — scroll back to show it
+    if (
+      prevPendingCountRef.current > 0 &&
+      pendingCount < prevPendingCountRef.current &&
+      page !== 0
+    ) {
+      setPage(0);
+      setAllHistory([]);
+    }
+    prevPendingCountRef.current = pendingCount;
+  }, [pendingCount, page]);
+
   // Intersection Observer for infinite scroll
   useEffect(() => {
     const loadMoreEl = loadMoreRef.current;
@@ -440,7 +455,7 @@ export function HistoryTable() {
                     role={isPlayable ? 'button' : undefined}
                     tabIndex={isPlayable ? 0 : undefined}
                     className={cn(
-                      'flex items-stretch gap-4 h-26 p-3',
+                      'flex items-stretch gap-4 h-26 p-3 outline-none',
                       isPlayable && 'hover:bg-muted/70 cursor-pointer rounded-md',
                       isVersionsExpanded && 'rounded-b-none',
                     )}

app/src/lib/api/client.ts

@@ -32,8 +32,24 @@ import type {
   TranscriptionResponse,
   VoiceProfileCreate,
   VoiceProfileResponse,
+  WhisperModelSize,
 } from './types';
 
+function formatErrorDetail(detail: unknown, fallback: string): string {
+  if (typeof detail === 'string') return detail;
+  if (Array.isArray(detail)) {
+    return detail
+      .map((e: Record<string, unknown>) => e.msg || e.message || JSON.stringify(e))
+      .join('; ');
+  }
+  if (detail && typeof detail === 'object') {
+    const obj = detail as Record<string, unknown>;
+    if (typeof obj.message === 'string') return obj.message;
+    return JSON.stringify(detail);
+  }
+  return fallback;
+}
+
 class ApiClient {
   private getBaseUrl(): string {
     const serverUrl = useServerStore.getState().serverUrl;
@@ -54,7 +70,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.json();
@@ -113,7 +129,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.json();
@@ -147,7 +163,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.blob();
@@ -167,7 +183,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.json();
@@ -187,7 +203,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.json();
@@ -257,7 +273,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.blob();
@@ -271,7 +287,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.blob();
@@ -297,7 +313,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.json();
@@ -318,12 +334,19 @@ class ApiClient {
   }
 
   // Transcription
-  async transcribeAudio(file: File, language?: LanguageCode): Promise<TranscriptionResponse> {
+  async transcribeAudio(
+    file: File,
+    language?: LanguageCode,
+    model?: WhisperModelSize,
+  ): Promise<TranscriptionResponse> {
     const formData = new FormData();
     formData.append('file', file);
     if (language) {
       formData.append('language', language);
     }
+    if (model) {
+      formData.append('model', model);
+    }
 
     const url = `${this.getBaseUrl()}/transcribe`;
     const response = await fetch(url, {
@@ -335,7 +358,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.json();
@@ -608,7 +631,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.blob();
@@ -705,7 +728,7 @@ class ApiClient {
       const error = await response.json().catch(() => ({
         detail: response.statusText,
       }));
-      throw new Error(error.detail || `HTTP error! status: ${response.status}`);
+      throw new Error(formatErrorDetail(error.detail, `HTTP error! status: ${response.status}`));
     }
 
     return response.blob();

app/src/lib/api/types.ts

@@ -99,8 +99,11 @@ export interface HistoryListResponse {
   total: number;
 }
 
+export type WhisperModelSize = 'base' | 'small' | 'medium' | 'large' | 'turbo';
+
 export interface TranscriptionRequest {
   language?: LanguageCode;
+  model?: WhisperModelSize;
 }
 
 export interface TranscriptionResponse {

app/src/lib/hooks/useGenerationProgress.ts

@@ -75,8 +75,8 @@ export function useGenerationProgress() {
             currentSources.delete(id);
             removePendingGeneration(id);
 
-            // Refresh history to pick up the completed generation
-            queryClient.invalidateQueries({ queryKey: ['history'] });
+            // Refetch history to pick up the completed generation
+            queryClient.refetchQueries({ queryKey: ['history'] });
 
             // If this generation was queued for a story, add it now
             const storyId = removePendingStoryAdd(id);
@@ -120,7 +120,7 @@ export function useGenerationProgress() {
             removePendingGeneration(id);
             removePendingStoryAdd(id);
 
-            queryClient.invalidateQueries({ queryKey: ['history'] });
+            queryClient.refetchQueries({ queryKey: ['history'] });
 
             toast({
               title: data.status === 'not_found' ? 'Generation not found' : 'Generation failed',
@@ -134,11 +134,12 @@ export function useGenerationProgress() {
       };
 
       source.onerror = () => {
-        // EventSource auto-reconnects, but if we get repeated errors
-        // just clean up
+        // SSE connection dropped — clean up and refresh history so any
+        // completed/failed generation still appears in the list
         source.close();
         currentSources.delete(id);
         removePendingGeneration(id);
+        queryClient.refetchQueries({ queryKey: ['history'] });
       };
 
       currentSources.set(id, source);

app/src/lib/hooks/useSystemAudioCapture.ts

@@ -1,4 +1,4 @@
-import { useState, useRef, useCallback, useEffect } from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
 import { usePlatform } from '@/platform/PlatformContext';
 
 interface UseSystemAudioCaptureOptions {
@@ -94,15 +94,13 @@ export function useSystemAudioCapture({
       const blob = await platform.audio.stopSystemAudioCapture();
 
       // Pass the actual recorded duration
-      const recordedDuration = startTimeRef.current 
-        ? (Date.now() - startTimeRef.current) / 1000 
+      const recordedDuration = startTimeRef.current
+        ? (Date.now() - startTimeRef.current) / 1000
         : undefined;
       onRecordingComplete?.(blob, recordedDuration);
     } catch (err) {
       const errorMessage =
-        err instanceof Error
-          ? err.message
-          : 'Failed to stop system audio capture.';
+        err instanceof Error ? err.message : 'Failed to stop system audio capture.';
       setError(errorMessage);
     }
   }, [isRecording, onRecordingComplete, platform]);

app/src/lib/hooks/useTranscription.ts

@@ -1,10 +1,18 @@
 import { useMutation } from '@tanstack/react-query';
 import { apiClient } from '@/lib/api/client';
+import type { WhisperModelSize } from '@/lib/api/types';
 import type { LanguageCode } from '@/lib/constants/languages';
 
 export function useTranscription() {
   return useMutation({
-    mutationFn: ({ file, language }: { file: File; language?: LanguageCode }) =>
-      apiClient.transcribeAudio(file, language),
+    mutationFn: ({
+      file,
+      language,
+      model,
+    }: {
+      file: File;
+      language?: LanguageCode;
+      model?: WhisperModelSize;
+    }) => apiClient.transcribeAudio(file, language, model),
   });
 }

backend/backends/__init__.py

@@ -134,6 +134,7 @@ class STTBackend(Protocol):
         self,
         audio_path: str,
         language: Optional[str] = None,
+        model_size: Optional[str] = None,
     ) -> str:
         """
         Transcribe audio to text.

backend/backends/mlx_backend.py

@@ -345,18 +345,20 @@ class MLXSTTBackend:
         self,
         audio_path: str,
         language: Optional[str] = None,
+        model_size: Optional[str] = None,
     ) -> str:
         """
         Transcribe audio to text.
 
         Args:
             audio_path: Path to audio file
-            language: Optional language hint (en or zh)
+            language: Optional language hint
+            model_size: Optional model size override
 
         Returns:
             Transcribed text
         """
-        await self.load_model_async(None)
+        await self.load_model_async(model_size)
 
         def _transcribe_sync():
             """Run synchronous transcription in thread pool."""

backend/backends/pytorch_backend.py

@@ -306,18 +306,20 @@ class PyTorchSTTBackend:
         self,
         audio_path: str,
         language: Optional[str] = None,
+        model_size: Optional[str] = None,
     ) -> str:
         """
         Transcribe audio to text.
 
         Args:
             audio_path: Path to audio file
-            language: Optional language hint (en or zh)
+            language: Optional language hint
+            model_size: Optional model size override
 
         Returns:
             Transcribed text
         """
-        await self.load_model_async(None)
+        await self.load_model_async(model_size)
 
         def _transcribe_sync():
             """Run synchronous transcription in thread pool."""

backend/models.py

@@ -149,7 +149,8 @@ class HistoryListResponse(BaseModel):
 class TranscriptionRequest(BaseModel):
     """Request model for audio transcription."""
 
-    language: Optional[str] = Field(None, pattern="^(en|zh)$")
+    language: Optional[str] = Field(None, pattern="^(en|zh|ja|ko|de|fr|ru|pt|es|it)$")
+    model: Optional[str] = Field(None, pattern="^(base|small|medium|large|turbo)$")
 
 
 class TranscriptionResponse(BaseModel):

backend/routes/generations.py

@@ -1,12 +1,15 @@
 """TTS generation endpoints."""
 
 import asyncio
+import logging
 import uuid
 
 from fastapi import APIRouter, Depends, HTTPException
 from fastapi.responses import StreamingResponse
 from sqlalchemy.orm import Session
 
+logger = logging.getLogger(__name__)
+
 from .. import models
 from ..services import history, profiles, tts
 from ..database import Generation as DBGeneration, VoiceProfile as DBVoiceProfile, get_db
@@ -181,25 +184,28 @@ async def get_generation_status(generation_id: str, db: Session = Depends(get_db
     import json
 
     async def event_stream():
-        while True:
-            db.expire_all()
-            gen = db.query(DBGeneration).filter_by(id=generation_id).first()
-            if not gen:
-                yield f"data: {json.dumps({'status': 'not_found', 'id': generation_id})}\n\n"
-                return
+        try:
+            while True:
+                db.expire_all()
+                gen = db.query(DBGeneration).filter_by(id=generation_id).first()
+                if not gen:
+                    yield f"data: {json.dumps({'status': 'not_found', 'id': generation_id})}\n\n"
+                    return
 
-            payload = {
-                "id": gen.id,
-                "status": gen.status or "completed",
-                "duration": gen.duration,
-                "error": gen.error,
-            }
-            yield f"data: {json.dumps(payload)}\n\n"
+                payload = {
+                    "id": gen.id,
+                    "status": gen.status or "completed",
+                    "duration": gen.duration,
+                    "error": gen.error,
+                }
+                yield f"data: {json.dumps(payload)}\n\n"
 
-            if (gen.status or "completed") in ("completed", "failed"):
-                return
+                if (gen.status or "completed") in ("completed", "failed"):
+                    return
 
-            await asyncio.sleep(1)
+                await asyncio.sleep(1)
+        except (BrokenPipeError, ConnectionResetError, asyncio.CancelledError):
+            logger.debug("SSE client disconnected for generation %s", generation_id)
 
     return StreamingResponse(
         event_stream(),
@@ -265,9 +271,12 @@ async def stream_speech(
     wav_bytes = tts.audio_to_wav_bytes(audio, sample_rate)
 
     async def _wav_stream():
-        chunk_size = 64 * 1024
-        for i in range(0, len(wav_bytes), chunk_size):
-            yield wav_bytes[i : i + chunk_size]
+        try:
+            chunk_size = 64 * 1024
+            for i in range(0, len(wav_bytes), chunk_size):
+                yield wav_bytes[i : i + chunk_size]
+        except (BrokenPipeError, ConnectionResetError, asyncio.CancelledError):
+            logger.debug("Client disconnected during audio stream")
 
     return StreamingResponse(
         _wav_stream(),

backend/routes/profiles.py

@@ -102,6 +102,10 @@ async def delete_profile(
     return {"message": "Profile deleted successfully"}
 
 
+SAMPLE_MAX_FILE_SIZE = 50 * 1024 * 1024  # 50 MB
+SAMPLE_UPLOAD_CHUNK_SIZE = 1024 * 1024  # 1 MB
+
+
 @router.post("/profiles/{profile_id}/samples", response_model=models.ProfileSampleResponse)
 async def add_profile_sample(
     profile_id: str,
@@ -115,8 +119,16 @@ async def add_profile_sample(
     file_suffix = _uploaded_ext if _uploaded_ext in _allowed_audio_exts else ".wav"
 
     with tempfile.NamedTemporaryFile(suffix=file_suffix, delete=False) as tmp:
-        content = await file.read()
-        tmp.write(content)
+        total_size = 0
+        while chunk := await file.read(SAMPLE_UPLOAD_CHUNK_SIZE):
+            total_size += len(chunk)
+            if total_size > SAMPLE_MAX_FILE_SIZE:
+                Path(tmp.name).unlink(missing_ok=True)
+                raise HTTPException(
+                    status_code=413,
+                    detail=f"File too large (max {SAMPLE_MAX_FILE_SIZE // (1024 * 1024)} MB)",
+                )
+            tmp.write(chunk)
         tmp_path = tmp.name
 
     try:

backend/routes/transcription.py

@@ -20,6 +20,7 @@ UPLOAD_CHUNK_SIZE = 1024 * 1024  # 1MB
 async def transcribe_audio(
     file: UploadFile = File(...),
     language: str | None = Form(None),
+    model: str | None = Form(None),
 ):
     """Transcribe audio file to text."""
     with tempfile.NamedTemporaryFile(suffix=".wav", delete=False) as tmp:
@@ -29,14 +30,23 @@ async def transcribe_audio(
 
     try:
         from ..utils.audio import load_audio
+        from ..backends import WHISPER_HF_REPOS
 
         audio, sr = await asyncio.to_thread(load_audio, tmp_path)
         duration = len(audio) / sr
 
         whisper_model = transcribe.get_whisper_model()
-        model_size = whisper_model.model_size
+        model_size = model if model else whisper_model.model_size
 
-        if not whisper_model.is_loaded() and not whisper_model._is_model_cached(model_size):
+        valid_sizes = list(WHISPER_HF_REPOS.keys())
+        if model_size not in valid_sizes:
+            raise HTTPException(
+                status_code=400,
+                detail=f"Invalid model size '{model_size}'. Must be one of: {', '.join(valid_sizes)}",
+            )
+
+        already_loaded = whisper_model.is_loaded() and whisper_model.model_size == model_size
+        if not already_loaded and not whisper_model._is_model_cached(model_size):
             progress_model_name = f"whisper-{model_size}"
             task_manager = get_task_manager()
 
@@ -59,7 +69,7 @@ async def transcribe_audio(
                 },
             )
 
-        text = await whisper_model.transcribe(tmp_path, language)
+        text = await whisper_model.transcribe(tmp_path, language, model_size)
 
         return models.TranscriptionResponse(
             text=text,

backend/services/profiles.py

@@ -22,7 +22,7 @@ from ..database import (
     Generation as DBGeneration,
 )
 from ..models import EffectConfig
-from ..utils.audio import validate_reference_audio, load_audio, save_audio
+from ..utils.audio import validate_reference_audio, validate_and_load_reference_audio, load_audio, save_audio
 from ..utils.images import validate_image, process_avatar
 from ..utils.cache import _get_cache_dir, clear_profile_cache
 from .tts import get_tts_model
@@ -117,11 +117,16 @@ async def add_profile_sample(
     Returns:
         Created sample
     """
+    import asyncio
+
     profile = db.query(DBVoiceProfile).filter_by(id=profile_id).first()
     if not profile:
         raise ValueError(f"Profile {profile_id} not found")
 
-    is_valid, error_msg = validate_reference_audio(audio_path)
+    # Validate and load audio in a single pass, off the event loop
+    is_valid, error_msg, audio, sr = await asyncio.to_thread(
+        validate_and_load_reference_audio, audio_path
+    )
     if not is_valid:
         raise ValueError(f"Invalid reference audio: {error_msg}")
 
@@ -130,8 +135,7 @@ async def add_profile_sample(
     profile_dir.mkdir(parents=True, exist_ok=True)
 
     dest_path = profile_dir / f"{sample_id}.wav"
-    audio, sr = load_audio(audio_path)
-    save_audio(audio, str(dest_path), sr)
+    await asyncio.to_thread(save_audio, audio, str(dest_path), sr)
 
     db_sample = DBProfileSample(
         id=sample_id,

backend/utils/audio.py

@@ -217,22 +217,40 @@ def validate_reference_audio(
     Returns:
         Tuple of (is_valid, error_message)
     """
+    result = validate_and_load_reference_audio(
+        audio_path, min_duration, max_duration, min_rms
+    )
+    return (result[0], result[1])
+
+
+def validate_and_load_reference_audio(
+    audio_path: str,
+    min_duration: float = 2.0,
+    max_duration: float = 30.0,
+    min_rms: float = 0.01,
+) -> Tuple[bool, Optional[str], Optional[np.ndarray], Optional[int]]:
+    """
+    Validate and load reference audio in a single pass.
+    
+    Returns:
+        Tuple of (is_valid, error_message, audio_array, sample_rate)
+    """
     try:
         audio, sr = load_audio(audio_path)
         duration = len(audio) / sr
         
         if duration < min_duration:
-            return False, f"Audio too short (minimum {min_duration} seconds)"
+            return False, f"Audio too short (minimum {min_duration} seconds)", None, None
         if duration > max_duration:
-            return False, f"Audio too long (maximum {max_duration} seconds)"
+            return False, f"Audio too long (maximum {max_duration} seconds)", None, None
         
         rms = np.sqrt(np.mean(audio**2))
         if rms < min_rms:
-            return False, "Audio is too quiet or silent"
+            return False, "Audio is too quiet or silent", None, None
         
         if np.abs(audio).max() > 0.99:
-            return False, "Audio is clipping (reduce input gain)"
+            return False, "Audio is clipping (reduce input gain)", None, None
         
-        return True, None
+        return True, None, audio, sr
     except Exception as e:
-        return False, f"Error validating audio: {str(e)}"
+        return False, f"Error validating audio: {str(e)}", None, None

backend/utils/progress.py

@@ -246,6 +246,8 @@ class ProgressManager:
                     # Send heartbeat
                     yield ": heartbeat\n\n"
                     continue
+        except (BrokenPipeError, ConnectionResetError, asyncio.CancelledError):
+            logger.debug(f"SSE client disconnected from {model_name}")
         finally:
             # Remove from listeners
             if model_name in self._listeners: