diff --git a/api/mutations/functions/playlists.ts b/api/mutations/functions/playlists.ts index cfa2e14a..b40c67fd 100644 --- a/api/mutations/functions/playlists.ts +++ b/api/mutations/functions/playlists.ts @@ -1,6 +1,6 @@ import { BaseItemDto, MediaType } from "@jellyfin/sdk/lib/generated-client/models"; import Client from "../../../api/client"; -import { getPlaylistsApi } from "@jellyfin/sdk/lib/utils/api"; +import { getLibraryApi, getPlaylistsApi } from "@jellyfin/sdk/lib/utils/api"; export async function addToPlaylist(track: BaseItemDto, playlist: BaseItemDto) { @@ -40,7 +40,7 @@ export async function reorderPlaylist(playlistId: string, itemId: string, to: nu } export async function createPlaylist(name: string) { - console.debug("Creating new playlist"); + console.debug("Creating new playlist..."); return getPlaylistsApi(Client.api!) .createPlaylist({ @@ -52,6 +52,15 @@ export async function createPlaylist(name: string) { }); } +export async function deletePlaylist(playlistId: string) { + console.debug("Deleting playlist..."); + + return getLibraryApi(Client.api!) + .deleteItem({ + itemId: playlistId + }) +} + /** * Updates a Jellyfin playlist with the provided options. * diff --git a/api/queries/functions/playlists.ts b/api/queries/functions/playlists.ts index 38b42d75..fc07426e 100644 --- a/api/queries/functions/playlists.ts +++ b/api/queries/functions/playlists.ts @@ -20,7 +20,7 @@ export function fetchUserPlaylists( fields: [ "Path" ], - sortBy: defaultSorting.concat(sortBy), + sortBy: sortBy.concat(defaultSorting), sortOrder: [ SortOrder.Ascending ] diff --git a/components/Global/helpers/text.tsx b/components/Global/helpers/text.tsx index 5e1f2b88..be8d4063 100644 --- a/components/Global/helpers/text.tsx +++ b/components/Global/helpers/text.tsx @@ -18,7 +18,7 @@ interface LabelProps { export function Label(props: LabelProps): React.JSX.Element { return ( - { props.children } + { props.children } ) } diff --git a/components/Home/component.tsx b/components/Home/component.tsx index 5e757d0b..6cde7acc 100644 --- a/components/Home/component.tsx +++ b/components/Home/component.tsx @@ -1,13 +1,11 @@ import { StackParamList } from "../types"; import { ScrollView, RefreshControl } from "react-native"; -import { SafeAreaView } from "react-native-safe-area-context"; import { YStack, XStack, Separator } from "tamagui"; import Playlists from "./helpers/playlists"; import RecentArtists from "./helpers/recent-artists"; import RecentlyPlayed from "./helpers/recently-played"; import { useHomeContext } from "./provider"; import { H3 } from "../Global/helpers/text"; -import Avatar from "../Global/components/avatar"; import Client from "../../api/client"; import { usePlayerContext } from "../../player/provider"; import { useEffect } from "react"; @@ -30,7 +28,6 @@ export function ProvidedHome({ ]) return ( - - ); } \ No newline at end of file diff --git a/components/Home/stack.tsx b/components/Home/stack.tsx index 053b533e..6a378fd9 100644 --- a/components/Home/stack.tsx +++ b/components/Home/stack.tsx @@ -26,10 +26,10 @@ export default function Home(): React.JSX.Element { name="Home" component={ProvidedHome} options={{ - headerLargeTitle: true, - headerLargeTitleStyle: { - fontFamily: 'Aileron-Bold' - } + // headerLargeTitle: true, + // headerLargeTitleStyle: { + // fontFamily: 'Aileron-Bold' + // } }} /> diff --git a/components/Library/components/add-playlist.tsx b/components/Library/components/add-playlist.tsx index 7aa9d9d3..fc73c7d0 100644 --- a/components/Library/components/add-playlist.tsx +++ b/components/Library/components/add-playlist.tsx @@ -35,9 +35,9 @@ export default function AddPlaylist({ navigation.goBack(); - // Refresh user playlists component on home screen + // Refresh user playlists component in library queryClient.invalidateQueries({ - queryKey: [QueryKeys.UserPlaylists] + queryKey: [QueryKeys.FavoritePlaylists] }); }, onError: () => { diff --git a/components/Library/components/delete-playlist.tsx b/components/Library/components/delete-playlist.tsx new file mode 100644 index 00000000..603ea25a --- /dev/null +++ b/components/Library/components/delete-playlist.tsx @@ -0,0 +1,57 @@ +import { View, XStack } from "tamagui"; +import { DeletePlaylistProps } from "../../../components/types"; +import Button from "../../../components/Global/helpers/button"; +import { Text } from "../../../components/Global/helpers/text"; +import { useMutation } from "@tanstack/react-query"; +import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models"; +import { deletePlaylist } from "../../../api/mutations/functions/playlists"; +import { trigger } from "react-native-haptic-feedback"; +import { queryClient } from "../../../constants/query-client"; +import { QueryKeys } from "../../../enums/query-keys"; + +import * as Burnt from "burnt"; + +export default function DeletePlaylist( +{ + navigation, + route +}: DeletePlaylistProps) : React.JSX.Element { + + + const useDeletePlaylist = useMutation({ + mutationFn: (playlist: BaseItemDto) => deletePlaylist(playlist.Id!), + onSuccess: (data, playlist) => { + trigger("notificationSuccess"); + + navigation.goBack(); + navigation.goBack(); + Burnt.alert({ + title: `Playlist deleted`, + message: `Deleted ${playlist.Name ?? "Untitled Playlist"}`, + duration: 1, + preset: 'done' + }); + + // Refresh user playlists component in library + queryClient.invalidateQueries({ + queryKey: [QueryKeys.FavoritePlaylists] + }); + + + }, + onError: () => { + trigger("notificationError"); + } + }) + + return ( + + {`Delete playlist ${route.params.playlist.Name ?? "Untitled Playlist"}?`} + + + + + + + ) +} \ No newline at end of file diff --git a/components/Library/stack.tsx b/components/Library/stack.tsx index a22f7bdc..44d8c329 100644 --- a/components/Library/stack.tsx +++ b/components/Library/stack.tsx @@ -11,6 +11,7 @@ import TracksScreen from "../Tracks/screen"; import DetailsScreen from "../ItemDetail/screen"; import PlaylistsScreen from "../Playlists/screen"; import AddPlaylist from "./components/add-playlist"; +import DeletePlaylist from "./components/delete-playlist"; const Stack = createNativeStackNavigator(); @@ -111,6 +112,14 @@ export default function LibraryStack(): React.JSX.Element { title: "Add Playlist", }} /> + + diff --git a/components/Player/mini-player.tsx b/components/Player/mini-player.tsx index 21e780bc..5544e599 100644 --- a/components/Player/mini-player.tsx +++ b/components/Player/mini-player.tsx @@ -73,7 +73,7 @@ export function Miniplayer({ navigation }: { navigation : NavigationHelpers useSkip.mutate(undefined)} - /> + /> ) diff --git a/components/Playlist/component.tsx b/components/Playlist/component.tsx index 73cfa991..5393a178 100644 --- a/components/Playlist/component.tsx +++ b/components/Playlist/component.tsx @@ -1,7 +1,7 @@ import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models"; import { NativeStackNavigationProp } from "@react-navigation/native-stack"; import { StackParamList } from "../types"; -import { getTokens, Separator, XStack, YStack } from "tamagui"; +import { getToken, Separator, Spacer, XStack, YStack } from "tamagui"; import { useItemTracks } from "../../api/queries/tracks"; import { RunTimeTicks } from "../Global/helpers/time-codes"; import { H4, H5, Text } from "../Global/helpers/text"; @@ -45,14 +45,26 @@ export default function Playlist({ navigation.setOptions({ headerRight: () => { return ( - setEditing(!editing)} - /> + + + + { editing && ( + navigation.navigate("DeletePlaylist", { playlist })} + /> + + )} + + + + setEditing(!editing)} + /> + ) } }); diff --git a/components/types.d.ts b/components/types.d.ts index 571a8563..c2bf1197 100644 --- a/components/types.d.ts +++ b/components/types.d.ts @@ -26,6 +26,9 @@ export type StackParamList = { Tracks: undefined; Genres: undefined; Playlists: undefined; + DeletePlaylist: { + playlist: BaseItemDto + } Search: undefined; @@ -84,6 +87,7 @@ export type ArtistsProps = NativeStackScreenProps; export type AlbumsProps = NativeStackScreenProps; export type FavoritePlaylistsProps = NativeStackScreenProps; +export type DeletePlaylistProps = NativeStackScreenProps; export type FavoriteTracksProps = NativeStackScreenProps; diff --git a/tamagui.config.ts b/tamagui.config.ts index f8b28004..a13d9d45 100644 --- a/tamagui.config.ts +++ b/tamagui.config.ts @@ -5,6 +5,7 @@ import { headingFont, bodyFont } from './fonts.config' const tokens = createTokens({ ...TamaguiTokens, color: { + danger: "#ff0000", purpleDark: "#0C0622", purple: "#100538", purpleGray: "#66617B",