diff --git a/src/components/MoreComponents.tsx b/src/components/MoreComponents.tsx index be5251e7..63d490e5 100644 --- a/src/components/MoreComponents.tsx +++ b/src/components/MoreComponents.tsx @@ -64,17 +64,17 @@ export default function MoreComponents({ totalRequests.current < MAX_TOTAL_REQUESTS ); - const attempt = useCallback(() => { + const attempt = useCallback(() => { + const handleError = () => { + setTimeout(() => { + attempt(); + }, RETRY_DELAY_IN_SECONDS * 1000); + }; if (attemptsPerRequest.current < MAX_ATTEMPTS_PER_REQUEST) { if (totalRequests.current < MAX_TOTAL_REQUESTS) { attemptsPerRequest.current += 1; totalRequests.current += 1; setState({ isLoading: true }); - const handleError = () => { - setTimeout(() => { - attempt(); - }, RETRY_DELAY_IN_SECONDS * 1000); - }; getNextComponent( initialOffset + (indexToLoad - 1) * itemsPerRequest, itemsPerRequest, @@ -88,27 +88,30 @@ export default function MoreComponents({ ...state, components: updatedComponents, indexLoaded: indexToLoad, + isLoading: false, + ...isFinished && { lastIndexToLoad: indexToLoad }, }; }); - if (isFinished) { - setState({ lastIndexToLoad: indexToLoad }); - } attemptsPerRequest.current = 0; } else { handleError(); } }) - .catch(handleError) - .finally(() => setState({ isLoading: false })); + .catch(handleError); } else { console.error( `Max total attempts reached (${MAX_TOTAL_REQUESTS})` ); + setState({ isLoading: false }); } } else { console.error( `Max attempts per request reached ${MAX_ATTEMPTS_PER_REQUEST}` ); + setState({ + isLoading: false, + haveAttemptsPerRequestBeenExceeded: true, + }); } }, [ setState, diff --git a/src/state/MoreComponentsState.ts b/src/state/MoreComponentsState.ts index 5cf54c63..78b07d4f 100644 --- a/src/state/MoreComponentsState.ts +++ b/src/state/MoreComponentsState.ts @@ -8,6 +8,7 @@ export interface MoreComponentsStateForKey { indexLoaded: number isLoading: boolean lastIndexToLoad?: number + haveAttemptsPerRequestBeenExceeded: boolean components: JSX.Element[] } @@ -16,6 +17,7 @@ export const createInitialStateForKey = indexToView: 0, indexLoaded: 0, isLoading: false, + haveAttemptsPerRequestBeenExceeded: false, components: [], });