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
This commit is contained in:
Gigi
2025-10-05 21:15:30 +01:00
parent cdbb920a5f
commit 8d7b853e75

View File

@@ -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>