calling-async-function-in-action-with-redux-thunk-5

calling-async-function-in-action-with-redux-thunk-5.js

export const setPersonalData = (personalData) => {
  return {
    type: UPDATE_PesonalData,
    personalData
  }
}

export const getPersonalData = (payload) =>  (dispatch) => {
  // Update the store on the status of API call (optional)
  dispatch(apiCallInProgress())
  // Make AJAX call 
  return postRequest(payload)
    .then((response) => {
      // Once AJAX call is successful, update the store
      dispatch(setPersonalData(response))
      // Then indicate apiCall was successful (optional)
      dispatch(apiCallSuccess())
    })
    .catch(err => dispatch(apiCallNotSuccess()))
}

export const getPersonalData = (payload) =>  (dispatch, getState) => {
  // Update the store on the status of API call (optional)
  dispatch(apiCallInProgress())
  // Make AJAX call 
  return postRequest(payload)
    .then((response) => {
      // we can transform response data with current state retrived with getState
      // with fictitious transformData function takes response and current state.
      const newState = transformData(response, getState)
      // Once AJAX call is successful, update the store
      dispatch(setPersonalData(newState))
      // Then indicate apiCall was successful (optional)
      dispatch(apiCallSuccess())
    })
    .catch(err => dispatch(apiCallNotSuccess()))
}