storkit: merge 450_bug_web_ui_silently_swallows_chat_errors_including_oauth_login_link

frontend/src/components/Chat.test.tsx

@@ -1691,3 +1691,40 @@ describe("Slash command handling (Story 374)", () => {
 		).toBeInTheDocument();
 	});
 });
+
+describe("Bug 450: WebSocket error messages displayed in chat", () => {
+	beforeEach(() => {
+		capturedWsHandlers = null;
+		setupMocks();
+	});
+
+	it("AC1: WebSocket error message is shown in chat as an assistant message", async () => {
+		render(<Chat projectPath="/tmp/project" onCloseProject={vi.fn()} />);
+
+		await waitFor(() => expect(capturedWsHandlers).not.toBeNull());
+
+		act(() => {
+			capturedWsHandlers?.onError("Something went wrong on the server.");
+		});
+
+		expect(
+			await screen.findByText("Something went wrong on the server."),
+		).toBeInTheDocument();
+	});
+
+	it("AC2: OAuth login URL in WebSocket error is rendered as a clickable link", async () => {
+		render(<Chat projectPath="/tmp/project" onCloseProject={vi.fn()} />);
+
+		await waitFor(() => expect(capturedWsHandlers).not.toBeNull());
+
+		act(() => {
+			capturedWsHandlers?.onError(
+				"OAuth login required. Please visit: https://example.com/oauth/login",
+			);
+		});
+
+		const link = await screen.findByRole("link", { name: /https:\/\/example\.com\/oauth\/login/ });
+		expect(link).toBeInTheDocument();
+		expect(link).toHaveAttribute("href", "https://example.com/oauth/login");
+	});
+});

frontend/src/components/Chat.tsx

@@ -413,6 +413,14 @@ export function Chat({
 				console.error("WebSocket error:", message);
 				setLoading(false);
 				setActivityStatus(null);
+				const markdownMessage = message.replace(
+					/(https?:\/\/[^\s]+)/g,
+					"[$1]($1)",
+				);
+				setMessages((prev) => [
+					...prev,
+					{ role: "assistant", content: markdownMessage },
+				]);
 				if (queuedMessagesRef.current.length > 0) {
 					const batch = queuedMessagesRef.current.map((item) => item.text);
 					queuedMessagesRef.current = [];