fix(explore): ensure nostrverse highlights are loaded and merged; preload nostrverse highlights at app start for instant Explore toggle

src/App.tsx

@@ -24,6 +24,7 @@ import { bookmarkController } from './services/bookmarkController'
 import { contactsController } from './services/contactsController'
 import { highlightsController } from './services/highlightsController'
 import { writingsController } from './services/writingsController'
+import { fetchNostrverseHighlights } from './services/nostrverseService'
 
 const DEFAULT_ARTICLE = import.meta.env.VITE_DEFAULT_ARTICLE_NADDR || 
   'naddr1qvzqqqr4gupzqmjxss3dld622uu8q25gywum9qtg4w4cv4064jmg20xsac2aam5nqqxnzd3cxqmrzv3exgmr2wfesgsmew'
@@ -116,6 +117,19 @@ function AppRoutes({
         console.log('[writings] 🚀 Auto-loading writings on mount/login')
         writingsController.start({ relayPool, eventStore, pubkey })
       }
+
+      // Preload some nostrverse highlights into the event store (non-blocking)
+      // so Explore can show nostrverse immediately when toggled
+      if (eventStore) {
+        try {
+          // Fire-and-forget
+          ;(async () => {
+            try {
+              await fetchNostrverseHighlights(relayPool, 100, eventStore)
+            } catch (e) { /* ignore */ }
+          })()
+        } catch { /* ignore */ }
+      }
     }
   }, [activeAccount, relayPool, eventStore, bookmarks.length, bookmarksLoading, contacts.size, contactsLoading, accountManager])
 

src/components/Explore.tsx

@@ -51,6 +51,7 @@ const Explore: React.FC<ExploreProps> = ({ relayPool, eventStore, settings, acti
   const [refreshTrigger, setRefreshTrigger] = useState(0)
   const [hasLoadedNostrverse, setHasLoadedNostrverse] = useState(false)
   const [hasLoadedMine, setHasLoadedMine] = useState(false)
+  const [hasLoadedNostrverseHighlights, setHasLoadedNostrverseHighlights] = useState(false)
   
   // Get myHighlights directly from controller
   const [myHighlights, setMyHighlights] = useState<Highlight[]>([])
@@ -134,6 +135,7 @@ const Explore: React.FC<ExploreProps> = ({ relayPool, eventStore, settings, acti
       // When logged out, show nostrverse by default
       setVisibility(prev => ({ ...prev, nostrverse: true, friends: false, mine: false }))
       setHasLoadedNostrverse(true) // logged out path loads nostrverse immediately
+      setHasLoadedNostrverseHighlights(true)
     } else {
       // When logged in, use settings defaults
       setVisibility({
@@ -142,6 +144,7 @@ const Explore: React.FC<ExploreProps> = ({ relayPool, eventStore, settings, acti
         mine: settings?.defaultExploreScopeMine ?? false
       })
       setHasLoadedNostrverse(false)
+      setHasLoadedNostrverseHighlights(false)
     }
   }, [activeAccount, settings])
 
@@ -474,6 +477,19 @@ const Explore: React.FC<ExploreProps> = ({ relayPool, eventStore, settings, acti
     }).catch(() => {})
   }, [visibility.nostrverse, activeAccount, relayPool, eventStore, hasLoadedNostrverse])
 
+  // Lazy-load nostrverse highlights when user toggles it on (logged in)
+  useEffect(() => {
+    if (!activeAccount || !relayPool || !visibility.nostrverse || hasLoadedNostrverseHighlights) return
+    setHasLoadedNostrverseHighlights(true)
+    fetchNostrverseHighlights(relayPool, 100, eventStore || undefined)
+      .then((hl) => {
+        if (hl && hl.length > 0) {
+          setHighlights(prev => dedupeHighlightsById([...prev, ...hl]).sort((a, b) => b.created_at - a.created_at))
+        }
+      })
+      .catch(() => {})
+  }, [visibility.nostrverse, activeAccount, relayPool, eventStore, hasLoadedNostrverseHighlights])
+
   // Lazy-load my writings when user toggles "mine" on (logged in)
   // No direct fetch here; writingsController streams my posts centrally
   useEffect(() => {