fix: implement graceful file not found error handling with unified display

- Show styled FileNotFoundError component in UI for better user experience
- Display all missing files in a single component instead of multiple
- Component supports both single and multiple file paths
- Keep error message in tool result XML for AI model awareness
- Prevent duplicate 'Error reading file' message by not calling handleError
- Improved error detection to catch various file not found scenarios
- Updated component styling to match diff_error appearance
- Added translations for plural forms in all 17 supported languages

Author: daniel-lxs

src/core/tools/readFileTool.ts

@@ -198,6 +198,9 @@ export async function readFileTool(
 		lineRanges: entry.lineRanges,
 	}))
 
+	// Track files that were not found
+	const notFoundFiles: string[] = []
+
 	// Function to update file result status
 	const updateFileResult = (path: string, updates: Partial<FileResult>) => {
 		const index = fileResults.findIndex((result) => result.path === path)
@@ -621,31 +624,38 @@ export async function readFileTool(
 						errorMsg.includes("File not found"))
 
 				if (isFileNotFound) {
-					// Emit a proper typed message for file not found errors
-					await cline.say(
-						"file_not_found_error",
-						JSON.stringify({
-							filePath: relPath,
-							error: "The requested file does not exist in the current workspace.",
-						}),
-					)
+					// Track the missing file
+					notFoundFiles.push(relPath)
 
 					updateFileResult(relPath, {
 						status: "error",
 						error: "File not found",
-						xmlContent: "", // Empty to prevent duplicate error display
+						xmlContent: `<file><path>${relPath}</path><error>File not found: The requested file does not exist in the current workspace.</error></file>`,
 					})
+					// Don't call handleError for file not found - we'll emit a unified message later
 				} else {
 					updateFileResult(relPath, {
 						status: "error",
 						error: errorMsg,
 						xmlContent: `<file><path>${relPath}</path><error>${errorMsg}</error></file>`,
 					})
+					// Only call handleError for non-file-not-found errors
+					await handleError(`reading file ${relPath}`, error instanceof Error ? error : new Error(errorMsg))
 				}
-				await handleError(`reading file ${relPath}`, error instanceof Error ? error : new Error(errorMsg))
 			}
 		}
 
+		// Emit a unified file not found error message if any files were not found
+		if (notFoundFiles.length > 0) {
+			await cline.say(
+				"file_not_found_error",
+				JSON.stringify({
+					filePaths: notFoundFiles,
+					error: "The requested files do not exist in the current workspace.",
+				}),
+			)
+		}
+
 		// Generate final XML result from all file results
 		const xmlResults = fileResults.filter((result) => result.xmlContent).map((result) => result.xmlContent)
 		const filesXml = `<files>\n${xmlResults.join("\n")}\n</files>`
@@ -731,23 +741,18 @@ export async function readFileTool(
 				errorMsg.includes("File not found"))
 
 		if (isFileNotFound) {
-			// Emit a proper typed message for file not found errors
-			await cline.say(
-				"file_not_found_error",
-				JSON.stringify({
-					filePath: relPath,
-					error: "The requested file does not exist in the current workspace.",
-				}),
-			)
+			// Track the missing file
+			notFoundFiles.push(relPath)
 
 			// If we have file results, update the first one with the error
 			if (fileResults.length > 0) {
 				updateFileResult(relPath, {
 					status: "error",
 					error: "File not found",
-					xmlContent: "", // Empty to prevent duplicate error display
+					xmlContent: `<file><path>${relPath}</path><error>File not found: The requested file does not exist in the current workspace.</error></file>`,
 				})
 			}
+			// Don't call handleError for file not found - we'll emit a unified message later
 		} else {
 			// If we have file results, update the first one with the error
 			if (fileResults.length > 0) {
@@ -757,9 +762,20 @@ export async function readFileTool(
 					xmlContent: `<file><path>${relPath}</path><error>${errorMsg}</error></file>`,
 				})
 			}
+			// Only call handleError for non-file-not-found errors
+			await handleError(`reading file ${relPath}`, error instanceof Error ? error : new Error(errorMsg))
 		}
 
-		await handleError(`reading file ${relPath}`, error instanceof Error ? error : new Error(errorMsg))
+		// Emit a unified file not found error message if any files were not found
+		if (notFoundFiles.length > 0) {
+			await cline.say(
+				"file_not_found_error",
+				JSON.stringify({
+					filePaths: notFoundFiles,
+					error: "The requested files do not exist in the current workspace.",
+				}),
+			)
+		}
 
 		// Generate final XML result from all file results
 		const xmlResults = fileResults.filter((result) => result.xmlContent).map((result) => result.xmlContent)

webview-ui/src/components/chat/ChatRow.tsx

