React-native-navigation: [V2] [Android] Calling setRoot a second time or currentTabIndex breaks the bottom tab bar

[wfilleman]

Issue Description

Running 2.17.0-snapshot.285 calling setRoot multiple times in the app's lifecycle or calling

Navigation.mergeOptions('MainBottomTab', {
    bottomTabs: {
      currentTabIndex: 0,
    },
  });

causes the Android bottom tab bar to become stuck on tab index 0. Trying to tap on any other tab causes the tab bar to appear to switch to that tab, but it immediately reverts back to tab index 0. Only killing the app and restarting it can restore bottom tab functionality until the next setRoot or currentTabIndex call.

Steps to Reproduce / Code Snippets / Screenshots

On Android call setRoot multiple times with two or more bottomTabs or call

Navigation.mergeOptions('MainBottomTab', {
    bottomTabs: {
      currentTabIndex: 0,
    },
  });

after setRoot.

---

Environment

• React Native Navigation version: 2.17.0-snapshot.285
• React Native version: 0.59.5
• Platform(s) (iOS, Android, or both?): Android
• Device info (Simulator/Device? OS version? Debug/Release?): Emulator and Device 9.0. Debug only tested so far.

[matt-oakes]

I downgraded to 2.16.0 which does not have this issue.

React Native Navigation version: >= 2.17.0
React Native version: 0.59.3
Platform(s) (iOS, Android, or both?): Android only
Device info (Simulator/Device? OS version? Debug/Release?): Tested on Android Emulator, multiple versions in debug mode

[MaxMaes]

I have the same issue on Android after upgrading to 2.18.3. When I call currentTabIndex with my BottomTabBar passed as componentid it breaks. But when I use one of my screens component ids, its all fine.

For now im downgrading as well as this is a wonky workaround.

[kentdev92]

@matt-oakes @MaxMaes except downgrade version of RNN anything else guys? Because i have downgraded to RNN ver 2.16.0 but it's still happened. But my case is different, i have custom topbar: button search and textinput also, click search button i have mergeOptions to show TextInput, and click Cancel button to hide TextInput, 2 time work as well but 3 time when i click Cancel button, my app was crash! Please help me if you have any ideas to fix this!

[minhtc]

applyBottomTabsOptions() run 2 times after the Tabbar index changed (I have no idea why it's 2 times). Remove code bellow should fix this issue, an other solution is removing the options.currentTabIndex after mergeOptions(), I'm not sure which way is better.

--- a/node_modules/react-native-navigation/lib/android/app/src/main/java/com/reactnativenavigation/presentation/BottomTabsPresenter.java
@@ -139,10 +139,10 @@ public class BottomTabsPresenter {
     private void applyBottomTabsOptions(BottomTabsOptions options, AnimationsOptions animationsOptions) {
         bottomTabs.setTitleState(options.titleDisplayMode.get(TitleState.SHOW_WHEN_ACTIVE));
         bottomTabs.setBackgroundColor(options.backgroundColor.get(Color.WHITE));
-        if (options.currentTabIndex.hasValue()) {
-            int tabIndex = options.currentTabIndex.get();
-            if (tabIndex >= 0) tabSelector.selectTab(tabIndex);
-        }
         if (options.testId.hasValue()) bottomTabs.setTag(options.testId.get());
         if (options.currentTabId.hasValue()) {
             int tabIndex = bottomTabFinder.findByControllerId(options.currentTabId.get());

[dannyBuonocore]

Was having the same problem; can confirm @minhtc's solution did the trick
React Native Navigation 2.18.4
React Native 0.59.5

Thanks!

[wfilleman]

Confirmed that @minhtc solution worked for me as well.

[kentdev92]

I have found other way to resolve this issue and my issue also. In the last time. I have started my project like have redux and i write down something like store.subsrice(onUpdateRoot)
The onUpdateRoot inside i have check from store some params like isLogin equal true or false to setRoot.
But right now i am remove everything like this and turn into the way like: when i starter the app, i am always setRoot to 1 sreen like LoadingScreen and it's have connected with redux. Right here i am not write something like store.subrice anymore. I get props isLogin via redux. And manual setRoot by this. And everything work as well. No more crash. Even i have searchinput inside 1 topBar. Click search i have mergeOptions to show input. After and changed the way like this. No more crash. Right now all working very very well.

[guyca]

Hey guys, this should be resolved in 2.18.5-snapshot.330. Would appreciate if anyone could report any more issues 👍
Thanks for your patience

[matt-oakes]

@guyca Thanks for this. I'll try it out on my client's project in the next couple of days and report back 👍

[wfilleman]

Thanks, @guyca! This is working for me on a Pixel running the latest Android 9 as well as an Android 8 emulator. I appreciate the fix!

Wes

[matt-oakes]

@guyca I have tested this and it's working for me too. Let us know when this is out on the latest tag on NPM 👍

[guyca]

Available in version 2.19.0