fix(hub): starting one player stops the other

Opening a film while a track was playing left both audio tracks running
together — nothing closed the music queue when a video opened, and nothing
closed the video modal when a track started. Both directions now stop
whichever player wasn't just asked for.

1 files changed, 8 insertions, 1 deletions

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/group-page.js b/packages/meshbay-hub/src/meshbay_hub/static/group-page.js
index 2331977..93b0466 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/group-page.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/group-page.js
@@ -96,7 +96,12 @@ function GroupPage({ groupId, group, token, username, userId, userPrefs,
   // "play this same album again from track 0" a distinct value every time,
   // so MusicPlayerBar's queue-init effect always re-runs.
   const [musicQueue, setMusicQueue] = useState(null);
+  // Starting one player stops the other — both would otherwise keep playing
+  // at once, found live: opening a film while a track was going left both
+  // audio tracks running together. onPlayQueue closes the video modal for
+  // the same reason `entry.type === 'video'` below stops the music queue.
   const onPlayQueue = useCallback((tracks, startIndex) => {
+    setVideoEntry(null);
     setMusicQueue({ tracks, startIndex, nonce: Date.now() });
   }, []);
   // This component instance is not remounted when switching to a *different*
@@ -441,7 +446,9 @@ function GroupPage({ groupId, group, token, username, userId, userPrefs,
   // already playing (from Music, or a previous Files click) rather than
   // merging with it, so there is nothing to special-case here.
   const onPreview = useCallback((entry) => {
-    if (entry.type === 'video') { setVideoEntry(entry); return; }
+    // Opening a film stops whatever the Music player was doing — see the
+    // matching setVideoEntry(null) in onPlayQueue above for the reverse case.
+    if (entry.type === 'video') { setMusicQueue(null); setVideoEntry(entry); return; }
     if (entry.type === 'audio') {
       const siblings = entries
         .filter((e) => e.type === 'audio' && e.path === entry.path)