From 78d556fffc85e9b929638496d1d794c92df74bfc Mon Sep 17 00:00:00 2001
From: Cian Johnston <cian@coder.com>
Date: Fri, 29 May 2026 11:34:54 +0100
Subject: [PATCH] feat(site/src/pages/AgentsPage): show error details for
 generic errors (#25803)

Error messages in agent chat now expose the actual error detail
instead of hiding it entirely. Also captures API response detail
for generic errors that previously dropped it.
---
 site/src/pages/AgentsPage/AgentChatPage.tsx      |  4 +++-
 .../ChatConversation/ChatStatusCallout.tsx       | 16 +++++++++++-----
 .../ChatConversation/LiveStreamTail.stories.tsx  |  2 +-
 3 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/site/src/pages/AgentsPage/AgentChatPage.tsx b/site/src/pages/AgentsPage/AgentChatPage.tsx
index 8eca4e5f7d..a6d968d8af 100644
--- a/site/src/pages/AgentsPage/AgentChatPage.tsx
+++ b/site/src/pages/AgentsPage/AgentChatPage.tsx
@@ -1163,9 +1163,11 @@ const AgentChatPage: FC = () => {
 			store.setStreamError(reason);
 			setChatErrorReason(agentId, reason);
 		} else if (isApiError(error)) {
+			const detail = error.response?.data?.detail?.trim() || undefined;
 			const reason: ChatDetailError = {
 				kind: "generic",
-				message: error.message || "An unexpected error occurred.",
+				message: getErrorMessage(error, "An unexpected error occurred."),
+				...(detail ? { detail } : {}),
 			};
 			store.setStreamError(reason);
 			setChatErrorReason(agentId, reason);
diff --git a/site/src/pages/AgentsPage/components/ChatConversation/ChatStatusCallout.tsx b/site/src/pages/AgentsPage/components/ChatConversation/ChatStatusCallout.tsx
index 9cf3d8bc5b..857d15a5eb 100644
--- a/site/src/pages/AgentsPage/components/ChatConversation/ChatStatusCallout.tsx
+++ b/site/src/pages/AgentsPage/components/ChatConversation/ChatStatusCallout.tsx
@@ -157,11 +157,17 @@ const StatusAlert: FC<{ status: RetryOrFailedStatus }> = ({ status }) => {
 						</Link>
 					)}
 				</span>
-				{status.phase === "failed" && status.detail && (
-					<span className="mt-1 block text-content-secondary">
-						{status.detail}
-					</span>
-				)}
+				{status.phase === "failed" &&
+					status.detail &&
+					(status.kind === "generic" ? (
+						<code className="mt-1 block whitespace-pre-wrap text-xs text-content-secondary font-mono bg-surface-secondary rounded-md">
+							{status.detail}
+						</code>
+					) : (
+						<span className="mt-1 block text-content-secondary">
+							{status.detail}
+						</span>
+					))}
 			</AlertDescription>
 		</Alert>
 	);
diff --git a/site/src/pages/AgentsPage/components/ChatConversation/LiveStreamTail.stories.tsx b/site/src/pages/AgentsPage/components/ChatConversation/LiveStreamTail.stories.tsx
index 08fd59d1bb..b58a6b8ebe 100644
--- a/site/src/pages/AgentsPage/components/ChatConversation/LiveStreamTail.stories.tsx
+++ b/site/src/pages/AgentsPage/components/ChatConversation/LiveStreamTail.stories.tsx
@@ -317,7 +317,7 @@ export const GenericErrorDoesNotShowUsageAction: Story = {
 	},
 };
 
-/** Provider detail renders as a muted secondary line under the main error. */
+/** Provider detail renders in a monospace block for generic errors. */
 export const GenericErrorShowsProviderDetail: Story = {
 	args: {
 		...defaultArgs,