music options

2025-08-29 12:08:46 +02:00
parent 023177ea22
commit 20b132f5ab
11 changed files with 276 additions and 150 deletions
@@ -0,0 +1,151 @@
+import { BlurView } from "expo-blur";
+import React from "react";
+import { Platform, Pressable, Text, View } from "react-native";
+import { SheetManager } from "react-native-actions-sheet";
+import Animated, { Easing, FadeIn, FadeOut } from "react-native-reanimated";
+import { arrayRemove, playlistsRef } from "../config/firebase";
+import useMinuit from "react-native-minuit/src/hooks/useMinuit";
+import { Palette } from "../styles";
+import { FONT_FAMILY } from "../styles/Fonts";
+
+const MoreMenu = ({
+  visible = false,
+  top = 0,
+  onClose = () => {},
+  inPlaylist = false,
+  playlistId = null,
+  projectId = null,
+  extraItems = [],
+}) => {
+  if (!visible) return null;
+  const { setTooltip } = useMinuit();
+
+  const removeFromPlaylist = async () => {
+    try {
+      if (inPlaylist && playlistId && projectId) {
+        await playlistsRef
+          .doc(playlistId)
+          .update({ musics: arrayRemove(projectId), updatedAt: new Date() });
+        setTooltip({ type: "success", text: "Supprimé de la playlist" });
+      }
+    } catch (e) {
+      console.log("Remove from playlist error", e?.message);
+      setTooltip({ type: "error", text: e?.message || "Suppression impossible" });
+    } finally {
+      onClose?.();
+    }
+  };
+
+  const addToPlaylist = () => {
+    if (projectId) {
+      SheetManager.show("Playlist", { payload: { projectId } });
+    } else {
+      SheetManager.show("Playlist");
+    }
+    onClose?.();
+  };
+
+  return (
+    <Animated.View
+      entering={FadeIn.duration(300).easing(Easing.ease)}
+      exiting={FadeOut.duration(300).easing(Easing.ease)}
+      style={{ position: "absolute", right: 0, top, zIndex: 2 }}
+    >
+      <View style={{ gap: 2 }}>
+        {inPlaylist && (
+          <Pressable onPress={removeFromPlaylist}>
+            <BlurView
+              intensity={20}
+              style={{
+                paddingHorizontal: 12,
+                paddingVertical: 10,
+                backgroundColor: Palette.glass,
+                borderRadius: 12,
+                overflow: "hidden",
+              }}
+              experimentalBlurMethod={
+                Platform.OS !== "ios" ? "dimezisBlurView" : "none"
+              }
+            >
+              <Text
+                style={{
+                  fontSize: 14,
+                  color: Palette.white,
+                  fontFamily: FONT_FAMILY.InterRegular,
+                }}
+              >
+                Supprimer de la playlist
+              </Text>
+            </BlurView>
+          </Pressable>
+        )}
+
+        <Pressable onPress={addToPlaylist}>
+          <BlurView
+            intensity={20}
+            style={{
+              paddingHorizontal: 12,
+              paddingVertical: 10,
+              backgroundColor: Palette.glass,
+              borderRadius: 12,
+              overflow: "hidden",
+            }}
+            experimentalBlurMethod={
+              Platform.OS !== "ios" ? "dimezisBlurView" : "none"
+            }
+          >
+            <Text
+              style={{
+                fontSize: 14,
+                color: Palette.white,
+                fontFamily: FONT_FAMILY.InterRegular,
+              }}
+            >
+              Ajouter à une playlist
+            </Text>
+          </BlurView>
+        </Pressable>
+
+        {Array.isArray(extraItems) &&
+          extraItems.map((item, idx) => (
+            <Pressable
+              key={idx}
+              onPress={() => {
+                try {
+                  item?.onPress?.();
+                } finally {
+                  onClose?.();
+                }
+              }}
+            >
+              <BlurView
+                intensity={20}
+                style={{
+                  paddingHorizontal: 12,
+                  paddingVertical: 10,
+                  backgroundColor: Palette.glass,
+                  borderRadius: 12,
+                  overflow: "hidden",
+                }}
+                experimentalBlurMethod={
+                  Platform.OS !== "ios" ? "dimezisBlurView" : "none"
+                }
+              >
+                <Text
+                  style={{
+                    fontSize: 14,
+                    color: Palette.white,
+                    fontFamily: FONT_FAMILY.InterRegular,
+                  }}
+                >
+                  {item?.label || "Action"}
+                </Text>
+              </BlurView>
+            </Pressable>
+          ))}
+      </View>
+    </Animated.View>
+  );
+};
+
+export default MoreMenu;