title: Error when using toggleDrawer navigation.ToggleDrawer is not a function
body: <p>I'm currently using stack navigation on my app, but I decided to increment a Drawer for a user's menu.</p>
  <p>I managed to insert the Drawer in my pages, but some of them are a MapView content, so the user can't really drag the menu from the screen...
  So I decided to implement a button to call the ToggleDrawer function, which is presented in the <a href="https://reactnavigation.org/docs/drawer-based-navigation/" rel="nofollow noreferrer">documentation</a>. But I'm getting the error:</p>
  <blockquote>
  <p>TypeError: navigation.ToggleDrawer is not a function. (In 'navigation.ToggleDrawer()', 'navigation.ToggleDrawer' is undefined)</p>
  </blockquote>
  <p>Here is my map screen where I'm trying to insert the button in like this:</p>
  <pre><code>onPress={() =&gt; navigation.ToggleDrawer()}
  </code></pre>
  <p>If I remove the <code>&lt;any&gt;</code> from useNavitation() I receive the following:
  <code>Property 'ToggleDrawer' does not exist on type 'NavigationProp</code></p>
  <pre><code>export default function IncidentsMap() {
      const navigation = useNavigation&lt;any&gt;();
  
  
      return (
  
          &lt;View style={styles.container}&gt;
  
              {typeof location?.coords.latitude == 'number' ?
                  &lt;View style={styles.container}&gt;
                      &lt;MapView
                          provider={PROVIDER_GOOGLE}
                          style={styles.map}
                          &gt;
  
                              &lt;Callout tooltip={true} onPress={handleNavigateToIncidentDetails}&gt;
                                  &lt;View style={styles.calloutContainer}&gt;
                                      &lt;Text style={styles.calloutText}&gt;Enchente rasa&lt;/Text&gt;
                                  &lt;/View&gt;
                              &lt;/Callout&gt;
                          &lt;/Marker&gt;
                      &lt;/MapView&gt;
                      &lt;View style={styles.footer}&gt;
                          &lt;Text style={styles.footerText}&gt;Reporte um incidente&lt;/Text&gt;
                          &lt;RectButton style={styles.createFloodButton} onPress={handleNavigateToCreateIncident}&gt;
                              &lt;Feather name='plus' size={20} color={'#fff'}/&gt;
                          &lt;/RectButton&gt;
                      &lt;/View&gt;
                      &lt;View style={styles.menuContainer}&gt;
                          &lt;RectButton style={styles.menuButton} onPress={() =&gt; navigation.ToggleDrawer()}&gt;
                              &lt;Feather name='menu' size={20} color={'#fff'}/&gt;
                          &lt;/RectButton&gt;
                      &lt;/View&gt;
                  &lt;/View&gt; : &lt;View style={styles.container}&gt;
                      &lt;Text&gt;Carregando ... Carregando ... Carregando ... Carregando ... Carregando ...
                          Carregando &lt;/Text&gt;
                  &lt;/View&gt;}
          &lt;/View&gt;
      );
  }
  </code></pre>
  <p>Here is my routes file:</p>
  <pre><code>export default function Routes() {
      return(
          &lt;NavigationContainer&gt;
              &lt;Navigator screenOptions={{headerShown: false}}&gt;
                  &lt;Screen name={'MyDrawer'} component={DrawerImported}/&gt;
                  {/*&lt;Screen name=&quot;GetLocationTest&quot; component={GetLocationTest}/&gt;*/}
                  &lt;Screen name=&quot;WelcomePage&quot; component={WelcomePage}/&gt;
                  &lt;Screen name=&quot;WelcomePageStep2&quot; component={WelcomePageStep2}/&gt;
                  &lt;Screen name=&quot;IncidentsMap&quot; component={IncidentsMap}/&gt;
                  &lt;Screen name=&quot;IncidentDetails&quot;
                          component={IncidentDetails}
                          options={{
                              headerShown: true,
                              header: () =&gt; &lt;Header showCancel={false} title=&quot;Incidente&quot;/&gt;
                          }}
                  /&gt;
                  &lt;Screen name=&quot;SelectIncidentLocation&quot; component={SelectIncidentLocation}
                          options={{
                              headerShown: true,
                              header: () =&gt; &lt;Header title=&quot;Selecione no Mapa&quot; showCancel={false}/&gt;
                          }}
                  /&gt;
                  &lt;Screen name=&quot;IncidentData&quot; component={IncidentData}/&gt;
                  &lt;Screen name=&quot;Profile&quot; component={Profile}/&gt;
  
                  &lt;Screen name=&quot;Settings&quot; component={Settings}
                          options={{
                      headerShown: true,
                      header: () =&gt; &lt;Header title=&quot;Configurações&quot; showCancel={false}/&gt;
                  }}
                  /&gt;
  
  
              &lt;/Navigator&gt;
          &lt;/NavigationContainer&gt;
      )
  }
  </code></pre>
  <p>Here is my DrawerFile:</p>
  <pre><code>
  interface Props {
      navigation: any
  }
  export function DrawerImported(props) {
  
      const paperTheme = useTheme();
  
      function CustomDrawerContent(props) {
          return (
              &lt;View style={{flex:1}}&gt;
                  &lt;DrawerContentScrollView {...props}&gt;
                      &lt;View style={styles.drawerContent}&gt;
                          &lt;View style={styles.userInfoSection}&gt;
                              &lt;View style={{flexDirection:'row',marginTop: 15}}&gt;
                                  &lt;Avatar.Image
                                      source={{
                                          uri: 'https://avatars.githubusercontent.com/u/47571680?v=4'
                                      }}
                                      size={50}
                                  /&gt;
                                  &lt;View style={{marginLeft:15, flexDirection:'column'}}&gt;
                                      &lt;Title style={styles.title}&gt;Vinícius Melo&lt;/Title&gt;
                                  &lt;/View&gt;
                              &lt;/View&gt;
                          &lt;/View&gt;
  
                          &lt;View style={styles.drawerSection}&gt;
                              &lt;DrawerItem
                                  icon={({color, size}) =&gt; (
                                      &lt;Feather
                                          name=&quot;map&quot;
                                          color={color}
                                          size={size}
                                      /&gt;
                                  )}
                                  label=&quot;Mapa da região&quot;
                                  onPress={() =&gt; {props.navigation.navigate('IncidentsMap')}}
                              /&gt;
                              &lt;DrawerItem
                                  icon={({color, size}) =&gt; (
                                      &lt;Feather
                                          name=&quot;user&quot;
                                          color={color}
                                          size={size}
                                      /&gt;
                                  )}
                                  label=&quot;Profile&quot;
                                  onPress={() =&gt; {props.navigation.navigate('Profile')}}
                              /&gt;
                              &lt;DrawerItem
                                  icon={({color, size}) =&gt; (
                                      &lt;Feather
                                          name=&quot;settings&quot;
                                          color={color}
                                          size={size}
                                      /&gt;
                                  )}
                                  label=&quot;Configurações&quot;
                                  onPress={() =&gt; {props.navigation.navigate('Settings')}}
                              /&gt;
                              &lt;DrawerItem
                                  icon={({color, size}) =&gt; (
                                      &lt;Feather
                                          name=&quot;alert-triangle&quot;
                                          color={color}
                                          size={size}
                                      /&gt;
                                  )}
                                  label=&quot;Reportar Bug&quot;
                                  onPress={() =&gt; {props.navigation.navigate('BugReport')}}
                              /&gt;
                          &lt;/View&gt;
                         
                      &lt;/View&gt;
                  &lt;/DrawerContentScrollView&gt;
                  &lt;View style=  {styles.bottomDrawerSection}&gt;
                      &lt;DrawerItem
                          icon={({color, size}) =&gt; (
                              &lt;Feather
                                  name=&quot;log-out&quot;
                                  color={color}
                                  size={size}
                              /&gt;
                          )}
                          label=&quot;Log Out&quot;
                          onPress={() =&gt; {}}
                      /&gt;
                  &lt;/View&gt;
              &lt;/View&gt;
          );
      }
      const Drawer = createDrawerNavigator();
  
      return (
          &lt;Drawer.Navigator drawerContent={props =&gt; &lt;CustomDrawerContent {...props} /&gt;}&gt;
              &lt;Drawer.Screen name=&quot;Map&quot; component={IncidentsMap}/&gt;
              &lt;Drawer.Screen name=&quot;Settings&quot; component={Settings}/&gt;
              &lt;Drawer.Screen name=&quot;Profile&quot; component={Profile}/&gt;
              &lt;Drawer.Screen name=&quot;BugReport&quot; component={BugReport}/&gt;
  
          &lt;/Drawer.Navigator&gt;
      );
  }
      function MyDrawer() {
  
      return(
          &lt;MyDrawer/&gt;
      );
  }
  </code></pre>
  <p>How should I call this Drawer on my screen?</p>