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

@@ -31104,6 +31104,41 @@ html .column.drag-over * {
color: var(--text-tertiary);
}
/* === Chat Session Delete Button === */
.chat-session-delete-btn {
position: absolute;
top: 8px;
right: 8px;
display: flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
padding: 0;
background: transparent;
border: none;
border-radius: var(--radius-sm);
color: var(--text-muted);
cursor: pointer;
opacity: 0;
transition: opacity var(--transition-fast), color var(--transition-fast);
}
.chat-session-item:hover .chat-session-delete-btn {
opacity: 1;
}
.chat-session-delete-btn:hover {
color: var(--color-error);
opacity: 1;
}
.chat-session-delete-btn:focus {
opacity: 1;
outline: 2px solid var(--focus-ring-strong);
outline-offset: 1px;
}
/* Context menu for session items */
.chat-session-context-menu {
position: fixed;
@@ -35865,4 +35900,9 @@ html .column.drag-over * {
.insights-view-count {
font-size: 12px;
}
/* Chat session delete button - always visible on mobile */
.chat-session-delete-btn {
opacity: 1;
}
}