Skip to content

Commit

Permalink
fix: resolve own todos, code cleanup
Browse files Browse the repository at this point in the history
  • Loading branch information
kirillzyusko committed Sep 30, 2024
1 parent fa3c56a commit 1f2db18
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 10 deletions.
15 changes: 7 additions & 8 deletions src/libs/Navigation/AppNavigator/index.tsx
Original file line number Diff line number Diff line change
@@ -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 = {
Expand All @@ -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);
});
Expand Down
11 changes: 9 additions & 2 deletions src/utils/lazyRetry.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -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};

0 comments on commit 1f2db18

Please sign in to comment.