diff --git a/components/jellify.tsx b/components/jellify.tsx index 99dffd20..2d531b48 100644 --- a/components/jellify.tsx +++ b/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 ( diff --git a/ios/Jellify/CarSceneDelegate.h b/ios/Jellify/CarSceneDelegate.h new file mode 100644 index 00000000..3861529d --- /dev/null +++ b/ios/Jellify/CarSceneDelegate.h @@ -0,0 +1,5 @@ +#import +#import + +@interface CarSceneDelegate : UIResponder +@end \ No newline at end of file diff --git a/ios/Jellify/CarSceneDelegate.m b/ios/Jellify/CarSceneDelegate.m new file mode 100644 index 00000000..fedf9ca3 --- /dev/null +++ b/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 \ No newline at end of file diff --git a/ios/Jellify/Info.plist b/ios/Jellify/Info.plist index 59e3814e..050cb224 100644 --- a/ios/Jellify/Info.plist +++ b/ios/Jellify/Info.plist @@ -90,5 +90,35 @@ UIViewControllerBasedStatusBarAppearance + UIApplicationSceneManifest + + UIApplicationSupportsMultipleScenes + + UISceneConfigurations + + CPTemplateApplicationSceneSessionRoleApplication + + + UISceneClassName + CPTemplateApplicationScene + UISceneConfigurationName + CarPlay + UISceneDelegateClassName + $(PRODUCT_MODULE_NAME).CarSceneDelegate + + + UIWindowSceneSessionRoleApplication + + + UISceneClassName + UIWindowScene + UISceneConfigurationName + Phone + UISceneDelegateClassName + $(PRODUCT_MODULE_NAME).PhoneSceneDelegate + + + + diff --git a/ios/Jellify/PhoneSceneDelegate.h b/ios/Jellify/PhoneSceneDelegate.h new file mode 100644 index 00000000..013f0dfd --- /dev/null +++ b/ios/Jellify/PhoneSceneDelegate.h @@ -0,0 +1,7 @@ +#import + +@interface PhoneSceneDelegate : UIResponder + +@property (strong, nonatomic) UIWindow *window; + +@end \ No newline at end of file diff --git a/ios/Jellify/PhoneSceneDelegate.m b/ios/Jellify/PhoneSceneDelegate.m new file mode 100644 index 00000000..6beb2d2f --- /dev/null +++ b/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 \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 1b6b028d..5529e88f 100644 --- a/package-lock.json +++ b/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", diff --git a/package.json b/package.json index 45c27cb6..1f99568d 100644 --- a/package.json +++ b/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",