From 97dd28b356ec5af17503df66e35d98bd1a08a301 Mon Sep 17 00:00:00 2001
From: Bryan Helmkamp <bryan@brynary.com>
Date: Sun, 24 May 2026 18:00:50 -0400
Subject: [PATCH] Add tool descriptions as tooltips in sidebar Tools list
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Loosen vertical spacing between tool rows (space-y-1 → space-y-1.5).
- Add `title={tool.description}` so hovering a tool surfaces the
  model-facing description without re-adding inline description text.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 apps/fabro-web/app/components/stage-insights-sidebar.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/fabro-web/app/components/stage-insights-sidebar.tsx b/apps/fabro-web/app/components/stage-insights-sidebar.tsx
index 8ce26cbf1..c28c3cee0 100644
--- a/apps/fabro-web/app/components/stage-insights-sidebar.tsx
+++ b/apps/fabro-web/app/components/stage-insights-sidebar.tsx
@@ -516,13 +516,13 @@ function SkillSourceIcon({ source }: { source: ActivatedSkill["source"] }) {
 function AgentToolsSection({ tools }: { tools: AgentToolSummary[] }) {
   if (tools.length === 0) return <p className="text-xs text-fg-muted">No tools reported.</p>;
   return (
-    <ul role="list" className="space-y-1">
+    <ul role="list" className="space-y-1.5">
       {tools.map((tool) => {
         const nameClass = tool.invoked
           ? "min-w-0 flex-1 truncate text-xs text-fg-2"
           : "min-w-0 flex-1 truncate text-xs text-fg-muted";
         return (
-          <li key={tool.name} className="flex items-center gap-1.5">
+          <li key={tool.name} title={tool.description} className="flex items-center gap-1.5">
             {tool.invoked ? (
               <CheckCircleIcon className="size-3.5 shrink-0 text-mint" aria-label="Used" />
             ) : (