CarPlay hotfix (#507)

Fix CarPlay not loading any data on the home screen

src/components/CarPlay/Home.tsx

@@ -10,11 +10,21 @@ import { QueueMutation } from '../../providers/Player/interfaces'
 import { JellifyLibrary } from '../../types/JellifyLibrary'
 import { Api } from '@jellyfin/sdk'
 import { networkStatusTypes } from '../Network/internetConnectionWatcher'
+import {
+	RecentlyPlayedArtistsQueryKey,
+	RecentlyPlayedTracksQueryKey,
+} from '../../api/queries/recents/keys'
+import { JellifyUser } from '@/src/types/JellifyUser'
+import {
+	FrequentlyPlayedArtistsQueryKey,
+	FrequentlyPlayedTracksQueryKey,
+} from '../../api/queries/frequents/keys'
 
 const CarPlayHome = (
 	library: JellifyLibrary,
 	loadQueue: (mutation: QueueMutation) => void,
 	api: Api | undefined,
+	user: JellifyUser | undefined,
 	networkStatus: networkStatusTypes | null,
 	deviceProfile: DeviceProfile | undefined,
 ) =>
@@ -45,20 +55,18 @@ const CarPlayHome = (
 			switch (index) {
 				case 0: {
 					// Recent Artists
-					const artists = queryClient.getQueryData<InfiniteData<BaseItemDto[], unknown>>([
-						QueryKeys.RecentlyPlayedArtists,
-						library?.musicLibraryId,
-					]) ?? { pages: [], pageParams: [] }
+					const artists = queryClient.getQueryData<InfiniteData<BaseItemDto[], unknown>>(
+						RecentlyPlayedArtistsQueryKey(user, library),
+					) ?? { pages: [], pageParams: [] }
 					CarPlay.pushTemplate(ArtistsTemplate(artists.pages.flat()))
 					break
 				}
 
 				case 1: {
 					// Recent Tracks
-					const items = queryClient.getQueryData<InfiniteData<BaseItemDto[], unknown>>([
-						QueryKeys.RecentlyPlayed,
-						library?.musicLibraryId,
-					]) ?? { pages: [], pageParams: [] }
+					const items = queryClient.getQueryData<InfiniteData<BaseItemDto[], unknown>>(
+						RecentlyPlayedTracksQueryKey(user, library),
+					) ?? { pages: [], pageParams: [] }
 					CarPlay.pushTemplate(
 						TracksTemplate(
 							items.pages.flat(),
@@ -74,20 +82,18 @@ const CarPlayHome = (
 
 				case 2: {
 					// Most Played Artists
-					const artists = queryClient.getQueryData<InfiniteData<BaseItemDto[], unknown>>([
-						QueryKeys.FrequentArtists,
-						library?.musicLibraryId,
-					]) ?? { pages: [], pageParams: [] }
+					const artists = queryClient.getQueryData<InfiniteData<BaseItemDto[], unknown>>(
+						FrequentlyPlayedArtistsQueryKey(user, library),
+					) ?? { pages: [], pageParams: [] }
 					CarPlay.pushTemplate(ArtistsTemplate(artists.pages.flat()))
 					break
 				}
 
 				case 3: {
 					// On Repeat
-					const items = queryClient.getQueryData<InfiniteData<BaseItemDto[], unknown>>([
-						QueryKeys.FrequentlyPlayed,
-						library?.musicLibraryId,
-					]) ?? { pages: [], pageParams: [] }
+					const items = queryClient.getQueryData<InfiniteData<BaseItemDto[], unknown>>(
+						FrequentlyPlayedTracksQueryKey(user, library),
+					) ?? { pages: [], pageParams: [] }
 					CarPlay.pushTemplate(
 						TracksTemplate(
 							items.pages.flat(),

src/components/CarPlay/Navigation.tsx

@@ -7,11 +7,13 @@ import { JellifyLibrary } from '../../types/JellifyLibrary'
 import { Api } from '@jellyfin/sdk'
 import { networkStatusTypes } from '../Network/internetConnectionWatcher'
 import { DeviceProfile } from '@jellyfin/sdk/lib/generated-client'
+import { JellifyUser } from '@/src/types/JellifyUser'
 
 const CarPlayNavigation = (
 	library: JellifyLibrary,
 	loadQueue: (mutation: QueueMutation) => void,
 	api: Api | undefined,
+	user: JellifyUser | undefined,
 	networkStatus: networkStatusTypes | null,
 	deviceProfile: DeviceProfile | undefined,
 ) =>
@@ -19,7 +21,7 @@ const CarPlayNavigation = (
 		id: uuid.v4(),
 		title: 'Tabs',
 		templates: [
-			CarPlayHome(library, loadQueue, api, networkStatus, deviceProfile),
+			CarPlayHome(library, loadQueue, api, user, networkStatus, deviceProfile),
 			CarPlayDiscover,
 		],
 		onTemplateSelect(template, e) {},

src/providers/CarPlay/index.tsx

@@ -12,7 +12,7 @@ interface CarPlayContext {
 }
 
 const CarPlayContextInitializer = () => {
-	const { api, library } = useJellifyContext()
+	const { api, user, library } = useJellifyContext()
 	const [carplayConnected, setCarPlayConnected] = useState(CarPlay ? CarPlay.connected : false)
 
 	const [networkStatus] = useNetworkStatus()
@@ -27,7 +27,14 @@ const CarPlayContextInitializer = () => {
 
 			if (api && library) {
 				CarPlay.setRootTemplate(
-					CarPlayNavigation(library, loadNewQueue, api, networkStatus, deviceProfile),
+					CarPlayNavigation(
+						library,
+						loadNewQueue,
+						api,
+						user,
+						networkStatus,
+						deviceProfile,
+					),
 				)
 
 				if (Platform.OS === 'ios') {