99 lines
3.0 KiB
JavaScript
99 lines
3.0 KiB
JavaScript
import { useRoute } from "@react-navigation/native";
|
|
import React, { useState } from "react";
|
|
import { View } from "react-native";
|
|
import { background } from "../../assets";
|
|
import MoreMenu from "../../components/MoreMenu";
|
|
import useNavigateToMusicDetails from "../../hooks/useNavigateToMusicDetails";
|
|
import Page from "../../layouts/Page";
|
|
import { Routes } from "../../navigation";
|
|
import { navigate } from "../../navigation/NavigationService";
|
|
import { useUser } from "../../providers/UserDataProvider";
|
|
import { gutters } from "../../styles";
|
|
import MusicCard from "./components/MusicCard";
|
|
|
|
export default function AllMyList() {
|
|
const route = useRoute();
|
|
const {
|
|
title = "Mes éléments",
|
|
scope = "music",
|
|
liked = false,
|
|
} = route?.params || {};
|
|
|
|
const { userProjects, userLikedProjects, userPlaybacks, userLikedPlaybacks } =
|
|
useUser();
|
|
const navigateToMusicDetails = useNavigateToMusicDetails();
|
|
|
|
const items = (() => {
|
|
if (scope === "playback") {
|
|
return Array.isArray(liked ? userLikedPlaybacks : userPlaybacks)
|
|
? liked
|
|
? userLikedPlaybacks
|
|
: userPlaybacks
|
|
: [];
|
|
}
|
|
// music (projects)
|
|
return Array.isArray(liked ? userLikedProjects : userProjects)
|
|
? liked
|
|
? userLikedProjects
|
|
: userProjects
|
|
: [];
|
|
})();
|
|
|
|
const [menuPosition, setMenuPosition] = useState(null);
|
|
const [showMenu, setShowMenu] = useState(false);
|
|
const [selectedProjectId, setSelectedProjectId] = useState(null);
|
|
|
|
const onPressItem = (item) => {
|
|
if (scope === "playback") {
|
|
navigate(Routes.Playbacks, { projectId: item.id });
|
|
} else {
|
|
navigateToMusicDetails({
|
|
projectId: item.id,
|
|
songUrl: item?.songUrl,
|
|
});
|
|
}
|
|
};
|
|
|
|
return (
|
|
<Page
|
|
headerType="NAVIGATION"
|
|
backgroundImg={background.libraryBG}
|
|
title={title}
|
|
contentContainerStyle={{ paddingBottom: gutters * 2 }}
|
|
>
|
|
<View style={{ flex: 1 }}>
|
|
<View style={{ gap: 10 }}>
|
|
{Array.isArray(items) &&
|
|
items.map((item) => (
|
|
<MusicCard
|
|
key={item.id}
|
|
title={item?.title || "Sans titre"}
|
|
imageUri={item?.coverUrl || null}
|
|
subtitle={item?.userName}
|
|
projectId={item?.id}
|
|
likedBy={item?.likedBy || []}
|
|
onPress={() => onPressItem(item)}
|
|
onPressMore={(posTop) => {
|
|
setSelectedProjectId(item.id);
|
|
setMenuPosition(posTop);
|
|
setShowMenu(
|
|
(prev) =>
|
|
!prev || posTop?.top !== (menuPosition?.top ?? null)
|
|
);
|
|
}}
|
|
/>
|
|
))}
|
|
<MoreMenu
|
|
visible={showMenu}
|
|
top={menuPosition?.top ?? 0}
|
|
position={menuPosition}
|
|
onClose={() => setShowMenu(false)}
|
|
inPlaylist={false}
|
|
projectId={selectedProjectId}
|
|
/>
|
|
</View>
|
|
</View>
|
|
</Page>
|
|
);
|
|
}
|