TouchableOpacity not working on expo for react native

Question

Am working on this login page where I had to use TouchableOpacity on a this text "Already have an account? Sign in instead!" to send me to the singin screen and for some reason it didn't work so naturally I thought I had an error in my code and after hours of debugging I had the idea to make a simple button with the same functionality and it works for am wondering is there something wrong with TouchableOpacity on expo or there is somekind of logic error i missed.

here is the code i used :

From my signup screen :

return (
    <View style={styles.container}>
      <NavigationEvents onWillBlur={clearErrorMessage} />
      <AuthForm
        headerText="Sign Up for Tracker"
        errorMessage={state.errorMessage}
        submitButtonText="Sign Up"
        onSubmit={signup}
      />
      <NavLink
        routeName="Signin"
        text="Already have an account? Sign in instead!"
      />
    </View>
  );

from the Navlink component :

return (
    <>
      <TouchableOpacity onPress={() => navigation.navigate(routeName)}>
        <Spacer>
          <Text style={styles.link}>{text}</Text>
        </Spacer>
      </TouchableOpacity>
      <Button
        title="go to sing in"
        onPress={() => {
          navigation.navigate("Singin");
        }}
      />
    </>
  );

Answer 1

This routeName is not a name. You said that you had the idea to make a simple button with the same functionality and it works. It works is because you give the right routename as "Singin"

So you just replace

<TouchableOpacity onPress={() => navigation.navigate(routeName)}>

with

<TouchableOpacity onPress={() => navigation.navigate("Singin")}>

should be work.