buid and fix bottom sheet and react native compressor

src/screens/Library/MusicDetails.js

@@ -8,6 +8,7 @@ import {
   StyleSheet,
   Text,
   View,
+  Linking,
 } from "react-native";
 import { SheetManager } from "react-native-actions-sheet";
 import {
@@ -17,7 +18,6 @@ import {
 import { useGlobal } from "reactn";
 import { background, icons } from "../../assets";
 import PressableScale from "../../components/PressableScale";
-import ShareBtn from "../../components/ShareBtn/ShareBtn";
 import Slider from "../../components/Slider";
 import {
   arrayRemove,
@@ -38,11 +38,6 @@ import {
   getSegmentMeta,
   normalizeStructureType,
 } from "../../utils/songStructure";
-import {
-  createMusicSharePayload,
-  openShareSheet,
-} from "../../utils/shareSheet";
-import { Feather } from "@expo/vector-icons";
 
 // 20 secondes
 const timeBeforeIncrement = 20000;
@@ -113,21 +108,6 @@ const MusicDetails = ({ route }) => {
     };
   }, [trackId, songUrl, title, artist, coverUrl, projectId]);
 
-  const sharePayload = useMemo(
-    () =>
-      createMusicSharePayload({
-        projectId,
-        title,
-        artist,
-      }),
-    [projectId, title, artist]
-  );
-
-  const handleShare = useCallback(() => {
-    if (!sharePayload) return;
-    openShareSheet(sharePayload);
-  }, [sharePayload]);
-
   const handleReport = useCallback(() => {
     if (!projectId) return;
     SheetManager.show("Report", {
@@ -140,6 +120,46 @@ const MusicDetails = ({ route }) => {
     });
   }, [owner?.id, project?.userId, projectId, title]);
 
+  const handleAddToPlaylist = useCallback(() => {
+    if (projectId) {
+      SheetManager.show("Playlist", { payload: { projectId } });
+    } else {
+      SheetManager.show("Playlist");
+    }
+  }, [projectId]);
+
+  const handleDownload = useCallback(async () => {
+    if (!songUrl) return;
+    try {
+      await Linking.openURL(songUrl);
+    } catch (error) {
+      console.log("MusicDetails download error", error?.message);
+    }
+  }, [songUrl]);
+
+  const handleOpenOptions = useCallback(() => {
+    SheetManager.show("MusicOptions", {
+      payload: {
+        projectId,
+        title,
+        ownerId: project?.userId || owner?.id || null,
+        onReport: handleReport,
+        onAddToPlaylist: handleAddToPlaylist,
+        onDownload: handleDownload,
+        downloadDisabled: !songUrl,
+      },
+    });
+  }, [
+    handleAddToPlaylist,
+    handleDownload,
+    handleReport,
+    owner?.id,
+    project?.userId,
+    projectId,
+    songUrl,
+    title,
+  ]);
+
   const {
     isCurrent: isCurrentTrack,
     isPlaying: isTrackPlaying,
@@ -709,40 +729,30 @@ const MusicDetails = ({ route }) => {
                     if (!projectId || !currentUID) return;
                     const next = !fav;
                     setFav(next);
-                  try {
-                    await projectsRef.doc(projectId).update({
-                      likedBy: next
-                        ? arrayUnion(currentUID)
-                        : arrayRemove(currentUID),
-                    });
-                  } catch (e) {
-                    setFav(!next);
-                  }
-                }}
-              >
-                <RNImage
-                  source={fav ? icons.heart : icons.heartOutline}
-                  style={{ ...size({ size: 24 }) }}
-                  resizeMode="contain"
-                />
-              </PressableScale>
-              <PressableScale onPress={handleReport}>
-                <Feather name="flag" size={22} color={Palette.white} style={{ marginHorizontal: 2 }} />
-              </PressableScale>
-              {!!sharePayload && (
-                <ShareBtn style={{ borderRadius: 18 }} onPress={handleShare} />
-              )}
-              <Pressable
-                onPress={() =>
-                  SheetManager.show("Playlist", { payload: { projectId } })
-                }
-              >
-                <RNImage
-                  source={icons.more}
-                  style={{ ...size({ size: 24 }) }}
-                  resizeMode="contain"
-                />
-              </Pressable>
+                    try {
+                      await projectsRef.doc(projectId).update({
+                        likedBy: next
+                          ? arrayUnion(currentUID)
+                          : arrayRemove(currentUID),
+                      });
+                    } catch (e) {
+                      setFav(!next);
+                    }
+                  }}
+                >
+                  <RNImage
+                    source={fav ? icons.heart : icons.heartOutline}
+                    style={{ ...size({ size: 24 }) }}
+                    resizeMode="contain"
+                  />
+                </PressableScale>
+                <PressableScale onPress={handleOpenOptions}>
+                  <RNImage
+                    source={icons.more}
+                    style={{ ...size({ size: 24 }) }}
+                    resizeMode="contain"
+                  />
+                </PressableScale>
               </View>
             </View>
           </View>