Component view doesn't render with React Navigation

I'm using React Navigation v5 for navigation in my app. User signs up to the application and right after signing up, the user is navigated to the ExtendedRegisteration Screen. After extended registration is completed, the user is then navigated to the Home screen.

Problem is that the extended registeration screen view is not being shown. I checked and the componentWillMount and componentWillUnmount are being called one after the other without it's view being rendered. Below is the code.

App.js

export default class App extends React.Component {
  render() {
    return (
      <NavigationContainer>
        <Stack.Navigator initialRouteName='Loading' >
          <Stack.Screen name='Loading' component={Loading} />
          <Stack.Screen name='AddContact' component={AddContact} />
          <Stack.Screen name='GuestNav' component={BottomNavGuest} 
            options={{
              //title: 'Welcome',
              headerLeft: null
            }}
          />
          <Stack.Screen name='Extended' component={ExtendedRegisteration} 
            options={{
              headerLeft: null
            }}
          />
          <Stack.Screen name='UserNav' component={BottomNavUser} 
            options={{
              headerLeft: null
            }}
          />
        </Stack.Navigator>
      </NavigationContainer>
    )
  }
}

Function called on button press in SignUp

signUpHandler = () => {
        if (this.state.email == '' || this.state.password == '') {
            alert("Email or Password is empty.")
        }
        else {
            firebase.auth().createUserWithEmailAndPassword(this.state.email, this.state.password)
                .then(() => this.props.navigation.navigate('Extended'))
                .catch(error => { alert(error.message) });            
        }
    }

Below is the screen which I can't access.

ExtendedRegisteration.js

export default class ExtendedRegisteration extends React.Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (
            <View style={styles.container}>
                <Text>Hello</Text>
            </View>
        );
    }

}

Any solutions?