56 lines
2 KiB
JavaScript
56 lines
2 KiB
JavaScript
import useSWR from 'swr'
|
|
import {fetcher, renderResults, sliceArray} from '../utils'
|
|
import CardNormal from './CardNormal'
|
|
import Heading from './Heading'
|
|
import Loading from './Loading'
|
|
|
|
export default function Collection({
|
|
Component = CardNormal,
|
|
endpoint,
|
|
href,
|
|
isHomePage,
|
|
isTrending,
|
|
limit = 8,
|
|
media_type = 'movie',
|
|
title,
|
|
type = 'movie'
|
|
}) {
|
|
const {data, error} = useSWR(endpoint, fetcher)
|
|
if (error) return <div>Error occurred</div>
|
|
return (
|
|
<div className={"relative"}>
|
|
{data ? (
|
|
<section
|
|
className={
|
|
isTrending
|
|
? 'mb-6 h-full w-full overflow-hidden md:mb-10 lg:overflow-visible '
|
|
: 'mb-6 md:mb-10'
|
|
}>
|
|
|
|
<Heading
|
|
title={title}
|
|
href={href}
|
|
isHomePage={isHomePage}
|
|
isTrending={isTrending}
|
|
media_type={type}
|
|
/>
|
|
<section
|
|
className={
|
|
isTrending
|
|
? 'h-scroll relative flex gap-x-4 overflow-x-scroll sm:gap-x-10 2xs:mt-2'
|
|
: 'card-collection-wrapper'
|
|
}>
|
|
|
|
{renderResults(
|
|
sliceArray(data.results || [], limit),
|
|
Component,
|
|
media_type
|
|
)}
|
|
</section>
|
|
</section>
|
|
) : (
|
|
<Loading/>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|