global player

src/screens/Playbacks/components/PlaybackItem.web.js

@@ -1,4 +1,4 @@
-import { useAudioPlayer } from "expo-audio";
+import useSharedAudioPlayer from "../../../hooks/useSharedAudioPlayer";
 import { BlurView } from "expo-blur";
 import React, {
   useCallback,
@@ -144,7 +144,14 @@ const PlaybackItem = ({
     setIsLiked(currentUID ? lb.includes(currentUID) : false);
   }, [item?.likedBy, currentUID]);
 
-  const audioPlayer = useAudioPlayer(audioSource || undefined);
+  const audioPlayer = useSharedAudioPlayer(audioSource || undefined, {
+    id: item?.id ? `playback-${item.id}` : audioSource?.uri ? `playback-${audioSource.uri}` : undefined,
+    title: typeof item?.title === "string" ? item.title : "",
+    artist: typeof item?.userName === "string" ? item.userName : "",
+    artwork: item?.coverUrl || null,
+    coverUrl: item?.coverUrl || null,
+    metadata: { playbackId: item?.id },
+  });
 
   // Helpers to normalize and map clocks
   const getAudioTimeSeconds = useCallback(() => {