mirror of
https://github.com/antebudimir/feishin.git
synced 2025-12-31 10:03:33 +00:00
support artist art as artist background
This commit is contained in:
parent
4e4a0464d6
commit
452803fc72
5 changed files with 77 additions and 11 deletions
|
|
@ -9,13 +9,14 @@ import { usePlayQueueAdd } from '/@/renderer/features/player';
|
|||
import { AnimatedPage, LibraryHeaderBar } from '/@/renderer/features/shared';
|
||||
import { useFastAverageColor } from '/@/renderer/hooks';
|
||||
import { useCurrentServer } from '/@/renderer/store';
|
||||
import { usePlayButtonBehavior } from '/@/renderer/store/settings.store';
|
||||
import { useGeneralSettings, usePlayButtonBehavior } from '/@/renderer/store/settings.store';
|
||||
import { LibraryItem } from '/@/shared/types/domain-types';
|
||||
|
||||
const AlbumArtistDetailRoute = () => {
|
||||
const scrollAreaRef = useRef<HTMLDivElement>(null);
|
||||
const headerRef = useRef<HTMLDivElement>(null);
|
||||
const server = useCurrentServer();
|
||||
const { artistBackground, artistBackgroundBlur } = useGeneralSettings();
|
||||
|
||||
const { albumArtistId, artistId } = useParams() as {
|
||||
albumArtistId?: string;
|
||||
|
|
@ -30,12 +31,16 @@ const AlbumArtistDetailRoute = () => {
|
|||
query: { id: routeId },
|
||||
serverId: server?.id,
|
||||
});
|
||||
const { background, colorId } = useFastAverageColor({
|
||||
id: routeId,
|
||||
|
||||
const { background: backgroundColor, colorId } = useFastAverageColor({
|
||||
id: artistId,
|
||||
src: detailQuery.data?.imageUrl,
|
||||
srcLoaded: !detailQuery.isLoading,
|
||||
});
|
||||
|
||||
const backgroundUrl = detailQuery.data?.imageUrl || '';
|
||||
const background = (artistBackground && `url(${backgroundUrl})`) || backgroundColor;
|
||||
|
||||
const handlePlay = () => {
|
||||
handlePlayQueueAdd?.({
|
||||
byItemType: {
|
||||
|
|
@ -65,8 +70,11 @@ const AlbumArtistDetailRoute = () => {
|
|||
ref={scrollAreaRef}
|
||||
>
|
||||
<AlbumArtistDetailHeader
|
||||
background={background}
|
||||
loading={!background || colorId !== routeId}
|
||||
background={{
|
||||
background,
|
||||
blur: (artistBackground && artistBackgroundBlur) || 0,
|
||||
loading: !backgroundColor || colorId !== artistId,
|
||||
}}
|
||||
ref={headerRef}
|
||||
/>
|
||||
<AlbumArtistDetailContent background={background} />
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue