async action creator

async-action-creator-class.js

class ProfileAction {

  constructor{}

  //action creators
  syncProfile() {
    this.fetchProfile()
      .then(old_profile => this.fetchProfileDetailsFrom3rdParty())
      .then(new_profile => this.syncProfileDetails(old_profile, new_profile))
      .then(new_profile => this.dispatch(this.syncProfileSuccess(new_profile)))
      .catch(e => this.syncProfileFail(e))
  }

  fetchProfile() {
    fetch()..
  }

  fetchProfileDetailsFrom3rdParty() {
    fetch()..
  }

  syncProfileDetails(old_profile, new_profile) {
    newProfile = {
      ...old_profile,
      // new_profile props
    }
    dispatch(this.updateProfile())
      .then(json => this.updateProfileSuccess(json))
      .catch(e => this.updateProfileFail(e))
  }

  //actions
  getProfile() {
    return {
      type: GET_PROFILE
    }
  }

  syncProfileSuccess() {
    return {
      type: GET_PROFILE_SUCCESS
    }
  }

  syncProfileFail() {
    return {
      type: GET_PROFILE_FAIL
    }
  }

  updateProfile() {
    return {
      type: UPDATE_PROFILE
    }
  }

  updateProfileSuccess() {
    return {
      type: UPDATE_PROFILE_SUCCESS,
      data
    }
  }

  updateProfileFail(e) {
    return {
      type: UPDATE_PROFILE_FAIL,
      error
    }
  }
}

export default profile = new ProfileAction()

// in my component...
import profile as profileActions from './actions/profile'