feat: enhance message rendering for user answers

Author: qorzj

packages/cli/src/tests/ask-user-question.test.ts

@@ -104,18 +104,18 @@ test("formatAskUserQuestionAnswers creates model-readable answer text", () => {
     }),
     [
       "Questions 2/2 answered",
-      " - `Which package manager?`",
+      " - Which package manager?",
       "   answer: yarn",
-      " - `Any notes?`",
+      " - Any notes?",
       "   answer: Use the existing lockfile",
     ].join("\n")
   );
 });
 
-test("formatAskUserQuestionAnswers normalizes multiline answers and escapes question backticks", () => {
+test("formatAskUserQuestionAnswers normalizes multiline questions and answers", () => {
   assert.equal(
-    formatAskUserQuestionAnswers({ "Which `mode`?": "Use fast\nmode" }),
-    ["Questions 1/1 answered", " - `Which \\`mode\\`?`", "   answer: Use fast mode"].join("\n")
+    formatAskUserQuestionAnswers({ "Which\nmode?": "Use fast\nmode" }),
+    ["Questions 1/1 answered", " - Which mode?", "   answer: Use fast mode"].join("\n")
   );
 });
 

packages/cli/src/tests/message-view.test.ts

@@ -120,6 +120,37 @@ test("renderMessageToStdout renders user messages with > prefix", () => {
   assert.ok(output.includes("> fix the bug"));
 });
 
+test("MessageView renders only answer user messages as Markdown", () => {
+  const regular = makeSessionMessage({ role: "user", content: "**Questions answered**" });
+  const answers = makeSessionMessage({
+    role: "user",
+    content: "**Questions answered**",
+    meta: { isAnswers: true },
+  });
+
+  const regularOutput = stripAnsi(
+    renderToString(React.createElement(MessageView, { message: regular, width: 80 }), { columns: 80 })
+  );
+  const answersOutput = stripAnsi(
+    renderToString(React.createElement(MessageView, { message: answers, width: 80 }), { columns: 80 })
+  );
+
+  assert.match(regularOutput, /\*\*Questions answered\*\*/);
+  assert.doesNotMatch(answersOutput, /\*\*/);
+  assert.match(answersOutput, /Questions answered/);
+});
+
+test("renderMessageToStdout renders answer user messages as Markdown", () => {
+  const msg = makeSessionMessage({
+    role: "user",
+    content: "**Questions answered**",
+    meta: { isAnswers: true },
+  });
+  const output = stripAnsi(renderMessageToStdout(msg, RawMode.Raw));
+
+  assert.equal(output, "> Questions answered");
+});
+
 test("renderMessageToStdout shows (no content) for empty user messages", () => {
   const msg = makeSessionMessage({ role: "user", content: "" });
   const output = renderMessageToStdout(msg, RawMode.Raw);

packages/cli/src/ui/components/MessageView/index.tsx

@@ -22,7 +22,8 @@ export function MessageView({ message, collapsed, width = 80 }: MessageViewProps
   }
 
   if (message.role === "user") {
-    const text = message.content || "(no content)";
+    const content = message.content || "(no content)";
+    const text = message.meta?.isAnswers ? renderMarkdown(content) : content;
     return (
       <PromptEchoLine
         text={text}

packages/cli/src/ui/components/MessageView/utils.ts

@@ -2,6 +2,7 @@ import type { DiffPreviewLine, ToolSummary } from "./types";
 import type { SessionMessage } from "@vegamo/deepcode-core";
 import { RawMode } from "../../contexts";
 import chalk from "chalk";
+import { renderMarkdown } from "./markdown";
 
 /** Type guard that checks whether a value is a plain object (not null, not an array). */
 export function isPlainRecord(value: unknown): value is Record<string, unknown> {
@@ -227,7 +228,8 @@ export function renderMessageToStdout(message: SessionMessage, mode: RawMode): s
   }
 
   if (message.role === "user") {
-    const text = message.content || "(no content)";
+    const content = message.content || "(no content)";
+    const text = message.meta?.isAnswers ? renderMarkdown(content) : content;
     return chalk(`> ${text}`);
   }
 

packages/cli/src/ui/core/ask-user-question.ts

@@ -50,8 +50,8 @@ export function formatAskUserQuestionAnswers(answers: AskUserQuestionAnswers): s
   const entries = Object.entries(answers);
   const lines = [`Questions ${entries.length}/${entries.length} answered`];
   for (const [question, answer] of entries) {
-    lines.push(` - \`${formatQuestion(question)}\``);
-    lines.push(`   answer: ${formatAnswer(answer)}`);
+    lines.push(` - ${formatAnswerPart(question)}`);
+    lines.push(`   answer: ${formatAnswerPart(answer)}`);
   }
   return lines.join("\n");
 }
@@ -131,10 +131,6 @@ function normalizeOption(raw: unknown): AskUserQuestionOption | null {
   };
 }
 
-function formatQuestion(value: string): string {
-  return value.replace(/`/g, "\\`").replace(/\s+/g, " ").trim();
-}
-
-function formatAnswer(value: string): string {
+function formatAnswerPart(value: string): string {
   return value.replace(/\s+/g, " ").trim();
 }

packages/cli/src/ui/utils/index.ts

@@ -5,6 +5,7 @@ import type { PromptDraft } from "../views/PromptInput";
 import type { ModelConfigSelection } from "@vegamo/deepcode-core";
 import type { SessionEntry, SessionMessage } from "@vegamo/deepcode-core";
 import type { SessionManager } from "@vegamo/deepcode-core";
+import type { MessageMeta } from "@vegamo/deepcode-core";
 
 /**
  * Render all messages directly to stdout for Raw mode display.
@@ -26,7 +27,7 @@ export function renderRawModeMessages(allMessages: SessionMessage[], mode: strin
   }
 }
 
-export function buildSyntheticUserMessage(content: string, imageCount: number): SessionMessage {
+export function buildSyntheticUserMessage(content: string, imageCount: number, meta?: MessageMeta): SessionMessage {
   const now = new Date().toISOString();
   return {
     id: `local-${Math.random().toString(36).slice(2)}`,
@@ -45,6 +46,7 @@ export function buildSyntheticUserMessage(content: string, imageCount: number):
     visible: true,
     createTime: now,
     updateTime: now,
+    meta,
   };
 }
 

packages/cli/src/ui/views/App.tsx

@@ -424,7 +424,14 @@ function App({ projectRoot, initialPrompt, resumeSessionId, forkSessionId, onRes
         (submission.imageUrls.length > 0 ? "[Image]" : "");
 
       if (userDisplayContent && submission.command !== "continue") {
-        setMessages((prev) => [...prev, buildSyntheticUserMessage(userDisplayContent, submission.imageUrls.length)]);
+        setMessages((prev) => [
+          ...prev,
+          buildSyntheticUserMessage(
+            userDisplayContent,
+            submission.imageUrls.length,
+            submission.isAnswers ? { isAnswers: true } : undefined
+          ),
+        ]);
       }
 
       setBusy(true);

packages/core/src/tests/session.test.ts

@@ -631,7 +631,7 @@ test("SessionManager tags AskUserQuestion answer messages", async () => {
     createChatResponse("continued", { prompt_tokens: 1, completion_tokens: 1, total_tokens: 2 }),
   ]);
   const sessionId = await manager.createSession({
-    text: "Questions 1/1 answered\n - `Continue?`\n   answer: Yes",
+    text: "Questions 1/1 answered\n - Continue?\n   answer: Yes",
     isAnswers: true,
   });
   const message = manager.listSessionMessages(sessionId).find((item) => item.role === "user");

packages/vscode-ide-companion/resources/webview.css

@@ -733,6 +733,10 @@ body {
   max-width: 80%;
 }
 
+.bubble.user.answers {
+  white-space: normal;
+}
+
 .bubble.system {
   background: transparent;
   border-color: transparent;

packages/vscode-ide-companion/resources/webview.html

@@ -562,8 +562,10 @@
           if (otherText) {
             answers.push(otherText);
           }
-          lines.push(` - \`${String(question.question || "").replace(/`/g, "\\`")}\``);
-          lines.push(`   answer: ${answers.join(", ")}`);
+          const questionText = String(question.question || "").replace(/\s+/g, " ").trim();
+          const answerText = answers.join(", ").replace(/\s+/g, " ").trim();
+          lines.push(` - ${questionText}`);
+          lines.push(`   answer: ${answerText}`);
         }
 
         return {
@@ -698,8 +700,13 @@
         }
 
         if (role === "user") {
-          // 普通用户气泡
-          bubble.textContent = content;
+          if (meta && meta.isAnswers) {
+            bubble.classList.add("answers");
+            bubble.innerHTML = content;
+          } else {
+            // 普通用户气泡
+            bubble.textContent = content;
+          }
         } else if (role === "assistant") {
           if (meta && meta.asThinking === true) {
             // 思考气泡（可折叠）
@@ -2168,7 +2175,7 @@
         if (msg.role === "system") {
           addBubble(msg.content, "system", msg.meta, shouldConnect);
         } else if (msg.role === "user") {
-          addBubble(msg.content, "user", msg.meta, false);
+          addBubble(msg.meta?.isAnswers ? msg.html || msg.content : msg.content, "user", msg.meta, false);
         } else if (msg.role === "assistant") {
           addBubble(msg.html || msg.content, "assistant", msg.meta, shouldConnect, msg.content || "");
         } else if (msg.role === "tool") {
@@ -2327,8 +2334,12 @@
           }
           updateThinkingBubbleContent();
         } else if (message.type === "userMessage") {
-          // 显示用户消息（纯文本）
-          addBubble(message.content || "", "user", message.meta, false);
+          addBubble(
+            message.meta?.isAnswers ? message.html || message.content || "" : message.content || "",
+            "user",
+            message.meta,
+            false
+          );
 
           // Record user message into history
           if (typeof message.content === "string") {