mirror of
https://github.com/Significant-Gravitas/AutoGPT.git
synced 2026-02-06 04:45:10 -05:00
fix(frontend): Improve clarification answer message formatting (#11985)
## Summary Improves the auto-generated message format when users submit clarification answers in the agent generator. ## Before ``` I have the answers to your questions: keyword_1: User answer 1 keyword_2: User answer 2 Please proceed with creating the agent. ``` <img width="748" height="153" alt="image" src="https://github.com/user-attachments/assets/7231aaab-8ea4-406b-ba31-fa2b6055b82d" /> ## After ``` **Here are my answers:** > What is the primary purpose? User answer 1 > What is the target audience? User answer 2 Please proceed with creating the agent. ``` <img width="619" height="352" alt="image" src="https://github.com/user-attachments/assets/ef8c1fbf-fb60-4488-b51f-407c1b9e3e44" /> ## Changes - Use human-readable question text instead of machine-readable keywords - Use blockquote format for questions (natural "quote and reply" pattern) - Use double newlines for proper Markdown paragraph breaks - Iterate over `message.questions` array to preserve original question order - Move handler inside conditional block for proper TypeScript type narrowing ## Why - The old format was ugly and hard to read (raw keywords, no line breaks) - The new format uses a natural "quoting and replying" pattern - Better readability for both users and the LLM (verified: backend does NOT parse keywords) ## Linear Ticket Fixes [SECRT-1822](https://linear.app/autogpt/issue/SECRT-1822) ## Testing - [ ] Trigger agent creation that requires clarifying questions - [ ] Fill out the form and submit - [ ] Verify message appears with new blockquote format - [ ] Verify questions appear in original order - [ ] Verify agent generation proceeds correctly Co-authored-by: Toran Bruce Richards <toran.richards@gmail.com>
This commit is contained in:
@@ -102,18 +102,6 @@ export function ChatMessage({
|
||||
}
|
||||
}
|
||||
|
||||
function handleClarificationAnswers(answers: Record<string, string>) {
|
||||
if (onSendMessage) {
|
||||
const contextMessage = Object.entries(answers)
|
||||
.map(([keyword, answer]) => `${keyword}: ${answer}`)
|
||||
.join("\n");
|
||||
|
||||
onSendMessage(
|
||||
`I have the answers to your questions:\n\n${contextMessage}\n\nPlease proceed with creating the agent.`,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const handleCopy = useCallback(
|
||||
async function handleCopy() {
|
||||
if (message.type !== "message") return;
|
||||
@@ -162,6 +150,22 @@ export function ChatMessage({
|
||||
.slice(index + 1)
|
||||
.some((m) => m.type === "message" && m.role === "user");
|
||||
|
||||
const handleClarificationAnswers = (answers: Record<string, string>) => {
|
||||
if (onSendMessage) {
|
||||
// Iterate over questions (preserves original order) instead of answers
|
||||
const contextMessage = message.questions
|
||||
.map((q) => {
|
||||
const answer = answers[q.keyword] || "";
|
||||
return `> ${q.question}\n\n${answer}`;
|
||||
})
|
||||
.join("\n\n");
|
||||
|
||||
onSendMessage(
|
||||
`**Here are my answers:**\n\n${contextMessage}\n\nPlease proceed with creating the agent.`,
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<ClarificationQuestionsWidget
|
||||
questions={message.questions}
|
||||
|
||||
Reference in New Issue
Block a user