feat: improve error display with custom titles and expandable UI

packages/types/src/message.ts

@@ -224,6 +224,7 @@ export const clineMessageSchema = z.object({
 					reasoning_summary: z.string().optional(),
 				})
 				.optional(),
+			title: z.string().optional(), // Custom title for error messages
 		})
 		.optional(),
 })

src/core/assistant-message/presentAssistantMessage.ts

@@ -317,12 +317,15 @@ export async function presentAssistantMessage(cline: Task) {
 				return await askApproval("tool", toolMessage)
 			}
 
-			const handleError = async (action: string, error: Error) => {
+			const handleError = async (action: string, error: Error, title?: string) => {
 				const errorString = `Error ${action}: ${JSON.stringify(serializeError(error))}`
 
 				await cline.say(
 					"error",
 					`Error ${action}:\n${error.message ?? JSON.stringify(serializeError(error), null, 2)}`,
+					undefined,
+					undefined,
+					title ? { title } : undefined,
 				)
 
 				pushToolResult(formatResponse.toolError(errorString))

src/core/task/Task.ts

@@ -1164,15 +1164,41 @@ export class Task extends EventEmitter<TaskEvents> implements TaskLike {
 	}
 
 	async sayAndCreateMissingParamError(toolName: ToolName, paramName: string, relPath?: string) {
+		const relPathFormatted = relPath ? ` for '${relPath.toPosix()}'` : ""
 		await this.say(
 			"error",
-			`Roo tried to use ${toolName}${
-				relPath ? ` for '${relPath.toPosix()}'` : ""
-			} without value for required parameter '${paramName}'. Retrying...`,
+			t("tools:common.errors.missingParameterMessage", {
+				toolName,
+				relPath: relPathFormatted,
+				paramName,
+			}),
+			undefined,
+			undefined,
+			undefined,
+			undefined,
+			{
+				metadata: {
+					title: t("tools:common.errors.missingParameter"),
+				},
+			},
 		)
 		return formatResponse.toolError(formatResponse.missingToolParameterError(paramName))
 	}
 
+	/**
+	 * Helper method to say an error with a custom title
+	 * @param title - The title to display for the error
+	 * @param text - The error message text
+	 * @param images - Optional images to include
+	 */
+	async sayError(title: string, text: string, images?: string[]) {
+		await this.say("error", text, images, undefined, undefined, undefined, {
+			metadata: {
+				title,
+			},
+		})
+	}
+
 	// Lifecycle
 	// Start / Resume / Abort / Dispose
 

src/core/tools/__tests__/generateImageTool.test.ts

@@ -277,7 +277,17 @@ describe("generateImageTool", () => {
 				mockRemoveClosingTag,
 			)
 
-			expect(mockCline.say).toHaveBeenCalledWith("error", expect.stringContaining("Input image not found"))
+			expect(mockCline.say).toHaveBeenCalledWith(
+				"error",
+				expect.stringContaining("Input image not found"),
+				undefined,
+				undefined,
+				undefined,
+				undefined,
+				{
+					metadata: { title: "Input Image Not Found" },
+				},
+			)
 			expect(mockPushToolResult).toHaveBeenCalledWith(expect.stringContaining("Input image not found"))
 		})
 
@@ -302,7 +312,17 @@ describe("generateImageTool", () => {
 				mockRemoveClosingTag,
 			)
 
-			expect(mockCline.say).toHaveBeenCalledWith("error", expect.stringContaining("Unsupported image format"))
+			expect(mockCline.say).toHaveBeenCalledWith(
+				"error",
+				expect.stringContaining("Unsupported image format"),
+				undefined,
+				undefined,
+				undefined,
+				undefined,
+				{
+					metadata: { title: "Unsupported Image Format" },
+				},
+			)
 			expect(mockPushToolResult).toHaveBeenCalledWith(expect.stringContaining("Unsupported image format"))
 		})
 	})

src/core/tools/__tests__/insertContentTool.spec.ts

