You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I've been using react-native-brownfield for a while now and recently we added a new module inside the RNApp project.
A module is a separate stack which comes with its own screens and logic. Normally these modules should be as isolated as possible one from another.
The way I implemented the module is by using the NavigationContainer and the Stack.Navigator from react-navigation.
For testing purposes I've made a new SwiftUI view that allows me to navigate to each module based on the initialModule prop, and from React Native I am passing the prop to NavigationContainer's initialRouteName prop.
Now, just like in the attached video, if I navigate on Home module, then on Settings [native screen], then on Contact [RN screen], and then press the back button [which calls popToNative], it will close all the screens. Basically popToNative closes all the React Native screens.
I am not sure if this is the expected behavior or if it's a bug. I would expect popToNative to close only the React Native screens that are on the top of the stack.
Here is the code I am using:
import Brownie
import ReactBrownfield
import SwiftUI
import UIKit
enumHomeDestination:Hashable{case rnHome
case nativeSettings
case rnContact
}@available(iOS 16.0,*)structContentView:View{@Stateprivatevarpath=NavigationPath()varbody:someView{ZStack(alignment:.topTrailing){NavigationStack(path: $path){Color(UIColor.systemBackground).ignoresSafeArea().navigationBarHidden(true).navigationDestination(for:HomeDestination.self){ dest indestinationView(for: dest)}}FloatingHomeButtons{ destination in
path.append(destination)}.padding(16)}}@ViewBuilderprivatefunc destinationView(for dest:HomeDestination)->someView{switch dest {case.rnHome:RNScreen(initialModule:"Home")case.nativeSettings:SettingsScreen()case.rnContact:RNScreen(initialModule:"Contact")}}}privatestructFloatingHomeButtons:View{letonSelect:(HomeDestination)->Voidvarbody:someView{VStack(alignment:.trailing, spacing:12){Button("Open RN-Home"){onSelect(.rnHome)}.buttonStyle(.borderedProminent)Button("Open Native-Settings"){onSelect(.nativeSettings)}.buttonStyle(.borderedProminent)Button("Open RN-Contact"){onSelect(.rnContact)}.buttonStyle(.borderedProminent)}.frame(maxWidth:.infinity, maxHeight:.infinity, alignment:.topTrailing).allowsHitTesting(true)}}structRNScreen:View{letinitialModule:Stringvarbody:someView{ReactNativeView(
moduleName:"RNApp",
initialProperties:["nativeOsVersionLabel":"\(UIDevice.current.systemName)\(UIDevice.current.systemVersion)","initialModule": initialModule
]).ignoresSafeArea().navigationBarHidden(true)}}@available(iOS 16.0,*)
#Preview {ContentView()}
Hello,
I've been using react-native-brownfield for a while now and recently we added a new module inside the RNApp project.
A module is a separate stack which comes with its own screens and logic. Normally these modules should be as isolated as possible one from another.
The way I implemented the module is by using the NavigationContainer and the Stack.Navigator from react-navigation.
For testing purposes I've made a new SwiftUI view that allows me to navigate to each module based on the initialModule prop, and from React Native I am passing the prop to NavigationContainer's initialRouteName prop.
Now, just like in the attached video, if I navigate on Home module, then on Settings [native screen], then on Contact [RN screen], and then press the back button [which calls popToNative], it will close all the screens. Basically popToNative closes all the React Native screens.
I am not sure if this is the expected behavior or if it's a bug. I would expect popToNative to close only the React Native screens that are on the top of the stack.
Here is the code I am using:
Reproducible Demo
Simulator.Screen.Recording.-.iPhone.17.Pro.-.2026-05-26.at.22.58.58.mov