I have this sign up button, which takes the form data as payload and dispatch the API, the strange thing is the action is only dispatched once but in saga the API is called twice, which in turns sends 2 sign up requests and generates error. Following is code which is responsible for dispatching action
export function mapDispatchToProps(dispatch) {
return {
onSignIn: (data) => {
dispatch(signInUser(data));
},
makeCreateUser: (data, countryName, signupFields) => {
dispatch(createUser(data, countryName, signupFields));
}
};
}
Following is the action
export function createUser(data, countryName, signupFields) {
return {
type: CREATE_USER,
data,
countryName,
signupFields,
};
}
Following is reducer
case CREATE_USER:
return state
.set('userSuccess', false)
.set('userError', false);
case CREATE_USER_SUCCESS:
return state
.set('userSuccess', action.response);
case CREATE_USER_ERROR:
return state
.set('userError', action.error);
Following code calls the API in saga
// CREATE_USER
export function* createUser(payload) {
const requestURL = `users/signup${window.location.search}`;
try {
// Call our request helper (see 'utils/request')
const response = yield call(request, requestURL, { headers: { 'Content-Type': 'application/json' }, method: 'POST', body: JSON.stringify(payload.data) });
yield put(signInUserSuccess(response, payload.data.provider, payload.signupFields, true));
} catch (err) {
yield put(createUserError(err, payload));
}
}
export default function* AccountSagas() {
yield takeLatest(CREATE_USER, createUser);
}
Following is the definition for signInUserSuccess, sendSignUpFormEvent is for analytics
export function signInUserSuccess(response, provider = null,
signupFields = null, isNewUser = false) {
segmentIdentity(response.user);
storage.setItem(USER_KEY, response.user);
eraseCookie('xiangqi.jwt_token'); // just making sure to remove previous cookie;
setCookie('xiangqi.jwt_token', response.access_token, 10);
if (isNewUser) {
sendSignUpFormEvent(response.user, {
provider,
errorFields: null,
errorType: null,
isSuccessful: true,
signupFields,
});
} else {
sendSignInFormEvent(response.user, provider);
}
return {
type: SIGN_IN_USER_SUCCESS,
response,
};
}
Please have a look at createUser in codebase, its only being used once as generator
Also I added logs on the whole request journey and as you can see in the picture the API is being called twice from saga.js

