AnimationStackView onNavigation should return a promise for animation completion

[gre]

onNavigation() could return a promise that would allow to (optionally) track the completion of the navigation action.

For instance, if a button do a navigation push, you might want to make it display differently and disable it until the navigation is completed. I don't think it is the responsability to the button to "check if navigation is happening and disable it itself" but if the button onPress methods allow a function that (potentially) returns a promise, we could just do: <Button onPress={() => onNavigation(new Navigation.Action.Push('route'))} />

It's great to have a fine level of control over navigation action: on a single navigation action, user could know when the navigation has successfully moved to next screen or if it was aborted (by making the promise failing). Also the fact it's a promise make a great API to the user I think, because people might just ignore this detail and don't use it, but when you need it you can do a then() on the result.

(for context, I asked the same question on the old navigation api: https://github.com/facebook/react-native/issues/4824 )

[skevy]

Also, fwiw, if we move all the current async apis to be promised based (as we're discussing here: https://github.com/facebook/react-native/issues/4971), it would fit in nicely. :)

:+1:

[ericvicenti]

I'm concerned about baking this into onNavigation. It is already clear on an abstract level when the navigation is completed. The new NavigationStack will get rendered immediately. Some views (like tabs) will update instantly, while the AnimatedStackView will take some time to transition. Personally I find it easier to think of a navigation change as an atomic thing, rather than a long-lived mutation that can somehow be interrupted.

But I totally understand the application's need for a promise to know when the nav animation is complete. My best idea is to bake it in to the action:

const push = new Navigation.Action.Push('route');
push.promise.then(onPushComplete, onPushInterrupted);
onNavigation(push);

How does this look? This way, developers will have more flexibility because we can mix and match our own actions.

[gre]

looks good to me :+1:

[ericvicenti]

Actually, after talking with @gaearon about it, I think it does make sense for onNavigation to return a promise for animation completion, as long as it is called within a NavigationAnimatedView. If you need to know about animation progress from outside that area of your app, we can add props like onAnimationCompleted to the NavigationAnimatedView