luis.felipe/PromptLab-Front-end
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add delete button to history items

Browse Source 
Adds a Trash2 icon button to each conversation in the test prompt history to delete conversations via handleDeleteConversation, updating TestPrompt.tsx accordingly.
This commit is contained in:
gpt-engineer-app[bot]
2025-11-11 20:13:32 +00:00
parent 70fb1e9d40
commit 55cb7c0ae6
1 changed files with 33 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/TestPrompt.tsx
+33 -18
View File
@@ -4,7 +4,7 @@ import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input"; import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label"; import { Label } from "@/components/ui/label";
import { ScrollArea } from "@/components/ui/scroll-area"; import { ScrollArea } from "@/components/ui/scroll-area";
import { Send, Bot, User, RotateCcw, MessageSquare, Plus } from "lucide-react"; import { Send, Bot, User, RotateCcw, MessageSquare, Plus, Trash2 } from "lucide-react";
import { useToast } from "@/hooks/use-toast"; import { useToast } from "@/hooks/use-toast";
import { import {
Select, Select,
@@ -188,32 +188,47 @@ export default function TestPrompt() {
</div> </div>
) : ( ) : (
conversations.map((conversation) => ( conversations.map((conversation) => (
<button <div
key={conversation.id} key={conversation.id}
onClick={() => handleSelectConversation(conversation.id)} className={`group relative rounded-lg transition-colors ${
className={`w-full text-left p-3 rounded-lg transition-colors ${
currentConversationId === conversation.id currentConversationId === conversation.id
? "bg-primary/10 border border-primary/20" ? "bg-primary/10 border border-primary/20"
: "hover:bg-muted" : "hover:bg-muted"
}`} }`}
> >
<div className="flex items-start gap-2"> <button
<MessageSquare className="h-4 w-4 mt-1 flex-shrink-0 text-muted-foreground" /> onClick={() => handleSelectConversation(conversation.id)}
<div className="flex-1 min-w-0"> className="w-full text-left p-3"
<p className="text-sm font-medium text-foreground truncate"> >
{conversation.title} <div className="flex items-start gap-2 pr-8">
</p> <MessageSquare className="h-4 w-4 mt-1 flex-shrink-0 text-muted-foreground" />
<div className="flex items-center gap-2 mt-1"> <div className="flex-1 min-w-0">
<span className="text-xs px-2 py-0.5 rounded bg-muted text-muted-foreground"> <p className="text-sm font-medium text-foreground truncate">
{conversation.agentName} {conversation.title}
</span>
<p className="text-xs text-muted-foreground">
{new Date(conversation.createdAt).toLocaleDateString("pt-BR")}
</p> </p>
<div className="flex items-center gap-2 mt-1">
<span className="text-xs px-2 py-0.5 rounded bg-muted text-muted-foreground">
{conversation.agentName}
</span>
<p className="text-xs text-muted-foreground">
{new Date(conversation.createdAt).toLocaleDateString("pt-BR")}
</p>
</div>
</div> </div>
</div> </div>
</div> </button>
</button> <Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
handleDeleteConversation(conversation.id);
}}
className="absolute right-2 top-2 h-7 w-7 opacity-0 group-hover:opacity-100 transition-opacity"
>
<Trash2 className="h-4 w-4 text-destructive" />
</Button>
</div>
)) ))
)} )}
</div> </div>