smol fixes, change to image handling

api/queries/functions/images.ts

@@ -2,7 +2,6 @@ import { ImageFormat, ImageType } from "@jellyfin/sdk/lib/generated-client/model
 import { getImageApi } from "@jellyfin/sdk/lib/utils/api"
 import _ from "lodash"
 import Client from "../../../api/client"
-import { Dirs, FileSystem } from 'react-native-file-access'
 
 export function fetchItemImage(itemId: string, imageType: ImageType, width: number, height: number) {
     
@@ -10,14 +9,8 @@ export function fetchItemImage(itemId: string, imageType: ImageType, width: numb
 
         console.debug("Fetching item image");
 
-        // Make sure images folder exists in cache, create if it doesn't
-        if (!(await FileSystem.exists(`${Dirs.CacheDir}/images`)))
-            await FileSystem.mkdir(`${Dirs.CacheDir}/images`)
-
-        const existingImage = await FileSystem.exists(getImageFilePath(itemId, width, height, imageType));
-
-        if (existingImage)
-            resolve(await FileSystem.readFile(getImageFilePath(itemId, width, height, imageType)));
+        if (!!!Client.api) 
+            return reject("Client instance not set")
         else
             getImageApi(Client.api!)
                 .getItemImage({
@@ -34,13 +27,9 @@ export function fetchItemImage(itemId: string, imageType: ImageType, width: numb
 
                 if (response.status < 300) {
 
-
-                    FileSystem.writeFile(getImageFilePath(itemId, width, height, imageType), await blobToBase64(response.data))
-                    .then(async () => {
-                        resolve(await FileSystem.readFile(getImageFilePath(itemId, width, height, imageType)));
-                    })
+                    return resolve(await blobToBase64(response.data))
                 } else {
-                    reject();
+                    return reject("Invalid image response");
                 }
             }).catch((error) => {
                 console.error(error);
@@ -49,10 +38,6 @@ export function fetchItemImage(itemId: string, imageType: ImageType, width: numb
     });
 }
 
-export function getImageFilePath(itemId: string, width: number, height: number, imageType: ImageType) {
-    return `${Dirs.CacheDir}/images/${itemId}_${imageType}_${width}x${height}.png`
-}
-
 function blobToBase64(blob : Blob) {
     return new Promise<string>((resolve, _) => {
       const reader = new FileReader();

components/ItemDetail/helpers/TrackOptions.tsx

@@ -150,13 +150,16 @@ export default function TrackOptions({
                         { playlists.map(playlist => {
 
                             return (
-                                <YGroup.Item>
-                                    <ListItem hoverTheme onPress={() => {
-                                        useAddToPlaylist.mutate({
-                                            track,
-                                            playlist
-                                        })
-                                    }}>
+                                <YGroup.Item key={playlist.Id!}>
+                                    <ListItem 
+                                        hoverTheme 
+                                        onPress={() => {
+                                            useAddToPlaylist.mutate({
+                                                track,
+                                                playlist
+                                            })
+                                        }}
+                                    >
                                         <XStack alignItems="center">
                                             <YStack flex={1}>