From 552b1dcd59dc8deb4a7297c2b7ee66c252ab51a4 Mon Sep 17 00:00:00 2001
From: Violet Caulfield <violet@cosmonautical.cloud>
Date: Thu, 13 Feb 2025 10:13:13 -0600
Subject: [PATCH] fix item detail hook

---
 .../ItemDetail/helpers/TrackOptions.tsx       | 42 +++++++++----------
 1 file changed, 21 insertions(+), 21 deletions(-)

diff --git a/components/ItemDetail/helpers/TrackOptions.tsx b/components/ItemDetail/helpers/TrackOptions.tsx
index 9648823e..82468dfd 100644
--- a/components/ItemDetail/helpers/TrackOptions.tsx
+++ b/components/ItemDetail/helpers/TrackOptions.tsx
@@ -41,6 +41,26 @@ export default function TrackOptions({
     const { useAddToQueue } = usePlayerContext();
 
     const { width } = useSafeAreaFrame();
+
+    const useAddToPlaylist = useMutation({
+        mutationFn: ({ track, playlist }: AddToPlaylistMutation) => {
+            return addToPlaylist(track, playlist)
+        },
+        onSuccess: (data, { playlist }) => {
+            trigger("notificationSuccess");
+
+            queryClient.invalidateQueries({
+                queryKey: [QueryKeys.UserPlaylists]
+            });
+
+            queryClient.invalidateQueries({
+                queryKey: [QueryKeys.ItemTracks, playlist.Id!, false],
+            });                                    
+        },
+        onError: () => {
+            trigger("notificationError")
+        }
+    })
     
     return (
         <YStack width={width}>
@@ -98,7 +118,7 @@ export default function TrackOptions({
                 <Spinner />
             )}
 
-            { playlistsFetchSuccess && (
+            { !playlistsFetchPending && playlistsFetchSuccess && (
                 <>
                     <Text 
                         bold 
@@ -110,26 +130,6 @@ export default function TrackOptions({
                     <YGroup separator={(<Separator />)}>
                         { playlists.map(playlist => {
 
-                            const useAddToPlaylist = useMutation({
-                                mutationFn: ({ track, playlist }: AddToPlaylistMutation) => {
-                                    return addToPlaylist(track, playlist)
-                                },
-                                onSuccess: (data, { playlist }) => {
-                                    trigger("notificationSuccess");
-
-                                    queryClient.invalidateQueries({
-                                        queryKey: [QueryKeys.UserPlaylists]
-                                    });
-
-                                    queryClient.invalidateQueries({
-                                        queryKey: [QueryKeys.ItemTracks, playlist.Id!, false],
-                                    });                                    
-                                },
-                                onError: () => {
-                                    trigger("notificationError")
-                                }
-                            })
-
                             return (
                                 <YGroup.Item>
                                     <ListItem hoverTheme onPress={() => {