optimizations

resources/js/Pages/Home/HomePage.jsx

@@ -1,9 +1,6 @@
 import React, { lazy, Suspense } from 'react'
 import { createRoot } from 'react-dom/client'
 
-// Above-fold — eager
-import HomeHero from './HomeHero'
-
 // Below-fold — lazy-loaded to keep initial bundle small
 const HomeWelcomeRow      = lazy(() => import('./HomeWelcomeRow'))
 const HomeFromFollowing   = lazy(() => import('./HomeFromFollowing'))
@@ -13,6 +10,7 @@ const HomeSuggestedCreators = lazy(() => import('./HomeSuggestedCreators'))
 const HomeTrending        = lazy(() => import('./HomeTrending'))
 const HomeRising          = lazy(() => import('./HomeRising'))
 const HomeFresh           = lazy(() => import('./HomeFresh'))
+const HomeCollections     = lazy(() => import('./HomeCollections'))
 const HomeCategories      = lazy(() => import('./HomeCategories'))
 const HomeTags            = lazy(() => import('./HomeTags'))
 const HomeCreators        = lazy(() => import('./HomeCreators'))
@@ -26,12 +24,10 @@ function SectionFallback() {
 }
 
 function GuestHomePage(props) {
-  const { hero, rising, trending, fresh, tags, creators, news } = props
+  const { rising, trending, fresh, tags, creators, news, collections_featured, collections_trending, collections_editorial, collections_community } = props
 
   return (
     <>
-      {/* 1. Hero */}
-      <HomeHero artwork={hero} isLoggedIn={false} />
       <Suspense fallback={<SectionFallback />}>
         <HomeRising items={rising} />
       </Suspense>
@@ -44,6 +40,15 @@ function GuestHomePage(props) {
         <HomeFresh items={fresh} />
       </Suspense>
 
+      <Suspense fallback={<SectionFallback />}>
+        <HomeCollections
+          featured={collections_featured}
+          trending={collections_trending}
+          editorial={collections_editorial}
+          community={collections_community}
+        />
+      </Suspense>
+
       {/* 4. Explore Categories */}
       <Suspense fallback={<SectionFallback />}>
         <HomeCategories />
@@ -75,12 +80,16 @@ function GuestHomePage(props) {
 function AuthHomePage(props) {
   const {
     user_data,
-    hero,
+    for_you,
     from_following,
     rising,
     trending,
     fresh,
-    by_tags,
+    collections_featured,
+    collections_recent,
+    collections_trending,
+    collections_editorial,
+    collections_community,
     by_categories,
     suggested_creators,
     tags,
@@ -91,9 +100,6 @@ function AuthHomePage(props) {
 
   return (
     <>
-      {/* 1. Hero — flush to top */}
-      <HomeHero artwork={hero} isLoggedIn />
-
       {/* P0. Welcome/status row — below hero so featured image sits at 0px */}
       <Suspense fallback={null}>
         <HomeWelcomeRow user_data={user_data} />
@@ -104,9 +110,9 @@ function AuthHomePage(props) {
         <HomeFromFollowing items={from_following} />
       </Suspense>
 
-      {/* P3. Trending For You (by_tags = Meilisearch tag overlap sorted by trending) */}
+      {/* P3. Personalized For You preview */}
       <Suspense fallback={<SectionFallback />}>
-        <HomeTrendingForYou items={by_tags} preferences={preferences} />
+        <HomeTrendingForYou items={for_you} preferences={preferences} />
       </Suspense>
 
       {/* Rising Now */}
@@ -129,6 +135,17 @@ function AuthHomePage(props) {
         <HomeFresh items={fresh} />
       </Suspense>
 
+      <Suspense fallback={<SectionFallback />}>
+        <HomeCollections
+          featured={collections_featured}
+          recent={collections_recent}
+          trending={collections_trending}
+          editorial={collections_editorial}
+          community={collections_community}
+          isLoggedIn
+        />
+      </Suspense>
+
       {/* 4. Explore Categories */}
       <Suspense fallback={<SectionFallback />}>
         <HomeCategories />