refactor artist header to better handle artist image from info endpoint

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,

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 }),