diff --git a/src/screens/LandingPage.js b/src/screens/LandingPage.js
index ba5c0a1..35d1491 100644
--- a/src/screens/LandingPage.js
+++ b/src/screens/LandingPage.js
@@ -1,96 +1,108 @@
import AsyncStorage from '@react-native-async-storage/async-storage'
-import { useNavigation } from '@react-navigation/native'
-import { useCallback, useEffect, useState } from 'react'
-import { Image, Platform, StyleSheet, Text, TouchableOpacity, View } from 'react-native'
+import { useCallback, useEffect, useRef, useState } from 'react'
+import {
+ ActivityIndicator,
+ Image,
+ Platform,
+ StyleSheet,
+ Text,
+ TouchableOpacity,
+ View,
+} from 'react-native'
import { background, icons } from '../assets'
import EntryJingle from '../components/EntryJingle'
import FullscreenIntroVideo from '../components/FullscreenIntroVideo'
-import GradientButton from '../components/GradientButton'
import { videosRef } from '../config/firebase'
import useDataFromRef from '../hooks/useDataFromRef'
import Page from '../layouts/Page'
import { Routes } from '../navigation'
+import { navigate, reset } from '../navigation/NavigationService'
import { useUser } from '../providers/UserDataProvider'
import { Palette } from '../styles'
import { FONT_FAMILY } from '../styles/Fonts'
-import { BlurView } from 'expo-blur'
const LANGUAGE_STORAGE_KEY = 'preferredLanguage'
export default function LandingPage() {
- const navigation = useNavigation()
const { currentUID } = useUser()
const [videoUrl, setVideoUrl] = useState(null)
const [selectedLanguage, setSelectedLanguage] = useState(null)
- const [hasLoadedPreferredLanguage, setHasLoadedPreferredLanguage] = useState(false)
- const [showFreeCreditsPopup, setShowFreeCreditsPopup] = useState(false)
+ const continuationHandledRef = useRef(false)
const isAuthenticated = !!currentUID
- const handleSelectLanguage = useCallback((language) => {
- setSelectedLanguage(language)
- AsyncStorage.setItem(LANGUAGE_STORAGE_KEY, language).catch((error) => {
- console.warn('LandingPage: failed to persist language', error)
- })
- }, [])
-
- const handleLaunchAdventure = useCallback(() => {
- if (isAuthenticated) {
- navigation.navigate(Routes.BottomTab, {
- screen: Routes.HomeStack,
- params: { screen: Routes.Home },
- })
- return
- }
- navigation.navigate(Routes.Register)
- }, [isAuthenticated, navigation])
-
- const handleOpenSubscriptions = useCallback(() => {
- navigation.navigate(Routes.Payments)
- }, [navigation])
-
- const { data: video } = useDataFromRef({
- ref: videosRef.doc('fr'),
+ const { data: welcomeVideo, loading: welcomeVideoLoading } = useDataFromRef({
+ ref: selectedLanguage ? videosRef.doc(selectedLanguage) : null,
+ initialState: null,
simpleRef: true,
+ condition: !!selectedLanguage,
+ refreshArray: [selectedLanguage],
})
- useEffect(() => {
- let isMounted = true
- AsyncStorage.getItem(LANGUAGE_STORAGE_KEY)
- .then((storedLanguage) => {
- if (storedLanguage && isMounted) {
- setSelectedLanguage(storedLanguage)
- }
- })
- .catch((error) => {
- console.warn('LandingPage: failed to load language', error)
- })
- .finally(() => {
- if (isMounted) {
- setHasLoadedPreferredLanguage(true)
- }
- })
-
- return () => {
- isMounted = false
- }
+ const openRegistration = useCallback(() => {
+ navigate(Routes.Register)
}, [])
+ const handleSelectLanguage = useCallback(async (language) => {
+ try {
+ await AsyncStorage.setItem(LANGUAGE_STORAGE_KEY, language)
+ } catch (error) {
+ console.warn('LandingPage: failed to persist language', error)
+ }
+ continuationHandledRef.current = false
+ setSelectedLanguage(language)
+ }, [])
+
+ const handleVideoClose = useCallback(() => {
+ setVideoUrl(null)
+ openRegistration()
+ }, [openRegistration])
+
useEffect(() => {
- if (currentUID) {
- setShowFreeCreditsPopup(false)
+ if (!isAuthenticated) {
return
}
- if (selectedLanguage) {
- setShowFreeCreditsPopup(true)
+ reset({
+ index: 0,
+ routes: [
+ {
+ name: Routes.BottomTab,
+ params: {
+ screen: Routes.HomeStack,
+ params: { screen: Routes.Home },
+ },
+ },
+ ],
+ })
+ }, [isAuthenticated])
+
+ useEffect(() => {
+ if (
+ !selectedLanguage ||
+ welcomeVideoLoading ||
+ continuationHandledRef.current ||
+ isAuthenticated
+ ) {
+ return
}
- }, [currentUID, selectedLanguage])
+
+ continuationHandledRef.current = true
+ const nextVideoUrl =
+ Platform.OS === 'web'
+ ? welcomeVideo?.registrationIntroWeb
+ : welcomeVideo?.registrationIntro
+
+ if (typeof nextVideoUrl === 'string' && nextVideoUrl.trim().length > 0) {
+ setVideoUrl(nextVideoUrl)
+ return
+ }
+
+ openRegistration()
+ }, [isAuthenticated, openRegistration, selectedLanguage, welcomeVideo, welcomeVideoLoading])
return (
<>
-
+
@@ -120,62 +132,13 @@ export default function LandingPage() {
)}
- {selectedLanguage && (
-
- setVideoUrl(video?.introWeb)}
- containerStyle={styles.actionButton}
- />
-
- setVideoUrl(Platform.OS === 'web' ? video?.landingWeb : video?.landing)
- }
- containerStyle={styles.actionButton}
- />
-
- {!isAuthenticated ? (
-
- ) : null}
- {showFreeCreditsPopup && (
-
-
-
- 10 crédits offert
- pour 1 parcours gratuit !
-
- setShowFreeCreditsPopup(false)}
- accessibilityRole="button"
- accessibilityLabel="Fermer le message des crédits offerts"
- style={styles.freeCreditsClose}
- >
-
-
-
-
- )}
-
- )}
+ {selectedLanguage && welcomeVideoLoading ? (
+
+ ) : null}
- setVideoUrl(null)} />
+
>
)
}
@@ -213,47 +176,4 @@ const styles = StyleSheet.create({
color: Palette.white,
fontFamily: FONT_FAMILY.InterSemiBold,
},
- actions: {
- width: '100%',
- maxWidth: 320,
- gap: 16,
- },
- actionButton: {
- width: '100%',
- },
- freeCreditsCard: {
- width: '100%',
- borderRadius: 18,
- paddingVertical: 14,
- paddingHorizontal: 20,
- overflow: 'hidden',
- },
- freeCreditsContent: {
- flexDirection: 'row',
- alignItems: 'center',
- gap: 12,
- },
- freeCreditsTextContainer: {
- flex: 1,
- gap: 2,
- },
- freeCreditsTitle: {
- fontSize: 16,
- color: Palette.white,
- fontFamily: FONT_FAMILY.InterSemiBold,
- },
- freeCreditsSubtitle: {
- fontSize: 13,
- color: Palette.white,
- fontFamily: FONT_FAMILY.InterRegular,
- },
- freeCreditsClose: {
- padding: 6,
- marginLeft: 6,
- },
- freeCreditsCloseIcon: {
- width: 14,
- height: 14,
- tintColor: Palette.grayMid,
- },
})
diff --git a/src/screens/Splash.js b/src/screens/Splash.js
index dfdb01b..8dbc4ce 100644
--- a/src/screens/Splash.js
+++ b/src/screens/Splash.js
@@ -6,7 +6,6 @@ import { Routes } from '../navigation'
import { SplashAnimationContext } from '../providers/SplashAnimationProvider'
import { UserDataContext } from '../providers/UserDataProvider'
-import { getRouteAfterAuthentication } from '../utils/registrationFlow'
export default ({ navigation }) => {
const { setCurrentUserData } = useContext(UserDataContext)
@@ -29,7 +28,11 @@ export default ({ navigation }) => {
index: 0,
routes: [
{
- name: getRouteAfterAuthentication(user),
+ name: Routes.BottomTab,
+ params: {
+ screen: Routes.HomeStack,
+ params: { screen: Routes.Home },
+ },
},
],
})