Achieving type safe deep linking in React Native with react-navigation #5

make-navigator-custom.tsx

const Tab = createBottomTabNavigator();

export const SomeTabConfiguration = makeNavigator({
  name: 'SomeTab',
  type: 'tab',
  screens: {
    [Screen.One]: { screen: ScreenOne },
    [Screen.Two]: { screen: ScreenTwo },
    [Screen.Three]: { screen: ScreenThree, options: { /* ... */ }  },
    // ...
  },
  linking: {
    path: 'some-tab',
    initialRouteName: Screen.One,
    screens: {
      [Screen.One]: 'screen-one',
      [Screen.Two]: 'screen-two',
      [Screen.Three]: 'screen-three/:someParameter',
      // ...
    },
  },
  render(config) {
    const { theme } = useSomeThemeProvider();		

    <Tab.Navigator screenOptions={config.options}>
      {/* Render your screens as you wish */}
    </Tab.Navigator>
  },
});