React Navigation 5 - createNativeStackNavigator с настраиваемым заголовком

Я использую React Navigation 5 для реагирования на собственное приложение. Я пытаюсь использовать NativeStackNavigator с настраиваемым заголовком. С React Navigation 4 это работает, но с 5 нет.

Реагировать на навигацию 4:

import { createStackNavigator } from 'react-navigation-stack';

...

const _baseNavigationOptions = (props, icon, text) => {
    return ({
      headerTitle: () => <TitleComponent  {...props} config={someConfiguration}/>,
      headerStyle: {
        backgroundColor: '#6084AD',
      },
      headerTintColor: '#FFF'
    });
  }

...
const ConsumptionStackNavigator = createStackNavigator({
    Consumption: {
        screen: Consumption,
        navigationOptions: _baseNavigationOptions({name:'bars', type: 'font-awesome'}, 'My Consumptions')
    }
}

Когда я пытаюсь сделать то же самое с reactNavigation 5, headerTitle не работает:

import { createNativeStackNavigator } from '@react-navigation/native-stack';

...

  return (
      <Stack.Navigator
        initialRouteName="Consumption"
        screenOptions={{
          headerTitleAlign: 'center'
        }}>
        <Stack.Screen
          name="Consumption"
          component={ComsumptionComponent}
          options={{ header: (props) => _baseNavigationOptions(props, {name:'bars', type: 'font-awesome'}, 'My Consumption') }}
        />
...

в заголовке отображается потребление, а не мой пользовательский компонент. Если я попробую использовать headerRight вместо headerTitle, у меня будет та же проблема

Вы можете мне помочь :)