diff --git a/packages/app/src/components/agent-stream-view.tsx b/packages/app/src/components/agent-stream-view.tsx index 573364019..676ae3e08 100644 --- a/packages/app/src/components/agent-stream-view.tsx +++ b/packages/app/src/components/agent-stream-view.tsx @@ -496,7 +496,16 @@ export function AgentStreamView({ return ( - + {hasPermissions ? ( {pendingPermissionItems.map((permission) => ( @@ -534,6 +543,7 @@ export function AgentStreamView({ client, streamHead, renderStreamItemContent, + tightGap, ]); const flatListExtraData = useMemo( @@ -544,6 +554,16 @@ export function AgentStreamView({ [pendingPermissionItems.length, showWorkingIndicator] ); + // FlatList's ListHeaderComponent renders at the *bottom* when inverted. + // Without explicit spacing, the newest "head" rows (like Thinking/Setup tool badges) + // can butt up directly against the most recent stream item. + const headerGapStyle = useMemo(() => { + if (!listHeaderComponent) { + return undefined; + } + return { marginBottom: tightGap }; + }, [listHeaderComponent, tightGap]); + return ( @@ -553,6 +573,7 @@ export function AgentStreamView({ data={flatListData} renderItem={renderStreamItem} keyExtractor={(item) => item.id} + ListHeaderComponentStyle={headerGapStyle} contentContainerStyle={{ paddingVertical: 0, flexGrow: 1,