diff --git a/src/components/SidePanel/HelpComponents/HelpContent.tsx b/src/components/SidePanel/HelpComponents/HelpContent.tsx
index b6c0c91f5821..8c2c85ca6f03 100644
--- a/src/components/SidePanel/HelpComponents/HelpContent.tsx
+++ b/src/components/SidePanel/HelpComponents/HelpContent.tsx
@@ -2,6 +2,7 @@ import {findFocusedRoute} from '@react-navigation/native';
 import React, {useEffect, useMemo, useRef, useState} from 'react';
 import {ScrollView} from 'react-native-gesture-handler';
 import {useOnyx} from 'react-native-onyx';
+import FullScreenLoadingIndicator from '@components/FullscreenLoadingIndicator';
 // Importing from the react-native-gesture-handler package instead of the `components/ScrollView` to fix scroll issue:
 // https://github.com/react-native-modal/react-native-modal/issues/236
 import HeaderGap from '@components/HeaderGap';
@@ -13,7 +14,6 @@ import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useRootNavigationState from '@hooks/useRootNavigationState';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {normalizedConfigs} from '@libs/Navigation/linkingConfig/config';
-import {navigationRef} from '@libs/Navigation/Navigation';
 import {getOriginalMessage, isMoneyRequestAction} from '@libs/ReportActionsUtils';
 import {getHelpPaneReportType} from '@libs/ReportUtils';
 import {getExpenseType} from '@libs/TransactionUtils';
@@ -32,13 +32,13 @@ function HelpContent({closeSidePanel}: HelpContentProps) {
     const {isExtraLargeScreenWidth} = useResponsiveLayout();
     const [expandedIndex, setExpandedIndex] = useState(0);
 
-    const {params, routeName} = useRootNavigationState(() => {
-        const focusedRoute = findFocusedRoute(navigationRef.getRootState());
+    const {params, routeName, currentState} = useRootNavigationState((rootState) => {
+        const focusedRoute = findFocusedRoute(rootState);
         setExpandedIndex(0);
-
         return {
             routeName: (focusedRoute?.name ?? '') as Screen,
             params: focusedRoute?.params as Record<string, string>,
+            currentState: rootState,
         };
     });
 
@@ -90,13 +90,17 @@ function HelpContent({closeSidePanel}: HelpContentProps) {
                 shouldShowCloseButton={isExtraLargeScreenWidth}
                 shouldDisplayHelpButton={false}
             />
-            <ScrollView
-                style={[styles.ph5, styles.pb5]}
-                userSelect="auto"
-                scrollIndicatorInsets={{right: Number.MIN_VALUE}}
-            >
-                {getHelpContent(styles, route, isProduction, expandedIndex, setExpandedIndex)}
-            </ScrollView>
+            {currentState === undefined ? (
+                <FullScreenLoadingIndicator style={[styles.flex1, styles.pRelative]} />
+            ) : (
+                <ScrollView
+                    style={[styles.ph5, styles.pb5]}
+                    userSelect="auto"
+                    scrollIndicatorInsets={{right: Number.MIN_VALUE}}
+                >
+                    {getHelpContent(styles, route, isProduction, expandedIndex, setExpandedIndex)}
+                </ScrollView>
+            )}
         </>
     );
 }