Unified Markdown Renderer

[pedramamini]

Problem

16 separate Markdown rendering locations across the app. 12 use ReactMarkdown directly instead of the existing MarkdownRenderer component. 8+ unique component override sets are defined inline. 3 separate image loading implementations. 7+ files independently import vscDarkPlus syntax highlighting theme.

A centralized markdownConfig.ts and MarkdownRenderer.tsx exist but are underused.

Key Offenders

Component	Issue
ConversationScreen.tsx + WizardMessageBubble.tsx	95% identical component overrides defined inline
StreamingDocumentPreview.tsx	Generates its own prose CSS inline
UpdateCheckModal.tsx	Completely independent ReactMarkdown with inline overrides
MobileMarkdownRenderer.tsx	Full custom override set, no shared code
DocumentGenerationView.tsx	Embedded DocumentEditor copy with duplicate prose generation
AutoRun.tsx, FilePreview.tsx	Partially use shared config but define custom image/code components

Plugin Usage Inconsistencies

Component	remarkGfm	rehypeRaw	rehypeSlug	remarkFrontmatter	remarkFileLinks
MarkdownRenderer	✅	Optional	❌	✅	✅
FilePreview	✅	✅	✅	✅	✅
AutoRun	✅	❌	✅	❌	✅
UpdateCheckModal	❌	❌	❌	❌	❌
ConversationScreen	✅	❌	❌	❌	❌
WizardMessageBubble	✅	❌	❌	❌	❌
MobileMarkdownRenderer	✅	❌	❌	❌	❌

Proposed Solution

Extend MarkdownRenderer.tsx to accept variant/preset props:

<MarkdownRenderer
  variant="terminal" | "chat-bubble" | "document-editor" | "mobile" | "release-notes" | "marketplace"
  theme={theme}
  content={markdown}
/>

Each variant selects from pre-configured plugin/override/style sets. All 16 locations use this single component.

Additionally:

• Consolidate 3 image loading implementations (LocalImage, AttachmentImage, MarkdownImage) into one MarkdownImage component
• Centralize syntax highlighting config (single vscDarkPlus import)
• Remove all inline component override definitions

Estimated Impact

• ~1,500-2,000 lines of duplicate code eliminated
• 16 files touched
• Consistent markdown rendering across the entire app
• Bug fixes and style changes apply everywhere at once

[jeffscottward]

Correction to previous comment (shell escaped path names incorrectly):

Bundling update: I folded a phase 1 unification pass into PR #424 while fixing #53.

PR: #424

What was bundled from #315 in this pass:

• centralized shared markdown presets in src/renderer/utils/markdownConfig.ts
• migrated duplicate wizard markdown override sets:
  • src/renderer/components/Wizard/screens/ConversationScreen.tsx
  • src/renderer/components/InlineWizard/WizardMessageBubble.tsx
• migrated src/renderer/components/UpdateCheckModal.tsx release-notes markdown overrides to shared preset

Why bundled:

• Seeking Assistance: Pesky Markdown Formatting Issue #53 reproduced the same fragmentation concern from Unified Markdown Renderer #315, so this keeps the bug fix and first unification step consistent.

Scope note:

• this is intentionally not full 16-surface unification yet; it is the first migration slice with behavior-preserving refactor plus tests.

[jeffscottward]

Linking this explicitly for reviewer context: PR #424 is intentionally bundling #53 with a minimal safe subset of #315 in two phases, instead of a full renderer unification refactor.

Current status now includes phase 2:

• Shared markdown config rollout completed across remaining impacted UI render paths ( preview/document surfaces, , , )
• Shared GFM plugin constant adopted in those paths
• No broad architecture rewrite yet (full unification still separate scope)

This keeps risk low while eliminating the specific drift that caused inconsistent markdown behavior across these surfaces.

[jeffscottward]

Correction to previous note (shell escaping mangled component names).

Bundling update: PR #424 intentionally bundles #53 plus a minimal safe subset of #315 in two phases, rather than a full renderer unification refactor.

Current status now includes phase 2:

• Shared markdown config rollout completed across remaining impacted UI render paths (InlineWizard preview/document surfaces, SymphonyModal, MarketplaceModal, Wizard/shared/DocumentEditor)
• Shared GFM plugin constant adopted in those paths
• No broad architecture rewrite yet (full unification remains separate scope)

This keeps risk low while eliminating the specific markdown drift that caused inconsistent behavior across these surfaces.

[jeffscottward]

Final update: bundled #315 work in PR #424 is now complete for the planned multi-phase rollout.

What is now finished:

• Shared GFM plugin source is now centralized and reused across renderer + web/mobile (src/shared/markdownPlugins.ts)
• Remaining direct renderer markdown paths were migrated to the shared plugin stack and shared markdown component factory integration where applicable
• Mobile markdown path now has parity for list-item paragraph baseline alignment

Result:

• The markdown drift called out in Unified Markdown Renderer #315 has been addressed across the previously fragmented paths that were in scope for this bundle.
• No broad risky rewrite was done; this remained an incremental, behavior-safe consolidation.

Reference PR: #424