mirror of
https://github.com/jeffvli/feishin.git
synced 2026-05-15 21:16:17 +02:00
set debounce / viewport for images used in the app
This commit is contained in:
@@ -119,6 +119,9 @@ const CarouselItem = ({ album }: CarouselItemProps) => {
|
||||
<ItemImage
|
||||
className={styles.albumImage}
|
||||
containerClassName={styles.albumImageContainer}
|
||||
enableDebounce={false}
|
||||
enableViewport={false}
|
||||
fetchPriority="high"
|
||||
id={album.imageId}
|
||||
itemType={LibraryItem.ALBUM}
|
||||
src={imageUrl}
|
||||
|
||||
@@ -116,8 +116,11 @@ const CarouselItem = ({ album }: CarouselItemProps) => {
|
||||
<ItemImage
|
||||
className={styles.albumImage}
|
||||
containerClassName={styles.albumImageContainer}
|
||||
enableDebounce={false}
|
||||
enableViewport={false}
|
||||
id={album.imageId}
|
||||
itemType={LibraryItem.ALBUM}
|
||||
fetchPriority="high"
|
||||
type="itemCard"
|
||||
/>
|
||||
<div className={styles.playButtonOverlay}>
|
||||
|
||||
@@ -333,6 +333,7 @@ const CompactItemCard = ({
|
||||
className={clsx(styles.image, {
|
||||
[styles.isRound]: isRound,
|
||||
})}
|
||||
enableDebounce={false}
|
||||
id={data?.imageId}
|
||||
itemType={itemType}
|
||||
src={(data as Album | AlbumArtist | Playlist | Song)?.imageUrl}
|
||||
@@ -553,6 +554,7 @@ const DefaultItemCard = ({
|
||||
<>
|
||||
<ItemImage
|
||||
className={clsx(styles.image, { [styles.isRound]: isRound })}
|
||||
enableDebounce={false}
|
||||
id={data?.imageId}
|
||||
itemType={itemType}
|
||||
src={(data as Album | AlbumArtist | Playlist | Song)?.imageUrl}
|
||||
@@ -835,6 +837,7 @@ const PosterItemCard = ({
|
||||
<>
|
||||
<ItemImage
|
||||
className={clsx(styles.image, { [styles.isRound]: isRound })}
|
||||
enableDebounce={false}
|
||||
id={(data as { imageId: string })?.imageId}
|
||||
itemType={itemType}
|
||||
src={(data as { imageUrl: string })?.imageUrl}
|
||||
|
||||
@@ -87,6 +87,8 @@ const ImageColumnBase = (props: ItemTableListInnerColumn) => {
|
||||
[styles.imageContainerWithAspectRatio]:
|
||||
props.size === 'default' || props.size === 'large',
|
||||
})}
|
||||
enableDebounce={true}
|
||||
enableViewport={false}
|
||||
id={item?.imageId}
|
||||
itemType={item?._itemType}
|
||||
src={item?.imageUrl}
|
||||
|
||||
@@ -103,6 +103,8 @@ export const DefaultTitleCombinedColumn = (props: ItemTableListInnerColumn) => {
|
||||
>
|
||||
<ItemImage
|
||||
containerClassName={styles.image}
|
||||
enableDebounce={true}
|
||||
enableViewport={false}
|
||||
id={item?.imageId}
|
||||
itemType={item?._itemType}
|
||||
src={item?.imageUrl}
|
||||
|
||||
@@ -121,9 +121,11 @@ export const LeftControls = () => {
|
||||
styles.playerbarImage,
|
||||
PlaybackSelectors.playerCoverArt,
|
||||
)}
|
||||
enableDebounce={false}
|
||||
enableViewport={false}
|
||||
fetchPriority="high"
|
||||
id={currentSong?.imageId}
|
||||
itemType={LibraryItem.SONG}
|
||||
loading="eager"
|
||||
serverId={currentSong?._serverId}
|
||||
type="table"
|
||||
/>
|
||||
|
||||
@@ -92,9 +92,11 @@ export const MobilePlayerbar = () => {
|
||||
styles.playerbarImage,
|
||||
PlaybackSelectors.playerCoverArt,
|
||||
)}
|
||||
enableDebounce={false}
|
||||
enableViewport={false}
|
||||
fetchPriority="high"
|
||||
id={currentSong.imageId}
|
||||
itemType={LibraryItem.SONG}
|
||||
loading="eager"
|
||||
type="table"
|
||||
/>
|
||||
</Tooltip>
|
||||
|
||||
@@ -105,6 +105,9 @@ export const LibraryHeader = forwardRef(
|
||||
>
|
||||
<BaseImage
|
||||
alt="cover"
|
||||
enableDebounce={false}
|
||||
enableViewport={false}
|
||||
fetchPriority="high"
|
||||
src={imageUrl}
|
||||
style={{
|
||||
maxHeight: '100%',
|
||||
@@ -137,6 +140,9 @@ export const LibraryHeader = forwardRef(
|
||||
<ItemImage
|
||||
className={styles.image}
|
||||
containerClassName={styles.image}
|
||||
enableDebounce={false}
|
||||
enableViewport={false}
|
||||
fetchPriority="high"
|
||||
id={item.imageId}
|
||||
itemType={item.type as LibraryItem}
|
||||
onError={onImageError}
|
||||
|
||||
@@ -51,6 +51,8 @@ export function ArtistMultiSelectRow({
|
||||
>
|
||||
<ItemImage
|
||||
containerClassName={styles.rowImage}
|
||||
enableDebounce={true}
|
||||
enableViewport={false}
|
||||
itemType={LibraryItem.ARTIST}
|
||||
src={options[index].imageUrl}
|
||||
type="table"
|
||||
|
||||
Reference in New Issue
Block a user