From 8d7b853e75af187a3e19c0589bc6e4e56a5f68c9 Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Sun, 5 Oct 2025 21:15:30 +0100
Subject: [PATCH] fix: ensure highlights always render on markdown content

- Add logic to wait for HTML conversion when highlights need to be applied
- Prevent rendering plain markdown when highlights are pending
- Show ReactMarkdown fallback only when no highlights need to be applied
- Fixes default article highlights not showing
---
 src/components/ContentPanel.tsx | 40 ++++++++++++++++++---------------
 1 file changed, 22 insertions(+), 18 deletions(-)

diff --git a/src/components/ContentPanel.tsx b/src/components/ContentPanel.tsx
index be7ee6cd..5e3b507f 100644
--- a/src/components/ContentPanel.tsx
+++ b/src/components/ContentPanel.tsx
@@ -74,6 +74,10 @@ const ContentPanel: React.FC<ContentPanelProps> = ({
     return sourceHtml
   }, [html, renderedHtml, markdown, relevantHighlights, showUnderlines, highlightStyle])
 
+  // Check if we need to wait for HTML conversion
+  const needsHtmlConversion = markdown && !renderedHtml
+  const shouldShowContent = !needsHtmlConversion || relevantHighlights.length === 0
+
   // Attach click handlers to highlight marks
   useEffect(() => {
     if (!onHighlightClick || !contentRef.current) return
@@ -184,24 +188,24 @@ const ContentPanel: React.FC<ContentPanelProps> = ({
         </div>
       )}
       {markdown || html ? (
-        finalHtml ? (
-          <div 
-            ref={contentRef} 
-            className={markdown ? "reader-markdown" : "reader-html"} 
-            dangerouslySetInnerHTML={{ __html: finalHtml }} 
-          />
-        ) : markdown ? (
-          <div 
-            ref={contentRef} 
-            className="reader-markdown"
-          >
-            <ReactMarkdown remarkPlugins={[remarkGfm]}>
-              {markdown}
-            </ReactMarkdown>
-          </div>
-        ) : (
-          <div className={markdown ? "reader-markdown" : "reader-html"} ref={contentRef} />
-        )
+        finalHtml || (markdown && shouldShowContent) ? (
+          finalHtml ? (
+            <div 
+              ref={contentRef} 
+              className={markdown ? "reader-markdown" : "reader-html"} 
+              dangerouslySetInnerHTML={{ __html: finalHtml }} 
+            />
+          ) : (
+            <div 
+              ref={contentRef} 
+              className="reader-markdown"
+            >
+              <ReactMarkdown remarkPlugins={[remarkGfm]}>
+                {markdown}
+              </ReactMarkdown>
+            </div>
+          )
+        ) : null
       ) : (
         <div className="reader empty">
           <p>No readable content found for this URL.</p>