feat: play from dropdown

src/screens/Home/Home.js

@@ -33,6 +33,7 @@ import {
   getStageAction,
 } from "../../utils/projectStages";
 import { openCoinPackModal } from "../../utils/coinPackModal";
+import useNavigateToMusicDetails from "../../hooks/useNavigateToMusicDetails";
 import StageCard from "./components/StageCard";
 import ClubCard from "./components/ClubCard";
 
@@ -66,7 +67,7 @@ const STAGE_CARD_CONTENT = [
     key: "beatmaker",
     step: "ÉTAPE 2",
     description:
-      "Bienvenue au studio MusicLand.\nNous mettons en musique tes paroles en fonction de tes inspirations, ça va être top !",
+      "Je suis Malik, responsable du studio de MusicLand.\nJe vais mettre en musique tes paroles en fonction de tes goûts musicaux, ça va être top !",
     image: cardsImg.studio,
     imagePosition: "right",
     textAlign: "right",
@@ -86,7 +87,7 @@ const STAGE_CARD_CONTENT = [
     key: "publisher",
     step: "ÉTAPE 4",
     description:
-      "À la sortie du studio, l'équipe production te propose les prochaines étapes pour partager ta musique avec le monde.",
+      "Je suis Mr Benhaï, Producteur de MusicLand, et je vais te faire une proposition qui pourrait t’intéresser. On se retrouve à la sortie du studio !",
     image: cardsImg.production,
     imagePosition: "right",
     textAlign: "right",
@@ -115,6 +116,7 @@ const Home = ({ navigation, route }) => {
   } = useUser();
   const { setTooltip } = useMinuit();
   const [videoUrl, setVideoUrl] = useState(null);
+  const navigateToMusicDetails = useNavigateToMusicDetails();
 
   if (!currentUID) {
     return <LandingPage />;
@@ -174,6 +176,7 @@ const Home = ({ navigation, route }) => {
   const [menuAnchor, setMenuAnchor] = useState(null);
   const [menuProject, setMenuProject] = useState(null);
   const menuAnchorRef = useRef(null);
+  const projectDropdownRef = useRef(null);
   const [hasLocalAdventureFlag, setHasLocalAdventureFlag] = useState(false);
 
   const handleSelectProject = useCallback(
@@ -232,28 +235,48 @@ const Home = ({ navigation, route }) => {
 
   const moreMenuItems = useMemo(() => {
     if (!menuProject?.id) return [];
-    return [
-      {
-        label: "Supprimer",
-        onPress: () =>
-          Alert(
-            "Confirmer la suppression",
-            "Cette action supprimera définitivement ce projet.",
-            [
-              { text: "Annuler", style: "cancel" },
-              {
-                text: "Supprimer",
-                style: "destructive",
-                onPress: () => {
-                  handleDeleteProject();
-                },
+
+    const items = [];
+    const hasSongUrl =
+      typeof menuProject?.songUrl === "string" &&
+      menuProject.songUrl.length > 0;
+
+    if (hasSongUrl) {
+      items.push({
+        label: "Jouer la musique",
+        onPress: () => {
+          projectDropdownRef.current?.close?.();
+          navigateToMusicDetails({
+            projectId: menuProject.id,
+            songUrl: menuProject.songUrl,
+            project: menuProject,
+          });
+        },
+      });
+    }
+
+    items.push({
+      label: "Supprimer",
+      onPress: () =>
+        Alert(
+          "Confirmer la suppression",
+          "Cette action supprimera définitivement ce projet.",
+          [
+            { text: "Annuler", style: "cancel" },
+            {
+              text: "Supprimer",
+              style: "destructive",
+              onPress: () => {
+                handleDeleteProject();
               },
-            ],
-            { cancelable: true },
-          ),
-      },
-    ];
-  }, [handleDeleteProject, menuProject?.id]);
+            },
+          ],
+          { cancelable: true },
+        ),
+    });
+
+    return items;
+  }, [handleDeleteProject, menuProject, navigateToMusicDetails]);
 
   useEffect(() => {
     if (!route?.params?.showLyricsCongrats) {
@@ -495,6 +518,7 @@ const Home = ({ navigation, route }) => {
     <View style={styles.topBar}>
       {mobileInfoRow}
       <ProjectDropDown
+        ref={projectDropdownRef}
         style={styles.projectDropDown}
         projects={projects}
         selectedProject={currentProject}