adding a button for fixing all errors (#1785)

closes #1688 



<!-- This is an auto-generated description by cubic. -->
---
## Summary by cubic
Add a “Fix All Errors” button to the chat that collects all error
messages and sends a single request to resolve them. This helps users
fix multiple errors in one step.

- New Features
- Parse dyad-output type=error messages and track count/last index in
DyadMarkdownParser.
- Show FixAllErrorsButton after the last error when there are 2+ errors,
not streaming, and chatId is present.
- Button streams a prompt listing all errors, shows a loading state, and
displays the error count.

<sup>Written for commit b9762955d3b9cecd3b00c9efb478ce599f60e32d.
Summary will update automatically on new commits.</sup>

<!-- End of auto-generated description by cubic. -->
This commit is contained in:
Mohamed Aziz Mejri
2025-12-05 07:20:35 +01:00
committed by GitHub
parent 40aeed1456
commit 90c5805b57
6 changed files with 229 additions and 1 deletions

View File

@@ -28,6 +28,7 @@ import { DyadCodeSearch } from "./DyadCodeSearch";
import { DyadRead } from "./DyadRead";
import { mapActionToButton } from "./ChatInput";
import { SuggestedAction } from "@/lib/schemas";
import { FixAllErrorsButton } from "./FixAllErrorsButton";
interface DyadMarkdownParserProps {
content: string;
@@ -90,6 +91,34 @@ export const DyadMarkdownParser: React.FC<DyadMarkdownParserProps> = ({
return parseCustomTags(content);
}, [content]);
// Extract error messages and track positions
const { errorMessages, lastErrorIndex, errorCount } = useMemo(() => {
const errors: string[] = [];
let lastIndex = -1;
let count = 0;
contentPieces.forEach((piece, index) => {
if (
piece.type === "custom-tag" &&
piece.tagInfo.tag === "dyad-output" &&
piece.tagInfo.attributes.type === "error"
) {
const errorMessage = piece.tagInfo.attributes.message;
if (errorMessage?.trim()) {
errors.push(errorMessage.trim());
count++;
lastIndex = index;
}
}
});
return {
errorMessages: errors,
lastErrorIndex: lastIndex,
errorCount: count,
};
}, [contentPieces]);
return (
<>
{contentPieces.map((piece, index) => (
@@ -106,6 +135,17 @@ export const DyadMarkdownParser: React.FC<DyadMarkdownParserProps> = ({
</ReactMarkdown>
)
: renderCustomTag(piece.tagInfo, { isStreaming })}
{index === lastErrorIndex &&
errorCount > 1 &&
!isStreaming &&
chatId && (
<div className="mt-3 w-full flex">
<FixAllErrorsButton
errorMessages={errorMessages}
chatId={chatId}
/>
</div>
)}
</React.Fragment>
))}
</>

View File

@@ -0,0 +1,47 @@
import { Button } from "@/components/ui/button";
import { useStreamChat } from "@/hooks/useStreamChat";
import { Sparkles, Loader2 } from "lucide-react";
import { useState } from "react";
interface FixAllErrorsButtonProps {
errorMessages: string[];
chatId: number;
}
export function FixAllErrorsButton({
errorMessages,
chatId,
}: FixAllErrorsButtonProps) {
const { streamMessage } = useStreamChat();
const [isLoading, setIsLoading] = useState(false);
const handleFixAllErrors = () => {
setIsLoading(true);
const allErrors = errorMessages
.map((msg, i) => `${i + 1}. ${msg}`)
.join("\n");
streamMessage({
prompt: `Fix all of the following errors:\n\n${allErrors}`,
chatId,
onSettled: () => setIsLoading(false),
});
};
return (
<Button
variant="outline"
size="sm"
disabled={isLoading}
onClick={handleFixAllErrors}
className="bg-red-50 hover:bg-red-100 dark:bg-red-950 dark:hover:bg-red-900 text-red-700 dark:text-red-300 border-red-200 dark:border-red-800 ml-auto hover:cursor-pointer"
>
{isLoading ? (
<Loader2 size={16} className="mr-1 animate-spin" />
) : (
<Sparkles size={16} className="mr-1" />
)}
Fix All Errors ({errorMessages.length})
</Button>
);
}