Fix carplay crashing?

components/jellify.tsx

@@ -1,5 +1,5 @@
 import _ from "lodash";
-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
 import { NavigationContainer } from "@react-navigation/native";
 import Navigation from "./navigation";
 import Login from "./Login/component";
@@ -11,6 +11,7 @@ import { useColorScheme } from "react-native";
 import { PortalProvider } from "tamagui";
 import Client from "@/api/client";
 import { JellifyProvider, useJellifyContext } from "./provider";
+import { CarPlay } from "react-native-carplay"
 
 export default function Jellify(): React.JSX.Element {
 
@@ -28,6 +29,8 @@ function App(): React.JSX.Element {
   const isDarkMode = useColorScheme() === "dark";
 
   const { loggedIn } = useJellifyContext();
+
+  const [carPlayConnected, setCarPlayConnected] = useState(CarPlay.connected);
   
   useEffect(() => {
     console.debug("Client instance changed")
@@ -35,6 +38,24 @@ function App(): React.JSX.Element {
     Client.instance
   ])
 
+  useEffect(() => {
+
+    function onConnect() {
+      setCarPlayConnected(true)
+    }
+
+    function onDisconnect() {
+      setCarPlayConnected(false)
+    }
+
+    CarPlay.registerOnConnect(onConnect);
+    CarPlay.registerOnDisconnect(onDisconnect);
+    return () => {
+      CarPlay.unregisterOnConnect(onConnect)
+      CarPlay.unregisterOnDisconnect(onDisconnect)
+    };
+  });
+
   return (
     <NavigationContainer theme={isDarkMode ? JellifyDarkTheme : JellifyLightTheme}>
       <SafeAreaProvider>

ios/Jellify/CarSceneDelegate.h

@@ -0,0 +1,5 @@
+#import <Foundation/Foundation.h>
+#import <CarPlay/CarPlay.h>
+
+@interface CarSceneDelegate : UIResponder <CPTemplateApplicationSceneDelegate>
+@end

ios/Jellify/CarSceneDelegate.m

@@ -0,0 +1,19 @@
+#import "CarSceneDelegate.h"
+#import "CarSceneDelegate.h"
+#import "RNCarPlay.h"
+
+@implementation CarSceneDelegate
+
+- (void)templateApplicationScene:(CPTemplateApplicationScene *)templateApplicationScene
+      didConnectInterfaceController:(CPInterfaceController *)interfaceController {
+    // Dispatch connect to RNCarPlay
+    [RNCarPlay connectWithInterfaceController:interfaceController window:templateApplicationScene.carWindow];
+}
+
+- (void)templateApplicationScene:(CPTemplateApplicationScene *)templateApplicationScene
+      didDisconnectInterfaceController:(CPInterfaceController *)interfaceController {
+    // Dispatch disconnect to RNCarPlay
+ in   [RNCarPlay disconnect];
+}
+
+@end

ios/Jellify/Info.plist

@@ -90,5 +90,35 @@
 	</array>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
 	<false/>
+	<key>UIApplicationSceneManifest</key>
+	<dict>
+	<key>UIApplicationSupportsMultipleScenes</key>
+	<true/>
+	<key>UISceneConfigurations</key>
+	<dict>
+		<key>CPTemplateApplicationSceneSessionRoleApplication</key>
+		<array>
+		<dict>
+			<key>UISceneClassName</key>
+			<string>CPTemplateApplicationScene</string>
+			<key>UISceneConfigurationName</key>
+			<string>CarPlay</string>
+			<key>UISceneDelegateClassName</key>
+			<string>$(PRODUCT_MODULE_NAME).CarSceneDelegate</string>
+		</dict>
+		</array>
+		<key>UIWindowSceneSessionRoleApplication</key>
+		<array>
+		<dict>
+			<key>UISceneClassName</key>
+			<string>UIWindowScene</string>
+			<key>UISceneConfigurationName</key>
+			<string>Phone</string>
+			<key>UISceneDelegateClassName</key>
+			<string>$(PRODUCT_MODULE_NAME).PhoneSceneDelegate</string>
+		</dict>
+		</array>
+	</dict>
+	</dict>
 </dict>
 </plist>

ios/Jellify/PhoneSceneDelegate.h

@@ -0,0 +1,7 @@
+#import <UIKit/UIKit.h>
+
+@interface PhoneSceneDelegate : UIResponder <UIWindowSceneDelegate>
+
+@property (strong, nonatomic) UIWindow *window;
+
+@end

ios/Jellify/PhoneSceneDelegate.m

@@ -0,0 +1,15 @@
+#import "PhoneSceneDelegate.h"
+
+@implementation PhoneSceneDelegate
+- (void)scene:(UIScene *)scene willConnectToSession:(UISceneSession *)session options:(UISceneConnectionOptions *)connectionOptions {
+  AppDelegate *appDelegate = (AppDelegate *)UIApplication.sharedApplication.delegate;
+  UIWindowScene *windowScene = (UIWindowScene *)scene;
+  UIViewController *rootViewController = [[UIViewController alloc] init];
+  rootViewController.view = appDelegate.rootView;
+  UIWindow *window = [[UIWindow alloc] initWithWindowScene:windowScene];
+  window.rootViewController = rootViewController;
+  self.window = window;
+  [window makeKeyAndVisible];
+}
+
+@end

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "jellify",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "jellify",
-      "version": "0.1.0",
+      "version": "0.1.1",
       "dependencies": {
         "@animatereactnative/marquee": "^0.2.0",
         "@gcores/react-native-carplay": "^1.1.12",
@@ -34,6 +34,7 @@
         "react": "18.3.1",
         "react-native": "0.75.2",
         "react-native-blurhash": "^2.1.0",
+        "react-native-carplay": "^2.4.1-beta.0",
         "react-native-device-info": "^11.1.0",
         "react-native-file-access": "^3.1.1",
         "react-native-gesture-handler": "^2.20.0",
@@ -20197,6 +20198,24 @@
         "react-native": ">=0.60.0-rc.0 <1.0.x"
       }
     },
+    "node_modules/react-native-carplay": {
+      "version": "2.4.1-beta.0",
+      "resolved": "https://registry.npmjs.org/react-native-carplay/-/react-native-carplay-2.4.1-beta.0.tgz",
+      "integrity": "sha512-tYJymLgJi+0516niv4ApGVC+VgENX/uCYqCX81tewSILWnS6KR7M0A9+bHyNk8xoheFyYGruX7onYxU2U8ykPA==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^17.0.2 || ^18.0.0",
+        "react-native": "^0.60.0"
+      },
+      "peerDependenciesMeta": {
+        "react": {
+          "optional": true
+        },
+        "react-native": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/react-native-css-interop": {
       "version": "0.0.36",
       "resolved": "https://registry.npmjs.org/react-native-css-interop/-/react-native-css-interop-0.0.36.tgz",

package.json

@@ -36,6 +36,7 @@
     "react": "18.3.1",
     "react-native": "0.75.2",
     "react-native-blurhash": "^2.1.0",
+    "react-native-carplay": "^2.4.1-beta.0",
     "react-native-device-info": "^11.1.0",
     "react-native-file-access": "^3.1.1",
     "react-native-gesture-handler": "^2.20.0",