Add fix to hide the "More from this artist" carousel when it contains no albums (#173)

* Add fix to hide carousel with other albums
This commit is contained in:
Kyan 2023-07-15 20:13:56 +02:00 committed by GitHub
parent 287fbab29a
commit f74e02eb09
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -194,6 +194,7 @@ export const AlbumDetailContent = ({ tableRef }: AlbumDetailContentProps) => {
const carousels = [ const carousels = [
{ {
data: artistQuery?.data?.items, data: artistQuery?.data?.items,
isHidden: !artistQuery?.data?.items.length,
loading: artistQuery?.isLoading || artistQuery.isFetching, loading: artistQuery?.isLoading || artistQuery.isFetching,
pagination: { pagination: {
handleNextPage: () => handleNextPage('artist'), handleNextPage: () => handleNextPage('artist'),
@ -205,7 +206,6 @@ export const AlbumDetailContent = ({ tableRef }: AlbumDetailContentProps) => {
uniqueId: 'mostPlayed', uniqueId: 'mostPlayed',
}, },
]; ];
const playButtonBehavior = usePlayButtonBehavior(); const playButtonBehavior = usePlayButtonBehavior();
const handlePlay = async (playType?: Play) => { const handlePlay = async (playType?: Play) => {
@ -370,46 +370,51 @@ export const AlbumDetailContent = ({ tableRef }: AlbumDetailContentProps) => {
<> <>
{cq.height || cq.width ? ( {cq.height || cq.width ? (
<> <>
{carousels.map((carousel, index) => ( {carousels
<SwiperGridCarousel .filter((c) => !c.isHidden)
key={`carousel-${carousel.uniqueId}-${index}`} .map((carousel, index) => (
cardRows={[ <SwiperGridCarousel
{ key={`carousel-${carousel.uniqueId}-${index}`}
property: 'name', cardRows={[
route: { {
route: AppRoute.LIBRARY_ALBUMS_DETAIL, property: 'name',
slugs: [ route: {
{ idProperty: 'id', slugProperty: 'albumId' }, route: AppRoute.LIBRARY_ALBUMS_DETAIL,
], slugs: [
{
idProperty: 'id',
slugProperty: 'albumId',
},
],
},
}, },
}, {
{ arrayProperty: 'name',
arrayProperty: 'name', property: 'albumArtists',
property: 'albumArtists', route: {
route: { route: AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL,
route: AppRoute.LIBRARY_ALBUM_ARTISTS_DETAIL, slugs: [
slugs: [ {
{ idProperty: 'id',
idProperty: 'id', slugProperty: 'albumArtistId',
slugProperty: 'albumArtistId', },
}, ],
], },
}, },
}, ]}
]} data={carousel.data}
data={carousel.data} isLoading={carousel.loading}
isLoading={carousel.loading} itemType={LibraryItem.ALBUM}
itemType={LibraryItem.ALBUM} route={{
route={{ route: AppRoute.LIBRARY_ALBUMS_DETAIL,
route: AppRoute.LIBRARY_ALBUMS_DETAIL, slugs: [{ idProperty: 'id', slugProperty: 'albumId' }],
slugs: [{ idProperty: 'id', slugProperty: 'albumId' }], }}
}} title={{
title={{ label: carousel.title,
label: carousel.title, }}
}} uniqueId={carousel.uniqueId}
uniqueId={carousel.uniqueId} />
/> ))}
))}
</> </>
) : null} ) : null}
</> </>