@iternio/react-native-auto-play 0.2.3 → 0.3.0

package/README.md

@@ -880,7 +880,7 @@ CarPlayDashboard.setButtons([
 
 ### iOS
 
--   **Broken exceptions with `react-native-skia`**: When using `react-native-skia` up to version `2.4.14`, exceptions on iOS are not reported correctly. This is fixed in newer versions of `react-native-skia`. For more details, see this [pull request](https://github.com/Shopify/react-native-skia/pull/3595) and [issue](https://github.com/Shopify/react-native-skia/issues/3635).
+-   **Broken exceptions with `react-native-skia`**: When using `react-native-skia` exceptions on iOS are not reported correctly. This is fixed since version `2.4.19` of `react-native-skia`. For more details, see this [pull request](https://github.com/Shopify/react-native-skia/pull/3595) and [issue](https://github.com/Shopify/react-native-skia/issues/3635).
 -   **AppState on iOS**: The `AppState` module from React Native does not work correctly on iOS because this library uses scenes, which are not supported by the stock `AppState` module. This library provides a custom state listener that works for both Android and iOS. Use `HybridAutoPlay.addListenerRenderState` instead of `AppState`.
 -   **Timers stop on screen lock**: iOS stops all timers when the device's main screen is turned off. To ensure timers continue to run (which is often necessary for background tasks related to autoplay), a patch for `react-native` is required. A patch is included in the root `patches/` directory and can be applied using `patch-package`.
 -   **expo-splash-screen stuck on iOS**: The `expo-splash-screen` module is broken on iOS because it does not support scenes, which are used by this library. This can cause the splash screen to be stuck on either the mobile device or on CarPlay. To fix this, a patch for `expo-splash-screen` is included in the root `patches/` directory and can be applied using `patch-package`. After applying the patch, you can hide the splash screen for a specific scene by passing the module name to the `hide` or `hideAsync` function. The module name can be one of the values from the `AutoPlayModules` enum or the UUID of a cluster screen.

package/ReactNativeAutoPlay.podspec

@@ -37,6 +37,7 @@ Pod::Spec.new do |s|
   load 'nitrogen/generated/ios/ReactNativeAutoPlay+autolinking.rb'
   add_nitrogen_files(s)
 
+  s.dependency 'React-Core'
   s.dependency 'React-jsi'
   s.dependency 'React-callinvoker'
   install_modules_dependencies(s)

package/android/build.gradle

@@ -44,7 +44,6 @@ android {
   defaultConfig {
     minSdkVersion getExtOrIntegerDefault("minSdkVersion")
     targetSdkVersion getExtOrIntegerDefault("targetSdkVersion")
-    buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString()
 
     externalNativeBuild {
       cmake {

package/android/src/main/java/com/margelo/nitro/swe/iternio/reactnativeautoplay/VirtualRenderer.kt

@@ -20,10 +20,8 @@ import androidx.car.app.CarContext
 import androidx.car.app.SurfaceCallback
 import androidx.car.app.SurfaceContainer
 import com.facebook.react.ReactApplication
-import com.facebook.react.ReactRootView
 import com.facebook.react.bridge.Arguments
 import com.facebook.react.bridge.ReactContext
-import com.facebook.react.bridge.UIManager
 import com.facebook.react.fabric.FabricUIManager
 import com.facebook.react.runtime.ReactSurfaceImpl
 import com.facebook.react.runtime.ReactSurfaceView
@@ -45,28 +43,18 @@ class VirtualRenderer(
     private val isCluster: Boolean = false
 ) {
     private lateinit var fabricUiManager: FabricUIManager
-    private lateinit var uiManager: UIManager
 
     private fun isUiManagerInitialized(): Boolean {
-        if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
-            return ::fabricUiManager.isInitialized
-        }
-
-        return ::uiManager.isInitialized
+        return ::fabricUiManager.isInitialized
     }
 
     private lateinit var display: Display
     private lateinit var reactContext: ReactContext
 
     private lateinit var reactSurfaceImpl: ReactSurfaceImpl
-    private lateinit var reactSurfaceView: ReactSurfaceView
+    private var reactSurfaceView: ReactSurfaceView? = null
     private var reactSurfaceId: Int? = null
 
-    private lateinit var reactRootView: ReactRootView
-    private fun isReactRootViewInitialized(): Boolean {
-        return ::reactRootView.isInitialized
-    }
-
     private var height: Int = 0
     private var width: Int = 0
 
@@ -85,20 +73,9 @@ class VirtualRenderer(
             reactContext =
                 ReactContextResolver.getReactContext(context.applicationContext as ReactApplication)
 
-            if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
-                fabricUiManager = UIManagerHelper.getUIManager(
-                    reactContext, UIManagerType.FABRIC
-                ) as FabricUIManager
-            } else {
-                // UIManagerType.DEFAULT was deprecated and will eventually be removed, but LEGACY is not available in lower RN versions. 
-                // So make sure both work to be backwards compatible
-                val legacyType = try {
-                    UIManagerType::class.java.getField("LEGACY").getInt(null)
-                } catch (e: NoSuchFieldException) {
-                    UIManagerType.DEFAULT
-                }
-                uiManager = UIManagerHelper.getUIManager(reactContext, legacyType) as UIManager
-            }
+            fabricUiManager = UIManagerHelper.getUIManager(
+                reactContext, UIManagerType.FABRIC
+            ) as FabricUIManager
 
             initRenderer()
         }
@@ -216,7 +193,7 @@ class VirtualRenderer(
                     val additionalMarginRight =
                         if (stableArea.right == visibleArea.right && visibleArea.right != width) 0 else defaultMargin
                     val additionalMarginTop =
-                        if (visibleArea.top != stableArea.top || (visibleArea.top > 0 && stableArea.top > 0 && visibleArea.right < width)) 0 else defaultMargin
+                        if (visibleArea.top != stableArea.top || (visibleArea.top > 0 && visibleArea.right < width)) 0 else defaultMargin
                     val additionalMarginBottom =
                         if (stableArea.bottom == visibleArea.bottom) defaultMargin else 0
 
@@ -293,89 +270,15 @@ class VirtualRenderer(
         val mainScreenDensity = DisplayMetricsHolder.getScreenDisplayMetrics().density
         val reactNativeScale = virtualScreenDensity / mainScreenDensity * BuildConfig.SCALE_FACTOR
 
-        if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
-            if (!isUiManagerInitialized()) {
-                // this makes sure we have all required instances
-                // no matter if the app is launched on the phone or AA first
-                return
-            }
-
-            FabricMapPresentation(
-                context, display, height, width, initialProperties, reactNativeScale
-            ).show()
-        } else {
-            if (!isUiManagerInitialized()) {
-                // this makes sure we have all required instances
-                // no matter if the app is launched on the phone or AA first
-                return
-            }
-            MapPresentation(
-                context, display, height, width, initialProperties, reactNativeScale
-            ).show()
+        if (!isUiManagerInitialized()) {
+            // this makes sure we have all required instances
+            // no matter if the app is launched on the phone or AA first
+            return
         }
-    }
-
-    inner class MapPresentation(
-        private val context: CarContext,
-        display: Display,
-        private val height: Int,
-        private val width: Int,
-        private val initialProperties: Bundle,
-        private val reactNativeScale: Float,
-    ) : Presentation(context, display) {
-        override fun onCreate(savedInstanceState: Bundle?) {
-            super.onCreate(savedInstanceState)
-
-            var splashScreenView: View? = null
-
-            // Wrap applicationContext with app theme to support AppCompat widgets like ReactTextView
-            val appTheme = context.applicationContext.applicationInfo.theme
-            val themedContext = ContextThemeWrapper(context.applicationContext, appTheme)
-
-            if (!isReactRootViewInitialized()) {
-                splashScreenView =
-                    if (isCluster) getClusterSplashScreen(themedContext, height, width) else null
-
-                val instanceManager =
-                    (themedContext.applicationContext as ReactApplication).reactNativeHost.reactInstanceManager
-
-                reactRootView = ReactRootView(themedContext).apply {
-                    layoutParams = FrameLayout.LayoutParams(
-                        (this@MapPresentation.width / reactNativeScale).toInt(),
-                        (this@MapPresentation.height / reactNativeScale).toInt()
-                    )
-                    scaleX = reactNativeScale
-                    scaleY = reactNativeScale
-                    pivotX = 0f
-                    pivotY = 0f
-                    setBackgroundColor(Color.DKGRAY)
-
-                    splashScreenView?.let {
-                        removeClusterSplashScreen({ viewTreeObserver }, it)
-                    }
-
-                    startReactApplication(instanceManager, moduleName, initialProperties)
-                    runApplication()
-                }
-            } else {
-                (reactRootView.parent as? ViewGroup)?.removeView(reactRootView)
-            }
-
-            val rootContainer = FrameLayout(themedContext).apply {
-                layoutParams = FrameLayout.LayoutParams(
-                    FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT
-                )
-                clipChildren = false
-
-                addView(reactRootView)
-            }
-
-            splashScreenView?.let {
-                rootContainer.addView(it)
-            }
 
-            setContentView(rootContainer)
-        }
+        FabricMapPresentation(
+            context, display, height, width, initialProperties, reactNativeScale
+        ).show()
     }
 
     inner class FabricMapPresentation(
@@ -398,11 +301,13 @@ class VirtualRenderer(
 
             var splashScreenView: View? = null
 
-            if (!this@VirtualRenderer::reactSurfaceView.isInitialized) {
+            reactSurfaceView?.let {
+                (it.parent as ViewGroup).removeView(it)
+            } ?: run {
                 splashScreenView =
                     if (isCluster) getClusterSplashScreen(themedContext, height, width) else null
 
-                reactSurfaceView = ReactSurfaceView(themedContext, reactSurfaceImpl).apply {
+                val surfaceView = ReactSurfaceView(themedContext, reactSurfaceImpl).apply {
                     layoutParams = FrameLayout.LayoutParams(
                         (width / reactNativeScale).toInt(), (height / reactNativeScale).toInt()
                     )
@@ -418,7 +323,7 @@ class VirtualRenderer(
                 }
 
                 reactSurfaceId = fabricUiManager.startSurface(
-                    reactSurfaceView,
+                    surfaceView,
                     moduleName,
                     Arguments.fromBundle(initialProperties),
                     View.MeasureSpec.makeMeasureSpec(
@@ -433,10 +338,11 @@ class VirtualRenderer(
                 reactContext.removeLifecycleEventListener(fabricUiManager)
                 // trigger ui-managers onHostResume to make sure the surface is rendered properly even when AA only is starting without the phone app
                 fabricUiManager.onHostResume()
-            } else {
-                (reactSurfaceView.parent as ViewGroup).removeView(reactSurfaceView)
+
+                reactSurfaceView = surfaceView
             }
 
+
             val rootContainer = FrameLayout(themedContext).apply {
                 layoutParams = FrameLayout.LayoutParams(
                     FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT
@@ -457,8 +363,15 @@ class VirtualRenderer(
     private fun getClusterSplashScreen(
         context: Context, containerHeight: Int, containerWidth: Int
     ): View {
+        val root = FrameLayout(context).apply {
+            layoutParams = ViewGroup.LayoutParams(
+                ViewGroup.LayoutParams.MATCH_PARENT,
+                ViewGroup.LayoutParams.MATCH_PARENT
+            )
+        }
+
         val layout =
-            LayoutInflater.from(context).inflate(R.layout.cluster_splashscreen, null, false)
+            LayoutInflater.from(context).inflate(R.layout.cluster_splashscreen, root, false)
         val text = layout.findViewById<TextView>(R.id.splash_text)
 
         AppInfo.getApplicationIcon(context)?.let {
@@ -506,15 +419,9 @@ class VirtualRenderer(
         fun removeRenderer(moduleId: String) {
             val renderer = virtualRenderer[moduleId]
 
-            if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) {
-                if (renderer?.isUiManagerInitialized() == true) {
-                    renderer.reactSurfaceId?.let {
-                        renderer.fabricUiManager.stopSurface(it)
-                    }
-                }
-            } else {
-                if (renderer?.isReactRootViewInitialized() == true) {
-                    renderer.reactRootView.unmountReactApplication()
+            if (renderer?.isUiManagerInitialized() == true) {
+                renderer.reactSurfaceId?.let {
+                    renderer.fabricUiManager.stopSurface(it)
                 }
             }
 

package/ios/scenes/AutoPlayScene.swift

@@ -6,6 +6,7 @@
 //
 
 import CarPlay
+import React
 
 class AutoPlayScene: UIResponder {
     var initialProperties: [String: Any] = [:]
@@ -53,7 +54,10 @@ class AutoPlayScene: UIResponder {
     }
 
     func disconnect() {
-        NitroSurface.stop(self.window?.rootViewController?.view)
+        if let view = self.window?.rootViewController?.view, let rootView = view as? RCTSurfaceHostingProxyRootView {
+            rootView.surface.stop()
+        }
+
         self.window = nil
         isConnected = false
 

package/ios/templates/MapTemplate.swift

@@ -597,7 +597,7 @@ class MapTemplate: AutoPlayHeaderProviding,
 
         if var userInfo = route.userInfo as? [String: Any?] {
             userInfo["travelEstimates"] = steps.map { step in
-                Parser.parseTravelEstiamtes(
+                Parser.parseTravelEstimates(
                     travelEstimates: step.travelEstimates
                 )
             }
@@ -675,7 +675,7 @@ class MapTemplate: AutoPlayHeaderProviding,
                 .firstIndex(where: { $0.id == nitroManeuver.id })
             {
                 navigationSession.updateEstimates(
-                    Parser.parseTravelEstiamtes(
+                    Parser.parseTravelEstimates(
                         travelEstimates: nitroManeuver.travelEstimates
                     ),
                     for: navigationSession.upcomingManeuvers[maneuverIndex]

package/ios/templates/Parser.swift

@@ -7,6 +7,7 @@
 
 import CarPlay
 import UIKit
+import React
 
 struct HeaderActions {
     let leadingNavigationBarButtons: [CPBarButton]
@@ -452,7 +453,7 @@ class Parser {
             id: routeChoice.id,
             // we don't want to keep the origin travel estimate
             travelEstimates: routeChoice.steps[1...].map { step in
-                parseTravelEstiamtes(travelEstimates: step.travelEstimates)
+                parseTravelEstimates(travelEstimates: step.travelEstimates)
             }
         )
 
@@ -492,7 +493,7 @@ class Parser {
         }
     }
 
-    static func parseTravelEstiamtes(travelEstimates: TravelEstimates)
+    static func parseTravelEstimates(travelEstimates: TravelEstimates)
         -> CPTravelEstimates
     {
         return CPTravelEstimates(
@@ -515,7 +516,7 @@ class Parser {
             traitCollection: traitCollection
         )
 
-        maneuver.initialTravelEstimates = Parser.parseTravelEstiamtes(
+        maneuver.initialTravelEstimates = Parser.parseTravelEstimates(
             travelEstimates: nitroManeuver.travelEstimates
         )
         maneuver.symbolImage = Parser.parseNitroImage(
@@ -739,7 +740,7 @@ class Parser {
     }
 
     static func doubleToColor(value: Double) -> UIColor {
-        return NitroConvert.uiColor(value)
+        return RCTConvert.uiColor(value)
     }
 
     static func parseNitroImage(
@@ -767,7 +768,7 @@ class Parser {
         assetImage: AssetImage,
         traitCollection: UITraitCollection
     ) -> UIImage? {
-        let uiImage = NitroConvert.uiImage([
+        let uiImage = RCTConvert.uiImage([
             "height": assetImage.height, "width": assetImage.width,
             "uri": assetImage.uri, "scale": assetImage.scale,
             "__packager_asset": assetImage.packager_asset,
@@ -776,6 +777,10 @@ class Parser {
         guard let color = assetImage.color else {
             return uiImage
         }
+        
+        guard let uiImage = uiImage else {
+            return nil
+        }
 
         return getTintedImageAsset(
             color: color,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iternio/react-native-auto-play",
-  "version": "0.2.3",
+  "version": "0.3.0",
   "description": "Android Auto and Apple CarPlay for react-native",
   "main": "lib/index",
   "module": "lib/index",

package/ios/ReactHelpers/NitroConvert.h

@@ -1,19 +0,0 @@
-//
-//  NitroConvert.h
-//  Pods
-//
-//  Created by Manuel Auer on 04.11.25.
-//
-
-// this is required for old architecture support since the React pod can not be imported
-
-#import <UIKit/UIKit.h>
-
-NS_ASSUME_NONNULL_BEGIN
-
-@interface NitroConvert : NSObject
-+ (UIColor *)uiColor:(id)json;
-+ (UIImage *)uiImage:(id)json;
-@end
-
-NS_ASSUME_NONNULL_END

package/ios/ReactHelpers/NitroConvert.m

@@ -1,21 +0,0 @@
-//
-//  NitroConvert.m
-//  Pods
-//
-//  Created by Manuel Auer on 04.11.25.
-//
-
-// this is required for old architecture support since the React pod can not be imported
-
-#import "NitroConvert.h"
-#import <React/RCTConvert.h>
-
-@implementation NitroConvert
-+ (UIColor *)uiColor:(id)json {
-    return [RCTConvert UIColor:json];
-}
-
-+ (nonnull UIImage *)uiImage:(nonnull id)json {
-    return [RCTConvert UIImage:json];
-}
-@end

package/ios/ReactHelpers/NitroSurface.h

@@ -1,10 +0,0 @@
-//
-//  NitroSurface.h
-//  Pods
-//
-//  Created by Manuel Auer on 28.11.25.
-//
-
-@interface NitroSurface : NSObject
-+ (void)stop:(nullable UIView *)view;
-@end

package/ios/ReactHelpers/NitroSurface.m

@@ -1,51 +0,0 @@
-//
-//  NitroSurface.m
-//  Pods
-//
-//  Created by Manuel Auer on 28.11.25.
-//
-
-#import "NitroSurface.h"
-#import <React/RCTInvalidating.h>
-#import <React/RCTRootView.h>
-#import <React/RCTSurface.h>
-#import <React/RCTSurfaceHostingProxyRootView.h>
-
-@implementation NitroSurface
-
-+ (void)stop:(nullable UIView *)view {
-    if (view == nil) {
-        NSLog(@"[AutoPlay] View is nil, ignoring");
-        return;
-    }
-
-    if ([view isKindOfClass:[RCTSurfaceHostingProxyRootView class]]) {
-        RCTSurfaceHostingProxyRootView *rootView =
-            (RCTSurfaceHostingProxyRootView *)view;
-        RCTSurface *surface = rootView.surface;
-
-        if (surface == nil) {
-            NSLog(@"[AutoPlay] surface == nil, cannot stop");
-            return;
-        }
-
-        [surface stop];
-        return;
-    }
-    
-    if ([view isKindOfClass:[RCTRootView class]]) {
-        RCTRootView *rootView = (RCTRootView *)view;
-        UIView<RCTInvalidating> *contentView = (UIView<RCTInvalidating> *)rootView.contentView;
-        
-        if ([contentView conformsToProtocol:@protocol(RCTInvalidating)]) {
-            [contentView invalidate];
-        } else {
-            NSLog(@"[AutoPlay] contentView does not conform to RCTInvalidating");
-        }
-        return;
-    }
-
-    NSLog(@"[AutoPlay] View is not recognized type, ignoring");
-}
-
-@end