diff --git a/components/Albums/component.tsx b/components/Albums/component.tsx index b65042df..aa34e52f 100644 --- a/components/Albums/component.tsx +++ b/components/Albums/component.tsx @@ -1,26 +1,18 @@ import { AlbumsProps } from '../types' -import { useSafeAreaFrame } from 'react-native-safe-area-context' import { ItemCard } from '../Global/components/item-card' import { FlatList, RefreshControl } from 'react-native' import { useQuery } from '@tanstack/react-query' import { QueryKeys } from '../../enums/query-keys' import { fetchFavoriteAlbums } from '../../api/queries/functions/favorites' -import { fetchRecentlyAdded } from '../../api/queries/functions/recents' -import { QueryConfig } from '../../api/queries/query.config' export default function Albums({ navigation, route }: AlbumsProps): React.JSX.Element { - const fetchRecentlyAddedAlbums = route.params.query === QueryKeys.RecentlyAdded - const { data: albums, refetch, isPending, } = useQuery({ - queryKey: [route.params.query], - queryFn: () => - fetchRecentlyAddedAlbums - ? fetchRecentlyAdded(QueryConfig.limits.recents * 4, QueryConfig.limits.recents) - : fetchFavoriteAlbums(), + queryKey: [QueryKeys.FavoriteAlbums], + queryFn: fetchFavoriteAlbums, }) return ( @@ -31,7 +23,7 @@ export default function Albums({ navigation, route }: AlbumsProps): React.JSX.El }} contentInsetAdjustmentBehavior='automatic' numColumns={2} - data={albums} + data={route.params.albums ? route.params.albums : albums ? albums : []} refreshControl={} renderItem={({ index, item: album }) => ( ( } > -

{`Recently added`}

diff --git a/components/Discover/helpers/just-added.tsx b/components/Discover/helpers/just-added.tsx index fb9f2e68..a5bb3406 100644 --- a/components/Discover/helpers/just-added.tsx +++ b/components/Discover/helpers/just-added.tsx @@ -1,9 +1,11 @@ import { StackParamList } from '../../../components/types' import { NativeStackNavigationProp } from '@react-navigation/native-stack' -import { QueryKeys } from '../../../enums/query-keys' import HorizontalCardList from '../../../components/Global/components/horizontal-list' import { ItemCard } from '../../../components/Global/components/item-card' import { useDiscoverContext } from '../provider' +import { View, XStack } from 'tamagui' +import { H2 } from '../../../components/Global/helpers/text' +import Icon from '../../../components/Global/helpers/icon' export default function RecentlyAdded({ navigation, @@ -13,28 +15,42 @@ export default function RecentlyAdded({ const { recentlyAdded } = useDiscoverContext() return ( - { - navigation.navigate('Albums', { - query: QueryKeys.RecentlyAdded, - }) - }} - renderItem={({ item }) => ( - { - navigation.navigate('Album', { - album: item, - }) - }} - /> - )} - /> + + { + navigation.navigate('Albums', { + albums: recentlyAdded, + }) + }} + > +

Recently Added

+ +
+ + 10 ? recentlyAdded!.slice(0, 10) : recentlyAdded} + onSeeMore={() => { + navigation.navigate('Albums', { + albums: recentlyAdded, + }) + }} + renderItem={({ item }) => ( + { + navigation.navigate('Album', { + album: item, + }) + }} + /> + )} + /> +
) } diff --git a/components/Library/categories.ts b/components/Library/categories.ts index 83b31106..4ffcb2e8 100644 --- a/components/Library/categories.ts +++ b/components/Library/categories.ts @@ -7,19 +7,15 @@ interface CategoryRoute { name: any // ¯\_(ツ)_/¯ iconName: string params?: { - query?: QueryKeys queue?: Queue tracks?: BaseItemDto[] + artists?: BaseItemDto[] } } const Categories: CategoryRoute[] = [ - { - name: 'Artists', - iconName: 'microphone-variant', - params: { query: QueryKeys.FavoriteArtists }, - }, - { name: 'Albums', iconName: 'music-box-multiple', params: { query: QueryKeys.FavoriteAlbums } }, + { name: 'Artists', iconName: 'microphone-variant', params: {} }, + { name: 'Albums', iconName: 'music-box-multiple', params: {} }, { name: 'Tracks', iconName: 'music-note', params: { queue: 'Favorite Tracks' } }, { name: 'Playlists', iconName: 'playlist-music' }, ] diff --git a/components/Player/screens/index.tsx b/components/Player/screens/index.tsx index 2ad0eec6..00f1265d 100644 --- a/components/Player/screens/index.tsx +++ b/components/Player/screens/index.tsx @@ -22,7 +22,7 @@ export default function PlayerScreen({ }: { navigation: NativeStackNavigationProp }): React.JSX.Element { - const { nowPlayingIsFavorite, setNowPlayingIsFavorite, nowPlaying } = usePlayerContext() + const { nowPlaying } = usePlayerContext() const { queueRef } = useQueueContext() @@ -155,10 +155,7 @@ export default function PlayerScreen({ - setNowPlayingIsFavorite(!nowPlayingIsFavorite)} - /> + diff --git a/components/types.d.ts b/components/types.d.ts index ce2d8db4..d3197643 100644 --- a/components/types.d.ts +++ b/components/types.d.ts @@ -34,7 +34,7 @@ export type StackParamList = { artists: BaseItemDto[] | undefined } Albums: { - query: QueryKeys.FavoriteAlbums | QueryKeys.RecentlyAdded + albums: BaseItemDto[] | undefined } Tracks: { tracks: BaseItemDto[] | undefined diff --git a/jest.config.js b/jest.config.js index 7482f200..4b8eb5bb 100644 --- a/jest.config.js +++ b/jest.config.js @@ -3,11 +3,13 @@ module.exports = { preset: 'jest-expo', setupFiles: ['./node_modules/react-native-gesture-handler/jestSetup.js'], setupFilesAfterEnv: [ - './jest/setup.js', - './jest/setup-carplay.js', - './jest/setup-blurhash.js', - './jest/setup-reanimated.js', - './jest/setup-rnfs.js', + './jest/setup.ts', + './jest/setup-carplay.ts', + './jest/setup-blurhash.ts', + './jest/setup-device-info.js', // JS to prevent Typescript implicit any warning + './jest/setup-reanimated.ts', + './jest/setup-rnfs.ts', + './jest/setup-rntp.ts', './tamagui.config.ts', ], extensionsToTreatAsEsm: ['.ts', '.tsx'], diff --git a/jest/App.test.tsx b/jest/App.test.tsx index dc699f7b..bbfacce3 100644 --- a/jest/App.test.tsx +++ b/jest/App.test.tsx @@ -1,7 +1,3 @@ -/** - * @format - */ - import 'react-native' import React from 'react' import App from '../App' diff --git a/jest/PlayerProvider.test.tsx b/jest/PlayerProvider.test.tsx new file mode 100644 index 00000000..2f161b07 --- /dev/null +++ b/jest/PlayerProvider.test.tsx @@ -0,0 +1,22 @@ +import 'react-native' +import React from 'react' +import { render } from '@testing-library/react-native' + +import { QueryClient, QueryClientProvider } from '@tanstack/react-query' +import { QueueProvider } from '../player/queue-provider' +import { PlayerProvider } from '../player/player-provider' +import { View } from 'react-native' + +const queryClient = new QueryClient() + +test(`${PlayerProvider.name} renders correctly`, () => { + render( + + + + + + + , + ) +}) diff --git a/jest/QueueProvider.test.tsx b/jest/QueueProvider.test.tsx new file mode 100644 index 00000000..a8079f65 --- /dev/null +++ b/jest/QueueProvider.test.tsx @@ -0,0 +1,47 @@ +import 'react-native' +import React from 'react' +import { render, screen, waitFor } from '@testing-library/react-native' + +import { QueryClient, QueryClientProvider } from '@tanstack/react-query' +import { QueueProvider, useQueueContext } from '../player/queue-provider' +import { Button, Text } from 'react-native' +import { Event } from 'react-native-track-player' +import { eventHandler } from './setup-rntp' + +const queryClient = new QueryClient() + +const QueueConsumer = () => { + const { currentIndex, useSkip } = useQueueContext() + + return ( + <> + {currentIndex} + +