mirror of
https://github.com/jeffvli/feishin.git
synced 2026-05-09 20:29:36 +02:00
fix incorrect imageId assignments (#1456)
This commit is contained in:
@@ -32,7 +32,7 @@ export const DragPreview = memo(({ data }: DragPreviewProps) => {
|
|||||||
const itemName = firstItem ? getItemName(firstItem) : 'Item';
|
const itemName = firstItem ? getItemName(firstItem) : 'Item';
|
||||||
|
|
||||||
const itemImage = useItemImageUrl({
|
const itemImage = useItemImageUrl({
|
||||||
id: (firstItem as { id: string })?.id,
|
id: (firstItem as { imageId: string })?.imageId,
|
||||||
itemType: data.itemType || LibraryItem.SONG,
|
itemType: data.itemType || LibraryItem.SONG,
|
||||||
type: 'table',
|
type: 'table',
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -119,7 +119,7 @@ const CarouselItem = ({ album }: CarouselItemProps) => {
|
|||||||
<ItemImage
|
<ItemImage
|
||||||
className={styles.albumImage}
|
className={styles.albumImage}
|
||||||
containerClassName={styles.albumImageContainer}
|
containerClassName={styles.albumImageContainer}
|
||||||
id={album.id}
|
id={album.imageId}
|
||||||
itemType={LibraryItem.ALBUM}
|
itemType={LibraryItem.ALBUM}
|
||||||
src={imageUrl}
|
src={imageUrl}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -314,7 +314,7 @@ const CompactItemCard = ({
|
|||||||
className={clsx(styles.image, {
|
className={clsx(styles.image, {
|
||||||
[styles.isRound]: isRound,
|
[styles.isRound]: isRound,
|
||||||
})}
|
})}
|
||||||
id={data?.id}
|
id={data?.imageId}
|
||||||
itemType={itemType}
|
itemType={itemType}
|
||||||
src={(data as Album | AlbumArtist | Playlist | Song)?.imageUrl}
|
src={(data as Album | AlbumArtist | Playlist | Song)?.imageUrl}
|
||||||
/>
|
/>
|
||||||
@@ -532,7 +532,7 @@ const DefaultItemCard = ({
|
|||||||
<>
|
<>
|
||||||
<ItemImage
|
<ItemImage
|
||||||
className={clsx(styles.image, { [styles.isRound]: isRound })}
|
className={clsx(styles.image, { [styles.isRound]: isRound })}
|
||||||
id={data?.id}
|
id={data?.imageId}
|
||||||
itemType={itemType}
|
itemType={itemType}
|
||||||
src={(data as Album | AlbumArtist | Playlist | Song)?.imageUrl}
|
src={(data as Album | AlbumArtist | Playlist | Song)?.imageUrl}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -31,7 +31,7 @@ const getUnloaderIcon = (itemType: LibraryItem) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const BaseItemImage = (
|
const BaseItemImage = (
|
||||||
props: Omit<ImageProps, 'src'> & {
|
props: Omit<ImageProps, 'id' | 'src'> & {
|
||||||
id?: null | string;
|
id?: null | string;
|
||||||
itemType: LibraryItem;
|
itemType: LibraryItem;
|
||||||
src?: null | string;
|
src?: null | string;
|
||||||
@@ -46,13 +46,20 @@ const BaseItemImage = (
|
|||||||
size: 300,
|
size: 300,
|
||||||
});
|
});
|
||||||
|
|
||||||
return <BaseImage src={imageUrl} unloaderIcon={getUnloaderIcon(props.itemType)} {...rest} />;
|
return (
|
||||||
|
<BaseImage
|
||||||
|
src={imageUrl}
|
||||||
|
unloaderIcon={getUnloaderIcon(props.itemType)}
|
||||||
|
{...rest}
|
||||||
|
id={props.id || undefined}
|
||||||
|
/>
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export const ItemImage = memo(BaseItemImage);
|
export const ItemImage = memo(BaseItemImage);
|
||||||
|
|
||||||
interface UseItemImageUrlProps {
|
interface UseItemImageUrlProps {
|
||||||
id?: string;
|
id?: null | string;
|
||||||
imageUrl?: null | string;
|
imageUrl?: null | string;
|
||||||
itemType: LibraryItem;
|
itemType: LibraryItem;
|
||||||
serverId?: string;
|
serverId?: string;
|
||||||
|
|||||||
@@ -83,7 +83,7 @@ export const ImageColumn = (props: ItemTableListInnerColumn) => {
|
|||||||
[styles.imageContainerWithAspectRatio]:
|
[styles.imageContainerWithAspectRatio]:
|
||||||
props.size === 'default' || props.size === 'large',
|
props.size === 'default' || props.size === 'large',
|
||||||
})}
|
})}
|
||||||
id={item?.id}
|
id={item?.imageId}
|
||||||
itemType={item?._itemType}
|
itemType={item?._itemType}
|
||||||
src={item?.imageUrl}
|
src={item?.imageUrl}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -100,7 +100,7 @@ export const DefaultTitleCombinedColumn = (props: ItemTableListInnerColumn) => {
|
|||||||
>
|
>
|
||||||
<ItemImage
|
<ItemImage
|
||||||
containerClassName={styles.image}
|
containerClassName={styles.image}
|
||||||
id={item?.id}
|
id={item?.imageId}
|
||||||
itemType={item?._itemType}
|
itemType={item?._itemType}
|
||||||
src={item?.imageUrl}
|
src={item?.imageUrl}
|
||||||
/>
|
/>
|
||||||
@@ -236,7 +236,7 @@ export const QueueSongTitleCombinedColumn = (props: ItemTableListInnerColumn) =>
|
|||||||
>
|
>
|
||||||
<ItemImage
|
<ItemImage
|
||||||
containerClassName={styles.image}
|
containerClassName={styles.image}
|
||||||
id={item?.id}
|
id={item?.imageId}
|
||||||
itemType={item?._itemType}
|
itemType={item?._itemType}
|
||||||
src={item?.imageUrl}
|
src={item?.imageUrl}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -121,7 +121,7 @@ export const LeftControls = () => {
|
|||||||
styles.playerbarImage,
|
styles.playerbarImage,
|
||||||
PlaybackSelectors.playerCoverArt,
|
PlaybackSelectors.playerCoverArt,
|
||||||
)}
|
)}
|
||||||
id={currentSong?.id}
|
id={currentSong?.imageId}
|
||||||
itemType={LibraryItem.SONG}
|
itemType={LibraryItem.SONG}
|
||||||
loading="eager"
|
loading="eager"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -92,7 +92,7 @@ export const MobilePlayerbar = () => {
|
|||||||
styles.playerbarImage,
|
styles.playerbarImage,
|
||||||
PlaybackSelectors.playerCoverArt,
|
PlaybackSelectors.playerCoverArt,
|
||||||
)}
|
)}
|
||||||
id={currentSong.id}
|
id={currentSong.imageId}
|
||||||
itemType={LibraryItem.SONG}
|
itemType={LibraryItem.SONG}
|
||||||
loading="eager"
|
loading="eager"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -556,7 +556,7 @@ const PlaylistTableItem = memo(
|
|||||||
<Grid.Col span="content">
|
<Grid.Col span="content">
|
||||||
<Flex align="center" justify="center" px="sm">
|
<Flex align="center" justify="center" px="sm">
|
||||||
<ItemImage
|
<ItemImage
|
||||||
id={item.id}
|
id={item.imageId}
|
||||||
imageContainerProps={{
|
imageContainerProps={{
|
||||||
className: styles.imageContainer,
|
className: styles.imageContainer,
|
||||||
}}
|
}}
|
||||||
|
|||||||
@@ -167,6 +167,7 @@ export const CommandPalette = ({ modalProps }: CommandPaletteProps) => {
|
|||||||
{({ isHighlighted }) => (
|
{({ isHighlighted }) => (
|
||||||
<LibraryCommandItem
|
<LibraryCommandItem
|
||||||
id={album.id}
|
id={album.id}
|
||||||
|
imageId={album.imageId}
|
||||||
imageUrl={album.imageUrl}
|
imageUrl={album.imageUrl}
|
||||||
isHighlighted={isHighlighted}
|
isHighlighted={isHighlighted}
|
||||||
itemType={LibraryItem.ALBUM}
|
itemType={LibraryItem.ALBUM}
|
||||||
@@ -200,6 +201,7 @@ export const CommandPalette = ({ modalProps }: CommandPaletteProps) => {
|
|||||||
<LibraryCommandItem
|
<LibraryCommandItem
|
||||||
disabled={artist?.albumCount === 0}
|
disabled={artist?.albumCount === 0}
|
||||||
id={artist.id}
|
id={artist.id}
|
||||||
|
imageId={artist.imageId}
|
||||||
imageUrl={artist.imageUrl}
|
imageUrl={artist.imageUrl}
|
||||||
isHighlighted={isHighlighted}
|
isHighlighted={isHighlighted}
|
||||||
itemType={LibraryItem.ALBUM_ARTIST}
|
itemType={LibraryItem.ALBUM_ARTIST}
|
||||||
@@ -237,6 +239,7 @@ export const CommandPalette = ({ modalProps }: CommandPaletteProps) => {
|
|||||||
{({ isHighlighted }) => (
|
{({ isHighlighted }) => (
|
||||||
<LibraryCommandItem
|
<LibraryCommandItem
|
||||||
id={song.id}
|
id={song.id}
|
||||||
|
imageId={song.imageId}
|
||||||
imageUrl={song.imageUrl}
|
imageUrl={song.imageUrl}
|
||||||
isHighlighted={isHighlighted}
|
isHighlighted={isHighlighted}
|
||||||
itemType={LibraryItem.SONG}
|
itemType={LibraryItem.SONG}
|
||||||
|
|||||||
@@ -19,6 +19,7 @@ import { Play } from '/@/shared/types/types';
|
|||||||
interface LibraryCommandItemProps {
|
interface LibraryCommandItemProps {
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
id: string;
|
id: string;
|
||||||
|
imageId: null | string;
|
||||||
imageUrl: null | string;
|
imageUrl: null | string;
|
||||||
isHighlighted?: boolean;
|
isHighlighted?: boolean;
|
||||||
itemType: LibraryItem;
|
itemType: LibraryItem;
|
||||||
@@ -30,6 +31,7 @@ interface LibraryCommandItemProps {
|
|||||||
export const LibraryCommandItem = ({
|
export const LibraryCommandItem = ({
|
||||||
disabled,
|
disabled,
|
||||||
id,
|
id,
|
||||||
|
imageId,
|
||||||
imageUrl,
|
imageUrl,
|
||||||
isHighlighted,
|
isHighlighted,
|
||||||
itemType,
|
itemType,
|
||||||
@@ -99,7 +101,7 @@ export const LibraryCommandItem = ({
|
|||||||
alt="cover"
|
alt="cover"
|
||||||
className={styles.image}
|
className={styles.image}
|
||||||
height={40}
|
height={40}
|
||||||
id={id}
|
id={imageId}
|
||||||
itemType={itemType}
|
itemType={itemType}
|
||||||
src={imageUrl}
|
src={imageUrl}
|
||||||
width={40}
|
width={40}
|
||||||
|
|||||||
@@ -232,7 +232,7 @@ const normalizeAlbum = (
|
|||||||
_itemType: LibraryItem.ALBUM,
|
_itemType: LibraryItem.ALBUM,
|
||||||
_serverId: server?.id || '',
|
_serverId: server?.id || '',
|
||||||
_serverType: ServerType.JELLYFIN,
|
_serverType: ServerType.JELLYFIN,
|
||||||
albumArtistName: item.AlbumArtist || '',
|
albumArtistName: item.AlbumArtist,
|
||||||
albumArtists:
|
albumArtists:
|
||||||
item.AlbumArtists.map((entry) => ({
|
item.AlbumArtists.map((entry) => ({
|
||||||
id: entry.Id,
|
id: entry.Id,
|
||||||
|
|||||||
@@ -225,15 +225,8 @@ export type AlbumArtist = {
|
|||||||
userRating: null | number;
|
userRating: null | number;
|
||||||
};
|
};
|
||||||
|
|
||||||
export type Artist = {
|
export type Artist = Omit<AlbumArtist, '_itemType'> & {
|
||||||
_itemType: LibraryItem.ARTIST;
|
_itemType: LibraryItem.ARTIST;
|
||||||
_serverId: string;
|
|
||||||
_serverType: ServerType;
|
|
||||||
biography: null | string;
|
|
||||||
createdAt: string;
|
|
||||||
id: string;
|
|
||||||
name: string;
|
|
||||||
updatedAt: string;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export type AuthenticationResponse = {
|
export type AuthenticationResponse = {
|
||||||
|
|||||||
Reference in New Issue
Block a user