Route's async onEnter hook

[alexeyraspopov]

I apologize in advance if I'm missing some old discussion or an explanation in docs.

I've tried to use onEnter hook which was a great solution for my case of data fetching on demand.

However, I found the way I'm required to use it a bit odd. I'm talking about callback argument. Here is a question I've got: what was the idea behind using callback-based continuation style instead of Promises?

I'm using async/await syntax wich means the function will always return a Promise (even if it's just resolved data). So, instead of calling callback at the end of this function the Route can easily use received Promise to figure out the point where a component should be rendered. Here is an example:

<Route path="/user/:userId" component={UserProfilePage} onEnter={fetchUserData} />

async function fetchUserData(nextState) {
  return ActionCreators.retrieveUser(nextState.params.userId);
}

I'd be happy to get some comments or explanation if it's possible to do or not.

Thanks,
Alexey

[taion]

The idea is that, if we use a callback, you have the option of resolving this synchronously. It's also just the lowest common denominator there.

[alexeyraspopov]

The idea is that, if we use a callback, you have the option of resolving this synchronously.

So from the implementation's perspective, the component can either check if the result of onEnter is a Promise or just do Promise.resolve(onEnterResult) which will be resolved on the next tick anyway.

What do you think?

[timdorr]

We still want to work from the lowest common denominator. Not all environments have Promise support, so we can't rely on them without an expensive polyfill.