diff --git a/src/components/CarPlay/Home.tsx b/src/components/CarPlay/Home.tsx index 06f7529f..7e8b90ce 100644 --- a/src/components/CarPlay/Home.tsx +++ b/src/components/CarPlay/Home.tsx @@ -7,6 +7,7 @@ import ArtistsTemplate from './Artists' import uuid from 'react-native-uuid' import { Api } from '@jellyfin/sdk' import { JellifyUser } from '../../types/JellifyUser' +import { InfiniteData } from '@tanstack/react-query' const CarPlayHome = (api: Api, user: JellifyUser, sessionId: string) => new ListTemplate({ @@ -40,35 +41,41 @@ const CarPlayHome = (api: Api, user: JellifyUser, sessionId: string) => switch (index) { case 0: { // Recent Artists - const artists = - queryClient.getQueryData([ - QueryKeys.RecentlyPlayedArtists, - ]) ?? [] - CarPlay.pushTemplate(ArtistsTemplate(artists)) + const artists = queryClient.getQueryData>([ + QueryKeys.RecentlyPlayedArtists, + ]) ?? { pages: [], pageParams: [] } + CarPlay.pushTemplate(ArtistsTemplate(artists.pages.flat())) break } case 1: { // Recent Tracks - const items = - queryClient.getQueryData([QueryKeys.RecentlyPlayed]) ?? [] - CarPlay.pushTemplate(TracksTemplate(api, sessionId, items, 'Recently Played')) + const items = queryClient.getQueryData>([ + QueryKeys.RecentlyPlayed, + ]) ?? { pages: [], pageParams: [] } + CarPlay.pushTemplate( + TracksTemplate(api, sessionId, items.pages.flat(), 'Recently Played'), + ) break } case 2: { // Most Played Artists - const artists = - queryClient.getQueryData([QueryKeys.FrequentArtists]) ?? [] - CarPlay.pushTemplate(ArtistsTemplate(artists)) + const artists = queryClient.getQueryData>([ + QueryKeys.FrequentArtists, + ]) ?? { pages: [], pageParams: [] } + CarPlay.pushTemplate(ArtistsTemplate(artists.pages.flat())) break } case 3: { // On Repeat - const items = - queryClient.getQueryData([QueryKeys.FrequentlyPlayed]) ?? [] - CarPlay.pushTemplate(TracksTemplate(api, sessionId, items, 'On Repeat')) + const items = queryClient.getQueryData>([ + QueryKeys.FrequentlyPlayed, + ]) ?? { pages: [], pageParams: [] } + CarPlay.pushTemplate( + TracksTemplate(api, sessionId, items.pages.flat(), 'On Repeat'), + ) break } } diff --git a/src/components/Global/components/item.tsx b/src/components/Global/components/item.tsx index 0195ab6c..8c954cb6 100644 --- a/src/components/Global/components/item.tsx +++ b/src/components/Global/components/item.tsx @@ -1,9 +1,8 @@ import { StackParamList } from '../../../components/types' import { BaseItemDto } from '@jellyfin/sdk/lib/generated-client/models' import { NativeStackNavigationProp } from '@react-navigation/native-stack' -import { getTokens, Separator, Spacer, View, XStack, YStack } from 'tamagui' +import { XStack, YStack } from 'tamagui' import { Text } from '../helpers/text' -import { useSafeAreaFrame } from 'react-native-safe-area-context' import Icon from './icon' import { QueuingType } from '../../../enums/queuing-type' import { RunTimeTicks } from '../helpers/time-codes' @@ -12,8 +11,7 @@ import { usePlayerContext } from '../../../providers/Player' import ItemImage from './image' import FavoriteIcon from './favorite-icon' import { Gesture, GestureDetector } from 'react-native-gesture-handler' -import { UseMutationResult } from '@tanstack/react-query' -import { QueueMutation } from '@/src/player/interfaces' +import { runOnJS } from 'react-native-reanimated' export default function Item({ item, @@ -27,29 +25,30 @@ export default function Item({ const { useStartPlayback } = usePlayerContext() const { useLoadNewQueue } = useQueueContext() - const gesture = Gesture.Tap() - .maxDistance(10) - .onEnd((e, success) => { - if (success) { - switch (item.Type) { - case 'Audio': { - useLoadNewQueue.mutate( - { - track: item, - tracklist: [item], - index: 0, - queue: 'Search', - queuingType: QueuingType.FromSelection, - }, - { - onSuccess: () => useStartPlayback.mutate(), - }, - ) - break - } - } + const gestureCallback = runOnJS(() => { + switch (item.Type) { + case 'Audio': { + useLoadNewQueue.mutate( + { + track: item, + tracklist: [item], + index: 0, + queue: 'Search', + queuingType: QueuingType.FromSelection, + }, + { + onSuccess: () => useStartPlayback.mutate(), + }, + ) + break } - }) + default: { + break + } + } + }) + + const gesture = Gesture.Tap().onEnd(gestureCallback) return (