Lazy-load profile collections until the tab is opened.

Keep the profile payload smaller on first paint and fetch collections through a dedicated API when the collections tab is needed.

resources/js/Pages/Profile/ProfileShow.jsx

@@ -18,6 +18,7 @@ import GroupProfileSummary from '../../components/groups/GroupProfileSummary'
 import useLazyProfileFeaturedArtworks from '../../lib/useLazyProfileFeaturedArtworks'
 import useLazyProfileFavourites from '../../lib/useLazyProfileFavourites'
 import useLazyProfileWorldHistory from '../../lib/useLazyProfileWorldHistory'
+import useLazyProfileCollections from '../../lib/useLazyProfileCollections'
 
 const VALID_TABS = ['posts', 'artworks', 'stories', 'achievements', 'worlds', 'collections', 'about', 'stats', 'favourites', 'activity', 'followers']
 
@@ -104,6 +105,11 @@ export default function ProfileShow() {
     initialWorldHistory: worldHistory,
     enabled: activeTab === 'worlds' || activeTab === 'achievements',
   })
+  const collectionsState = useLazyProfileCollections({
+    username: user?.username || user?.name || '',
+    initialCollections: collections,
+    enabled: activeTab === 'collections',
+  })
 
   const handleTabChange = useCallback((tab) => {
     if (!VALID_TABS.includes(tab)) return
@@ -252,12 +258,15 @@ export default function ProfileShow() {
         )}
         {activeTab === 'collections' && (
           <TabCollections
-            collections={collections}
+            collections={collectionsState.items}
             isOwner={isOwner}
             createUrl={collectionCreateUrl}
             reorderUrl={collectionReorderUrl}
             featuredUrl={collectionsFeaturedUrl}
             featureLimit={collectionFeatureLimit}
+            loading={collectionsState.loading}
+            error={collectionsState.error}
+            onRetry={collectionsState.retry}
           />
         )}
         {activeTab === 'about' && (