Skip to content

Fix hover card covering delete button in sessions sidebar #1246

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
angaduom wants to merge 1 commit into
base: main
Choose a base branch
from
+62 −61
Open

Fix hover card covering delete button in sessions sidebar #1246

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
123 changes: 62 additions & 61 deletions ...s/frontend/src/app/projects/[name]/sessions/[sessionName]/components/sessions-sidebar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -351,18 +351,19 @@ export function SessionsSidebar({
const agentStatus = session.status?.agentStatus ?? deriveAgentStatusFromPhase(phase);

return (
<HoverCard key={session.metadata.uid} openDelay={300} closeDelay={100}>
<HoverCardTrigger asChild>
<div
className={cn(
"group relative w-full flex items-center gap-2 rounded-md text-left text-sm transition-colors",
"border-l-2",
borderColor,
"hover:bg-accent hover:text-accent-foreground",
isActive &&
"bg-accent text-accent-foreground font-medium"
)}
>
<div
key={session.metadata.uid}
className={cn(
"group relative w-full flex items-center gap-2 rounded-md text-left text-sm transition-colors",
"border-l-2",
borderColor,
"hover:bg-accent hover:text-accent-foreground",
isActive &&
"bg-accent text-accent-foreground font-medium"
)}
>
<HoverCard openDelay={300} closeDelay={100}>
<HoverCardTrigger asChild>
<Link
href={sessionHref(session.metadata.name)}
onClick={() => onSessionSelect?.()}
Expand All @@ -383,59 +384,59 @@ export function SessionsSidebar({
: ""}
</span>
</Link>
<SidebarSessionActions
sessionName={session.metadata.name}
displayName={name}
phase={phase}
onStop={handleStop}
onContinue={handleContinue}
onDelete={handleDelete}
onEditName={handleEditName}
canDelete={canDelete}
canModify={canModify}
/>
</div>
</HoverCardTrigger>
<HoverCardContent side="right" align="start" className="w-80">
<div className="space-y-2">
<p className="text-sm font-semibold truncate">
{name}
</p>
{session.spec.displayName && (
<p className="text-xs text-muted-foreground">{session.metadata.name}</p>
)}
<div className="flex flex-col gap-1.5 pt-1">
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
<SessionStatusDot phase={phase} />
<span>Session: {sessionPhaseLabel(phase)}</span>
</div>
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
<AgentStatusIndicator
status={agentStatus}
compact
/>
<span>Agent: {agentStatusLabel(agentStatus)}</span>
</div>
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
<Cpu className="h-3 w-3" />
<span>{session.spec.llmSettings.model}</span>
</div>
{activityTime && (
</HoverCardTrigger>
<HoverCardContent side="right" align="start" className="w-80">
<div className="space-y-2">
<p className="text-sm font-semibold truncate">
{name}
</p>
{session.spec.displayName && (
<p className="text-xs text-muted-foreground">{session.metadata.name}</p>
)}
<div className="flex flex-col gap-1.5 pt-1">
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
<Clock className="h-3 w-3" />
<span>{formatDistanceToNow(new Date(activityTime), { addSuffix: true })}</span>
<SessionStatusDot phase={phase} />
<span>Session: {sessionPhaseLabel(phase)}</span>
</div>
)}
{session.spec.initialPrompt && (
<div className="flex items-start gap-1.5 text-xs text-muted-foreground pt-1">
<MessageSquare className="h-3 w-3 mt-0.5 shrink-0" />
<span className="line-clamp-3">{session.spec.initialPrompt}</span>
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
<AgentStatusIndicator
status={agentStatus}
compact
/>
<span>Agent: {agentStatusLabel(agentStatus)}</span>
</div>
)}
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
<Cpu className="h-3 w-3" />
<span>{session.spec.llmSettings.model}</span>
</div>
{activityTime && (
<div className="flex items-center gap-1.5 text-xs text-muted-foreground">
<Clock className="h-3 w-3" />
<span>{formatDistanceToNow(new Date(activityTime), { addSuffix: true })}</span>
</div>
)}
{session.spec.initialPrompt && (
<div className="flex items-start gap-1.5 text-xs text-muted-foreground pt-1">
<MessageSquare className="h-3 w-3 mt-0.5 shrink-0" />
<span className="line-clamp-3">{session.spec.initialPrompt}</span>
</div>
)}
</div>
</div>
</div>
</HoverCardContent>
</HoverCard>
</HoverCardContent>
</HoverCard>
<SidebarSessionActions
sessionName={session.metadata.name}
displayName={name}
phase={phase}
onStop={handleStop}
onContinue={handleContinue}
onDelete={handleDelete}
onEditName={handleEditName}
canDelete={canDelete}
canModify={canModify}
/>
</div>
);
})}

Expand Down
Loading