start adventur

src/components/ConnectBtn.js

@@ -1,4 +1,3 @@
-import { Entypo } from "@expo/vector-icons";
 import { BlurView } from "expo-blur";
 import React from "react";
 import { Pressable, Text } from "react-native";
@@ -38,7 +37,6 @@ export default function ConnectBtn({ style }) {
         >
           {"Se connecter"}
         </Text>
-        <Entypo name="share-alternative" size={16} color="white" />
       </BlurView>
     </Pressable>
   );

src/screens/Home/Home.js

@@ -11,11 +11,12 @@ import { background } from "../../assets";
 import Alert from "../../components/Alert";
 import BorderGradientButton from "../../components/BorderGradientButton";
 import FeatureCarousel from "../../components/FeatureCarousel/FeatureCarousel";
+import FullscreenIntroVideo from "../../components/FullscreenIntroVideo";
 import GradientButton from "../../components/GradientButton";
 import MoreMenu from "../../components/MoreMenu";
 import ProjectDropDown from "../../components/ProjectDropDown/ProjectDropDown";
 import ShareBtn from "../../components/ShareBtn/ShareBtn";
-import { projectsRef } from "../../config/firebase";
+import { projectsRef, usersRef } from "../../config/firebase";
 import { isWeb } from "../../hooks/useLayoutType.js";
 import Page from "../../layouts/Page";
 import { navigate } from "../../navigation/NavigationService";
@@ -34,6 +35,8 @@ const Home = () => {
     selectProject,
     selectedProject,
     selectedProjectId,
+    currentUserData,
+    currentUID,
   } = useUser();
   const { setTooltip } = useMinuit();
 
@@ -98,13 +101,14 @@ const Home = () => {
     return stageStates.length - 1;
   }, [stageStates]);
 
-  const [activeStageIndex, setActiveStageIndex] =
+  const [activeStageIndex, setActiveStageIndex] = useState(preferredStageIndex);
-    useState(preferredStageIndex);
   const [menuVisible, setMenuVisible] = useState(false);
   const [menuAnchor, setMenuAnchor] = useState(null);
   const [menuProject, setMenuProject] = useState(null);
   const menuAnchorRef = useRef(null);
   const testLoaderTimeoutRef = useRef(null);
+  const [isIntroVideoVisible, setIsIntroVideoVisible] = useState(false);
+  const [hasLocalAdventureFlag, setHasLocalAdventureFlag] = useState(false);
 
   useEffect(() => {
     setActiveStageIndex((prev) => {
@@ -278,7 +282,50 @@ const Home = () => {
 
   const continueDisabled = !hasActiveProject || stageLocked || !stageRoute;
   const startDisabled = !songwriterAction?.route;
-  return (
+
+  useEffect(() => {
+    if (currentUserData?.adventureStarted) {
+      setHasLocalAdventureFlag(true);
+    }
+  }, [currentUserData?.adventureStarted]);
+
+  const persistAdventureStarted = useCallback(async () => {
+    if (!currentUID) {
+      return;
+    }
+    await usersRef
+      .doc(currentUID)
+      .set({ adventureStarted: true }, { merge: true });
+  }, [currentUID]);
+
+  const markAdventureStarted = useCallback(() => {
+    if (hasLocalAdventureFlag) {
+      return;
+    }
+    setHasLocalAdventureFlag(true);
+    persistAdventureStarted().catch((error) => {
+      console.warn("Home: adventureStarted update failed", error);
+      setHasLocalAdventureFlag(false);
+      setTooltip?.({
+        type: "error",
+        text: "Impossible de mettre à jour votre profil",
+      });
+    });
+  }, [hasLocalAdventureFlag, persistAdventureStarted, setTooltip]);
+
+  const handleStartVisit = useCallback(() => {
+    setIsIntroVideoVisible(true);
+  }, []);
+
+  const handleIntroVideoClose = useCallback(() => {
+    setIsIntroVideoVisible(false);
+    markAdventureStarted();
+  }, [markAdventureStarted]);
+
+  const adventureStarted =
+    hasLocalAdventureFlag || !!currentUserData?.adventureStarted;
+
+  return adventureStarted ? (
     <Page
       shareBtn
       headerType="NONE"
@@ -369,6 +416,27 @@ const Home = () => {
         </View>
       </View>
     </Page>
+  ) : (
+    <>
+      <Page shareBtn title="Landing Page" backgroundImg={background.homeBGWeb}>
+        <View
+          style={{
+            flex: 1,
+            justifyContent: "center",
+            alignItems: "center",
+          }}
+        >
+          <GradientButton
+            title="Commencer l'aventure MusicLand"
+            onPress={handleStartVisit}
+          />
+        </View>
+      </Page>
+      <FullscreenIntroVideo
+        visible={isIntroVideoVisible}
+        onClose={handleIntroVideoClose}
+      />
+    </>
   );
 };
 

src/screens/LandingPage.js

@@ -1,25 +1,69 @@
+import { useCallback, useState } from "react";
 import { View } from "react-native";
+import { useNavigation } from "@react-navigation/native";
 import { background } from "../assets";
+import { usersRef } from "../config/firebase";
+import FullscreenIntroVideo from "../components/FullscreenIntroVideo";
 import GradientButton from "../components/GradientButton";
 import Page from "../layouts/Page";
+import { Routes } from "../navigation/Routes";
+import { useUser } from "../providers/UserDataProvider";
 
 export default function LandingPage() {
+  const navigation = useNavigation();
+  const { currentUID } = useUser();
+  const [isVideoVisible, setIsVideoVisible] = useState(false);
+
+  const handleStartVisit = useCallback(() => {
+    setIsVideoVisible(true);
+  }, []);
+
+  const persistAdventureStarted = useCallback(async () => {
+    if (!currentUID) {
+      return;
+    }
+    await usersRef.doc(currentUID).set(
+      { adventureStarted: true },
+      { merge: true }
+    );
+  }, [currentUID]);
+
+  const handleVideoClose = useCallback(() => {
+    setIsVideoVisible(false);
+    persistAdventureStarted()
+      .catch((error) => {
+        console.warn("LandingPage: adventureStarted update failed", error);
+      })
+      .finally(() => {
+        navigation.navigate(Routes.Login);
+      });
+  }, [navigation, persistAdventureStarted]);
+
   return (
-    <Page
+    <>
-      shareBtn
+      <Page
-      connect
+        shareBtn
-      title="Landing Page"
+        connect
-      backgroundImg={background.homeBGWeb}
+        title="Landing Page"
-    >
+        backgroundImg={background.homeBGWeb}
-      <View
-        style={{
-          flex: 1,
-          justifyContent: "center",
-          alignItems: "center",
-        }}
       >
-        <GradientButton title="Commencer la visite" onPress={() => {}} />
+        <View
-      </View>
+          style={{
-    </Page>
+            flex: 1,
+            justifyContent: "center",
+            alignItems: "center",
+          }}
+        >
+          <GradientButton
+            title="Commencer la visite"
+            onPress={handleStartVisit}
+          />
+        </View>
+      </Page>
+      <FullscreenIntroVideo
+        visible={isVideoVisible}
+        onClose={handleVideoClose}
+      />
+    </>
   );
 }