[Navigator] getCurrentRoutes & willfocus/didfocus Events

[yelled3]

The Issue
Navigator.getCurrentRoutes() values are not correct in when called from willfocus & didfocus.

I've implemented my own navigation bar (without the Navigator.navigationBar prop)

I wanted to be able to toggle the back button according the current routes stack. (by using Navigator.getCurrentRoutes())

navigator.navigationContext.addListener('willfocus', this._onNavigatorWillFocus),

_onNavigatorWillFocus(navigationEvent) {
    const currentRoutes = this.props.navigator.getCurrentRoutes();
    const hideBackButton = currentRoutes.length > 1;
  },

(any suggestions for a better solution would be welcomed)

I start the navigator with a single initial route.
pushed a new route, and from the 2nd screen I tried both:

• calling Navigator.pop
• pan gesture to return to the 1st screen

in both cases, when I call getCurrentRoutes from willfocus is called with 2 routes.
same issue happens when using didfocus

after going over the code I found the issue, in _handlePanResponderRelease
https://github.com/facebook/react-native/blob/master/Libraries/CustomComponents/Navigator/Navigator.js#L659-L667

the routes stack is updated in _cleanScenesPastIndex but as you can see _emitWillFocus is called before.
I did noticed that the navigator.state.presentedIndex is the correct value.

which is how it's done in the NavigationBarSample
https://github.com/facebook/react-native/blob/master/Examples/UIExplorer/Navigator/NavigationBarSample.js#L44-L49

and I can also check the index from the routes stack:

_onNavigatorWillFocus(navigationEvent) {
    const currentRoutes = this.props.navigator.getCurrentRoutes();
    const currentRoute = navigationEvent.data.route;
    const presentedIndex = _.indexOf(currentRoutes, currentRoute);

this seems like the wrong way to go about this...
Thoughts?

BTW, I've noticed this has some related issues:
#1252
#1346

[brentvatne]

cc @ide

[ericvicenti]

Yep, this is a KP and we're working towards a cleaner solution. cc @hedgerwang who is going to help drive this

The Navigator as we know it will own a navigation context which has a route stack. The context will emit instantaneous change events for the route stack. The navigator will subscribe to the route change events, manage animations, and coordinate gestures.

[yelled3]

@ericvicenti is this planned for v0.9.0 release?

[ericvicenti]

Probably won't be ready for v0.9. We have some major refactoring to do and we need to be careful because Navigator is in production

[yelled3]

FYI,

I did noticed that the navigator.state.presentedIndex is the correct value.

I'm using v0.8.0 - and this seems to be incorrect on willfocus but correct on didfocus
to get the correct value in willfocus you need to:

const routeStackIds = this.props.navigator.state.routeStack.map((route)=> route.id);
const presentedIndex = _.indexOf(routeStackIds, this.props.route.id);

[brentvatne]

Hi there! This issue is being closed because it has been inactive for a while.

But don't worry, it will live on with ProductPains! Check out it's new home: https://productpains.com/post/react-native/navigator-getcurrentroutes-willfocusdidfocus-events

[vishalgadhiya91]

"this.props.navigator.navigationContext.addListener('didfocus', viewAppearCallBack)" gives error "TypeError: undefined is not an object (evaluating 'this.props.navigation.addListener)"

What is solution ??