fix: resolve own todos, code cleanup

src/libs/Navigation/AppNavigator/index.tsx

@@ -1,14 +1,13 @@
 import React, {lazy, memo, Suspense, useEffect, useState} from 'react';
 import {preload, register} from 'react-native-bundle-splitter';
-import lazyRetry from '@src/utils/lazyRetry';
+import lazyRetry, {retryImport} from '@src/utils/lazyRetry';
 
-// const AuthScreens = lazy(() => lazyRetry(() => import('./AuthScreens')));
 const PublicScreens = lazy(() => lazyRetry(() => import('./PublicScreens')));
 
+const AUTH_SCREENS = 'AuthScreens';
 const AuthScreens = register({
-    name: 'AuthScreens',
-    // TODO: add retry logic
-    loader: () => import('./AuthScreens'),
+    name: AUTH_SCREENS,
+    loader: () => retryImport(() => import('./AuthScreens')),
 });
 
 type AppNavigatorProps = {
@@ -20,10 +19,10 @@ function AppNavigator({authenticated}: AppNavigatorProps) {
     const [canNavigateToProtectedRoutes, setNavigateToProtectedRoutes] = useState(false);
 
     useEffect(() => {
-        // Preload Auth Screens to be sure navigator can be mounted synchronously to avoid problems
-        // described in https://github.com/Expensify/App/issues/44600
+        // Preload Auth Screens in advance to be sure that navigator can be mounted synchronously
+        // to avoid problems described in https://github.com/Expensify/App/issues/44600
         preload()
-            .component('AuthScreens')
+            .component(AUTH_SCREENS)
             .then(() => {
                 setNavigateToProtectedRoutes(true);
             });

src/utils/lazyRetry.ts

@@ -5,15 +5,16 @@ type Import<T> = Promise<{default: T}>;
 type ComponentImport<T> = () => Import<T>;
 
 /**
+ * Common retry mechanism for importing components.
+ *
  * Attempts to lazily import a React component with a retry mechanism on failure.
  * If the initial import fails the function will refresh the page once and retry the import.
  * If the import fails again after the refresh, the error is propagated.
  *
  * @param componentImport - A function that returns a promise resolving to a lazily imported React component.
  * @returns A promise that resolves to the imported component or rejects with an error after a retry attempt.
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const lazyRetry = function <T extends ComponentType<any>>(componentImport: ComponentImport<T>): Import<T> {
+function retryImport<T>(componentImport: ComponentImport<T>): Import<T> {
     return new Promise((resolve, reject) => {
         // Retrieve the retry status from sessionStorage, defaulting to 'false' if not set
         const hasRefreshed = JSON.parse(sessionStorage.getItem(CONST.SESSION_STORAGE_KEYS.RETRY_LAZY_REFRESHED) ?? 'false') as boolean;
@@ -37,6 +38,12 @@ const lazyRetry = function <T extends ComponentType<any>>(componentImport: Compo
                 }
             });
     });
+}
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const lazyRetry = function <T extends ComponentType<any>>(componentImport: ComponentImport<T>): Import<T> {
+    return retryImport(componentImport);
 };
 
 export default lazyRetry;
+export {retryImport};