feat: unify expo and bare RN in ReactNativeBrownfield

apps/AppleApp/Brownfield Apple App/BrownfieldAppleApp.swift

@@ -10,11 +10,7 @@ class AppDelegate: NSObject, UIApplicationDelegate {
         _ application: UIApplication,
         didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil
     ) -> Bool {
-#if USE_EXPO_HOST
-        return ReactNativeHostManager.shared.application(application, didFinishLaunchingWithOptions: launchOptions)
-#else
-        return true
-#endif
+        return ReactNativeBrownfield.shared.application(application, didFinishLaunchingWithOptions: launchOptions)
     }
 }
 
@@ -23,14 +19,15 @@ struct BrownfieldAppleApp: App {
     @UIApplicationDelegateAdaptor(AppDelegate.self) var appDelegate
 
     init() {
-#if USE_EXPO_HOST
-        ReactNativeHostManager.shared.initialize()
-#else
         ReactNativeBrownfield.shared.bundle = ReactNativeBundle
         ReactNativeBrownfield.shared.startReactNative {
             print("React Native has been loaded")
         }
+
+#if USE_EXPO_HOST
+        ReactNativeBrownfield.shared.ensureExpoModulesProvider()
 #endif
+
         BrownfieldStore.register(initialState)
     }
 

apps/AppleApp/Brownfield Apple App/ContentView.swift

@@ -1,5 +1,4 @@
 import ReactBrownfield
-import BrownfieldLib
 import Brownie
 import SwiftUI
 
@@ -17,33 +16,12 @@ struct ContentView: View {
     }
 }
 
