From fc67e1d6d92cde1adf7dc852a6cb2df279ffff5f Mon Sep 17 00:00:00 2001
From: Ben Sima <ben@bensima.com>
Date: Mon, 1 Dec 2025 12:48:51 -0500
Subject: Fix timeline dark mode styling and render comments/thoughts as
 markdown

- Add dark mode styles for comment-bubble and thought-bubble - Render
comments with renderMarkdown instead of plain text - Render thoughts
with renderMarkdown instead of renderTextWithNewlines - Remove unused
renderTextWithNewlines function
---
 Omni/Jr/Web.hs       | 17 ++++-------------
 Omni/Jr/Web/Style.hs |  6 ++++++
 2 files changed, 10 insertions(+), 13 deletions(-)

(limited to 'Omni/Jr')

diff --git a/Omni/Jr/Web.hs b/Omni/Jr/Web.hs
index ecc851d..03072bb 100644
--- a/Omni/Jr/Web.hs
+++ b/Omni/Jr/Web.hs
@@ -2444,8 +2444,8 @@ renderCommentTimelineEvent content actor timestamp now =
       Lucid.span_ [Lucid.class_ "event-icon"] "💬"
       renderActorLabel actor
       renderRelativeTimestamp now timestamp
-    Lucid.div_ [Lucid.class_ "event-content comment-bubble"] <| do
-      Lucid.toHtml content
+    Lucid.div_ [Lucid.class_ "event-content comment-bubble markdown-content"] <| do
+      renderMarkdown content
 
 -- | Render status change event
 renderStatusChangeEvent :: (Monad m) => Text -> TaskCore.CommentAuthor -> UTCTime -> UTCTime -> Lucid.HtmlT m ()
@@ -2500,10 +2500,10 @@ renderAssistantTimelineEvent content _actor timestamp now =
       Lucid.span_ [Lucid.class_ "event-label"] "Thought"
       renderActorLabel TaskCore.Junior
       renderRelativeTimestamp now timestamp
-    Lucid.div_ [Lucid.class_ "event-content thought-bubble"] <| do
+    Lucid.div_ [Lucid.class_ "event-content thought-bubble markdown-content"] <| do
       let truncated = Text.take 2000 content
           isTruncated = Text.length content > 2000
-      renderTextWithNewlines truncated
+      renderMarkdown truncated
       when isTruncated <| Lucid.span_ [Lucid.class_ "event-truncated"] "..."
 
 -- | Render tool call event
@@ -2589,15 +2589,6 @@ renderCollapsibleOutput content =
             Lucid.pre_ [Lucid.class_ "tool-output-pre"] (Lucid.toHtml content)
         else Lucid.pre_ [Lucid.class_ "tool-output-pre"] (Lucid.toHtml content)
 
--- | Render text with literal \n replaced by <br> tags
-renderTextWithNewlines :: (Monad m) => Text -> Lucid.HtmlT m ()
-renderTextWithNewlines txt =
-  let parts = Text.splitOn "\\n" txt
-      renderPart idx part = do
-        Lucid.toHtml part
-        when (idx < length parts - 1) <| Lucid.br_ []
-   in traverse_ (uncurry renderPart) (zip [0 ..] parts)
-
 -- | Decode JSON tool result and render in a user-friendly way
 renderDecodedToolResult :: (Monad m) => Text -> Lucid.HtmlT m ()
 renderDecodedToolResult content =
diff --git a/Omni/Jr/Web/Style.hs b/Omni/Jr/Web/Style.hs
index a169cd7..4efba18 100644
--- a/Omni/Jr/Web/Style.hs
+++ b/Omni/Jr/Web/Style.hs
@@ -2005,6 +2005,12 @@ darkModeStyles =
     ".retry-value" ? color "#9ca3af"
     ".retry-commit" ? backgroundColor "#374151"
     ".event-bubble" ? backgroundColor "#374151"
+    ".comment-bubble" ? do
+      backgroundColor "#374151"
+      color "#d1d5db"
+    ".thought-bubble" ? do
+      backgroundColor "#44403c"
+      color "#d6d3d1"
     ".event-label" ? color "#d1d5db"
     ".line-count" ? do
       backgroundColor "#374151"
-- 
cgit v1.2.3