Skip to main content

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>  );};