WIP: Fix play behaviour in track view

- Added wasPlayingRef to preserve playback state across version changes
- Auto-play new waveform if previous version was playing
- Ensure play/pause buttons work correctly after version switch
- Added WebSocket proxy configuration for real-time features

Fixes: Version switching now preserves playback state
Todo: Test edge cases and finalize implementation

web/src/hooks/useWaveform.ts

@@ -16,6 +16,7 @@ export function useWaveform(
   const [isPlaying, setIsPlaying] = useState(false);
   const [isReady, setIsReady] = useState(false);
   const [currentTime, setCurrentTime] = useState(0);
+  const wasPlayingRef = useRef(false);
 
   useEffect(() => {
     if (!containerRef.current || !options.url) return;
@@ -38,6 +39,10 @@ export function useWaveform(
     ws.on("ready", () => {
       setIsReady(true);
       options.onReady?.(ws.getDuration());
+      // Auto-play if previous version was playing
+      if (wasPlayingRef.current) {
+        ws.play();
+      }
     });
 
     ws.on("audioprocess", (time) => {
@@ -45,9 +50,18 @@ export function useWaveform(
       options.onTimeUpdate?.(time);
     });
 
-    ws.on("play", () => setIsPlaying(true));
-    ws.on("pause", () => setIsPlaying(false));
-    ws.on("finish", () => setIsPlaying(false));
+    ws.on("play", () => {
+      setIsPlaying(true);
+      wasPlayingRef.current = true;
+    });
+    ws.on("pause", () => {
+      setIsPlaying(false);
+      wasPlayingRef.current = false;
+    });
+    ws.on("finish", () => {
+      setIsPlaying(false);
+      wasPlayingRef.current = false;
+    });
 
     wsRef.current = ws;
     return () => {
@@ -57,8 +71,14 @@ export function useWaveform(
   // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [options.url]);
 
-  const play = () => wsRef.current?.play();
-  const pause = () => wsRef.current?.pause();
+  const play = () => {
+    wsRef.current?.play();
+    wasPlayingRef.current = true;
+  };
+  const pause = () => {
+    wsRef.current?.pause();
+    wasPlayingRef.current = false;
+  };
   const seekTo = (time: number) => {
     if (wsRef.current && isReady) {
       wsRef.current.setTime(time);