-#if USE_EXPO_HOST
-struct RNViewRepresentable: UIViewRepresentable {
-
-    func makeUIView(context: Context) -> UIView {
-        return ReactNativeHostManager.shared.loadView(moduleName: "RNApp", initialProps: nil, launchOptions: nil)
-    }
-
-    func updateUIView(_ uiView: UIView, context: Context) {
-        // Update the view when SwiftUI state changes
-    }
-}
-#endif
-
-struct MainScreen: View {
-    var rnView: some View {
-#if USE_EXPO_HOST
-        RNViewRepresentable()
-#else
-        ReactNativeView(moduleName: "RNApp")
-#endif
-    }
-
+struct MainScreen: View {    
     var body: some View {
         VStack(spacing: 16) {
             GreetingCard(name: "iOS")
 
-            rnView
+            ReactNativeView(moduleName: "RNApp")
                 .navigationBarHidden(true)
                 .clipShape(RoundedRectangle(cornerRadius: 16))
                 .background(Color(UIColor.systemBackground))

apps/RNApp/ios/Podfile.lock

@@ -2350,7 +2350,7 @@ PODS:
     - SocketRocket
   - ReactAppDependencyProvider (0.82.1):
     - ReactCodegen
-  - ReactBrownfield (2.2.0):
+  - ReactBrownfield (3.0.0-rc.1):
     - boost
     - DoubleConversion
     - fast_float
@@ -2843,7 +2843,7 @@ SPEC CHECKSUMS:
   React-utils: f06ff240e06e2bd4b34e48f1b34cac00866e8979
   React-webperformancenativemodule: b3398f8175fa96d992c071b1fa59bd6f9646b840
   ReactAppDependencyProvider: a45ef34bb22dc1c9b2ac1f74167d9a28af961176
-  ReactBrownfield: 65d6bf15ccb7501d3982ec05f8d37b697e9b3480
+  ReactBrownfield: ce231a9060b34e1fe8f91ec8416f21dc6da8b4b5
   ReactCodegen: 0bce2d209e2e802589f4c5ff76d21618200e74cb
   ReactCommon: 801eff8cb9c940c04d3a89ce399c343ee3eff654
   RNScreens: d6413aeb1878cdafd3c721e2c5218faf5d5d3b13

docs/docs/docs/getting-started/expo.mdx

@@ -111,15 +111,19 @@ This should only take a few minutes.
 - Follow the step for adding the frameworks to your iOS App - [here](/docs/getting-started/ios#6-add-the-framework-to-your-ios-app)
 <hr/>
 
-1. Call the `ReactNativeHostManager.shared.initialize()` from your Application Entry point:
+1. Call the following functions from your Application Entry point:
 
 ```swift
 @main
 struct IosApp: App {
     @UIApplicationDelegateAdaptor(AppDelegate.self) var appDelegate
 
     init() {
-        ReactNativeHostManager.shared.initialize()
+        ReactNativeBrownfield.shared.bundle = ReactNativeBundle
+        ReactNativeBrownfield.shared.startReactNative {
+            print("React Native has been loaded")
+        }
+        ReactNativeBrownfield.shared.ensureExpoModulesProvider()
     }
 
     var body: some Scene {
@@ -140,19 +144,19 @@ class AppDelegate: NSObject, UIApplicationDelegate {
         _ application: UIApplication,
         didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil
     ) -> Bool {
-        return ReactNativeHostManager.shared.application(application, didFinishLaunchingWithOptions: launchOptions)
+        return ReactNativeBrownfield.shared.application(application, didFinishLaunchingWithOptions: launchOptions)
     }
 }
 ```
 
-3. Use the `ReactNativeHostManager.loadView` to present the UI
+3. Use the `ReactNativeView` or `ReactNativeViewController` to present the UI
 
-```
-let RNView = ReactNativeHostManager.shared.loadView(moduleName: "ExpoRNApp", initialProps: nil, launchOptions: nil)
+```swift
+ReactNativeView(moduleName: "ExpoRNApp")
+  .background(Color(UIColor.systemBackground))
 ```
 
-> This returns a UIView, so if you're using SwiftUI, you will have to wrap this in UIViewRrepresentable .
-You can see the demo integration in [Apple App](https://github.com/callstack/react-native-brownfield/blob/main/apps/AppleApp/Brownfield%20Apple%20App/BrownfieldAppleApp.swift) as well
+> You can also use `ReactNativeBrownfield.shared.view(moduleName, initialProps)` which returns a UIView.
 
 4. Build and install the iOS application 🚀
 

packages/react-native-brownfield/ReactBrownfield.podspec

@@ -22,6 +22,10 @@ Pod::Spec.new do |spec|
 
   spec.dependency 'ReactAppDependencyProvider'
   add_dependency(spec, "React-RCTAppDelegate")
+
+  if ENV['REACT_NATIVE_BROWNFIELD_USE_EXPO_HOST'] == '1'
+    spec.dependency 'Expo'
+  end
 
   install_modules_dependencies(spec)
 end

packages/react-native-brownfield/ios/BrownfieldBundlePathResolver.swift

@@ -0,0 +1,21 @@
+import Foundation
+
+enum BrownfieldBundlePathResolver {
+  enum Error: Swift.Error {
+    case invalidBundlePath(String)
+  }
+
+  static func resourceComponents(from bundlePath: String) throws -> (
+    resourceName: String,
+    fileExtension: String
+  ) {
+    let fileExtension = (bundlePath as NSString).pathExtension
+    let resourceName = (bundlePath as NSString).deletingPathExtension
+
+    guard !fileExtension.isEmpty, !resourceName.isEmpty else {
+      throw Error.invalidBundlePath(bundlePath)
+    }
+
+    return (resourceName, fileExtension)
+  }
+}

packages/react-native-brownfield/ios/ExpoHostRuntime.swift

@@ -0,0 +1,140 @@
+import UIKit
+internal import React
+internal import React_RCTAppDelegate
+internal import ReactAppDependencyProvider
+
+#if canImport(Expo)
+internal import Expo
+
+final class ExpoHostRuntime {
+  static let shared = ExpoHostRuntime()
+
+  private let jsBundleLoadObserver = JSBundleLoadObserver()
+  private var delegate = ExpoHostRuntimeDelegate()
+  private var reactNativeFactory: RCTReactNativeFactory?
+  private var expoDelegate: ExpoAppDelegate?
+
+  /**
+   * Starts React Native with default parameters.
+   */
+  public func startReactNative() {
+    startReactNative(onBundleLoaded: nil)
+  }
+  /**
+   * Starts React Native with optional callback when bundle is loaded.
+   *
+   * @param onBundleLoaded Optional callback invoked after JS bundle is fully loaded.
+   */
+  public func startReactNative(onBundleLoaded: (() -> Void)?) {
+    guard reactNativeFactory == nil else { return }
+
+    let factory = ExpoReactNativeFactory(delegate: delegate)
+    delegate.dependencyProvider = RCTAppDependencyProvider()
+
+    reactNativeFactory = factory
+
+    let appDelegate = ExpoAppDelegate()
+    appDelegate.bindReactNativeFactory(factory)
+    expoDelegate = appDelegate
+
+    if let onBundleLoaded {
+      jsBundleLoadObserver.observeOnce(onBundleLoaded: onBundleLoaded)
+    }
+  }
+
+  /**
+   * Path to JavaScript root.
+   * Default value: ".expo/.virtual-metro-entry"
+   */
+  public var entryFile: String = ".expo/.virtual-metro-entry" {
+    didSet {
+      delegate.entryFile = entryFile
+    }
+  }
+
+  /**
+   * Path to JavaScript bundle file.
+   * Default value: "main.jsbundle"
+   */
+  public var bundlePath: String = "main.jsbundle" {
+    didSet {
+      delegate.bundlePath = bundlePath
+    }
+  }
+  /**
+   * Bundle instance to lookup the JavaScript bundle.
+   * Default value: Bundle.main
+   */
+  public var bundle: Bundle = Bundle.main {
+    didSet {
+      delegate.bundle = bundle
+    }
+  }
+  /**
+   * Dynamic bundle URL provider called on every bundle load.
+   * When set, this overrides the default bundleURL() behavior in the delegate.
+   * Returns a URL to load a custom bundle, or nil to use default behavior.
+   * Default value: nil
+   */
+  public var bundleURLOverride: (() -> URL?)? = nil {
+    didSet {
+      delegate.bundleURLOverride = bundleURLOverride
+    }
+  }
+
+  func application(
+    _ application: UIApplication,
+    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil
+  ) -> Bool {
+    return expoDelegate?.application(
+      application,
+      didFinishLaunchingWithOptions: launchOptions
+    ) != nil
+  }
+
+  func view(
+    moduleName: String,
+    initialProps: [AnyHashable: Any]?,
+    launchOptions: [AnyHashable: Any]?
+  ) -> UIView? {
+    let bundleURL = delegate.bundleURL()
+
+    return expoDelegate?.recreateRootView(
+      withBundleURL: bundleURL,
+      moduleName: moduleName,
+      initialProps: initialProps,
+      launchOptions: launchOptions
+    )
+  }
+}
+
+class ExpoHostRuntimeDelegate: ExpoReactNativeFactoryDelegate {
+  var entryFile = ".expo/.virtual-metro-entry"
+  var bundlePath = "main.jsbundle"
+  var bundle = Bundle.main
+  var bundleURLOverride: (() -> URL?)? = nil
+
+  override func sourceURL(for bridge: RCTBridge) -> URL? {
+    // needed to return the correct URL for expo-dev-client.
+    bridge.bundleURL ?? bundleURL()
+  }
+
+  override func bundleURL() -> URL? {
+    if let bundleURLProvider = bundleURLOverride { return bundleURLProvider() }
+#if DEBUG
+    return RCTBundleURLProvider.sharedSettings().jsBundleURL(
+      forBundleRoot: entryFile)
+#else
+    do {
+      let (resourceName, fileExtension) = try BrownfieldBundlePathResolver.resourceComponents(
+        from: bundlePath
+      )
+      return bundle.url(forResource: resourceName, withExtension: fileExtension)
+    } catch {
+      assertionFailure("Invalid bundlePath '\(bundlePath)': \(error)")
+      return nil
+    }
+#endif
+  }
+}
+#endif

packages/react-native-brownfield/ios/JSBundleLoadObserver.swift

@@ -0,0 +1,38 @@
+import Foundation
+internal import React
+
+final class JSBundleLoadObserver {
+  private var onBundleLoaded: (() -> Void)?
+  private var observerToken: NSObjectProtocol?
+
+  func observeOnce(onBundleLoaded: @escaping () -> Void) {
+    removeObserverIfNeeded()
+    self.onBundleLoaded = onBundleLoaded
+
+    observerToken = NotificationCenter.default.addObserver(
+      forName: NSNotification.Name("RCTInstanceDidLoadBundle"),
+      object: nil,
+      queue: nil
+    ) { [weak self] _ in
+      self?.notifyAndClear()
+    }
+  }
+
+  deinit {
+    removeObserverIfNeeded()
+  }
+
+  private func notifyAndClear() {
+    let callback = onBundleLoaded
+    onBundleLoaded = nil
+    removeObserverIfNeeded()
+    callback?()
+  }
+
+  private func removeObserverIfNeeded() {
+    if let observerToken {
+      NotificationCenter.default.removeObserver(observerToken)
+      self.observerToken = nil
+    }
+  }
+}

packages/react-native-brownfield/ios/Notification+Brownfield.swift

@@ -0,0 +1,12 @@
+import Foundation
+
+extension Notification.Name {
+  /**
+   * Notification sent when React Native wants to navigate back to native screen.
+   */
+  public static let popToNative = Notification.Name("PopToNativeNotification")
+  /**
+   * Notification sent to enable/disable the pop gesture recognizer.
+   */
+  public static let togglePopGestureRecognizer = Notification.Name("TogglePopGestureRecognizerNotification")
+}