Skip to content

fix(web): complete thread status icons and keep input threads prominent #11461

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

Merged
maria-rcks merged 2 commits into from
Sep 12, 2026
Merged

fix(web): complete thread status icons and keep input threads prominent #11461

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
eba3c57
fix(web): show input icon and full-opacity thread statuses
maria-rcks Sep 12, 2026
0b41bd0
fix(web): keep input threads prominent and complete status icons
maria-rcks Sep 12, 2026
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
16 changes: 5 additions & 11 deletions apps/web/src/components/Sidebar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@ import {
ClockIcon,
FolderIcon,
GitBranchIcon,
MessageCircleQuestionIcon,
PinIcon,
PinOffIcon,
PlusIcon,
Expand Down Expand Up @@ -1088,8 +1089,6 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: {
// switching sidebars must not light up every historical thread as unread.
const isUnread = hasUnseenCompletion({ ...thread, lastVisitedAt });
const status = resolveSidebarThreadStatus(thread);
const isInFlight =
status === "working" || status === "monitoring" || status === "approval" || status === "input";
// A woken thread reappears at its original position (the sort is
// deliberately static), so the pill has to carry the weight. Snoozing is
// an explicit act, so the pill clears only when the user re-engages:
Expand Down Expand Up @@ -1123,10 +1122,7 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: {
icon: "working" as const,
// No shimmer: a label that animates forever is noise in a sidebar
// full of them (and repaints every vsync on high-refresh displays).
// Working is a background state, so it rests at the dim end of what
// the old pulse cycled through; only the thread you have open gets
// the label at full strength.
className: cn("text-sky-600 dark:text-sky-400", !props.isActive && "opacity-75"),
className: "text-sky-600 dark:text-sky-400",
}
: status === "monitoring"
? {
Expand All @@ -1145,7 +1141,7 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: {
: status === "input"
? {
label: "Input",
icon: null,
icon: "input" as const,
className: "text-indigo-600 dark:text-indigo-300",
}
: status === "failed"
Expand Down Expand Up @@ -1396,10 +1392,6 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: {
: shouldRecede
? "text-sidebar-muted-foreground/75 hover:bg-sidebar-row-hover hover:text-sidebar-foreground"
: "bg-transparent text-sidebar-foreground hover:bg-sidebar-row-hover",
isInFlight &&
!props.isActive &&
!isSelected &&
"opacity-70 transition-opacity hover:opacity-100",
isFileDragOver && "ring-1 ring-inset ring-primary/70",
// The hover tint must not clobber an active/selected row's own surface.
isFileDragOver && !props.isActive && !isSelected && "bg-sidebar-row-hover",
Expand Down Expand Up @@ -1814,6 +1806,8 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: {
>
{topStatus.icon === "working" ? (
<CircleDashedIcon aria-hidden className="size-4 shrink-0" />
) : topStatus.icon === "input" ? (
<MessageCircleQuestionIcon aria-hidden className="size-4 shrink-0" />
) : topStatus.icon === "done" ? (
<CircleCheckIcon aria-hidden className="size-4 shrink-0" />
) : null}
Expand Down
Loading