diff --git a/src/ui.ts b/src/ui.ts index 3b56b72..6dc22d9 100644 --- a/src/ui.ts +++ b/src/ui.ts @@ -640,11 +640,13 @@ const html = ` contentDiv.innerHTML = todoHtml; } else { // Format raw input with expandable content for long values - // Use diff format for Edit and MultiEdit tools, regular format for others + // Use diff format for Edit, MultiEdit, and Write tools, regular format for others if (data.toolName === 'Edit') { contentDiv.innerHTML = formatEditToolDiff(data.rawInput); } else if (data.toolName === 'MultiEdit') { contentDiv.innerHTML = formatMultiEditToolDiff(data.rawInput); + } else if (data.toolName === 'Write') { + contentDiv.innerHTML = formatWriteToolDiff(data.rawInput); } else { contentDiv.innerHTML = formatToolInputUI(data.rawInput); } @@ -1014,6 +1016,68 @@ const html = ` return result; } + function formatWriteToolDiff(input) { + if (!input || typeof input !== 'object') { + return formatToolInputUI(input); + } + + // Check if this is a Write tool (has file_path and content) + if (!input.file_path || !input.content) { + return formatToolInputUI(input); + } + + // Format file path with better display + const formattedPath = formatFilePath(input.file_path); + let result = '
' + formattedPath + '
\\n'; + + // Create diff view showing all content as additions + const contentLines = input.content.split('\\n'); + + const maxLines = 6; + const shouldTruncate = contentLines.length > maxLines; + const visibleLines = shouldTruncate ? contentLines.slice(0, maxLines) : contentLines; + const hiddenLines = shouldTruncate ? contentLines.slice(maxLines) : []; + + result += '
'; + result += '
New file content:
'; + + // Create a unique ID for this diff + const diffId = 'write_' + Math.random().toString(36).substr(2, 9); + + // Show visible lines (all as additions) + result += '
'; + for (const line of visibleLines) { + result += '
+ ' + escapeHtml(line) + '
'; + } + result += '
'; + + // Show hidden lines (initially hidden) + if (shouldTruncate) { + result += ''; + + // Add expand button + result += '
'; + result += ''; + result += '
'; + } + + result += '
'; + + // Add other properties if they exist + for (const [key, value] of Object.entries(input)) { + if (key !== 'file_path' && key !== 'content') { + const valueStr = typeof value === 'string' ? value : JSON.stringify(value, null, 2); + result += '\\n' + key + ': ' + valueStr; + } + } + + return result; + } + function escapeHtml(text) { const div = document.createElement('div'); div.textContent = text;