diff --git a/src/components/AddToPlaylist/index.tsx b/src/components/AddToPlaylist/index.tsx index 9cca9cba..57734051 100644 --- a/src/components/AddToPlaylist/index.tsx +++ b/src/components/AddToPlaylist/index.tsx @@ -1,7 +1,7 @@ import { UseInfiniteQueryResult, useMutation, InfiniteData } from '@tanstack/react-query' import { BaseItemDto } from '@jellyfin/sdk/lib/generated-client/models' -import { addManyToPlaylist } from '../../api/mutations/playlists' -import { YStack, XStack, Spacer, Spinner, View } from 'tamagui' +import { addManyToPlaylist, createPlaylist } from '../../api/mutations/playlists' +import { YStack, XStack, Spacer, Spinner, View, Separator } from 'tamagui' import Icon from '../Global/components/icon' import { AddToPlaylistMutation } from './types' import { Text } from '../Global/helpers/text' @@ -17,6 +17,7 @@ import { FlashList, ViewToken } from '@shopify/flash-list' import { useState } from 'react' import { queryClient } from '../../constants/query-client' import { PlaylistTracksQueryKey } from '../../api/queries/playlist/keys' +import Toast from 'react-native-toast-message' export default function AddToPlaylist({ tracks, @@ -77,6 +78,7 @@ export default function AddToPlaylist({ visible={visiblePlaylistIds.includes(playlist.Id!)} /> )} + ListHeaderComponent={} keyExtractor={(item) => item.Id!} onViewableItemsChanged={onViewableItemsChanged} /> @@ -85,6 +87,72 @@ export default function AddToPlaylist({ ) } +function CreateNewPlaylistRow({ tracks }: { tracks: BaseItemDto[] }): React.JSX.Element { + const trigger = useHapticFeedback() + const { refetch } = useUserPlaylists() + + const useCreateAndAddToPlaylist = useMutation({ + mutationFn: async () => { + trigger('impactLight') + const api = getApi() + const user = getUser() + const name = `New Playlist ${new Date().toLocaleDateString()}` + await createPlaylist(api, user, name) + // Refetch to get the new playlist + await refetch() + }, + onSuccess: () => { + trigger('notificationSuccess') + Toast.show({ + text1: 'Playlist created', + text2: 'Select the new playlist to add tracks', + type: 'success', + }) + }, + onError: (error) => { + console.error(error) + trigger('notificationError') + Toast.show({ + text1: 'Failed to create playlist', + type: 'error', + }) + }, + }) + + return ( + <> + useCreateAndAddToPlaylist.mutate()} + > + + + + + + + Create New Playlist + + + + {useCreateAndAddToPlaylist.isPending && } + + + + ) +} + function AddToPlaylistRow({ playlist, tracks, diff --git a/src/components/Artist/similar.tsx b/src/components/Artist/similar.tsx index f766df21..4441dde7 100644 --- a/src/components/Artist/similar.tsx +++ b/src/components/Artist/similar.tsx @@ -26,6 +26,8 @@ export default function SimilarArtists(): React.JSX.Element { (