diff --git a/src/components/Bookmarks.tsx b/src/components/Bookmarks.tsx
index 93778306..80cd02a4 100644
--- a/src/components/Bookmarks.tsx
+++ b/src/components/Bookmarks.tsx
@@ -157,6 +157,16 @@ const Bookmarks: React.FC<BookmarksProps> = ({ relayPool, onLogout }) => {
     }
   }
 
+  const handleHighlightClick = (highlightId: string) => {
+    console.log('Highlight clicked:', highlightId)
+    setSelectedHighlightId(highlightId)
+    // Open highlights panel if it's collapsed
+    if (isHighlightsCollapsed) {
+      console.log('Opening highlights panel')
+      setIsHighlightsCollapsed(false)
+    }
+  }
+
 
 
   if (loading) {
@@ -204,7 +214,7 @@ const Bookmarks: React.FC<BookmarksProps> = ({ relayPool, onLogout }) => {
             selectedUrl={selectedUrl}
             highlights={highlights}
             showUnderlines={showUnderlines}
-            onHighlightClick={setSelectedHighlightId}
+            onHighlightClick={handleHighlightClick}
             selectedHighlightId={selectedHighlightId}
           />
         )}
@@ -220,7 +230,7 @@ const Bookmarks: React.FC<BookmarksProps> = ({ relayPool, onLogout }) => {
             onToggleUnderlines={setShowUnderlines}
             selectedHighlightId={selectedHighlightId}
             onRefresh={handleFetchHighlights}
-            onHighlightClick={setSelectedHighlightId}
+            onHighlightClick={handleHighlightClick}
           />
         </div>
       </div>