30 lines
1.2 KiB
JavaScript
30 lines
1.2 KiB
JavaScript
import React from 'react'
|
|
import ArtworkGalleryGrid from '../../components/artwork/ArtworkGalleryGrid'
|
|
|
|
export default function HomeTrendingForYou({ items, preferences }) {
|
|
if (!Array.isArray(items) || items.length === 0) return null
|
|
|
|
const topTag = preferences?.top_tags?.[0]
|
|
const heading = 'Picked For You'
|
|
const subheading = topTag
|
|
? `Fresh recommendations informed by your recent interest in #${topTag}.`
|
|
: 'A live preview of your personalized discovery feed.'
|
|
const link = '/discover/for-you'
|
|
|
|
return (
|
|
<section className="mt-14 px-4 sm:px-6 lg:px-8">
|
|
<div className="mb-5 flex flex-col gap-3 md:flex-row md:items-end md:justify-between">
|
|
<div>
|
|
<p className="text-[0.7rem] font-semibold uppercase tracking-[0.28em] text-sky-200/70">Personalized feed</p>
|
|
<h2 className="mt-2 text-xl font-bold text-white">{heading}</h2>
|
|
<p className="mt-1 max-w-2xl text-sm text-slate-300">{subheading}</p>
|
|
</div>
|
|
<a href={link} className="text-sm text-nova-300 transition hover:text-white">
|
|
Open full feed →
|
|
</a>
|
|
</div>
|
|
<ArtworkGalleryGrid items={items.slice(0, 8)} compact />
|
|
</section>
|
|
)
|
|
}
|