Doing onEnter hooks with Relay that require data / async

route.js

const node = Relay.QL`
  query {
    node(id: $channelId) {
      ... on Channel {
        joined
        ${JoinChannelMutation.getFragment('channel')}
      }
    }
  }
`;

const onEnter = (nextState, replace, callback) => {
  const {params: {channelId}} = nextState;
  const query = Relay.createQuery(node, {channelId});
  Relay.Store.primeCache({query}, readyState => {
    if (readyState.done) {
      const [channel] = Relay.Store.readQuery(query);
      if (channel.joined) {
        callback();
      } else {
        console.log('need to join');
        Relay.Store.commitUpdate(new JoinChannelMutation({channel}), {
          onSuccess: () => {
            console.log('joined!');
            callback()
          },
          onFailure: () => {
            console.log('sad panda');
            // replace ... like I have an error page
          }
        });
      }
    }
  });
}

export default (
  <Route
    path=':channelId'
    component={ChannelWrapper}
    onEnter={onEnter}
  />
);

"like I have an error page" 😄 😄 😄

@eyston BTW, wouldn't it be better to have this logic inside ChannelWrapper.componentWillMount()?