Merge pull request Expensify#65221 from Krishna2323/krishna2323/issue/64914

Author: flodnv

src/components/Lottie/index.tsx

@@ -94,7 +94,13 @@ function Lottie({source, webStyle, shouldLoadAfterInteractions, ...props}: Props
     // we'll just render an empty view as the fallback to prevent
     // 1. heavy rendering, see issues: https://github.com/Expensify/App/issues/34696 and https://github.com/Expensify/App/issues/47273
     // 2. lag on react navigation transitions, see issue: https://github.com/Expensify/App/issues/44812
-    if (isError || appState.isBackground || !animationFile || splashScreenState !== CONST.BOOT_SPLASH_STATE.HIDDEN || (!isInteractionComplete && shouldLoadAfterInteractions)) {
+    if (
+        isError ||
+        appState.isBackground ||
+        !animationFile ||
+        splashScreenState !== CONST.BOOT_SPLASH_STATE.HIDDEN ||
+        ((!isInteractionComplete || hasNavigatedAway) && shouldLoadAfterInteractions)
+    ) {
         return (
             <View
                 style={[aspectRatioStyle, props.style]}

src/components/Section/index.tsx

@@ -159,6 +159,7 @@ function Section({
                                 webStyle={styles.h100}
                                 autoPlay
                                 loop
+                                shouldLoadAfterInteractions={shouldUseNarrowLayout}
                             />
                         ) : (
                             <ImageSVG