I am starting with typescript and react redux. I have a login component which in turns has it's action creator which dispatch the LOGIN_SUCCESS action:
export const actionCreators = {
loginRequest: (user:string): AppThunkAction<KnownAction> => (dispatch, getState) => {
userService.login(JSON.parse(user))
.then(
(data)=>{//ok
dispatch({ type: 'LOGIN_SUCCESS', success: true, message: data });
},
(data)=>{//error
toast.error(""+data)
}
);
dispatch({ type: 'LOGIN_REQUEST' });
},
...
};
then on the reducer:
export const reducer: Reducer<LoginState> = (state: LoginState, action: KnownAction) => {
switch (action.type) {
case 'LOGIN_REQUEST':
return {... state};
case 'LOGIN_SUCCESS':
return {... state ,success:action.success, message:action.message};
case 'LOGIN_FAILURE':
...
default:
...
}
...
};
I am updating the state. Then I expect that in the component:
componentWillReceiveProps(newProps: LoginProps){
console.log(newProps);
if(newProps.success){
this.props.history.push('/home')
}
}
it will receive the new props and push me to /home, but nothing happens. I have setted a console.log(newProps)
to check when it gets the new properties, but it's never hitted. Can anyone help me? Any help would be much appreciated.
EDIT
this is how i got them connected:
export default connect(
(state: ApplicationState) => state.login, // Selects which state properties are merged into the component's props
loginState.actionCreators // Selects which action creators are merged into the component's props
)(Login) as typeof Login;