Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
5 changes: 5 additions & 0 deletions .changeset/bash-tool-render-sync.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"kilo-code": patch
---

Speed up rendering of expanded bash tool cards in the VS Code chat webview.
10 changes: 8 additions & 2 deletions packages/kilo-ui/src/components/basic-tool.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Show } from "solid-js"
import { createMemo, Show } from "solid-js"
import { BasicTool as Base, GenericTool } from "@opencode-ai/ui/basic-tool"
import type { BasicToolProps as BaseProps, TriggerTitle } from "@opencode-ai/ui/basic-tool"
import { toolOpenKey, readToolOpen, writeToolOpen } from "./tool-open-state"
Expand Down Expand Up @@ -46,12 +46,18 @@ export function BasicTool(props: BasicToolProps) {
}
// Renders after the body/tool list, not before — it's context about what
// happened, not part of the header.
const details = () => (
const buildDetails = () => (
<div data-slot="basic-tool-details">
{props.children}
<Show when={inBody() && approval()}>{(value) => <ToolApprovalLine display={value()} />}</Show>
</div>
)
// Base reads its children getter several times while laying out the tool, and a
// bare accessor rebuilds this subtree on every read (for a bash card, three
// BashHighlightedOutput instances per render). Memoize eager tools so repeated
// reads reuse one subtree. Deferred tools must stay lazy: createMemo runs
// eagerly, which would build a collapsed body before the card opens.
const details = props.defer ? buildDetails : createMemo(buildDetails)
// A <Show>, not a plain `if`: inBody() tracks the visibility toggle, which can
// flip after mount (Settings), so the branch must stay reactive.
return (
Expand Down
Loading