White screen issue with sidebarAdaptable

[robertherber]

We have a whitescreen issue when using react-native-bottom-tabs with sidebarAdaptable enabled. Disabling sidebarAdaptable makes it work as expected. A bit weird since I guess sidebarAdaptable really only makes sense for tablets and bigger screens.

We use the latest version of Expo, expo router, react-native-bottom-tabs and React Native 0.74.

It happens on the following device:

• iPhone 16 Pro (device, with latest iOS 18.2 public beta)

The whitescreen issue was not seen on the following devices:

• iPhone 12 Pro (device, with iOS 17.6.1)
• iPhone 15 Plus (simulator, with iOS 17.5)
• iPad Air 13-inch (simulator, with iOS 17.5, although notably the sidebar didn't "adapt" here)

[okwasniewski]

Hey, thanks for opening the issue.

The sidebarAdaptable prop is available only for iOS 18+, so iPad Air 13-inch (simulator, with iOS 17.5) didn't get it.

Can you try it on a device without beta software just to make sure its not something introduced by Apple? I will look into this

[robertherber]

Hey, thanks for opening the issue.

The sidebarAdaptable prop is available only for iOS 18+, so iPad Air 13-inch (simulator, with iOS 17.5) didn't get it.

Can you try it on a device without beta software just to make sure its not something introduced by Apple? I will look into this

Thanks for the quick reply! I tested again on iOS 18.1 with the following simulators and got the same white screen behaviour:

• iPad Air 13-inch
• iPhone 16

[okwasniewski]

@robertherber I just checked and I'm unable to reproduce this on iPhone 15 Pro running on iOS 18.1

Can you provide a minimal reproduction code?

[okwasniewski]

Oh no I can see the bug!

#if compiler(>=6.0)
        self.tabViewStyle(.sidebarAdaptable)
#endif

You are running Xcode < 16, right?

Can you check if this diff fixes it?

diff --git a/ios/TabViewImpl.swift b/ios/TabViewImpl.swift
index 244999f..8295d99 100644
--- a/ios/TabViewImpl.swift
+++ b/ios/TabViewImpl.swift
@@ -222,6 +222,8 @@ extension View {
       if (enabled) {
 #if compiler(>=6.0)
         self.tabViewStyle(.sidebarAdaptable)
+#else
+        self
 #endif
       } else {
         self

[robertherber]

Oh no I can see the bug!

#if compiler(>=6.0)
        self.tabViewStyle(.sidebarAdaptable)
#endif

You are running Xcode < 16, right?

Can you check if this diff fixes it?

diff --git a/ios/TabViewImpl.swift b/ios/TabViewImpl.swift
index 244999f..8295d99 100644
--- a/ios/TabViewImpl.swift
+++ b/ios/TabViewImpl.swift
@@ -222,6 +222,8 @@ extension View {
       if (enabled) {
 #if compiler(>=6.0)
         self.tabViewStyle(.sidebarAdaptable)
+#else
+        self
 #endif
       } else {
         self

Thanks for looking into it, quite possible this is the case! I'm on XCode 16.1 locally but we're running on Expo Dev Clients, so I guess it depends on what EAS is running.

[okwasniewski]

Can you try with 0.4.0?

https://github.com/okwasniewski/react-native-bottom-tabs/releases/tag/v0.4.0

[RevanToma]

Can you try with 0.4.0?

https://github.com/okwasniewski/react-native-bottom-tabs/releases/tag/v0.4.0

After updating to 0.4.0 and testing it on later iOS versions 18.x+ with the simulators mentioned above , i can confirm its working.

Thnx for the help @okwasniewski 👍