refactor(sidebar): emphasize active-tab conversations via rail color and status icon

- Highlight the vertical rail on conversations open in tabs with a darker primary tint and bleed 1px at both ends to stay continuous across cards
- Add emphasized state to SidebarStatusIcon mirroring the rail, deepening color when the conversation is open in a tab
- Redesign done icon as outlined circle + check, unify all status icons to sidebar-primary with consistent 0.75rem size and sidebar-tinted backdrop so they mask the rail
This commit is contained in:
xintaofei
2026-04-22 18:37:01 +08:00
parent 1d40308f52
commit 1904013dac
3 changed files with 84 additions and 31 deletions

View File

@@ -318,6 +318,16 @@ export function SidebarConversationList({
}
}, [tabs, activeTabId])
const openTabConversationKeys = useMemo(() => {
const set = new Set<string>()
for (const tab of tabs) {
if (tab.conversationId != null) {
set.add(`${tab.agentType}:${tab.conversationId}`)
}
}
return set
}, [tabs])
const [importing, setImporting] = useState(false)
const [folderExpanded, setFolderExpanded] = useState<Record<number, boolean>>(
{}
@@ -814,6 +824,9 @@ export function SidebarConversationList({
selectedConversation?.agentType === conv.agent_type &&
selectedConversation?.id === conv.id
}
isOpenInTab={openTabConversationKeys.has(
`${conv.agent_type}:${conv.id}`
)}
timeLabel={formatRelative(conv.updated_at)}
onSelect={handleSelect}
onDoubleClick={handleDoubleClick}