feat: use highlights controller in Explore page

- Pass myHighlights from controller through App.tsx → Bookmarks → Explore
- Merge controller highlights with friends/nostrverse highlights
- Seed Explore with myHighlights immediately (no re-fetch needed)
- Eliminate redundant fetching of user's own highlights
- Improve performance and consistency across the app

Benefits:
- User's highlights appear instantly in /explore (already loaded)
- No duplicate fetching of same data
- DRY principle - single source of truth for user highlights
- Better offline support (highlights from controller are in event store)

src/App.tsx

@@ -165,6 +165,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -177,6 +178,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -189,6 +191,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -201,6 +204,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -213,6 +217,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -225,6 +230,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -241,6 +247,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -253,6 +260,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -265,6 +273,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -277,6 +286,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -289,6 +299,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -301,6 +312,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -313,6 +325,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />
@@ -325,6 +338,7 @@ function AppRoutes({
             bookmarks={bookmarks}
             bookmarksLoading={bookmarksLoading}
             onRefreshBookmarks={handleRefreshBookmarks}
+            myHighlights={highlights}
           />
         } 
       />

src/components/Bookmarks.tsx

@@ -14,6 +14,7 @@ import { useBookmarksUI } from '../hooks/useBookmarksUI'
 import { useRelayStatus } from '../hooks/useRelayStatus'
 import { useOfflineSync } from '../hooks/useOfflineSync'
 import { Bookmark } from '../types/bookmarks'
+import { Highlight } from '../types/highlights'
 import ThreePaneLayout from './ThreePaneLayout'
 import Explore from './Explore'
 import Me from './Me'
@@ -28,6 +29,7 @@ interface BookmarksProps {
   bookmarks: Bookmark[]
   bookmarksLoading: boolean
   onRefreshBookmarks: () => Promise<void>
+  myHighlights: Highlight[]
 }
 
 const Bookmarks: React.FC<BookmarksProps> = ({ 
@@ -35,7 +37,8 @@ const Bookmarks: React.FC<BookmarksProps> = ({
   onLogout, 
   bookmarks, 
   bookmarksLoading, 
-  onRefreshBookmarks 
+  onRefreshBookmarks,
+  myHighlights
 }) => {
   const { naddr, npub } = useParams<{ naddr?: string; npub?: string }>()
   const location = useLocation()
@@ -322,7 +325,7 @@ const Bookmarks: React.FC<BookmarksProps> = ({
       onCreateHighlight={handleCreateHighlight}
       hasActiveAccount={!!(activeAccount && relayPool)}
       explore={showExplore ? (
-        relayPool ? <Explore relayPool={relayPool} eventStore={eventStore} settings={settings} activeTab={exploreTab} /> : null
+        relayPool ? <Explore relayPool={relayPool} eventStore={eventStore} settings={settings} activeTab={exploreTab} myHighlights={myHighlights} /> : null
       ) : undefined}
       me={showMe ? (
         relayPool ? <Me relayPool={relayPool} activeTab={meTab} bookmarks={bookmarks} bookmarksLoading={bookmarksLoading} /> : null

src/components/Explore.tsx

@@ -28,11 +28,12 @@ interface ExploreProps {
   eventStore: IEventStore
   settings?: UserSettings
   activeTab?: TabType
+  myHighlights?: Highlight[] // From highlightsController in App.tsx
 }
 
 type TabType = 'writings' | 'highlights'
 
-const Explore: React.FC<ExploreProps> = ({ relayPool, eventStore, settings, activeTab: propActiveTab }) => {
+const Explore: React.FC<ExploreProps> = ({ relayPool, eventStore, settings, activeTab: propActiveTab, myHighlights = [] }) => {
   const activeAccount = Hooks.useActiveAccount()
   const navigate = useNavigate()
   const [activeTab, setActiveTab] = useState<TabType>(propActiveTab || 'highlights')
@@ -77,6 +78,15 @@ const Explore: React.FC<ExploreProps> = ({ relayPool, eventStore, settings, acti
         if (cachedHighlights && cachedHighlights.length > 0) {
           setHighlights(prev => prev.length === 0 ? cachedHighlights : prev)
         }
+        
+        // Seed with myHighlights from controller (already loaded on app start)
+        if (myHighlights.length > 0) {
+          setHighlights(prev => {
+            const byId = new Map(prev.map(h => [h.id, h]))
+            for (const h of myHighlights) byId.set(h.id, h)
+            return Array.from(byId.values()).sort((a, b) => b.created_at - a.created_at)
+          })
+        }
 
         // Fetch the user's contacts (friends)
         const contacts = await fetchContacts(
@@ -180,8 +190,8 @@ const Explore: React.FC<ExploreProps> = ({ relayPool, eventStore, settings, acti
           return timeB - timeA
         })
 
-        // Merge and deduplicate all highlights
-        const allHighlights = [...friendsHighlights, ...nostriverseHighlights]
+        // Merge and deduplicate all highlights (mine from controller + friends + nostrverse)
+        const allHighlights = [...myHighlights, ...friendsHighlights, ...nostriverseHighlights]
         const highlightsByKey = new Map<string, Highlight>()
         for (const highlight of allHighlights) {
           highlightsByKey.set(highlight.id, highlight)
@@ -211,7 +221,7 @@ const Explore: React.FC<ExploreProps> = ({ relayPool, eventStore, settings, acti
     }
 
     loadData()
-  }, [relayPool, activeAccount, refreshTrigger, eventStore, settings])
+  }, [relayPool, activeAccount, refreshTrigger, eventStore, settings, myHighlights])
 
   // Pull-to-refresh
   const { isRefreshing, pullPosition } = usePullToRefresh({