app: prevent duplicate context tooltips by restricting tooltip to session header button only

packages/app/e2e/prompt/context.spec.ts

@@ -93,3 +93,23 @@ test("context panel can open file picker from context actions", async ({ page, s
     await expect(dialog).toHaveCount(0)
   })
 })
+
+test("context tooltip only appears from the session header trigger", async ({ page, sdk, gotoSession }) => {
+  await withSession(sdk, `e2e context tooltip ${Date.now()}`, async (session) => {
+    await seedContextSession({ sessionID: session.id, sdk })
+    await gotoSession(session.id)
+
+    const trigger = contextButton(page)
+    await expect(trigger).toBeVisible()
+    await trigger.click()
+
+    const tab = page.getByRole("tab", { name: "Context" })
+    await expect(tab).toBeVisible()
+
+    await tab.locator('[data-component="progress-circle"]').hover()
+    await expect(page.locator('[data-component="tooltip"]')).toHaveCount(0)
+
+    await trigger.hover()
+    await expect(page.locator('[data-component="tooltip"]')).toBeVisible()
+  })
+})

packages/app/src/components/session-context-usage.tsx

@@ -101,10 +101,10 @@ export function SessionContextUsage(props: SessionContextUsageProps) {
 
   return (
     <Show when={params.id}>
-      <Tooltip value={tooltipValue()} placement={props.placement ?? "top"}>
-        <Switch>
-          <Match when={variant() === "indicator"}>{circle()}</Match>
-          <Match when={true}>
+      <Switch>
+        <Match when={variant() === "indicator"}>{circle()}</Match>
+        <Match when={true}>
+          <Tooltip value={tooltipValue()} placement={props.placement ?? "top"}>
             <Button
               type="button"
               variant="ghost"
@@ -114,9 +114,9 @@ export function SessionContextUsage(props: SessionContextUsageProps) {
             >
               {circle()}
             </Button>
-          </Match>
-        </Switch>
-      </Tooltip>
+          </Tooltip>
+        </Match>
+      </Switch>
     </Show>
   )
 }