navigate to home instead of floàw

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 (
+      <Portal>
+        <View style={styles.webOverlay} pointerEvents="box-none">
+          <Pressable
+            onPress={onClose}
+            style={StyleSheet.absoluteFill}
+            pointerEvents="auto"
+          />
+          <BlurView intensity={40} tint="dark" style={styles.webModalCard}>
+            {children}
+          </BlurView>
+        </View>
+      </Portal>
+    );
+  }
+
   return (
     <ActionSheet
       containerStyle={{ backgroundColor: Palette.tran }}
@@ -17,7 +41,8 @@ const AppActionSheet = ({ children, ...props }) => {
         width: 50,
         zIndex: 2,
       }}
-      {...props}
+      onClose={onClose}
+      {...sheetProps}
     >
       <BlurView
         intensity={Platform.OS === "ios" || isWeb ? 20 : 10}
@@ -41,3 +66,21 @@ const AppActionSheet = ({ children, ...props }) => {
 };
 
 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,
+  },
+});

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 = ({
       <View style={styles.blurContainer}>
         <BlurView
           intensity={Platform.select({
-            ios: 40,
+            ios: 80,
-            android: 60,
+            android: 100,
-            web: 30,
+            web: 100,
           })}
           tint={"dark"}
           style={{ flex: 1, padding: 6 }}

src/navigation/BottomTab.js

@@ -23,7 +23,7 @@ export const BottomTabScreen = () => {
     <Motion.Image
       resizeMode={"contain"}
       animate={{
-        tintColor: focused ? Palette.white : "#8B8883",
+        tintColor: focused ? Palette.white : "#cacacaff",
       }}
       transition={{ type: "spring", damping: 18, mass: 0.7 }}
       style={[

src/navigation/TabBar.js

@@ -109,7 +109,7 @@ const TabBar = ({ state = {}, descriptors = {}, navigation = {} }) => {
                     <Text
                       style={{
                         fontSize: isWeb ? 14 : 10,
-                        color: isFocused ? Palette.white : "#8B8883",
+                        color: isFocused ? Palette.white : "#cacacaff",
                         fontFamily: FONT_FAMILY.HelveticaNeueRegular,
                         marginTop: 2,
                       }}

src/screens/Home/Home.js

@@ -70,7 +70,7 @@ const Home = () => {
     if (!project?.id) return;
     selectProject(project.id);
     setActiveStageIndex(findFirstUnlockedStageIndex(project));
-    navigate(Routes.FlowSelection);
+    navigate(Routes.Home);
   };
 
   const stageStates = useMemo(

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 React, { useMemo, useState } from "react";
-import MusicCard from "../Library/components/MusicCard";
+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);
             }}
           />
         </View>

src/screens/Studio/GeneratingSong.js

@@ -206,7 +206,7 @@ const GeneratingSong = () => {
   return (
     <Page headerType="NONE" backgroundImg={background.studioBG2}>
       <MusicLandHeader
-        onPressBack={() => navigate(Routes.FlowSelection)}
+        onPressBack={() => navigate(Routes.Home)}
         progress={63}
       />
       <View style={{ flex: 1, marginTop: 16 }}>

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}
       />

src/screens/Writing/Lyrics.js

@@ -1,23 +1,17 @@
-import { View, ScrollView, Alert } from "react-native";
+import React, { useCallback, useMemo, useRef, useState } from "react";
-import React, {
+import { Alert, ScrollView, View } from "react-native";
-  useMemo,
+import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
-  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 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 (
     <Page headerType="NONE">
       <MusicLandHeader
-        onPressBack={() => navigate(Routes.FlowSelection)}
+        onPressBack={() => navigate(Routes.Home)}
         progress={95}
       />
       <View

src/screens/cover/ValidateCover.js

@@ -38,7 +38,7 @@ const ValidateCover = () => {
       await updateProjectData({
         coverUrl: selectedProject?.cover?.result,
       });
-      navigate(Routes.FlowSelection);
+      navigate(Routes.Home);
     } catch (e) {
       console.log(e);
     } finally {