56 lines
1.7 KiB
JavaScript
56 lines
1.7 KiB
JavaScript
import React from 'react'
|
|
import CollectionCard from '../../components/profile/collections/CollectionCard'
|
|
|
|
function normalizeItems(items) {
|
|
if (!Array.isArray(items)) return []
|
|
|
|
return items.filter((item) => item && typeof item === 'object')
|
|
}
|
|
|
|
export default function HomeCollections({
|
|
featured,
|
|
recent,
|
|
trending,
|
|
editorial,
|
|
community,
|
|
}) {
|
|
const featuredItems = normalizeItems(featured)
|
|
const recentItems = normalizeItems(recent)
|
|
const trendingItems = normalizeItems(trending)
|
|
const editorialItems = normalizeItems(editorial)
|
|
const communityItems = normalizeItems(community)
|
|
const displayItems = (
|
|
trendingItems.length ? trendingItems :
|
|
featuredItems.length ? featuredItems :
|
|
recentItems.length ? recentItems :
|
|
editorialItems.length ? editorialItems :
|
|
communityItems
|
|
).slice(0, 3)
|
|
|
|
if (!displayItems.length) {
|
|
return null
|
|
}
|
|
|
|
return (
|
|
<section className="mt-14 px-4 sm:px-6 lg:px-8">
|
|
<div className="mb-5 flex items-center justify-between gap-4">
|
|
<div>
|
|
<h2 className="text-xl font-bold text-white">Trending Collections</h2>
|
|
<p className="mt-1 max-w-2xl text-sm text-nova-300">
|
|
Collections getting the strongest mix of follows, saves, and engagement right now.
|
|
</p>
|
|
</div>
|
|
<a href="/collections/trending" className="shrink-0 text-sm text-nova-300 transition hover:text-white">
|
|
All collections →
|
|
</a>
|
|
</div>
|
|
|
|
<div className="grid gap-4 lg:grid-cols-2 xl:grid-cols-3">
|
|
{displayItems.map((collection) => (
|
|
<CollectionCard key={collection.id} collection={collection} isOwner={false} />
|
|
))}
|
|
</div>
|
|
</section>
|
|
)
|
|
}
|