antebudimir/feishin
1
0
Fork 0
mirror of https://github.com/antebudimir/feishin.git synced 2026-01-01 18:33:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

handle playback on new artist list

Browse source
This commit is contained in:
jeffvli 2025-05-06 14:43:42 -07:00
parent b9611589ba
commit 4a3604b1a8
12 changed files with 121 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

28
src/renderer/features/artists/components/album-artist-detail-content.tsx
View file

@ -66,7 +66,11 @@ interface AlbumArtistDetailContentProps {
export const AlbumArtistDetailContent = ({ background }: AlbumArtistDetailContentProps) => {
const { t } = useTranslation();
const { artistItems, externalLinks } = useGeneralSettings();
const { albumArtistId } = useParams() as { albumArtistId: string };
const { albumArtistId, artistId } = useParams() as {
albumArtistId?: string;
artistId?: string;
};
const routeId = (artistId || albumArtistId) as string;
const cq = useContainerQuery();
const handlePlayQueueAdd = usePlayQueueAdd();
const server = useCurrentServer();
@ -85,24 +89,24 @@ export const AlbumArtistDetailContent = ({ background }: AlbumArtistDetailConten
}, [artistItems]);
const detailQuery = useAlbumArtistDetail({
query: { id: albumArtistId },
query: { id: routeId },
serverId: server?.id,
});
const artistDiscographyLink = `${generatePath(
AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL_DISCOGRAPHY,
{
albumArtistId,
albumArtistId: routeId,
},
)}?${createSearchParams({
artistId: albumArtistId,
artistId: routeId,
artistName: detailQuery?.data?.name || '',
})}`;
const artistSongsLink = `${generatePath(AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL_SONGS, {
albumArtistId,
albumArtistId: routeId,
})}?${createSearchParams({
artistId: albumArtistId,
artistId: routeId,
artistName: detailQuery?.data?.name || '',
})}`;
@ -111,7 +115,7 @@ export const AlbumArtistDetailContent = ({ background }: AlbumArtistDetailConten
enabled: enabledItem.recentAlbums,
},
query: {
artistIds: [albumArtistId],
artistIds: [routeId],
limit: 15,
sortBy: AlbumListSort.RELEASE_DATE,
sortOrder: SortOrder.DESC,
@ -125,7 +129,7 @@ export const AlbumArtistDetailContent = ({ background }: AlbumArtistDetailConten
enabled: enabledItem.compilations && server?.type !== ServerType.SUBSONIC,
},
query: {
artistIds: [albumArtistId],
artistIds: [routeId],
compilation: true,
limit: 15,
sortBy: AlbumListSort.RELEASE_DATE,
@ -141,7 +145,7 @@ export const AlbumArtistDetailContent = ({ background }: AlbumArtistDetailConten
},
query: {
artist: detailQuery?.data?.name || '',
artistId: albumArtistId,
artistId: routeId,
},
serverId: server?.id,
});
@ -292,8 +296,8 @@ export const AlbumArtistDetailContent = ({ background }: AlbumArtistDetailConten
const handlePlay = async (playType?: Play) => {
handlePlayQueueAdd?.({
byItemType: {
id: [albumArtistId],
type: LibraryItem.ALBUM_ARTIST,
id: [routeId],
type: albumArtistId ? LibraryItem.ALBUM : LibraryItem.ALBUM_ARTIST,
},
playType: playType || playButtonBehavior,
});
@ -528,7 +532,7 @@ export const AlbumArtistDetailContent = ({ background }: AlbumArtistDetailConten
to={generatePath(
AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL_TOP_SONGS,
{
albumArtistId,
albumArtistId: routeId,
},
)}
variant="subtle"

8
src/renderer/features/artists/components/album-artist-detail-header.tsx
View file

@ -16,11 +16,15 @@ interface AlbumArtistDetailHeaderProps {
export const AlbumArtistDetailHeader = forwardRef(
({ background }: AlbumArtistDetailHeaderProps, ref: Ref<HTMLDivElement>) => {
const { albumArtistId } = useParams() as { albumArtistId: string };
const { albumArtistId, artistId } = useParams() as {
albumArtistId?: string;
artistId?: string;
};
const routeId = (artistId || albumArtistId) as string;
const server = useCurrentServer();
const { t } = useTranslation();
const detailQuery = useAlbumArtistDetail({
query: { id: albumArtistId },
query: { id: routeId },
serverId: server?.id,
});

6
src/renderer/features/artists/components/artist-list-grid-view.tsx
View file

@ -156,12 +156,12 @@ export const ArtistListGridView = ({ itemCount, gridRef }: ArtistListGridViewPro
itemCount={itemCount || 0}
itemGap={grid?.itemGap ?? 10}
itemSize={grid?.itemSize || 200}
itemType={LibraryItem.ALBUM_ARTIST}
itemType={LibraryItem.ARTIST}
loading={itemCount === undefined || itemCount === null}
minimumBatchSize={40}
route={{
route: AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL,
slugs: [{ idProperty: 'id', slugProperty: 'albumArtistId' }],
route: AppRoute.LIBRARY_ARTISTS_DETAIL,
slugs: [{ idProperty: 'id', slugProperty: 'artistId' }],
}}
width={width}
onScroll={handleGridScroll}

18
src/renderer/features/artists/routes/album-artist-detail-route.tsx
View file

@ -16,15 +16,21 @@ const AlbumArtistDetailRoute = () => {
const headerRef = useRef<HTMLDivElement>(null);
const server = useCurrentServer();
const { albumArtistId } = useParams() as { albumArtistId: string };
const { albumArtistId, artistId } = useParams() as {
albumArtistId?: string;
artistId?: string;
};
const routeId = (artistId || albumArtistId) as string;
const handlePlayQueueAdd = usePlayQueueAdd();
const playButtonBehavior = usePlayButtonBehavior();
const detailQuery = useAlbumArtistDetail({
query: { id: albumArtistId },
query: { id: routeId },
serverId: server?.id,
});
const { color: background, colorId } = useFastAverageColor({
id: albumArtistId,
id: routeId,
src: detailQuery.data?.imageUrl,
srcLoaded: !detailQuery.isLoading,
});
@ -32,19 +38,19 @@ const AlbumArtistDetailRoute = () => {
const handlePlay = () => {
handlePlayQueueAdd?.({
byItemType: {
id: [albumArtistId],
id: [routeId],
type: LibraryItem.ALBUM_ARTIST,
},
playType: playButtonBehavior,
});
};
if (!background || colorId !== albumArtistId) {
if (!background || colorId !== routeId) {
return <Spinner container />;
}
return (
<AnimatedPage key={`album-artist-detail-${albumArtistId}`}>
<AnimatedPage key={`album-artist-detail-${routeId}`}>
<NativeScrollArea
ref={scrollAreaRef}
pageHeaderProps={{

14
src/renderer/features/artists/routes/album-artist-detail-top-songs-list-route.tsx
View file

@ -12,18 +12,22 @@ import { ListContext } from '/@/renderer/context/list-context';
const AlbumArtistDetailTopSongsListRoute = () => {
const tableRef = useRef<AgGridReactType | null>(null);
const { albumArtistId } = useParams() as { albumArtistId: string };
const { albumArtistId, artistId } = useParams() as {
albumArtistId?: string;
artistId?: string;
};
const routeId = (artistId || albumArtistId) as string;
const server = useCurrentServer();
const pageKey = LibraryItem.SONG;
const detailQuery = useAlbumArtistDetail({
query: { id: albumArtistId },
query: { id: routeId },
serverId: server?.id,
});
const topSongsQuery = useTopSongsList({
options: { enabled: !!detailQuery?.data?.name },
query: { artist: detailQuery?.data?.name || '', artistId: albumArtistId },
query: { artist: detailQuery?.data?.name || '', artistId: routeId },
serverId: server?.id,
});
@ -31,10 +35,10 @@ const AlbumArtistDetailTopSongsListRoute = () => {
const providerValue = useMemo(() => {
return {
id: albumArtistId,
id: routeId,
pageKey,
};
}, [albumArtistId, pageKey]);
}, [routeId, pageKey]);
return (
<AnimatedPage>