fix: render edit tool diffs in HTML export

- Use result.details.diff from tool execution (same as TUI)
- Apply proper color coding for added/removed/context lines
- Remove unused generateDiff function
- Match TUI's diff rendering approach

packages/coding-agent/poem.txt

@@ -1,29 +0,0 @@
-Through morning mist the sunlight breaks,
-A golden path on silver lakes,
-The world awakens, soft and new,
-With diamond drops of morning dew,
-And birds sing songs that daylight makes.
-
-The forest stands in ancient green,
-Where shadows dance and light is seen,
-Through branches high the breezes play,
-And lead the wandering heart away,
-To places only dreams have been.
-
-The river flows with endless grace,
-Its waters mirror time and space,
-It carries stories, old and worn,
-Of every soul that's ever born,
-And every smile on every face.
-
-When evening falls with purple hue,
-The stars emerge in cosmic view,
-They whisper secrets from afar,
-Each distant, shimmering, silent star,
-A reminder what we thought we knew.
-
-So let us walk this earthly ground,
-Where beauty, pain, and love are found,
-Embrace the journey, come what may,
-For every night will yield to day,
-And silence always turns to sound.

packages/coding-agent/src/export-html.ts

@@ -64,33 +64,6 @@ function replaceTabs(text: string): string {
 	return text.replace(/\t/g, "   ");
 }
 
-/**
- * Generate unified diff matching TUI style
- */
-function generateDiff(oldStr: string, newStr: string): string {
-	const oldLines = oldStr.split("\n");
-	const newLines = newStr.split("\n");
-
-	const maxLineNum = Math.max(oldLines.length, newLines.length);
-	const lineNumWidth = String(maxLineNum).length;
-
-	let html = `<div class="diff-old">- old:</div>`;
-	for (let i = 0; i < oldLines.length; i++) {
-		const lineNum = String(i + 1).padStart(lineNumWidth, " ");
-		html += `<div class="diff-line-old">- <span class="line-num">${escapeHtml(lineNum)}</span> ${escapeHtml(oldLines[i])}</div>`;
-	}
-
-	html += `<div class="diff-spacer"></div>`;
-
-	html += `<div class="diff-new">+ new:</div>`;
-	for (let i = 0; i < newLines.length; i++) {
-		const lineNum = String(i + 1).padStart(lineNumWidth, " ");
-		html += `<div class="diff-line-new">+ <span class="line-num">${escapeHtml(lineNum)}</span> ${escapeHtml(newLines[i])}</div>`;
-	}
-
-	return html;
-}
-
 /**
  * Format tool execution matching TUI ToolExecutionComponent
  */
@@ -235,8 +208,20 @@ function formatToolExecution(
 		const path = shortenPath(args?.file_path || args?.path || "");
 		html = `<div class="tool-header"><span class="tool-name">edit</span> <span class="tool-path">${escapeHtml(path || "...")}</span></div>`;
 
-		if (args?.old_string && args?.new_string) {
+		// Show diff if available from result.details.diff
-			html += '<div class="tool-diff">' + generateDiff(args.old_string, args.new_string) + "</div>";
+		if (result?.details?.diff) {
+			const diffLines = result.details.diff.split("\n");
+			html += '<div class="tool-diff">';
+			for (const line of diffLines) {
+				if (line.startsWith("+")) {
+					html += `<div class="diff-line-new">${escapeHtml(line)}</div>`;
+				} else if (line.startsWith("-")) {
+					html += `<div class="diff-line-old">${escapeHtml(line)}</div>`;
+				} else {
+					html += `<div class="diff-line-context">${escapeHtml(line)}</div>`;
+				}
+			}
+			html += "</div>";
 		}
 
 		if (result) {
@@ -584,35 +569,22 @@ export function exportSessionToHtml(sessionManager: SessionManager, state: Agent
         .tool-diff {
             margin-top: 12px;
             font-size: 13px;
-        }
+            font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
-
-        .diff-old, .diff-new {
-            font-weight: bold;
-            margin-bottom: 4px;
-        }
-
-        .diff-old {
-            color: ${COLORS.red};
-        }
-
-        .diff-new {
-            color: ${COLORS.green};
         }
 
         .diff-line-old {
             color: ${COLORS.red};
+            white-space: pre;
         }
 
         .diff-line-new {
             color: ${COLORS.green};
+            white-space: pre;
         }
 
-        .line-num {
+        .diff-line-context {
             color: ${COLORS.textDim};
-        }
+            white-space: pre;
-
-        .diff-spacer {
-            height: 8px;
         }
 
         /* Error text */