please take a look at this code my signup button doesn't direct me to profile component react native - react-native

Question

Help me with this so I can carry further on with my work.
Also all the other files which are needed for the solution I can provide you with.
profile.js
import React from "react";
import { StyleSheet, Text, View, StatusBar } from "react-native";
import { render } from "react-dom";
class Profile extends React.Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.textStyle}>This is the profile page </Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
backgroundColor: "#455a64",
flex: 1,
alignItems: "center",
justifyContent: "center",
},
textStyle: {
color: "#fff",
fontSize: 18,
},
});
export default Profile;
signup.js
import React from "react";
import {
StyleSheet,
Text,
View,
StatusBar,
TouchableOpacity,
} from "react-native";
import { createNewUser } from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/actions/auth.actions.js";
import { render } from "react-dom";
import { connect } from "react-redux";
import Form from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/form.js";
import { compose } from "redux";
import Logo from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/logo.js";
import SignupForm from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/signupform.js";
import { Actions } from "react-native-router-flux";
import { Field, reduxForm } from "redux-form";
import InputText from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/InputText.js";
import Loader from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/Loader.js";
class Signup extends React.Component {
goBack() {
Actions.pop();
}
createNewUser = (values) => {
this.props.dispatch(createNewUser(values));
};
onSubmit = (values) => {
this.createNewUser(values);
};
renderTextInput = (field) => {
const {
meta: { touched, error },
label,
secureTextEntry,
maxLength,
keyboardType,
placeholder,
input: { onChange, ...restInput },
} = field;
return (
<View>
<InputText
onChangeText={onChange}
maxLength={maxLength}
placeholder={placeholder}
keyboardType={keyboardType}
secureTextEntry={secureTextEntry}
label={label}
{...restInput}
/>
{touched && error && <Text style={styles.errorText}>{error}</Text>}
</View>
);
};
render() {
const { createUsers, handleSubmit } = this.props;
return (
<View style={styles.container}>
{createUsers.isLoading && <Loader />}
<Logo />
<Field
name="name"
placeholder=" First Name"
component={this.renderTextInput}
/>
<Field
name="name"
placeholder=" Last Name"
component={this.renderTextInput}
/>
<Field
name="email"
placeholder="Email"
component={this.renderTextInput}
/>
<Field
name="password"
placeholder="Password"
secureTextEntry={true}
component={this.renderTextInput}
/>
<TouchableOpacity
style={styles.button}
onPress={handleSubmit(this.onSubmit)}
>
<Text style={styles.buttonText}>Signup</Text>
</TouchableOpacity>
<View style={styles.signupTextCont}>
<Text style={styles.signupText}>Already have an account?</Text>
<TouchableOpacity onPress={this.goBack}>
<Text style={styles.signupButton}> Sign in</Text>
</TouchableOpacity>
</View>
</View>
);
}
}
const validate = (values) => {
const errors = {};
if (!values.name) {
errors.name = "First Name is required";
}
if (!values.name) {
errors.name = "Last Name is required";
}
if (!values.email) {
errors.email = "Email is required";
}
if (!values.password) {
errors.password = "Password is required";
}
return errors;
};
const styles = StyleSheet.create({
container: {
backgroundColor: "#455a64",
flex: 1,
alignItems: "center",
justifyContent: "center",
},
signupTextCont: {
flexGrow: 1,
alignItems: "flex-end",
justifyContent: "center",
paddingVertical: 16,
flexDirection: "row",
},
signupText: {
color: "rgba(255,255,255,0.6)",
fontSize: 16,
},
signupButton: {
color: "#ffffff",
fontSize: 16,
fontWeight: "500",
},
button: {
width: 300,
backgroundColor: "#1c313a",
borderRadius: 25,
marginVertical: 10,
paddingVertical: 13,
},
buttonText: {
fontSize: 16,
fontWeight: "500",
color: "#ffffff",
textAlign: "center",
},
errorText: {
color: "#ffffff",
fontSize: 14,
paddingHorizontal: 16,
paddingBottom: 8,
},
inputBox: {
width: 300,
backgroundColor: "rgba(255, 255,255,0.2)",
borderRadius: 25,
paddingHorizontal: 16,
fontSize: 16,
color: "#ffffff",
marginVertical: 10,
},
});
mapStateToProps = (state) => ({
createUsers: state.authReducer.createUsers,
});
mapDispatchToProps = (dispatch) => ({
dispatch,
});
export default compose(
connect(mapStateToProps, mapDispatchToProps),
reduxForm({
form: "register",
validate,
})
)(Signup);
auth.reducer.js
import { combineReducers } from "redux";
const createUsers = (state = {}, action) => {
switch (action.type) {
case "CREATE_USER_LOADING":
return {
isLoading: true,
isError: false,
isSuccess: false,
errors: null,
isLoggedIn: false,
};
case "CREAT_USER_SUCCESS":
return {
isLoading: false,
isError: false,
isSuccess: true,
errors: null,
isLoggedIn: true,
};
case "CREAT_USER_FAIL":
return {
isLoading: false,
isError: true,
isSuccess: false,
errors: action.payload,
isLoggedIn: false,
};
default:
return state;
}
};
/*const authData = (state = {}, action) => {
switch (action.type) {
case "AUTH_USER_SUCCESS":
return {
token: action.token,
isLoggedIn: true,
};
case "AUTH_USER_FAIL":
return {
token: null,
isLoggedIn: false,
};
default:
return state;
}
};
const loginUser = (state = {}, action) => {
switch (action.type) {
case "LOGIN_USER_LOADING":
return {
isLoading: true,
isError: false,
isSuccess: false,
errors: null,
};
case "LOGIN_USER_SUCCESS":
return {
isLoading: false,
isError: false,
isSuccess: true,
errors: null,
};
case "LOGIN_USER_FAIL":
return {
isLoading: false,
isError: true,
isSuccess: false,
errors: action.payload,
};
default:
return state;
}
};*/
export default combineReducers({
createUsers,
//loginUser,
//authData,
});
routes.js
import React, { Component } from "react";
import {
StyleSheet,
Text,
View,
StatusBar,
TouchableOpacity,
} from "react-native";
import { Router, Stack, Scene } from "react-native-router-flux";
import Login from "../pages/login.js";
import Signup from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/pages/signup.js";
import Profile from "../pages/profile.js";
class Routes extends React.Component {
render() {
return (
<Router>
<Scene>
<Scene key="root" hideNavBar={true} initial={!this.props.isLoggedIn}>
<Scene key="signup" component={Signup} title="Register" />
<Scene key="login" component={Login} />
</Scene>
<Scene key="app" hideNavBar={true} initial={this.props.isLoggedIn}>
<Scene key="profile" component={Profile} initial={true} />
</Scene>
</Scene>
</Router>
);
}
}
export default Routes;
Main.js
import React from "react";
import {
StyleSheet,
Text,
View,
StatusBar,
TouchableOpacity,
} from "react-native";
import { render } from "react-dom";
import { createUsers } from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/reducers/auth.reducer.js";
import { connect } from "react-redux";
import Routes from "/Users/ayeshasiddiquebutt/elearning9thclassapp/sourcefiles/components/routes.js";
import { Actions } from "react-native-router-flux";
class Main extends React.Component {
render() {
const { createUsers } = this.props;
console.log(this.props.createUsers.isLoggedIn);
return (
<View style={styles.container}>
<StatusBar backgroundColor="#1c313a" barStyle="light-content" />
<Routes isLoggedIn={this.props.createUsers.isLoggedIn} />
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
});
mapStateToProps = (state) => ({
createUsers: state.authReducer.createUsers,
});`enter code here`
export default connect(mapStateToProps, null)(Main);