feat(FN-2046): add accessible delete button to chat session items

- Add an inline delete button to each chat session item with an aria-label and Trash icon
- Prevent session selection when delete is clicked by stopping event propagation and opening the confirmation dialog
- Style the delete control to appear on hover/focus and remain visible on mobile for touch accessibility
- Add ChatView tests covering render behavior, confirmation flow, selection guard, delete action, and CSS visibility rules
This commit is contained in:
Fusion
2026-04-18 00:02:09 -07:00
committed by gsxdsm
parent b3cc6047c3
commit d58825cbd2
3 changed files with 158 additions and 0 deletions

View File

@@ -869,6 +869,17 @@ export function ChatView({ projectId, addToast }: ChatViewProps) {
}}
data-testid={`chat-session-${session.id}`}
>
<button
className="chat-session-delete-btn"
onClick={(e) => {
e.stopPropagation();
setConfirmDelete(session.id);
}}
data-testid="chat-session-delete-btn"
aria-label="Delete conversation"
>
<Trash2 size={14} />
</button>
<div className="chat-session-title">{session.title || "Untitled"}</div>
<div className="chat-session-preview">
{session.lastMessagePreview || "No messages"}