diff --git a/apps/app/src/components/promptbox/ThreadEnvironmentSummary.test.tsx b/apps/app/src/components/promptbox/ThreadEnvironmentSummary.test.tsx new file mode 100644 index 000000000..e8c017ffb --- /dev/null +++ b/apps/app/src/components/promptbox/ThreadEnvironmentSummary.test.tsx @@ -0,0 +1,29 @@ +// @vitest-environment jsdom + +import { fireEvent, render, screen } from "@testing-library/react"; +import { TooltipProvider } from "@bb/shared-ui/tooltip"; +import { describe, expect, it, vi } from "vitest"; +import { ThreadEnvironmentSummary } from "./ThreadEnvironmentSummary"; + +describe("ThreadEnvironmentSummary", () => { + it("explains the create-thread action in a tooltip", async () => { + render( + + + , + ); + + fireEvent.focus( + screen.getByRole("button", { + name: "Create new thread in this worktree", + }), + ); + + expect((await screen.findByRole("tooltip")).textContent).toBe( + "Create new thread in this worktree", + ); + }); +}); diff --git a/apps/app/src/components/promptbox/ThreadEnvironmentSummary.tsx b/apps/app/src/components/promptbox/ThreadEnvironmentSummary.tsx index fc711662e..5539071f7 100644 --- a/apps/app/src/components/promptbox/ThreadEnvironmentSummary.tsx +++ b/apps/app/src/components/promptbox/ThreadEnvironmentSummary.tsx @@ -2,6 +2,11 @@ import { memo } from "react"; import { OptionDisplay } from "@/components/pickers/OptionPicker"; import { copyToClipboardWithToast } from "@/lib/clipboard"; import { Icon, type IconName } from "@bb/shared-ui/icon"; +import { + Tooltip, + TooltipContent, + TooltipTrigger, +} from "@bb/shared-ui/tooltip"; import type { WorkspaceCheckoutDisplay } from "@/lib/workspace-checkout-display"; const CHECKOUT_CHIP_BASE_CLASS_NAME = @@ -107,14 +112,19 @@ export const ThreadEnvironmentSummary = memo(function ThreadEnvironmentSummary({ ) : null} {onCreateNewThreadInWorktree ? ( - + + + + + Create new thread in this worktree + ) : null} ); diff --git a/apps/app/src/components/secondary-panel/ThreadMetadataContent.test.tsx b/apps/app/src/components/secondary-panel/ThreadMetadataContent.test.tsx index 2a57067fd..3b96d9ce1 100644 --- a/apps/app/src/components/secondary-panel/ThreadMetadataContent.test.tsx +++ b/apps/app/src/components/secondary-panel/ThreadMetadataContent.test.tsx @@ -1,10 +1,11 @@ // @vitest-environment jsdom -import { fireEvent, render, screen } from "@testing-library/react"; +import { cleanup, fireEvent, render, screen } from "@testing-library/react"; import { renderToStaticMarkup } from "react-dom/server"; import { MemoryRouter } from "react-router-dom"; import type { Environment, Thread } from "@bb/domain"; -import { describe, expect, it, vi } from "vitest"; +import { TooltipProvider } from "@bb/shared-ui/tooltip"; +import { afterEach, describe, expect, it, vi } from "vitest"; import { EnvironmentRow, ParentSelectorRow } from "./ThreadMetadataContent"; import { parentThreads } from "./ThreadMetadataContent.fixtures"; @@ -61,16 +62,20 @@ function makeEnvironment(overrides: Partial = {}): Environment { function renderEnvironmentRow(environment: Environment): string { return renderToStaticMarkup( - - - , + + + + + , ); } +afterEach(cleanup); + describe("EnvironmentRow", () => { it("shows the create-thread action for a provisioned worktree", () => { expect(renderEnvironmentRow(makeEnvironment())).toContain( @@ -78,6 +83,30 @@ describe("EnvironmentRow", () => { ); }); + it("explains the create-thread action in a tooltip", async () => { + render( + + + + + , + ); + + fireEvent.focus( + screen.getByRole("button", { + name: "Create new thread in this worktree", + }), + ); + + expect((await screen.findByRole("tooltip")).textContent).toBe( + "Create new thread in this worktree", + ); + }); + it("hides the create-thread action while a managed worktree is provisioning", () => { const markup = renderEnvironmentRow( makeEnvironment({ diff --git a/apps/app/src/components/secondary-panel/ThreadMetadataContent.tsx b/apps/app/src/components/secondary-panel/ThreadMetadataContent.tsx index 249162603..4c187a12c 100644 --- a/apps/app/src/components/secondary-panel/ThreadMetadataContent.tsx +++ b/apps/app/src/components/secondary-panel/ThreadMetadataContent.tsx @@ -44,6 +44,11 @@ import { DropdownMenuTrigger, } from "@bb/shared-ui/dropdown-menu"; import { Icon } from "@bb/shared-ui/icon"; +import { + Tooltip, + TooltipContent, + TooltipTrigger, +} from "@bb/shared-ui/tooltip"; import { BranchPicker, getMergeBaseBranchCandidateGroups, @@ -338,14 +343,19 @@ export function EnvironmentRow({ ) : null} {showCreateThreadButton ? ( - + + + + + Create new thread in this worktree + ) : null}