feat: fix drag and drop

src/screens/Studio/SongReady.js

@@ -21,6 +21,7 @@ import { gutters, size } from "../../styles/Style";
 import { FONT_FAMILY } from "../../styles/Fonts";
 import useSharedAudioPlayer from "../../hooks/useSharedAudioPlayer";
 import CreateLyricsHeader from "../Writing/components/CreateLyricsHeader";
+import CreditAmount from "../../components/CreditAmount";
 
 const MUSIC_GENERATION_COIN_COST = 8;
 const SONG_OPTIONS_PER_GENERATION = 2;
@@ -65,7 +66,7 @@ const SongReady = () => {
         } catch (error) {
           console.log("SongReady pause error", error?.message);
         }
-      },
+      }
     );
     await Promise.all(tasks);
   }, []);
@@ -93,7 +94,7 @@ const SongReady = () => {
         console.log("SongReady play error", error?.message);
       }
     },
-    [pauseAllExcept],
+    [pauseAllExcept]
   );
 
   // Sync URLs from provider's selectedProject
@@ -110,8 +111,6 @@ const SongReady = () => {
     });
   }, [selectedProject?.musicUrls]);
 
-
-
   const validateSelection = async () => {
     try {
       const url = musicUrls[selectedIndex];
@@ -150,7 +149,7 @@ const SongReady = () => {
       return () => {
         pauseAllPlayers();
       };
-    }, [pauseAllPlayers]),
+    }, [pauseAllPlayers])
   );
 
   useEffect(() => {
@@ -177,7 +176,7 @@ const SongReady = () => {
             },
           },
         ],
-        { cancelable: false },
+        { cancelable: false }
       );
       return;
     }
@@ -208,7 +207,7 @@ const SongReady = () => {
             onPress: () => handleConfirmRegenerate(),
           },
         ],
-        { cancelable: true },
+        { cancelable: true }
       );
       return;
     }
@@ -234,7 +233,7 @@ const SongReady = () => {
             marginBottom: responsiveHeight(2),
           }}
         />
-        <View style={{ gap: 16 }}>
+        <View style={{ gap: 16, marginTop: isWeb ? gutters * 3 : 0 }}>
           {musicUrls.map((url, idx) => (
             <SongOptionCard
               key={`${url || "song"}-${idx}`}
@@ -341,11 +340,11 @@ const SongOptionCard = ({
     const id = setInterval(() => {
       const durationMs = Math.max(
         0,
-        Math.round((Number(player.duration) || 0) * 1000),
+        Math.round((Number(player.duration) || 0) * 1000)
       );
       const positionMs = Math.max(
         0,
-        Math.round((Number(player.currentTime) || 0) * 1000),
+        Math.round((Number(player.currentTime) || 0) * 1000)
       );
       setProgressInfo((prev) => {
         if (