title: How to add extra item at the bottom of the drawer navigation manually (like logout button)?
body: <p>I want to add logout button to the bottom of the drawer navigation in my RN app.</p>
  
  <p><a href="https://i.stack.imgur.com/XkRzm.png" rel="noreferrer"><img src="https://i.stack.imgur.com/XkRzm.png" alt="As you can see the Logout button is located at the bottom of the drawer menu. How can I move it to the bottom of the drawer panel?"></a></p>
  
  <p>I am trying to use <code>contentComponent</code> the following way:</p>
  
  <pre><code>const DrawerWithLogoutButton = (props) =&gt; (
    &lt;ScrollView&gt;
      &lt;SafeAreaView style={styles.container} forceInset={{ top: 'always', horizontal: 'never' }}&gt;
        &lt;DrawerItems {...props} /&gt;
      &lt;/SafeAreaView&gt;
      &lt;Button
        style={styles.logoutButton}
        title="Logout"
        onPress={() =&gt; props.navigation.navigate('Login') }/&gt;
    &lt;/ScrollView&gt;
  );
  
  export default Home = createDrawerNavigator({
    // screens
  }, {
    // other settings
    contentComponent: DrawerWithLogoutButton,
  });
  
  const styles = StyleSheet.create({
    container: {
      flex: 1,
      flexDirection: 'column',
    },
    logoutButton: {
      backgroundColor: 'red',
      position: 'absolute',
      bottom: 0
    }
  });
  </code></pre>
  
  <p>In the result I have the Logout button at the bottom of the menu. But I want it to be located at the bottom of the drawer panel instead</p>
  
  <p>Also I would want the Logout button to look like other menu items and had an icon</p>
  
  <p>Is there a way to create drawer navigator with a menu item which has no screen but is just an action like Logout as in my case? </p>