@@ -1060,8 +1060,10 @@ export const ChatRowContent = ({
 						</div>
 					)
 				case "file_not_found_error":
-					const errorData = safeJsonParse<{ filePath: string; error: string }>(message.text || "{}")
-					return <FileNotFoundError filePath={errorData?.filePath || ""} />
+					const errorData = safeJsonParse<{ filePath?: string; filePaths?: string[]; error: string }>(
+						message.text || "{}",
+					)
+					return <FileNotFoundError filePaths={errorData?.filePaths || errorData?.filePath || ""} />
 				case "user_feedback":
 					return (
 						<div className="bg-vscode-editor-background border rounded-xs p-1 overflow-hidden whitespace-pre-wrap">

webview-ui/src/components/chat/FileNotFoundError.tsx

@@ -2,81 +2,69 @@ import React from "react"
 import { useTranslation } from "react-i18next"
 
 interface FileNotFoundErrorProps {
-	filePath: string
-	isExpanded?: boolean
-	onToggleExpand?: () => void
+	filePaths: string | string[]
 }
 
-export const FileNotFoundError: React.FC<FileNotFoundErrorProps> = ({
-	filePath,
-	isExpanded = false,
-	onToggleExpand,
-}) => {
+export const FileNotFoundError: React.FC<FileNotFoundErrorProps> = ({ filePaths }) => {
 	const { t } = useTranslation()
-
-	const headerStyle: React.CSSProperties = {
-		display: "flex",
-		alignItems: "center",
-		gap: "10px",
-		marginBottom: "10px",
-		wordBreak: "break-word",
-		cursor: onToggleExpand ? "pointer" : "default",
-		userSelect: "none",
-	}
-
-	const containerStyle: React.CSSProperties = {
-		backgroundColor: "var(--vscode-inputValidation-warningBackground)",
-		border: "1px solid var(--vscode-inputValidation-warningBorder)",
-		borderRadius: "4px",
-		padding: "12px",
-		marginTop: "8px",
-		marginBottom: "8px",
-	}
-
-	const iconStyle: React.CSSProperties = {
-		color: "var(--vscode-editorWarning-foreground)",
-		fontSize: "16px",
-		marginBottom: "-1.5px",
-	}
-
-	const titleStyle: React.CSSProperties = {
-		color: "var(--vscode-editorWarning-foreground)",
-		fontWeight: "bold",
-	}
-
-	const pathStyle: React.CSSProperties = {
-		fontFamily: "var(--vscode-editor-font-family)",
-		fontSize: "var(--vscode-editor-font-size)",
-		marginTop: "8px",
-		marginBottom: "4px",
-		wordBreak: "break-all",
-	}
-
-	const messageStyle: React.CSSProperties = {
-		color: "var(--vscode-foreground)",
-		opacity: 0.9,
-		fontSize: "var(--vscode-font-size)",
-	}
+	const paths = Array.isArray(filePaths) ? filePaths : [filePaths]
+	const isMultiple = paths.length > 1
 
 	return (
-		<div style={containerStyle}>
-			<div style={headerStyle} onClick={onToggleExpand}>
-				<span className="codicon codicon-warning" style={iconStyle} />
-				<span style={titleStyle}>{t("chat:fileOperations.fileNotFound")}</span>
-				{onToggleExpand && (
-					<div style={{ flexGrow: 1, display: "flex", justifyContent: "flex-end" }}>
-						<span className={`codicon codicon-chevron-${isExpanded ? "up" : "down"}`} />
-					</div>
-				)}
+		<div
+			style={{
+				marginTop: "8px",
+				marginBottom: "8px",
+			}}>
+			<div
+				style={{
+					display: "flex",
+					alignItems: "center",
+					gap: "10px",
+					marginBottom: "8px",
+					fontSize: "var(--vscode-font-size)",
+					color: "var(--vscode-editor-foreground)",
+				}}>
+				<span
+					className="codicon codicon-warning"
+					style={{
+						color: "var(--vscode-editorWarning-foreground)",
+						opacity: 0.8,
+						fontSize: 16,
+						marginBottom: "-1.5px",
+					}}
+				/>
+				<span style={{ fontWeight: "bold" }}>
+					{isMultiple ? t("chat:fileOperations.filesNotFound") : t("chat:fileOperations.fileNotFound")}
+				</span>
 			</div>
-			{(isExpanded || !onToggleExpand) && (
-				<>
-					<div style={pathStyle}>
-						<code>{filePath}</code>
+			<div
+				style={{
+					paddingLeft: "26px", // Align with text after icon (16px icon + 10px gap)
+				}}>
+				{paths.map((path, index) => (
+					<div
+						key={index}
+						style={{
+							fontFamily: "var(--vscode-editor-font-family)",
+							fontSize: "var(--vscode-editor-font-size)",
+							marginBottom: index === paths.length - 1 ? "8px" : "4px",
+							wordBreak: "break-all",
+							color: "var(--vscode-foreground)",
+						}}>
+						<code>{path}</code>
 					</div>
-					<div style={messageStyle}>{t("chat:fileOperations.fileNotFoundMessage")}</div>
-				</>
-			)}
+				))}
+				<div
+					style={{
+						color: "var(--vscode-descriptionForeground)",
+						fontSize: "var(--vscode-font-size)",
+					}}>
+					{isMultiple
+						? t("chat:fileOperations.filesNotFoundMessage")
+						: t("chat:fileOperations.fileNotFoundMessage")}
+				</div>
+			</div>
 		</div>
 	)
 }

webview-ui/src/i18n/locales/ca/chat.json

@@ -189,7 +189,9 @@
 		"wantsToInsertWithLineNumber": "Roo wants to insert content into this file at line {{lineNumber}}:",
 		"wantsToInsertAtEnd": "Roo wants to append content to the end of this file:",
 		"fileNotFound": "File Not Found",
-		"fileNotFoundMessage": "The requested file does not exist in the current workspace."
+		"filesNotFound": "Files Not Found",
+		"fileNotFoundMessage": "The requested file does not exist in the current workspace.",
+		"filesNotFoundMessage": "The requested files do not exist in the current workspace."
 	},
 	"directoryOperations": {
 		"wantsToViewTopLevel": "Roo wants to view the top level files in this directory:",