From 49ff9284140f2904a92f5562aef613381d40ce9c Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Mon, 9 Mar 2026 01:54:01 -0700
Subject: [PATCH] refactor artist header to better handle artist image from
 info endpoint

---
 .../components/album-artist-detail-header.tsx |  8 +++--
 .../routes/album-artist-detail-route.tsx      | 33 ++-----------------
 2 files changed, 8 insertions(+), 33 deletions(-)

diff --git a/src/renderer/features/artists/components/album-artist-detail-header.tsx b/src/renderer/features/artists/components/album-artist-detail-header.tsx
index 933b7363d..915337a10 100644
--- a/src/renderer/features/artists/components/album-artist-detail-header.tsx
+++ b/src/renderer/features/artists/components/album-artist-detail-header.tsx
@@ -185,12 +185,14 @@ export const AlbumArtistDetailHeader = forwardRef<HTMLDivElement, AlbumArtistDet
         const showRating = showRatings && detailQuery?.data?._serverType === ServerType.NAVIDROME;
 
         const selectedImageUrl = useMemo(() => {
-            return detailQuery.data?.imageUrl || artistInfoQuery.data?.imageUrl || imageUrl;
-        }, [artistInfoQuery.data?.imageUrl, detailQuery.data?.imageUrl, imageUrl]);
+            return detailQuery.data?.imageUrl || imageUrl;
+        }, [detailQuery.data?.imageUrl, imageUrl]);
+
+        const alternateImageUrl = artistInfoQuery.data?.imageUrl;
 
         return (
             <LibraryHeader
-                imageUrl={selectedImageUrl}
+                imageUrl={selectedImageUrl || alternateImageUrl}
                 item={{
                     imageId: detailQuery.data?.imageId,
                     imageUrl: detailQuery.data?.imageUrl,
diff --git a/src/renderer/features/artists/routes/album-artist-detail-route.tsx b/src/renderer/features/artists/routes/album-artist-detail-route.tsx
index 023075370..874f4de6f 100644
--- a/src/renderer/features/artists/routes/album-artist-detail-route.tsx
+++ b/src/renderer/features/artists/routes/album-artist-detail-route.tsx
@@ -1,8 +1,7 @@
-import { useQuery, useQueryClient, useSuspenseQueries } from '@tanstack/react-query';
-import { Suspense, useEffect, useRef } from 'react';
+import { useSuspenseQueries } from '@tanstack/react-query';
+import { Suspense, useRef } from 'react';
 import { useParams } from 'react-router';
 
-import { queryKeys } from '/@/renderer/api/query-keys';
 import { useItemImageUrl } from '/@/renderer/components/item-image/item-image';
 import { NativeScrollArea } from '/@/renderer/components/native-scroll-area/native-scroll-area';
 import { albumQueries } from '/@/renderer/features/albums/api/album-api';
@@ -20,12 +19,7 @@ import { PageErrorBoundary } from '/@/renderer/features/shared/components/page-e
 import { useFastAverageColor } from '/@/renderer/hooks';
 import { useArtistBackground, useCurrentServer, useCurrentServerId } from '/@/renderer/store';
 import { Spinner } from '/@/shared/components/spinner/spinner';
-import {
-    AlbumArtistDetailResponse,
-    AlbumListSort,
-    LibraryItem,
-    SortOrder,
-} from '/@/shared/types/domain-types';
+import { AlbumListSort, LibraryItem, SortOrder } from '/@/shared/types/domain-types';
 
 const AlbumArtistDetailRouteContent = () => {
     const scrollAreaRef = useRef<HTMLDivElement>(null);
@@ -33,7 +27,6 @@ const AlbumArtistDetailRouteContent = () => {
     const server = useCurrentServer();
     const serverId = useCurrentServerId();
     const { artistBackground, artistBackgroundBlur } = useArtistBackground();
-    const queryClient = useQueryClient();
 
     const { albumArtistId, artistId } = useParams() as {
         albumArtistId?: string;
@@ -42,26 +35,6 @@ const AlbumArtistDetailRouteContent = () => {
 
     const routeId = (artistId || albumArtistId) as string;
 
-    const artistInfoQuery = useQuery({
-        ...artistsQueries.albumArtistInfo({
-            query: { id: routeId, limit: 10 },
-            serverId: server?.id,
-        }),
-        enabled: Boolean(server?.id && routeId),
-    });
-
-    useEffect(() => {
-        const data = artistInfoQuery.data;
-        if (!data?.imageUrl || !server?.id || !routeId) return;
-        queryClient.setQueryData(
-            queryKeys.albumArtists.detail(server.id, { id: routeId }),
-            (prev: AlbumArtistDetailResponse | undefined) => {
-                if (!prev) return prev;
-                return { ...prev, imageUrl: data.imageUrl ?? prev.imageUrl };
-            },
-        );
-    }, [artistInfoQuery.data, queryClient, routeId, server?.id]);
-
     const [detailQuery, albumsQuery] = useSuspenseQueries({
         queries: [
             artistsQueries.albumArtistDetail({ query: { id: routeId }, serverId: server?.id }),