fix(onboarding): give the hooks disclosure a caret so it reads as clickable

Visual capture showed "What Orca changes, and when" rendering as plain static
text in both states, while its own sibling six pixels above it ("Show N more
agents") carries an arrow. Nothing signalled the row was interactive, which
makes a disclosure nobody opens.

Not raising the disclosure's height cap along with it. A live ablation in the
running wizard measured the cap as a zero-sum dial against the agent grid: at
160px the grid shows six full cards and the disclosure clips its third row; at
224px the disclosure gains one row and the grid drops to three full cards plus
a row of sliced card-tops; at 288px the disclosure finally fits and the grid
has no fully visible card at all. The cap is also inert on machines with few
detected CLIs, so raising it can only act in the case where it hurts. Getting
all four rows above the fold needs the variable-height agent list capped rather
than the whole disclosure, which is more than a polish change.
This commit is contained in:
Merge Sim
2026-09-11 10:54:40 -07:00
parent bfe1aed19d
commit 29c9da5dd2
@@ -1,4 +1,5 @@
import { Checkbox } from '@/components/ui/checkbox'
import { ChevronRight } from 'lucide-react'
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible'
import { translate } from '@/i18n/i18n'
import type { TuiAgent } from '../../../../shared/tui-agent'
@@ -45,7 +46,9 @@ export function AgentStatusHooksControl({
</p>
{/* Sibling of the label, never nested inside it: a trigger under the label would toggle the checkbox. */}
<Collapsible defaultOpen={false}>
<CollapsibleTrigger className="cursor-pointer text-xs font-medium text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring/50 data-[state=open]:mb-2">
<CollapsibleTrigger className="flex cursor-pointer items-center gap-1 text-xs font-medium text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring/50 data-[state=open]:mb-2 [&[data-state=open]>svg]:rotate-90">
{/* Why: without a caret the row reads as static text; its sibling "Show N more agents→" carries one. */}
<ChevronRight className="size-3.5 shrink-0 transition-transform" aria-hidden="true" />
{translate(
'auto.components.onboarding.AgentStatusHooksControl.disclosureSummary',
'What Orca changes, and when'