Skip to content

Commit 9c0bbeb

Browse files
angaduomAmbient Code Botclaudejeremyeder
authored
Fix hover card covering delete button in sessions sidebar (#1246)
When clicking the three-dot menu on a session in the recents sidebar, the hover card would appear over the dropdown menu, blocking access to the delete button and other actions. Restructured the HoverCard to only wrap the session link instead of the entire row, preventing the hover card from appearing when interacting with the dropdown menu. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Restructured session sidebar layout to reorganize hover card and action menu positioning. <!-- end of auto-generated comment: release notes by coderabbit.ai --> Co-authored-by: Ambient Code Bot <bot@ambient-code.local> Co-authored-by: Claude Sonnet 4.5 <noreply@anthropic.com> Co-authored-by: Jeremy Eder <jeder@redhat.com>
1 parent dc1f42e commit 9c0bbeb

1 file changed

Lines changed: 62 additions & 61 deletions

File tree

‎components/frontend/src/app/projects/[name]/sessions/[sessionName]/components/sessions-sidebar.tsx‎

Lines changed: 62 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -351,18 +351,19 @@ export function SessionsSidebar({
351351
const agentStatus = session.status?.agentStatus ?? deriveAgentStatusFromPhase(phase);
352352

353353
return (
354-
<HoverCard key={session.metadata.uid} openDelay={300} closeDelay={100}>
355-
<HoverCardTrigger asChild>
356-
<div
357-
className={cn(
358-
"group relative w-full flex items-center gap-2 rounded-md text-left text-sm transition-colors",
359-
"border-l-2",
360-
borderColor,
361-
"hover:bg-accent hover:text-accent-foreground",
362-
isActive &&
363-
"bg-accent text-accent-foreground font-medium"
364-
)}
365-
>
354+
<div
355+
key={session.metadata.uid}
356+
className={cn(
357+
"group relative w-full flex items-center gap-2 rounded-md text-left text-sm transition-colors",
358+
"border-l-2",
359+
borderColor,
360+
"hover:bg-accent hover:text-accent-foreground",
361+
isActive &&
362+
"bg-accent text-accent-foreground font-medium"
363+
)}
364+
>
365+
<HoverCard openDelay={300} closeDelay={100}>
366+
<HoverCardTrigger asChild>
366367
<Link
367368
href={sessionHref(session.metadata.name)}
368369
onClick={() => onSessionSelect?.()}
@@ -383,59 +384,59 @@ export function SessionsSidebar({
383384
: ""}
384385
</span>
385386
</Link>
386-
<SidebarSessionActions
387-
sessionName={session.metadata.name}
388-
displayName={name}
389-
phase={phase}
390-
onStop={handleStop}
391-
onContinue={handleContinue}
392-
onDelete={handleDelete}
393-
onEditName={handleEditName}
394-
canDelete={canDelete}
395-
canModify={canModify}
396-
/>
397-
</div>
398-
</HoverCardTrigger>
399-
<HoverCardContent side="right" align="start" className="w-80">
400-
<div className="space-y-2">
401-
<p className="text-sm font-semibold truncate">
402-
{name}
403-
</p>
404-
{session.spec.displayName && (
405-
<p className="text-xs text-muted-foreground">{session.metadata.name}</p>
406-
)}
407-
<div className="flex flex-col gap-1.5 pt-1">
408-
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
409-
<SessionStatusDot phase={phase} />
410-
<span>Session: {sessionPhaseLabel(phase)}</span>
411-
</div>
412-
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
413-
<AgentStatusIndicator
414-
status={agentStatus}
415-
compact
416-
/>
417-
<span>Agent: {agentStatusLabel(agentStatus)}</span>
418-
</div>
419-
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
420-
<Cpu className="h-3 w-3" />
421-
<span>{session.spec.llmSettings.model}</span>
422-
</div>
423-
{activityTime && (
387+
</HoverCardTrigger>
388+
<HoverCardContent side="right" align="start" className="w-80">
389+
<div className="space-y-2">
390+
<p className="text-sm font-semibold truncate">
391+
{name}
392+
</p>
393+
{session.spec.displayName && (
394+
<p className="text-xs text-muted-foreground">{session.metadata.name}</p>
395+
)}
396+
<div className="flex flex-col gap-1.5 pt-1">
424397
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
425-
<Clock className="h-3 w-3" />
426-
<span>{formatDistanceToNow(new Date(activityTime), { addSuffix: true })}</span>
398+
<SessionStatusDot phase={phase} />
399+
<span>Session: {sessionPhaseLabel(phase)}</span>
427400
</div>
428-
)}
429-
{session.spec.initialPrompt && (
430-
<div className="flex items-start gap-1.5 text-xs text-muted-foreground pt-1">
431-
<MessageSquare className="h-3 w-3 mt-0.5 shrink-0" />
432-
<span className="line-clamp-3">{session.spec.initialPrompt}</span>
401+
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
402+
<AgentStatusIndicator
403+
status={agentStatus}
404+
compact
405+
/>
406+
<span>Agent: {agentStatusLabel(agentStatus)}</span>
433407
</div>
434-
)}
408+
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
409+
<Cpu className="h-3 w-3" />
410+
<span>{session.spec.llmSettings.model}</span>
411+
</div>
412+
{activityTime && (
413+
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
414+
<Clock className="h-3 w-3" />
415+
<span>{formatDistanceToNow(new Date(activityTime), { addSuffix: true })}</span>
416+
</div>
417+
)}
418+
{session.spec.initialPrompt && (
419+
<div className="flex items-start gap-1.5 text-xs text-muted-foreground pt-1">
420+
<MessageSquare className="h-3 w-3 mt-0.5 shrink-0" />
421+
<span className="line-clamp-3">{session.spec.initialPrompt}</span>
422+
</div>
423+
)}
424+
</div>
435425
</div>
436-
</div>
437-
</HoverCardContent>
438-
</HoverCard>
426+
</HoverCardContent>
427+
</HoverCard>
428+
<SidebarSessionActions
429+
sessionName={session.metadata.name}
430+
displayName={name}
431+
phase={phase}
432+
onStop={handleStop}
433+
onContinue={handleContinue}
434+
onDelete={handleDelete}
435+
onEditName={handleEditName}
436+
canDelete={canDelete}
437+
canModify={canModify}
438+
/>
439+
</div>
439440
);
440441
})}
441442

0 commit comments

Comments
 (0)