Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | 19x 19x 5x 5x 9x 8x | import { ReactElement } from "react";
import { CardSubTitle, Carousel, PresentationCard } from "components";
import { CardType } from "components/CardContent";
import { useOnSmallScreen } from "hooks";
import { IMappedAlbums } from "pages/artist/[artistId]";
interface ICarouselCards {
items: IMappedAlbums["items"] | SpotifyApi.ArtistObjectFull[];
title: string;
type: CardType;
}
export default function CarouselCards({
items,
title,
type,
}: Readonly<ICarouselCards>): ReactElement {
const isSmallScreen = useOnSmallScreen();
return (
<Carousel title={title} gap={isSmallScreen ? 8 : 24}>
{items?.map((item) => {
if (!item) return null;
return (
<PresentationCard
type={type}
key={item.id}
images={item.images}
title={item.name}
subTitle={<CardSubTitle type={type} item={item} />}
id={item.id}
/>
);
})}
</Carousel>
);
}
|