diff --git a/src/components/AppActionSheet.js b/src/components/AppActionSheet.js
index b1a39ff..51efc1a 100644
--- a/src/components/AppActionSheet.js
+++ b/src/components/AppActionSheet.js
@@ -1,13 +1,37 @@
+import { Portal } from "@gorhom/portal";
import { BlurView } from "expo-blur";
import React from "react";
-import { Platform } from "react-native";
+import { Platform, Pressable, StyleSheet, View } from "react-native";
import ActionSheet from "react-native-actions-sheet";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import { isWeb } from "../hooks/useLayoutType";
import { gutters, Palette } from "../styles";
-const AppActionSheet = ({ children, ...props }) => {
+const AppActionSheet = ({
+ children,
+ webModal = false,
+ onClose = () => {},
+ ...sheetProps
+}) => {
const insets = useSafeAreaInsets();
+
+ if (isWeb && webModal) {
+ return (
+
+
+
+
+ {children}
+
+
+
+ );
+ }
+
return (
{
width: 50,
zIndex: 2,
}}
- {...props}
+ onClose={onClose}
+ {...sheetProps}
>
{
};
export default AppActionSheet;
+
+const styles = StyleSheet.create({
+ webOverlay: {
+ ...StyleSheet.absoluteFillObject,
+ alignItems: "center",
+ justifyContent: "center",
+ padding: 24,
+ backgroundColor: "rgba(0, 0, 0, 0.55)",
+ },
+ webModalCard: {
+ width: 480,
+ maxWidth: "90%",
+ borderRadius: 28,
+ overflow: "hidden",
+ backgroundColor: Palette.glass,
+ padding: 32,
+ },
+});
diff --git a/src/components/ItemContainer/ItemContainer.js b/src/components/ItemContainer/ItemContainer.js
index 4a1066c..f532ec3 100644
--- a/src/components/ItemContainer/ItemContainer.js
+++ b/src/components/ItemContainer/ItemContainer.js
@@ -1,9 +1,9 @@
-import { View, StyleSheet, Platform } from "react-native";
-import React from "react";
-import BorderGradient from "../BorderGradient/BorderGradient";
-import { BlurView } from "expo-blur";
-import { responsiveHeight } from "react-native-responsive-dimensions";
import { useKeyboard } from "@react-native-community/hooks";
+import { BlurView } from "expo-blur";
+import React from "react";
+import { Platform, StyleSheet, View } from "react-native";
+import { responsiveHeight } from "react-native-responsive-dimensions";
+import BorderGradient from "../BorderGradient/BorderGradient";
const ItemContainer = ({
height = responsiveHeight(40),
@@ -36,9 +36,9 @@ const ItemContainer = ({
{
{
{
if (!project?.id) return;
selectProject(project.id);
setActiveStageIndex(findFirstUnlockedStageIndex(project));
- navigate(Routes.FlowSelection);
+ navigate(Routes.Home);
};
const stageStates = useMemo(
diff --git a/src/screens/Home/HomeSave.js b/src/screens/Home/HomeSave.js
index 9eb602f..8917c25 100644
--- a/src/screens/Home/HomeSave.js
+++ b/src/screens/Home/HomeSave.js
@@ -1,26 +1,25 @@
-import { View, Text, Image, Platform } from "react-native";
-import React, { useMemo, useState } from "react";
-import Page from "../../layouts/Page";
-import { background, img } from "../../assets";
-import { responsiveHeight } from "react-native-responsive-dimensions";
-import { Palette } from "../../styles";
-import { FONT_FAMILY } from "../../styles/Fonts";
-import { navigate } from "../../navigation/NavigationService";
-import { Routes } from "../../navigation";
-import { FlatList, Alert } from "react-native";
import { BlurView } from "expo-blur";
-import { useUser } from "../../providers/UserDataProvider";
-import MusicCard from "../Library/components/MusicCard";
+import React, { useMemo, useState } from "react";
+import { Alert, FlatList, Image, Platform, Text, View } from "react-native";
+import { responsiveHeight } from "react-native-responsive-dimensions";
+import { useGlobal } from "reactn";
+import { background, img } from "../../assets";
import GradientButton from "../../components/GradientButton";
import MoreMenu from "../../components/MoreMenu";
import { projectsRef } from "../../config/firebase";
-import { useGlobal } from "reactn";
+import Page from "../../layouts/Page";
+import { Routes } from "../../navigation";
+import { navigate } from "../../navigation/NavigationService";
+import { useUser } from "../../providers/UserDataProvider";
+import { Palette } from "../../styles";
+import { FONT_FAMILY } from "../../styles/Fonts";
+import MusicCard from "../Library/components/MusicCard";
const HomeSave = () => {
const { userProjects = [], resetSelectedProject, selectProject } = useUser();
const projects = useMemo(
() => (Array.isArray(userProjects) ? userProjects : []),
- [userProjects],
+ [userProjects]
);
const [, setTooltip] = useGlobal("_tooltip");
const [menuPosition, setMenuPosition] = useState(null);
@@ -79,14 +78,14 @@ const HomeSave = () => {
likedBy={item?.likedBy || []}
onPress={() => {
selectProject(item.id);
- navigate(Routes.FlowSelection);
+ navigate(Routes.Home);
}}
onPressMore={(posTop) => {
setMenuProjectId(item.id);
setMenuPosition(posTop);
setShowMenu(
(prev) =>
- !prev || posTop?.top !== (menuPosition?.top ?? null),
+ !prev || posTop?.top !== (menuPosition?.top ?? null)
);
}}
/>
@@ -128,7 +127,7 @@ const HomeSave = () => {
},
},
],
- { cancelable: true },
+ { cancelable: true }
),
},
]}
@@ -142,7 +141,7 @@ const HomeSave = () => {
containerStyle={{ width: "80%", alignSelf: "center" }}
onPress={() => {
resetSelectedProject();
- navigate(Routes.FlowSelection);
+ navigate(Routes.Home);
}}
/>
diff --git a/src/screens/Studio/GeneratingSong.js b/src/screens/Studio/GeneratingSong.js
index 39be21f..140cce5 100644
--- a/src/screens/Studio/GeneratingSong.js
+++ b/src/screens/Studio/GeneratingSong.js
@@ -206,7 +206,7 @@ const GeneratingSong = () => {
return (
navigate(Routes.FlowSelection)}
+ onPressBack={() => navigate(Routes.Home)}
progress={63}
/>
diff --git a/src/screens/Studio/SongReady.js b/src/screens/Studio/SongReady.js
index 5569a1e..2dd521b 100644
--- a/src/screens/Studio/SongReady.js
+++ b/src/screens/Studio/SongReady.js
@@ -131,7 +131,7 @@ const SongReady = () => {
});
await player0?.pause?.();
await player1?.pause?.();
- navigate(Routes.FlowSelection);
+ navigate(Routes.Home);
} catch (e) {
console.log("Validate error", e?.message);
}
@@ -166,7 +166,7 @@ const SongReady = () => {
await player0?.pause?.();
await player1?.pause?.();
} catch {}
- navigate(Routes.FlowSelection);
+ navigate(Routes.Home);
}}
progress={63}
/>
diff --git a/src/screens/Writing/Lyrics.js b/src/screens/Writing/Lyrics.js
index b797f5f..ba57b28 100644
--- a/src/screens/Writing/Lyrics.js
+++ b/src/screens/Writing/Lyrics.js
@@ -1,23 +1,17 @@
-import { View, ScrollView, Alert } from "react-native";
-import React, {
- useMemo,
- useState,
- useCallback,
- useEffect,
- useRef,
-} from "react";
-import Page from "../../layouts/Page";
-import MusicLandHeader from "../../components/MusicLandHeader";
-import { navigate } from "../../navigation/NavigationService";
-import { gutters } from "../../styles";
+import React, { useCallback, useMemo, useRef, useState } from "react";
+import { Alert, ScrollView, View } from "react-native";
+import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
import BorderGradientButton from "../../components/BorderGradientButton";
import GradientButton from "../../components/GradientButton";
-import { Routes } from "../../navigation";
-import CustomInput from "./components/CustomInput";
import ItemContainer from "../../components/ItemContainer/ItemContainer";
+import MusicLandHeader from "../../components/MusicLandHeader";
import firebase, { projectsRef } from "../../config/firebase";
-import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
+import Page from "../../layouts/Page";
+import { Routes } from "../../navigation";
+import { navigate } from "../../navigation/NavigationService";
import { useUser } from "../../providers/UserDataProvider";
+import { gutters } from "../../styles";
+import CustomInput from "./components/CustomInput";
const Lyrics = ({ navigation }) => {
const scrollRef = useRef(null);
@@ -112,7 +106,7 @@ const Lyrics = ({ navigation }) => {
if (invalid) {
Alert.alert(
"Champs incomplets",
- "Chaque couplet et refrain doit contenir du texte.",
+ "Chaque couplet et refrain doit contenir du texte."
);
return;
}
@@ -133,7 +127,7 @@ const Lyrics = ({ navigation }) => {
normalizedOldLyrics.every(
(s, i) =>
s.type === normalizedNewLyrics[i]?.type &&
- s.lyrics === normalizedNewLyrics[i]?.lyrics,
+ s.lyrics === normalizedNewLyrics[i]?.lyrics
);
// 1) Appel de la Cloud Function de modération avant tout enregistrement
@@ -157,7 +151,7 @@ const Lyrics = ({ navigation }) => {
: null;
Alert.alert(
"Contenu interdit",
- [data?.message, quotes].filter(Boolean).join("\n\n"),
+ [data?.message, quotes].filter(Boolean).join("\n\n")
);
return; // stop here
}
@@ -165,7 +159,7 @@ const Lyrics = ({ navigation }) => {
if (data?.errorCode === "ANALYSE_FAILED") {
Alert.alert(
"Analyse indisponible",
- "Impossible de vérifier la toxicité pour le moment. Réessayez plus tard.",
+ "Impossible de vérifier la toxicité pour le moment. Réessayez plus tard."
);
return;
}
@@ -200,11 +194,11 @@ const Lyrics = ({ navigation }) => {
} catch (moderationError) {
console.log(
"Moderation call failed",
- moderationError?.message || moderationError,
+ moderationError?.message || moderationError
);
Alert.alert(
"Analyse indisponible",
- "Impossible de vérifier la toxicité pour le moment. Réessayez plus tard.",
+ "Impossible de vérifier la toxicité pour le moment. Réessayez plus tard."
);
return;
}
@@ -226,7 +220,7 @@ const Lyrics = ({ navigation }) => {
.doc(selectedProjectId)
.set(updateData, { merge: true });
}
- navigate(Routes.FlowSelection);
+ navigate(Routes.Home);
} catch (e) {
console.log(e);
Alert.alert("Erreur", "Échec de l'enregistrement dans le projet.");
@@ -247,7 +241,7 @@ const Lyrics = ({ navigation }) => {
return (
navigate(Routes.FlowSelection)}
+ onPressBack={() => navigate(Routes.Home)}
progress={95}
/>
{
await updateProjectData({
coverUrl: selectedProject?.cover?.result,
});
- navigate(Routes.FlowSelection);
+ navigate(Routes.Home);
} catch (e) {
console.log(e);
} finally {