Render series note as markdown via OverType parser
Series notes with bold, italic, and lists were displayed as plain
text. Using OverType.MarkdownParser.parse() renders them without
needing a full editor instance or fighting OverType's layout system.

Assisted-by: Claude Opus 4.6 via Claude Code
change qrvqxqnotlyxwvqqyllosknvqrzyyrts
commit 9ef09afade325d36ff352b96a3024c9a27056116
author Alpha Chen <alpha@kejadlen.dev>
date
parent mqxlzrwt
diff --git a/Rakefile b/Rakefile
index 5575125..835e82f 100644
--- a/Rakefile
+++ b/Rakefile
@@ -31,14 +31,14 @@ task :seed do
 
   notes = [
     "Call Mom",
-    "Water the plants\n\nCheck soil moisture first",
+    "Water the plants\n\nCheck soil moisture *before* watering",
     "Clean the kitchen",
-    "Back up laptop\n\nTime Machine to external drive\nAlso sync cloud photos",
+    "Back up laptop\n\n- Time Machine to external drive\n- Sync cloud photos\n- Verify **offsite** backup",
     "Review finances",
-    "Dentist appointment\n\nDr. Chen, 10am\n555-0142 to reschedule",
+    "Dentist appointment\n\n**Dr. Chen**, 10am\n555-0142 to reschedule",
     "Oil change",
     "Haircut",
-    "Replace HVAC filter\n\nSize: 20x25x1",
+    "Replace HVAC filter\n\nSize: **20x25x1**",
     "Check smoke detectors",
   ]
 
diff --git a/lib/ketchup/views/home.rb b/lib/ketchup/views/home.rb
index 5a641a1..b3e4549 100644
--- a/lib/ketchup/views/home.rb
+++ b/lib/ketchup/views/home.rb
@@ -61,7 +61,7 @@ module Views
             end
 
             div(class: "task-detail", "x-show": "$store.sidebar.mode === 'task'") do
-              p(class: "task-detail-note", "x-text": "$store.sidebar.taskNote")
+              div(id: "series-note-preview", class: "task-detail-note")
               dl(class: "task-detail-fields") do
                 dt { "Interval" }
                 dd("x-text": "$store.sidebar.taskInterval")
diff --git a/public/css/app.css b/public/css/app.css
index 9352bf4..bbcc947 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -210,7 +210,6 @@ h2 { font-size: var(--step-0); font-weight: 600; }
 
 .task-detail-note {
   color: #444;
-  white-space: pre-line;
   margin-block-end: var(--space-s);
 }
 
diff --git a/public/js/app.js b/public/js/app.js
index 5dc586e..4518a69 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -59,6 +59,12 @@ document.addEventListener("alpine:init", () => {
       this.addingNoteId = null
       this.mode = "task"
 
+      const noteEl = document.getElementById("series-note-preview")
+      if (noteEl) {
+        noteEl.innerHTML = ""
+        noteEl.innerHTML = OverType.MarkdownParser.parse(this.taskNote)
+      }
+
       fetch(`/series/${el.dataset.seriesId}/completed`)
         .then((r) => r.json())
         .then((data) => (this.completedTasks = data))