music options

src/screens/Library/components/MyMusic.js

@@ -1,13 +1,17 @@
-import React from "react";
+import React, { useState } from "react";
 import { View } from "react-native";
 import { Routes } from "../../../navigation";
 import { navigate } from "../../../navigation/NavigationService";
 import { useUser } from "../../../providers/UserDataProvider";
 import CardContainer from "./CardContainer";
 import MusicCard from "./MusicCard";
+import MoreMenu from "../../../components/MoreMenu";
 
 const MyMusic = () => {
   const { userProjects = [] } = useUser();
+  const [menuTop, setMenuTop] = useState(0);
+  const [showMenu, setShowMenu] = useState(false);
+  const [selectedProjectId, setSelectedProjectId] = useState(null);
   const projects = Array.isArray(userProjects) ? userProjects.slice(0, 3) : [];
   return (
     <CardContainer
@@ -25,9 +29,20 @@ const MyMusic = () => {
               projectId={p?.id}
               likedBy={p?.likedBy || []}
               onPress={() => navigate(Routes.MusicDetails, { projectId: p.id })}
-              onPressMore={() => console.log("More options for", p.id)}
+              onPressMore={(posTop) => {
+                setSelectedProjectId(p.id);
+                setMenuTop(posTop);
+                setShowMenu((prev) => !prev || posTop !== menuTop);
+              }}
             />
           ))}
+        <MoreMenu
+          visible={showMenu}
+          top={menuTop}
+          onClose={() => setShowMenu(false)}
+          inPlaylist={false}
+          projectId={selectedProjectId}
+        />
       </View>
     </CardContainer>
   );