Solution
Add screen for the Analytics tab:
src/screens/Analytics.screen.tsx
import React from 'react';import { StyleSheet, View, Text } from 'react-native';
export const Analytics: React.FC = () => { return ( <View style={styles.container}> <Text>Analytics</Text> </View> );};
const styles = StyleSheet.create({ container: { flex: 1, },});
Update the BottomTabs.navigator
to include the new screen:
src/screens/BottomTabs.navigator.tsx
import * as React from 'react';import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';import { Home } from './Home.screen';import { History } from './History.screen';+import { Analytics } from './Analytics.screen';const BottomTabs = createBottomTabNavigator();
export const BottomTabsNavigator: React.FC = () => { return ( <BottomTabs.Navigator> <BottomTabs.Screen name="Home" component={Home} /> <BottomTabs.Screen name="History" component={History} />+ <BottomTabs.Screen name="Analytics" component={Analytics} /> </BottomTabs.Navigator> );};