Unable to read the properties of my react navigation object

I am getting the following error when I try navigate:

Uncaught TypeError: Cannot read properties of undefined (reading 'navigate')

Heres my main component:

const Stack = createStackNavigator<StackParamList>();type StackParamList = {    Home: undefined;    NewTrip: undefined;  };export default function UserStack() {    return (<NavigationContainer><Stack.Navigator><Stack.Screen name="Home" component={HomeScreen} /><Stack.Screen name="NewTrip" component={NewTripsScreen} /></Stack.Navigator></NavigationContainer>    );}

Here's where I'm unsuccessfully trying to call it:

const TripsProfileScreen: FunctionComponent<TripsSectionProfileProps> = (  props, navigation) => {  return (<Container><IconButton            onPress={() =>  navigation.navigate('NewTrip')}</IconButton></Container>)

}

What am I doing wrong? Thanks.