React Native navigation - navigation.navigate is not a function

Question

I try to make my application and using the React's navigation and when I try to make a button no change my screen like this: onPress={() => navigation.navigate('Connect') and when I click on my button I have this error: navigation.navigate is not a function (in 'navigation.navigate('Connect'), 'navigation.navigate is undefined'

However I used the same button on my Home screen and it's works? maybe my props navigation is not ready on my other screen 'Congratulations' ?

my code:

Congratulations.js -

export default function Congratulations({navigation}, props) {

return (
    <View style={styles.isSubmit}>
        <Logo width={300} height={100} />
        <Text style={styles.congratulations}>Félicitations {props.firstName + ' ' + props.lastName}, tu peux désormais organiser tes évènements sur l'application ! </Text>
        <View style={{marginTop:30}}>
                <TouchableOpacity
                    style={styles.buttonShadowConnect}
                    onPress={() => navigation.navigate('Connect')}>
                    <LinearGradient style={styles.button} colors={['#FD867E', '#FD7EAC']} start={[0, 0.65]}
                                    end={[0.70, 1]}>
                        <Text style={styles.textButton}>Connexion</Text>
                    </LinearGradient>
                </TouchableOpacity>
        </View>
    </View>
); }

my Navigation.js:

 <NavigationContainer theme={Theme}>
            <Drawer.Navigator initialRouteName="Home" drawerType={"slide"} options={options}>
                <Drawer.Screen name="Home" component={Home} options={{ title: "Accueil" }}/>
                <Drawer.Screen name="JoinUs" component={JoinUs} options={{ title: "Nous rejoindre" }}/>
                <Drawer.Screen name="Connect" component={Connect} options={{ title: "Se connecter" }}/>
            </Drawer.Navigator>

        </NavigationContainer>

and I call my component Congratulations in my Component JoinUsForm.js like this:

    <Congratulations firstName={getFirstName} lastName={getLastName} navigation={navigation}></Congratulations>

you can check on my repo if you want: https://github.com/teddyboirin/myparty thanks !

Answer 1

I've run your project on expo without issue. I think you forgot to run pod install on the iOS folder:

cd ios && pod install

Answer 2

The destructuring Props was the reason of my problem ! thanks !