Re-integrate Expo with our native code

Author: swansontec

android/app/src/main/java/co/edgesecure/app/MainActivity.kt

@@ -8,6 +8,7 @@ import com.facebook.react.ReactActivityDelegate
 import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.fabricEnabled
 import com.facebook.react.defaults.DefaultReactActivityDelegate
 import com.zoontek.rnbootsplash.RNBootSplash
+import expo.modules.ReactActivityDelegateWrapper
 
 class MainActivity : ReactActivity() {
     /**
@@ -21,7 +22,11 @@ class MainActivity : ReactActivity() {
      * which allows you to enable New Architecture with a single boolean flags [fabricEnabled]
      */
     override fun createReactActivityDelegate(): ReactActivityDelegate =
-        DefaultReactActivityDelegate(this, mainComponentName, fabricEnabled)
+        ReactActivityDelegateWrapper(
+            this,
+            BuildConfig.IS_NEW_ARCHITECTURE_ENABLED,
+            DefaultReactActivityDelegate(this, mainComponentName, fabricEnabled)
+        )
 
     // Edge addition
     override fun onCreate(savedInstanceState: Bundle?) {

android/app/src/main/java/co/edgesecure/app/MainApplication.kt

@@ -8,13 +8,11 @@ import com.facebook.react.ReactHost
 import com.facebook.react.ReactNativeHost
 import com.facebook.react.ReactPackage
 import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.load
-import com.facebook.react.defaults.DefaultReactHost.getDefaultReactHost
 import com.facebook.react.defaults.DefaultReactNativeHost
 import com.facebook.react.modules.i18nmanager.I18nUtil
 import com.facebook.react.soloader.OpenSourceMergedSoMapping
 import com.facebook.soloader.SoLoader
-import expo.modules.ApplicationLifecycleDispatcher.onApplicationCreate
-import expo.modules.ApplicationLifecycleDispatcher.onConfigurationChanged
+import expo.modules.ApplicationLifecycleDispatcher
 import expo.modules.ReactNativeHostWrapper
 import io.sentry.Hint
 import io.sentry.SentryEvent
@@ -24,12 +22,10 @@ import io.sentry.SentryOptions.BeforeSendCallback
 import io.sentry.android.core.SentryAndroid
 
 class MainApplication : Application(), ReactApplication {
-
     override val reactNativeHost: ReactNativeHost =
         ReactNativeHostWrapper(
             this,
             object : DefaultReactNativeHost(this) {
-
                 override fun getPackages(): List<ReactPackage> {
                     // Packages that cannot be autolinked yet can be added manually here, for
                     // example:
@@ -47,7 +43,7 @@ class MainApplication : Application(), ReactApplication {
         )
 
     override val reactHost: ReactHost
-        get() = getDefaultReactHost(applicationContext, reactNativeHost)
+        get() = ReactNativeHostWrapper.createReactHost(applicationContext, reactNativeHost)
 
     override fun onCreate() {
         super.onCreate()
@@ -101,17 +97,23 @@ class MainApplication : Application(), ReactApplication {
         // Background task:
         MessagesWorker.ensureScheduled(context)
         // MessagesWorker.testRun(context);
+
+        // React Native template code:
         SoLoader.init(this, OpenSourceMergedSoMapping)
         if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
             // If you opted-in for the New Architecture, we load the native entry point for this
             // app.
             load()
         }
-        onApplicationCreate(this)
+
+        // Expo integration:
+        ApplicationLifecycleDispatcher.onApplicationCreate(this)
     }
 
     override fun onConfigurationChanged(newConfig: Configuration) {
         super.onConfigurationChanged(newConfig)
-        onConfigurationChanged(this, newConfig)
+
+        // Expo integration:
+        ApplicationLifecycleDispatcher.onConfigurationChanged(this, newConfig)
     }
 }

android/build.gradle

@@ -29,3 +29,4 @@ buildscript {
 }
 
 apply plugin: "com.facebook.react.rootproject"
+apply plugin: "expo-root-project"

android/settings.gradle

@@ -1,9 +1,22 @@
-pluginManagement { includeBuild("../node_modules/@react-native/gradle-plugin") }
-plugins { id("com.facebook.react.settings") }
-extensions.configure(com.facebook.react.ReactSettingsExtension){ ex -> ex.autolinkLibrariesFromCommand() }
+// Expo integration:
+pluginManagement {
+  includeBuild("../node_modules/@react-native/gradle-plugin")
+  includeBuild("../node_modules/expo-modules-autolinking/android/expo-gradle-plugin")
+}
+plugins {
+  id("com.facebook.react.settings")
+  id("expo-autolinking-settings")
+}
+extensions.configure(com.facebook.react.ReactSettingsExtension) {
+  ex -> ex.autolinkLibrariesFromCommand(expoAutolinking.rnConfigCommand)
+}
+
+// React template code:
 rootProject.name = 'co.edgesecure.app'
 include ':app'
 includeBuild('../node_modules/@react-native/gradle-plugin')
 
-apply from: new File(["node", "--print", "require.resolve('expo/package.json')"].execute(null, rootDir).text.trim(), "../scripts/autolinking.gradle")
-useExpoModules()
+// Expo integration:
+expoAutolinking.useExpoModules()
+expoAutolinking.useExpoVersionCatalog()
+includeBuild(expoAutolinking.reactNativeGradlePlugin)

babel.config.js

@@ -1,4 +1,4 @@
 module.exports = {
-  presets: ['module:@react-native/babel-preset'],
+  presets: ['babel-preset-expo'],
   plugins: ['react-native-reanimated/plugin']
 }

ios/edge/AppDelegate.swift

@@ -1,3 +1,4 @@
+import Expo
 import Firebase
 import FirebaseMessaging
 import RNBootSplash
@@ -8,7 +9,7 @@ import UIKit
 import UserNotifications
 
 @main
-class AppDelegate: UIResponder, UIApplicationDelegate {
+class AppDelegate: ExpoAppDelegate {
   var window: UIWindow?
   var securityView: UIView?
 
@@ -19,7 +20,7 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
    * Handles deep links.
    * From https://reactnative.dev/docs/0.79/linking?ios-language=swift#enabling-deep-links
    */
-  func application(
+  override func application(
     _ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey: Any] = [:]
   ) -> Bool {
     return RCTLinkingManager.application(app, open: url, options: options)
@@ -29,7 +30,7 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
    * Handles deep links.
    * From https://reactnative.dev/docs/0.79/linking?ios-language=swift#enabling-deep-links
    */
-  func application(
+  override func application(
     _ application: UIApplication,
     continue userActivity: NSUserActivity,
     restorationHandler: @escaping ([UIUserActivityRestoring]?) -> Void
@@ -45,7 +46,7 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
    * Handles app start-up.
    * React Native template code.
    */
-  func application(
+  override func application(
     _ application: UIApplication,
     didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]? = nil
   ) -> Bool {
@@ -58,11 +59,12 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
 
     // React Native template code:
     let delegate = ReactNativeDelegate()
-    let factory = RCTReactNativeFactory(delegate: delegate)
+    let factory = ExpoReactNativeFactory(delegate: delegate)
     delegate.dependencyProvider = RCTAppDependencyProvider()
 
     reactNativeDelegate = delegate
     reactNativeFactory = factory
+    bindReactNativeFactory(factory)
 
     window = UIWindow(frame: UIScreen.main.bounds)
 
@@ -72,14 +74,14 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
       launchOptions: launchOptions
     )
 
-    return true
+    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
   }
 
   /**
    * Periodic background fetch logic.
    * Edge addition.
    */
-  func application(
+  override func application(
     _ application: UIApplication,
     performFetchWithCompletionHandler completionHandler: @escaping (UIBackgroundFetchResult) -> Void
   ) {
@@ -128,7 +130,7 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
    * Hides the app when we go into the background.
    * Edge addition.
    */
-  func applicationDidEnterBackground(_ application: UIApplication) {
+  override func applicationDidEnterBackground(_ application: UIApplication) {
     guard
       let storyboard = UIStoryboard(name: "LaunchScreen", bundle: nil) as UIStoryboard?,
       let launchScreen = storyboard.instantiateInitialViewController(),
@@ -148,7 +150,7 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
    * Shows the app when we come into the foreground.
    * Edge addition.
    */
-  func applicationWillEnterForeground(_ application: UIApplication) {
+  override func applicationWillEnterForeground(_ application: UIApplication) {
     if let view = securityView {
       view.removeFromSuperview()
       securityView = nil
@@ -158,13 +160,13 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
 
 /// Configures the React Native instance.
 /// React Native template code.
-class ReactNativeDelegate: RCTDefaultReactNativeFactoryDelegate {
+class ReactNativeDelegate: ExpoReactNativeFactoryDelegate {
   override func sourceURL(for bridge: RCTBridge) -> URL? {
     self.bundleURL()
   }
 
   // react-native-bootsplash integration:
-  override func customize(_ rootView: RCTRootView) {
+  override func customize(_ rootView: UIView) {
     super.customize(rootView)
     RNBootSplash.initWithStoryboard("LaunchScreen", rootView: rootView)
   }

metro.config.js

@@ -1,4 +1,5 @@
-const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config')
+const { getDefaultConfig } = require('expo/metro-config')
+const { mergeConfig } = require('@react-native/metro-config')
 const {
   wrapWithReanimatedMetroConfig
 } = require('react-native-reanimated/metro-config')