- ChatStopButton: centered outline button with Square icon and 'Stop generating' label - ChatMessageActions: edit Pencil for user messages (absolute, group-hover) - ChatMessageActions: retry RefreshCw for assistant messages (right-aligned, group-hover) - Both action buttons return null when isStreaming is true - Proper aria-labels and tooltips on all interactive elements
23 lines
568 B
TypeScript
23 lines
568 B
TypeScript
import { Square } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
interface ChatStopButtonProps {
|
|
onStop: () => void;
|
|
}
|
|
|
|
export function ChatStopButton({ onStop }: ChatStopButtonProps) {
|
|
return (
|
|
<div className="flex justify-center py-2 border-t border-border">
|
|
<Button
|
|
variant="outline"
|
|
size="sm"
|
|
onClick={onStop}
|
|
aria-label="Stop generating response"
|
|
className="gap-1.5"
|
|
>
|
|
<Square className="h-3 w-3 fill-current" />
|
|
Stop generating
|
|
</Button>
|
|
</div>
|
|
);
|
|
}
|