@@ -46,6 +46,22 @@ vi.mock("../../ignore/RooIgnoreController", () => ({
 	},
 }))
 
+vi.mock("../../../i18n", () => ({
+	t: vi.fn((key: string, params?: any) => {
+		// Return the key without the namespace prefix for testing
+		const keyWithoutNamespace = key.replace(/^[^:]+:/, "")
+		if (params) {
+			// Simple parameter replacement for testing
+			let result = keyWithoutNamespace
+			Object.entries(params).forEach(([key, value]) => {
+				result = result.replace(`{{${key}}}`, String(value))
+			})
+			return result
+		}
+		return keyWithoutNamespace
+	}),
+}))
+
 describe("insertContentTool", () => {
 	const testFilePath = "test/file.txt"
 	// Use a consistent mock absolute path for testing
@@ -226,7 +242,19 @@ describe("insertContentTool", () => {
 			expect(mockedFsReadFile).not.toHaveBeenCalled()
 			expect(mockCline.consecutiveMistakeCount).toBe(1)
 			expect(mockCline.recordToolError).toHaveBeenCalledWith("insert_content")
-			expect(mockCline.say).toHaveBeenCalledWith("error", expect.stringContaining("non-existent file"))
+			expect(mockCline.say).toHaveBeenCalledWith(
+				"error",
+				"insertContent.errors.cannotInsertIntoNonExistent",
+				undefined,
+				undefined,
+				undefined,
+				undefined,
+				expect.objectContaining({
+					metadata: expect.objectContaining({
+						title: "insertContent.errors.invalidLineNumber",
+					}),
+				}),
+			)
 			expect(mockCline.diffViewProvider.update).not.toHaveBeenCalled()
 			expect(mockCline.diffViewProvider.pushToolWriteResult).not.toHaveBeenCalled()
 		})

src/core/tools/__tests__/useMcpToolTool.spec.ts

@@ -151,7 +151,17 @@ describe("useMcpToolTool", () => {
 
 			expect(mockTask.consecutiveMistakeCount).toBe(1)
 			expect(mockTask.recordToolError).toHaveBeenCalledWith("use_mcp_tool")
-			expect(mockTask.say).toHaveBeenCalledWith("error", expect.stringContaining("invalid JSON argument"))
+			expect(mockTask.say).toHaveBeenCalledWith(
+				"error",
+				expect.stringContaining("invalid JSON argument"),
+				undefined,
+				undefined,
+				undefined,
+				undefined,
+				{
+					metadata: { title: "Invalid JSON Arguments" },
+				},
+			)
 			expect(mockPushToolResult).toHaveBeenCalledWith("Tool error: Invalid args for test_server:test_tool")
 		})
 	})
