inactiveTintColor doesn't work

[0xARROWK]

Hello !

I'm programming my first react-native application and I use this package for the tab bar navigation.

I would like to make my application in dark mode and for that I need to customize the colours of the navigation bar. There is no problem to change the colour of the navigation bar, the active tab and the text of the active tab, but impossible to change the text colour of the inactive tabs ! Can you help me ?

Here is my tabs navigator :

<Tabs.Navigator
    initialRouteName="Notifications"
    tabBarOptions={{
      activeBackgroundColor: 'white',
      inactiveTintColor: 'red',
    }}
    appearance={{
      tabBarBackground: '#23272a',
    }}>
    <Tabs.Screen
      name="Notifications"
      component={Home}
      options={{
        tabBarIcon: ({focused, color, size}) => (
          <TabBarIcon focused={focused} tintColor={color} name="bell" />
        ),
      }}
    />
    <Tabs.Screen
      name="Bientôt"
      component={Soon}
      options={{
        tabBarIcon: ({focused, color, size}) => (
          <TabBarIcon focused={focused} tintColor={color} name="lock" />
        ),
      }}
    />
  </Tabs.Navigator>

And the render (as you can see inactive tab text is not red) :

[EDIT]

I also noted that tintColor properties not work on inactive tab :

tabBarIcon: ({focused, color, size}) => (
    <TabBarIcon focused={focused} tintColor={'red'} name="lock" />
),

[0xARROWK]

Ok, I was stupid.

It was coming from the example code for render icons that I have modified :

const TabBarIcon = props => {
  return (
    <Icon
      name={props.name}
      size={props.size ? props.size : 24}
      color={props.focused ? props.tintColor : '#222222'}
      focused={props.focused}
    />
  );
};

This line :

      color={props.focused ? props.tintColor : '#222222'}