From 6239dc4ae81d9d13ca2d5acf5548857829c33818 Mon Sep 17 00:00:00 2001
From: Roo Code <roomote@roocode.com>
Date: Fri, 12 Dec 2025 16:25:41 +0000
Subject: [PATCH 1/2] feat: add metadata to error details dialog

- Prepends extension version, provider, model, and repository info to error details
- Helps users provide better bug reports with context
- Uses useExtensionState and useSelectedModel hooks for data
---
 webview-ui/src/components/chat/ErrorRow.tsx | 33 ++++++++++++++++-----
 1 file changed, 26 insertions(+), 7 deletions(-)

diff --git a/webview-ui/src/components/chat/ErrorRow.tsx b/webview-ui/src/components/chat/ErrorRow.tsx
index a4497a1fe9b..b84dae0ca6e 100644
--- a/webview-ui/src/components/chat/ErrorRow.tsx
+++ b/webview-ui/src/components/chat/ErrorRow.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useCallback, memo } from "react"
+import React, { useState, useCallback, memo, useMemo } from "react"
 import { useTranslation } from "react-i18next"
 import { VSCodeButton } from "@vscode/webview-ui-toolkit/react"
 import { BookOpenText, MessageCircleWarning, Info, Copy, Check } from "lucide-react"
@@ -7,6 +7,8 @@ import { vscode } from "@src/utils/vscode"
 import CodeBlock from "../common/CodeBlock"
 import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from "@src/components/ui/dialog"
 import { Button, Tooltip, TooltipContent, TooltipTrigger } from "../ui"
+import { useExtensionState } from "@src/context/ExtensionStateContext"
+import { useSelectedModel } from "@src/components/ui/hooks/useSelectedModel"
 
 /**
  * Unified error display component for all error types in the chat.
@@ -91,6 +93,23 @@ export const ErrorRow = memo(
 		const [isDetailsDialogOpen, setIsDetailsDialogOpen] = useState(false)
 		const [showDetailsCopySuccess, setShowDetailsCopySuccess] = useState(false)
 		const { copyWithFeedback } = useCopyToClipboard()
+		const { version, apiConfiguration } = useExtensionState()
+		const { provider, id: modelId } = useSelectedModel(apiConfiguration)
+
+		// Format error details with metadata prepended
+		const formattedErrorDetails = useMemo(() => {
+			if (!errorDetails) return undefined
+
+			const metadata = [
+				`Extension version: ${version}`,
+				`Provider: ${provider}`,
+				`Model: ${modelId}`,
+				`Repository: RooCodeInc/Roo-Code`,
+				"",
+			].join("\n")
+
+			return metadata + errorDetails
+		}, [errorDetails, version, provider, modelId])
 
 		// Default titles for different error types
 		const getDefaultTitle = () => {
@@ -139,8 +158,8 @@ export const ErrorRow = memo(
 		const handleCopyDetails = useCallback(
 			async (e: React.MouseEvent) => {
 				e.stopPropagation()
-				if (errorDetails) {
-					const success = await copyWithFeedback(errorDetails)
+				if (formattedErrorDetails) {
+					const success = await copyWithFeedback(formattedErrorDetails)
 					if (success) {
 						setShowDetailsCopySuccess(true)
 						setTimeout(() => {
@@ -149,7 +168,7 @@ export const ErrorRow = memo(
 					}
 				}
 			},
-			[errorDetails, copyWithFeedback],
+			[formattedErrorDetails, copyWithFeedback],
 		)
 
 		const errorTitle = getDefaultTitle()
@@ -209,7 +228,7 @@ export const ErrorRow = memo(
 										{t("chat:apiRequest.errorMessage.docs")}
 									</a>
 								)}
-								{errorDetails && (
+								{formattedErrorDetails && (
 									<Tooltip>
 										<TooltipTrigger asChild>
 											<button
@@ -238,7 +257,7 @@ export const ErrorRow = memo(
 				</div>
 
 				{/* Error Details Dialog */}
-				{errorDetails && (
+				{formattedErrorDetails && (
 					<Dialog open={isDetailsDialogOpen} onOpenChange={setIsDetailsDialogOpen}>
 						<DialogContent className="max-w-2xl">
 							<DialogHeader>
@@ -246,7 +265,7 @@ export const ErrorRow = memo(
 							</DialogHeader>
 							<div className="max-h-96 overflow-auto px-3 bg-vscode-editor-background rounded-xl border border-vscode-editorGroup-border">
 								<pre className="font-mono text-sm whitespace-pre-wrap break-words bg-transparent">
-									{errorDetails}
+									{formattedErrorDetails}
 								</pre>
 							</div>
 							<DialogFooter>

From 2a41704fac99121579a5e7c3a463cbbe7f482040 Mon Sep 17 00:00:00 2001
From: Bruno Bergher <bruno@roocode.com>
Date: Fri, 12 Dec 2025 16:31:14 +0000
Subject: [PATCH 2/2] Tweaks

---
 webview-ui/src/components/chat/ErrorRow.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/webview-ui/src/components/chat/ErrorRow.tsx b/webview-ui/src/components/chat/ErrorRow.tsx
index b84dae0ca6e..a5647867dca 100644
--- a/webview-ui/src/components/chat/ErrorRow.tsx
+++ b/webview-ui/src/components/chat/ErrorRow.tsx
@@ -101,10 +101,11 @@ export const ErrorRow = memo(
 			if (!errorDetails) return undefined
 
 			const metadata = [
+				`Date/time: ${new Date().toISOString()}`,
 				`Extension version: ${version}`,
 				`Provider: ${provider}`,
 				`Model: ${modelId}`,
-				`Repository: RooCodeInc/Roo-Code`,
+				"",
 				"",
 			].join("\n")
 
@@ -233,7 +234,7 @@ export const ErrorRow = memo(
 										<TooltipTrigger asChild>
 											<button
 												onClick={() => setIsDetailsDialogOpen(true)}
-												className="transition-opacity opacity-0 group-hover:opacity-100 cursor-pointer"
+												className="transition-opacity opacity-30 group-hover:opacity-100 cursor-pointer"
 												aria-label={t("chat:errorDetails.title")}>
 												<Info className="size-4" />
 											</button>