Add Images to CarPlay list templates

bump some packages

components/CarPlay/ListTemplate.tsx

@@ -1,26 +1,57 @@
-import { queryClient } from '../../constants/query-client'
-import { QueryKeys } from '../../enums/query-keys'
+import { Image } from 'expo-image'
 import { BaseItemDto } from '@jellyfin/sdk/lib/generated-client/models'
 import { ListTemplate } from 'react-native-carplay'
+import { getImageApi } from '@jellyfin/sdk/lib/utils/api'
+import Client from '../../api/client'
 
-export default function ListItemTemplate(items: BaseItemDto[] | undefined): ListTemplate {
-	return new ListTemplate({
-		sections: [
-			{
-				items:
-					items?.map((item) => {
+interface ListItemImage {
+	id: string
+	url: string | null
+}
+
+export default async function ListItemTemplate(
+	items: BaseItemDto[] | undefined,
+): Promise<ListTemplate> {
+	if (items) {
+		const itemImages: ListItemImage[] = await Promise.all(
+			items.map(async (item): Promise<ListItemImage> => {
+				return Image.getCachePathAsync(
+					getImageApi(Client.api!).getItemImageUrlById(item.Id!),
+				).then((imageUri) => {
+					if (imageUri)
 						return {
 							id: item.Id!,
-							text: item.Name ?? 'Untitled',
-							image: {
-								uri: queryClient.getQueryData<string | undefined>([
-									QueryKeys.ItemImage,
-									item.Id!,
-								]),
-							},
+							url: imageUri,
+						} as ListItemImage
+					else {
+						return {
+							id: item.Id!,
+							url: getImageApi(Client.api!).getItemImageUrlById(item.Id!),
 						}
-					}) ?? [],
-			},
-		],
-	})
+					}
+				})
+			}),
+		)
+
+		return new ListTemplate({
+			sections: [
+				{
+					items:
+						items?.map((item) => {
+							return {
+								id: item.Id!,
+								text: item.Name ?? 'Untitled',
+								image: {
+									uri:
+										itemImages.find((itemImage) => itemImage.id === item.Id)!
+											.url ?? undefined,
+								},
+							}
+						}) ?? [],
+				},
+			],
+		})
+	} else {
+		return new ListTemplate({})
+	}
 }

package.json

@@ -31,8 +31,8 @@
     "@react-navigation/native": "^7.1.6",
     "@react-navigation/native-stack": "^7.1.1",
     "@react-navigation/stack": "^7.1.0",
-    "@tamagui/config": "^1.124.17",
-    "@tamagui/toast": "^1.124.17",
+    "@tamagui/config": "^1.125.34",
+    "@tamagui/toast": "^1.125.34",
     "@tanstack/query-sync-storage-persister": "^5.66.0",
     "@tanstack/react-query": "^5.66.0",
     "@tanstack/react-query-persist-client": "^5.66.0",
@@ -71,7 +71,7 @@
     "react-native-uuid": "^2.0.3",
     "react-native-vector-icons": "^10.2.0",
     "ruby": "^0.6.1",
-    "tamagui": "^1.124.17"
+    "tamagui": "^1.125.34"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",