Dispatching an action from another action with props (Redux) - reactjs

Question

So, I have this login() action that redirects the user to the feed if the login is successful. I also have this register() action that creates a new user and calls the login() action after.
The problem is that login() isn't receiving the props when called from register(), so I can't call the this.navigation.navigate('Feed') from there.
userActions.js
function register(user) {
return dispatch => {
dispatch(request(user));
let { username, password } = user
userService.register(user)
.then(
user => {
dispatch(success(user));
dispatch(login(username, password)) //calls login() after the user is created
},
error => {
dispatch(failure(error.toString()));
}
);
};
function request(user) { return { type: userConstants.REGISTER_REQUEST, user } }
function success(user) { return { type: userConstants.REGISTER_SUCCESS, user } }
function failure(error) { return { type: userConstants.REGISTER_FAILURE, error } }
}
function login(username, password) {
return dispatch => {
dispatch(request({ username }));
userService.login(username, password)
.then(
user => {
dispatch(success(user));
this.navigation.navigate('Feed') //this is throwing "undefined is not an object" when login() is dispatched from register()
},
error => {
dispatch(failure(error.toString()));
}
);
};
function request(user) { return { type: userConstants.LOGIN_REQUEST, user } }
function success(user) { return { type: userConstants.LOGIN_SUCCESS, user } }
function failure(error) { return { type: userConstants.LOGIN_FAILURE, error } }
}
What am I missing here?

Answer 1

I think your code needs to be fixed a little.
It's not good solution to deal navigation in redux actions. To avoid this, Saga is recommended to be used with Redux.
However, with this your code, you didn't pass navigation property to action so you need to pass props variable to register action first.
Please try like this.
function register(user, props) {
...
dispatch(login(username, password, props))
...
function login(username, password, props) {
...
props.navigation.navigate('Feed')
Then navigation will work.
Hope this helps you to understand)
I recommend to use Redux and Saga as a stack according to my experience.