From d93537cd7342cead841c88886182e6512ac8d02b Mon Sep 17 00:00:00 2001
From: Bruno Agatao <bagatao@anaconda.com>
Date: Mon, 27 Jul 2026 12:45:37 +0200
Subject: [PATCH] fix(ui): actually hide auto-approval line for hidden
 placement

---
 .../kilo-ui/src/components/basic-tool.test.ts | 19 +++++++++++++++++++
 .../kilo-ui/src/components/basic-tool.tsx     | 12 +++++++++---
 2 files changed, 28 insertions(+), 3 deletions(-)
 create mode 100644 packages/kilo-ui/src/components/basic-tool.test.ts

diff --git a/packages/kilo-ui/src/components/basic-tool.test.ts b/packages/kilo-ui/src/components/basic-tool.test.ts
new file mode 100644
index 0000000000..c4009ba55f
--- /dev/null
+++ b/packages/kilo-ui/src/components/basic-tool.test.ts
@@ -0,0 +1,19 @@
+import { describe, expect, test } from "bun:test"
+import { shouldRenderApprovalInBody } from "./basic-tool"
+
+describe("shouldRenderApprovalInBody", () => {
+  test("renders in the body by default when an approval exists", () => {
+    expect(shouldRenderApprovalInBody(undefined, true)).toBe(true)
+    expect(shouldRenderApprovalInBody("body", true)).toBe(true)
+  })
+
+  test("does not render when there is no approval", () => {
+    expect(shouldRenderApprovalInBody("body", false)).toBe(false)
+    expect(shouldRenderApprovalInBody(undefined, false)).toBe(false)
+  })
+
+  test("never renders in the body for hidden placement, even with an approval", () => {
+    expect(shouldRenderApprovalInBody("hidden", true)).toBe(false)
+    expect(shouldRenderApprovalInBody("hidden", false)).toBe(false)
+  })
+})
diff --git a/packages/kilo-ui/src/components/basic-tool.tsx b/packages/kilo-ui/src/components/basic-tool.tsx
index f9bba8db7f..7dbaeee939 100644
--- a/packages/kilo-ui/src/components/basic-tool.tsx
+++ b/packages/kilo-ui/src/components/basic-tool.tsx
@@ -28,19 +28,25 @@ export function useToolApprovalLine() {
   }
 }
 
+/**
+ * Whether BasicTool should inject the approval line into its body.
+ */
+export function shouldRenderApprovalInBody(placement: BasicToolProps["approvalPlacement"], hasApproval: boolean) {
+  return placement !== "hidden" && hasApproval
+}
+
 export function BasicTool(props: BasicToolProps) {
   const key = () => toolOpenKey(props)
   const initial = () => initialOpen(props)
   const approval = useToolApproval()
-  // "hidden" means BasicTool must not inject the line (the card renders it itself, or it is omitted).
-  const inBody = () => props.approvalPlacement !== "hidden" && approval() !== undefined
+  const inBody = () => shouldRenderApprovalInBody(props.approvalPlacement, approval() !== undefined)
   const change = (open: boolean) => {
     writeToolOpen(key(), open)
     props.onOpenChange?.(open)
   }
   const details = () => (
     <div data-slot="basic-tool-details">
-      <Show when={approval()}>{(value) => <ToolApprovalLine display={value()} />}</Show>
+      <Show when={inBody() && approval()}>{(value) => <ToolApprovalLine display={value()} />}</Show>
       {props.children}
     </div>
   )