get rid of this lousy useeffect

fix home screen show more artists?

components/Artists/component.tsx

@@ -16,11 +16,6 @@ export default function Artists({
 
     const { data: artists, refetch, isPending } = 
         route.params.query === 
-            QueryKeys.FavoriteArtists ? useQuery({
-                queryKey: [QueryKeys.FavoriteArtists],
-                queryFn: () => fetchFavoriteArtists()
-            }) : 
-            
             QueryKeys.RecentlyPlayedArtists ? useQuery({
                 queryKey: [QueryKeys.RecentlyPlayedArtists, QueryConfig.limits.recents * 4, QueryConfig.limits.recents],
                 queryFn: () => fetchRecentlyPlayedArtists(QueryConfig.limits.recents * 4, QueryConfig.limits.recents)

components/Global/components/favorite-button.tsx

@@ -32,8 +32,8 @@ export default function FavoriteButton({
 
     const { data, isFetching, isFetched, refetch } = useQuery({
         queryKey: [QueryKeys.UserData, item.Id!],
-        queryFn: () => fetchUserData(item.Id!)
-    });;
+        queryFn: () => fetchUserData(item.Id!),
+    });
 
     const useSetFavorite = useMutation({
         mutationFn: async (mutation: SetFavoriteMutation) => {
@@ -86,17 +86,6 @@ export default function FavoriteButton({
             useSetFavorite.mutate({ item })
     }
 
-    useEffect(() => {
-        if (isFetched 
-            && !isUndefined(data) 
-            && !isUndefined(data.IsFavorite)
-        )
-            setIsFavorite(data.IsFavorite)
-    }, [
-        isFetched,
-        data
-    ])
-
     useEffect(() => {
         refetch();
     }, [
@@ -108,7 +97,7 @@ export default function FavoriteButton({
             <Spinner />
         ) : (
             <Icon
-                name={isFavorite ? "heart" : "heart-outline"}
+                name={data?.IsFavorite ?? isFavorite ? "heart" : "heart-outline"}
                 color={getTokens().color.telemagenta.val}
                 onPress={toggleFavorite}
             />