@@ -343,7 +353,17 @@ describe("useMcpToolTool", () => {
 
 			expect(mockTask.consecutiveMistakeCount).toBe(1)
 			expect(mockTask.recordToolError).toHaveBeenCalledWith("use_mcp_tool")
-			expect(mockTask.say).toHaveBeenCalledWith("error", expect.stringContaining("does not exist"))
+			expect(mockTask.say).toHaveBeenCalledWith(
+				"error",
+				expect.stringContaining("does not exist"),
+				undefined,
+				undefined,
+				undefined,
+				undefined,
+				{
+					metadata: { title: "MCP Tool Not Found" },
+				},
+			)
 			// Check that the error message contains available tools
 			expect(mockPushToolResult).toHaveBeenCalledWith(expect.stringContaining("existing-tool-1"))
 			expect(mockPushToolResult).toHaveBeenCalledWith(expect.stringContaining("existing-tool-2"))
@@ -390,7 +410,17 @@ describe("useMcpToolTool", () => {
 
 			expect(mockTask.consecutiveMistakeCount).toBe(1)
 			expect(mockTask.recordToolError).toHaveBeenCalledWith("use_mcp_tool")
-			expect(mockTask.say).toHaveBeenCalledWith("error", expect.stringContaining("does not exist"))
+			expect(mockTask.say).toHaveBeenCalledWith(
+				"error",
+				expect.stringContaining("does not exist"),
+				undefined,
+				undefined,
+				undefined,
+				undefined,
+				{
+					metadata: { title: "MCP Tool Not Found" },
+				},
+			)
 			expect(mockPushToolResult).toHaveBeenCalledWith(expect.stringContaining("No tools available"))
 		})
 
@@ -484,7 +514,17 @@ describe("useMcpToolTool", () => {
 			// Assert
 			expect(mockTask.consecutiveMistakeCount).toBe(1)
 			expect(mockTask.recordToolError).toHaveBeenCalledWith("use_mcp_tool")
-			expect(mockTask.say).toHaveBeenCalledWith("error", expect.stringContaining("not configured"))
+			expect(mockTask.say).toHaveBeenCalledWith(
+				"error",
+				expect.stringContaining("not configured"),
+				undefined,
+				undefined,
+				undefined,
+				undefined,
+				{
+					metadata: { title: "MCP Server Not Found" },
+				},
+			)
 			expect(mockPushToolResult).toHaveBeenCalledWith(expect.stringContaining("s1"))
 			expect(callToolMock).not.toHaveBeenCalled()
 			expect(mockAskApproval).not.toHaveBeenCalled()
@@ -527,7 +567,17 @@ describe("useMcpToolTool", () => {
 			// Assert
 			expect(mockTask.consecutiveMistakeCount).toBe(1)
 			expect(mockTask.recordToolError).toHaveBeenCalledWith("use_mcp_tool")
-			expect(mockTask.say).toHaveBeenCalledWith("error", expect.stringContaining("not configured"))
+			expect(mockTask.say).toHaveBeenCalledWith(
+				"error",
+				expect.stringContaining("not configured"),
+				undefined,
+				undefined,
+				undefined,
+				undefined,
+				{
+					metadata: { title: "MCP Server Not Found" },
+				},
+			)
 			expect(mockPushToolResult).toHaveBeenCalledWith(expect.stringContaining("No servers available"))
 			expect(callToolMock).not.toHaveBeenCalled()
 			expect(mockAskApproval).not.toHaveBeenCalled()

src/core/tools/__tests__/writeToFileTool.spec.ts

@@ -403,7 +403,11 @@ describe("writeToFileTool", () => {
 
 			await executeWriteFileTool({})
 
-			expect(mockHandleError).toHaveBeenCalledWith("writing file", expect.any(Error))
+			expect(mockHandleError).toHaveBeenCalledWith(
+				"writing file",
+				expect.any(Error),
+				"writeToFile.errors.writeFileError",
+			)
 			expect(mockCline.diffViewProvider.reset).toHaveBeenCalled()
 		})
 
@@ -412,7 +416,11 @@ describe("writeToFileTool", () => {
 
 			await executeWriteFileTool({}, { isPartial: true })
 
-			expect(mockHandleError).toHaveBeenCalledWith("writing file", expect.any(Error))
+			expect(mockHandleError).toHaveBeenCalledWith(
+				"writing file",
+				expect.any(Error),
+				"writeToFile.errors.writeFileError",
+			)
 			expect(mockCline.diffViewProvider.reset).toHaveBeenCalled()
 		})
 	})

src/core/tools/applyDiffTool.ts

@@ -13,6 +13,7 @@ import { fileExistsAtPath } from "../../utils/fs"
 import { RecordSource } from "../context-tracking/FileContextTrackerTypes"
 import { unescapeHtmlEntities } from "../../utils/text-normalization"
 import { EXPERIMENT_IDS, experiments } from "../../shared/experiments"
+import { t } from "../../i18n"
 
 export async function applyDiffToolLegacy(
 	cline: Task,
@@ -82,8 +83,10 @@ export async function applyDiffToolLegacy(
 			if (!fileExists) {
 				cline.consecutiveMistakeCount++
 				cline.recordToolError("apply_diff")
-				const formattedError = `File does not exist at path: ${absolutePath}\n\n<error_details>\nThe specified file could not be found. Please verify the file path and try again.\n</error_details>`
-				await cline.say("error", formattedError)
+				const formattedError = `${t("tools:applyDiff.errors.fileDoesNotExist", { path: absolutePath })}\n\n<error_details>\n${t("tools:applyDiff.errors.fileDoesNotExistDetails")}\n</error_details>`
+				await cline.say("error", formattedError, undefined, undefined, undefined, undefined, {
+					metadata: { title: t("tools:applyDiff.errors.fileNotFound") },
+				})
 				pushToolResult(formattedError)
 				return
 			}
@@ -248,7 +251,7 @@ export async function applyDiffToolLegacy(
 			return
 		}
 	} catch (error) {
-		await handleError("applying diff", error)
+		await handleError("applying diff", error, t("tools:applyDiff.errors.applyDiffError"))
 		await cline.diffViewProvider.reset()
 		return
 	}

src/core/tools/askFollowupQuestionTool.ts

@@ -2,6 +2,7 @@ import { Task } from "../task/Task"
 import { ToolUse, AskApproval, HandleError, PushToolResult, RemoveClosingTag } from "../../shared/tools"
 import { formatResponse } from "../prompts/responses"
 import { parseXml } from "../../utils/xml"
+import { t } from "../../i18n"
 
 export async function askFollowupQuestionTool(
 	cline: Task,
@@ -48,7 +49,17 @@ export async function askFollowupQuestionTool(
 				} catch (error) {
 					cline.consecutiveMistakeCount++
 					cline.recordToolError("ask_followup_question")
-					await cline.say("error", `Failed to parse operations: ${error.message}`)
+					await cline.say(
+						"error",
+						`Failed to parse operations: ${error.message}`,
+						undefined,
+						undefined,
+						undefined,
+						undefined,
+						{
+							metadata: { title: "XML Parse Error" },
+						},
+					)
 					pushToolResult(formatResponse.toolError("Invalid operations xml format"))
 					return
 				}
@@ -83,7 +94,7 @@ export async function askFollowupQuestionTool(
 			return
 		}
 	} catch (error) {
-		await handleError("asking question", error)
+		await handleError("asking question", error, t("tools:askFollowupQuestion.errors.askError"))
 		return
 	}
 }

src/core/tools/executeCommandTool.ts

@@ -128,7 +128,7 @@ export async function executeCommandTool(
 			return
 		}
 	} catch (error) {
-		await handleError("executing command", error)
+		await handleError("executing command", error, t("tools:executeCommand.errors.executeError"))
 		return
 	}
 }
@@ -271,7 +271,17 @@ export async function executeCommand(
 			if (isTimedOut) {
 				const status: CommandExecutionStatus = { executionId, status: "timeout" }
 				provider?.postMessageToWebview({ type: "commandExecutionStatus", text: JSON.stringify(status) })
-				await task.say("error", t("common:errors:command_timeout", { seconds: commandExecutionTimeoutSeconds }))
+				await task.say(
+					"error",
+					t("common:errors:command_timeout", { seconds: commandExecutionTimeoutSeconds }),
+					undefined,
+					undefined,
+					undefined,
+					undefined,
+					{
+						metadata: { title: "Command Timeout" },
+					},
+				)
 				task.terminalProcess = undefined
 
 				return [

src/core/tools/fetchInstructionsTool.ts

@@ -3,6 +3,7 @@ import { fetchInstructions } from "../prompts/instructions/instructions"
 import { ClineSayTool } from "../../shared/ExtensionMessage"
 import { formatResponse } from "../prompts/responses"
 import { ToolUse, AskApproval, HandleError, PushToolResult } from "../../shared/tools"
+import { t } from "../../i18n"
 
 export async function fetchInstructionsTool(
 	cline: Task,
@@ -58,6 +59,6 @@ export async function fetchInstructionsTool(
 			return
 		}
 	} catch (error) {
-		await handleError("fetch instructions", error)
+		await handleError("fetch instructions", error, t("tools:fetchInstructions.errors.fetchError"))
 	}
 }