How to add extra item at the bottom of the drawer navigation manually (like logout button)?

Question

I want to add logout button to the bottom of the drawer navigation in my RN app.

I am trying to use contentComponent the following way:

Answer 1

I was able to align Logout at the bottom of the drawer menu with adding justifyContent: 'space-between' to the ScrollView container. You can see the result in the picture

The result source code looks the following way:

const DrawerWithLogoutButton = (props) => (
  
    
      
    
    
      
        
          
        
        Logout
      
    
  
);

const styles = StyleSheet.create({
  item: {
    flexDirection: 'row',
    alignItems: 'center',
  },
  label: {
    margin: 16,
    fontWeight: 'bold',
    color: 'rgba(0, 0, 0, .87)',
  },
  iconContainer: {
    marginHorizontal: 16,
    width: 24,
    alignItems: 'center',
  },
  icon: {
    width: 24,
    height: 24,
  }
});