title: React Navigation ReferenceError: Can't find variable: isSelectionModeEnabled
body: <p>I'm using React Navigation in a react-native app. So I followed the docs at <a href="https://reactnavigation.org/docs/custom-android-back-button-handling/" rel="nofollow noreferrer">https://reactnavigation.org/docs/custom-android-back-button-handling/</a> to implement Custom Android back button behavior using this snippet.</p>
  <p>Screen One.js</p>
  <pre><code>import React, {useCallback} from 'react';
  import {useFocusEffect} from '@react-navigation/native';
  import {
   View,
   Text,
   BackHandler,
  } from 'react-native';
  
  export function ScreenOne({navigation}) {
   
   useFocusEffect(
     useCallback(() =&gt; {
       const onBackPress = () =&gt; {
         if (isSelectionModeEnabled()) {
           disableSelectionMode();
           return true;
         } else {
           return false;
         }
       };
  
       BackHandler.addEventListener('hardwareBackPress', onBackPress);
  
       return () =&gt;
         BackHandler.removeEventListener('hardwareBackPress', onBackPress);
     }, [isSelectionModeEnabled, disableSelectionMode])
   );
  
   return (
     &lt;View&gt;
       &lt;Text&gt;Demo&lt;/Text&gt;
     &lt;/View&gt;
   )
  }
  </code></pre>
  <p>Stack.js</p>
  <pre><code>import React from 'react';
  import {createStackNavigator, HeaderBackButton} from '@react-navigation/stack';
  import {
    ScreenOne,
    ScreenTwo,
  } from '../screens';
  
  const Stack = createStackNavigator();
  
  function AppStack() {
    return (
      &lt;Stack.Navigator&gt;
        &lt;Stack.Screen
          name=&quot;ScreenTwo&quot;
          component={ScreenTwo}
          options={{headerShown: false}}
        /&gt;
        &lt;Stack.Screen
          name=&quot;ScreenOne&quot;
          component={ScreenOne}
          options={({navigation}) =&gt; ({
            headerShown: true,
            headerLeft: () =&gt; (
              &lt;HeaderBackButton
                onPress={() =&gt; {
                  navigation.replace('ScreenTwo');
                }}
              /&gt;
            ),
          })}
        /&gt;
      &lt;/Stack.Navigator&gt;
    );
  }
  
  export default AppStack;
  </code></pre>
  <p>RootNavigation.js</p>
  <pre><code>import {createRef} from 'react';
  
  export const isReadyRef = createRef();
  export const navigationRef = createRef();
  
  export function navigate(name, params) {
    navigationRef.current?.navigate(name, params);
  }
  
  export function goBack() {
    navigationRef.current?.goBack();
  }
  </code></pre>
  <p>App.js</p>
  <pre><code>import 'react-native-gesture-handler';
  import React from 'react';
  import {NavigationContainer} from '@react-navigation/native';
  import Stack from './navigators/Stack';
  import {navigationRef} from './navigators/RootNavigation';
  import {AuthContext} from './context';
  
  const App = () =&gt; {
    return (
      &lt;AuthContext.Provider&gt;
        &lt;NavigationContainer ref={navigationRef}&gt;
          &lt;Stack /&gt;
        &lt;/NavigationContainer&gt;
      &lt;/AuthContext.Provider&gt;
    );
  };
  
  export default App;
  
  </code></pre>
  <p>When I press the app back button, I keep getting this error:</p>
  <p><strong>ReferenceError: Can't find variable: isSelectionModeEnabled</strong></p>