How do I conditionally handle navigation in React Redux (React Native) based on result of dispatched action?
<p>I have the following component</p>

<pre><code>import { View, Text } from 'react-native';
import React, { Component,PropTypes } from 'react';
import styles from './styles';
import { connect } from 'react-redux';
import EditProfile from '../../components/common/EditProfile'
import { saveProfile } from '../../actions/profile'

class Profile extends Component {

_saveProfile(){

    //I want to to dispatch this
    this.props.dispatch(saveProfile());

    //and if success push this route
    this.props.navigator.push({name:'Home'});

    //and if not, want to show an error message
}

render() {
    let {profile} = this.props;
      return (
        &lt;View style={styles.container}&gt;
            &lt;EditProfile
                navigator={this.props.navigator}
                profile={profile}
                onSaveProfile={this._saveProfile.bind(this)}
            /&gt;
        &lt;/View&gt;
      );
   }
}

Profile.propTypes = {
    navigator: PropTypes.object.isRequired,
};

function mapDispatchToProps(dispatch) {
    return {
        dispatch
    };
}

function mapStateToProps(state) {
    return {
        profile: state.get("profile").profileState
    }
}

export default connect(mapStateToProps,mapDispatchToProps)(Profile);
</code></pre>

<p>I have the following action creators for this...</p>

<pre><code>import facebook from '../api/facebook'
import * as types from '../constants/ActionTypes';

function saveProfileSuccess(profile){
    return {
        type:type.SAVE_PROFILE_SUCCESS,
        profile:profile
    }
}

function saveProfileError(error) {
    return {
        type:type.SAVE_PROFILE_ERROR,
        errorMessage:error
    }
}

export function saveProfile(profile){
  return dispatch =&gt; {
    profile.save(profile,(error,result)=&gt; {
          if(error){
              dispatch(saveProfileError(error);
          }else{
              dispatch(saveProfileSuccess(result);
          }
    ));
  }
}
</code></pre>

<p>I don't have anything yet in a reducer because I am not sure how/what I need to do to conditionally handle saving a profile, handling an error message to the API, conditionally navigating to the home screen (as shown in first code snippet).</p>

<p>How is it that you dispatch an action from a component, and conditionally navigate away from that component on whether that action which makes an API call successfully or not. If it is not successful, I obviously want to show an error message and not navigate to another view.</p>