From 458111546a9559201e4958cb8147df59a462bb38 Mon Sep 17 00:00:00 2001
From: Violet Caulfield <violet@cosmonautical.cloud>
Date: Wed, 15 Jan 2025 16:06:15 -0600
Subject: [PATCH] Add favorites icon to artist page

---
 components/Artist/component.tsx            | 25 +++++++++++++++++-----
 components/Artist/screens/index.tsx        |  4 ++--
 components/Artists/component.tsx           |  7 +-----
 components/Favorites/component.tsx         |  2 +-
 components/Home/component.tsx              |  2 +-
 components/Home/helpers/recent-artists.tsx |  3 +--
 components/Player/screens/index.tsx        |  3 +--
 components/types.tsx                       |  3 +--
 8 files changed, 28 insertions(+), 21 deletions(-)

diff --git a/components/Artist/component.tsx b/components/Artist/component.tsx
index 7a1f6b1c..fc7b5b49 100644
--- a/components/Artist/component.tsx
+++ b/components/Artist/component.tsx
@@ -8,26 +8,41 @@ import { StackParamList } from "../types";
 import { H2 } from "../Global/helpers/text";
 import { useState } from "react";
 import { CachedImage } from "@georstat/react-native-image-cache";
-import { ImageType } from "@jellyfin/sdk/lib/generated-client/models";
+import { BaseItemDto, ImageType } from "@jellyfin/sdk/lib/generated-client/models";
 import { queryConfig } from "@/api/queries/query.config";
 import { getImageApi } from "@jellyfin/sdk/lib/utils/api";
 import { SafeAreaView, useSafeAreaFrame } from "react-native-safe-area-context";
+import Icon from "../Global/helpers/icon";
+import { Colors } from "@/enums/colors";
 
 interface ArtistProps {
-    artistId: string,
-    artistName: string,
+    artist: BaseItemDto
     navigation: NativeStackNavigationProp<StackParamList>
 }
 
 export default function Artist(props: ArtistProps): React.JSX.Element {
 
+    props.navigation.setOptions({
+        headerRight: () => { 
+            return (
+                <Icon
+                    name={props.artist.UserData?.IsFavorite ?? false ? "heart" : "heart-outline"}
+                    color={Colors.Primary}
+                    onPress={() => {
+                        
+                    }}
+                />
+            )
+        }
+    });
+
     const [columns, setColumns] = useState<number>(2);
 
     const { apiClient } = useApiClientContext();
 
     const { width } = useSafeAreaFrame();
 
-    const { data: albums } = useArtistAlbums(props.artistId, apiClient!);
+    const { data: albums } = useArtistAlbums(props.artist.Id!, apiClient!);
 
     return (
         <SafeAreaView edges={["top", "right", "left"]}>
@@ -37,7 +52,7 @@ export default function Artist(props: ArtistProps): React.JSX.Element {
                 <CachedImage
                     source={getImageApi(apiClient!)
                         .getItemImageUrlById(
-                            props.artistId,
+                            props.artist.Id!,
                             ImageType.Primary,
                             { ...queryConfig.banners})
                         } 
diff --git a/components/Artist/screens/index.tsx b/components/Artist/screens/index.tsx
index a1cc9f66..13c0de8b 100644
--- a/components/Artist/screens/index.tsx
+++ b/components/Artist/screens/index.tsx
@@ -10,10 +10,10 @@ export function ArtistScreen({
     route: RouteProp<StackParamList, "Artist">, 
     navigation: NativeStackNavigationProp<StackParamList>
 }): React.JSX.Element {
+
     return (
         <Artist 
-            artistId={route.params.artistId}
-            artistName={route.params.artistName}
+            artist={route.params.artist}
             navigation={navigation}
         />
     );
diff --git a/components/Artists/component.tsx b/components/Artists/component.tsx
index 6507931d..38974931 100644
--- a/components/Artists/component.tsx
+++ b/components/Artists/component.tsx
@@ -32,12 +32,7 @@ export default function Artists({ navigation }: ArtistsProps): React.JSX.Element
                             itemId={artist.Id!}
                             caption={artist.Name ?? "Unknown Artist"}
                             onPress={() => {
-                                navigation.navigate("Artist",
-                                    {
-                                        artistId: artist.Id!,
-                                        artistName: artist.Name!
-                                    }
-                                )
+                                navigation.navigate("Artist", { artist })
                             }}
                             width={width / 2.1}
                         />
diff --git a/components/Favorites/component.tsx b/components/Favorites/component.tsx
index 2d0caabb..85b7f0f5 100644
--- a/components/Favorites/component.tsx
+++ b/components/Favorites/component.tsx
@@ -32,7 +32,7 @@ export default function Library(): React.JSX.Element {
                 name="Artist" 
                 component={ArtistScreen} 
                 options={({ route }) => ({
-                    title: route.params.artistName,
+                    title: route.params.artist.Name ?? "Unknown Artist",
                     headerLargeTitle: true,
                     headerLargeTitleStyle: {
                         fontFamily: 'Aileron-Bold'
diff --git a/components/Home/component.tsx b/components/Home/component.tsx
index 699de40e..eda12397 100644
--- a/components/Home/component.tsx
+++ b/components/Home/component.tsx
@@ -37,7 +37,7 @@ export default function Home(): React.JSX.Element {
                     name="Artist" 
                     component={ArtistScreen} 
                     options={({ route }) => ({
-                        title: route.params.artistName,
+                        title: route.params.artist.Name ?? "Unknown Artist",
                         headerLargeTitle: true,
                         headerLargeTitleStyle: {
                             fontFamily: 'Aileron-Bold'
diff --git a/components/Home/helpers/recent-artists.tsx b/components/Home/helpers/recent-artists.tsx
index 0e7735e1..ff61949b 100644
--- a/components/Home/helpers/recent-artists.tsx
+++ b/components/Home/helpers/recent-artists.tsx
@@ -26,8 +26,7 @@ export default function RecentArtists({ navigation }: ProvidedHomeProps): React.
                             onPress={() => {
                                 navigation.navigate('Artist', 
                                     { 
-                                        artistId: recentArtist.Id!, 
-                                        artistName: recentArtist.Name ?? "Unknown Artist" 
+                                        artist: recentArtist, 
                                     }
                                 )}
                             }>
diff --git a/components/Player/screens/index.tsx b/components/Player/screens/index.tsx
index f96d87df..75d87931 100644
--- a/components/Player/screens/index.tsx
+++ b/components/Player/screens/index.tsx
@@ -92,8 +92,7 @@ export default function PlayerScreen({ navigation }: { navigation: NativeStackNa
                                 onPress={() => {
                                     navigation.goBack(); // Dismiss player modal
                                     navigation.push("Artist", {
-                                        artistName: nowPlaying!.item.ArtistItems![0].Name ?? "Untitled",
-                                        artistId: nowPlaying!.item.ArtistItems![0].Id!,
+                                        artist: nowPlaying!.item.ArtistItems![0],
                                     })
                                 }}
                             >
diff --git a/components/types.tsx b/components/types.tsx
index f12cb718..ce483b00 100644
--- a/components/types.tsx
+++ b/components/types.tsx
@@ -17,8 +17,7 @@ export type StackParamList = {
     Player: undefined,
     Queue: undefined,
     Artist: { 
-        artistId: string,
-        artistName: string
+        artist: BaseItemDto
     };
     Album: {
         album: BaseItemDto