(BSR) fix(global): keep splashscreen when no network at startup

pass-culture · Dec 24, 2024 · a758018 · a758018
1 parent 2c80bd2
commit a758018
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 39 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -81,25 +81,24 @@ const App: FunctionComponent = function () {
   }, [])
 
   return (
-    <RemoteConfigProvider>
-      <ReactQueryClientProvider>
-        <ThemeProvider theme={theme}>
-          <SafeAreaProvider>
-            <ErrorBoundary FallbackComponent={AsyncErrorBoundaryWithoutNavigation}>
-              <AnalyticsInitializer>
-                {/* All react-query calls should be nested inside NetInfoWrapper to ensure the user has internet connection */}
-                <NetInfoWrapper>
-                  <SettingsWrapper>
-                    <AuthWrapper>
-                      <LocationWrapper>
-                        <AccessibilityFiltersWrapper>
-                          <FavoritesWrapper>
-                            <SearchAnalyticsWrapper>
-                              <SearchWrapper>
-                                <SnackBarProvider>
-                                  <CulturalSurveyContextProvider>
-                                    <SubscriptionContextProvider>
-                                      <SplashScreenProvider>
+    <SplashScreenProvider>
+      <NetInfoWrapper>
+        <RemoteConfigProvider>
+          <ReactQueryClientProvider>
+            <ThemeProvider theme={theme}>
+              <SafeAreaProvider>
+                <ErrorBoundary FallbackComponent={AsyncErrorBoundaryWithoutNavigation}>
+                  <AnalyticsInitializer>
+                    <SettingsWrapper>
+                      <AuthWrapper>
+                        <LocationWrapper>
+                          <AccessibilityFiltersWrapper>
+                            <FavoritesWrapper>
+                              <SearchAnalyticsWrapper>
+                                <SearchWrapper>
+                                  <SnackBarProvider>
+                                    <CulturalSurveyContextProvider>
+                                      <SubscriptionContextProvider>
                                         <PushNotificationsWrapper>
                                           <ShareAppWrapper>
                                             <OnboardingWrapper>
@@ -111,24 +110,24 @@ const App: FunctionComponent = function () {
                                             </OnboardingWrapper>
                                           </ShareAppWrapper>
                                         </PushNotificationsWrapper>
-                                      </SplashScreenProvider>
-                                    </SubscriptionContextProvider>
-                                  </CulturalSurveyContextProvider>
-                                </SnackBarProvider>
-                              </SearchWrapper>
-                            </SearchAnalyticsWrapper>
-                          </FavoritesWrapper>
-                        </AccessibilityFiltersWrapper>
-                      </LocationWrapper>
-                    </AuthWrapper>
-                  </SettingsWrapper>
-                </NetInfoWrapper>
-              </AnalyticsInitializer>
-            </ErrorBoundary>
-          </SafeAreaProvider>
-        </ThemeProvider>
-      </ReactQueryClientProvider>
-    </RemoteConfigProvider>
+                                      </SubscriptionContextProvider>
+                                    </CulturalSurveyContextProvider>
+                                  </SnackBarProvider>
+                                </SearchWrapper>
+                              </SearchAnalyticsWrapper>
+                            </FavoritesWrapper>
+                          </AccessibilityFiltersWrapper>
+                        </LocationWrapper>
+                      </AuthWrapper>
+                    </SettingsWrapper>
+                  </AnalyticsInitializer>
+                </ErrorBoundary>
+              </SafeAreaProvider>
+            </ThemeProvider>
+          </ReactQueryClientProvider>
+        </RemoteConfigProvider>
+      </NetInfoWrapper>
+    </SplashScreenProvider>
   )
 }
 

diff --git a/src/libs/network/NetInfoWrapper.tsx b/src/libs/network/NetInfoWrapper.tsx
@@ -6,6 +6,7 @@ import { onlineManager } from 'react-query'
 
 import { analytics } from 'libs/analytics'
 import { useNetInfo } from 'libs/network/useNetInfo'
+import { useSplashScreenContext } from 'libs/splashscreen'
 import { SNACK_BAR_TIME_OUT, useSnackBarContext } from 'ui/components/snackBar/SnackBarContext'
 
 export const NetInfoWrapper = memo(function NetInfoWrapper({
@@ -15,9 +16,10 @@ export const NetInfoWrapper = memo(function NetInfoWrapper({
 }) {
   const networkInfo = useNetInfo()
   const { showInfoSnackBar } = useSnackBarContext()
+  const isConnected = !!networkInfo.isConnected && !!networkInfo.isInternetReachable
+  const { isSplashScreenHidden } = useSplashScreenContext()
 
   useEffect(() => {
-    const isConnected = !!networkInfo.isConnected && !!networkInfo.isInternetReachable
     onlineManager.setOnline(isConnected)
     if (isConnected === false) {
       showInfoSnackBar({
@@ -43,7 +45,11 @@ export const NetInfoWrapper = memo(function NetInfoWrapper({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [networkInfo.type])
 
-  return <NetInfoContext.Provider value={networkInfo}>{children}</NetInfoContext.Provider>
+  return (
+    <NetInfoContext.Provider value={networkInfo}>
+      {!isSplashScreenHidden && !isConnected ? null : children}
+    </NetInfoContext.Provider>
+  )
 })
 
 const isWeb = Platform.OS === 'web'