Unverified 提交 9c64a6a0 authored 作者: wwwillchen-bot's avatar wwwillchen-bot 提交者: GitHub

feat: add tooltip to app name button in title bar (#3005)

## Summary - Wraps the app name button in the title bar with a `Tooltip` component to show the full app name on hover - Improves usability when the app name is truncated due to the `max-w-38` constraint - Uses the `render` prop pattern consistent with the project's `@base-ui/react` tooltip usage ## Test plan - [ ] Verify the app name button in the title bar shows a tooltip on hover displaying the full app name - [ ] Verify the tooltip shows "No app selected" when no app is selected - [ ] Verify the button click behavior (navigating to app details) still works correctly - [ ] Verify the tooltip styling matches other tooltips in the app 🤖 Generated with [Claude Code](https://claude.com/claude-code) <!-- devin-review-badge-begin --> --- <a href="https://app.devin.ai/review/dyad-sh/dyad/pull/3005" target="_blank"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://static.devin.ai/assets/gh-open-in-devin-review-dark.svg?v=1"> <img src="https://static.devin.ai/assets/gh-open-in-devin-review-light.svg?v=1" alt="Open with Devin"> </picture> </a> <!-- devin-review-badge-end --> Co-authored-by: 's avatarWill Chen <willchen90@gmail.com> Co-authored-by: 's avatarClaude <noreply@anthropic.com>
上级 dd5dcda6
......@@ -86,17 +86,26 @@ export const TitleBar = () => {
<div className={`${showWindowControls ? "pl-2" : "pl-18"}`}></div>
<img src={logo} alt="Dyad Logo" className="w-6 h-6 mr-0.5 ml-2" />
<Button
data-testid="title-bar-app-name-button"
variant="outline"
size="sm"
className={`hidden @2xl:block no-app-region-drag text-xs max-w-38 truncate font-medium ${
selectedApp ? "cursor-pointer" : ""
}`}
onClick={handleAppClick}
>
{displayText}
</Button>
<Tooltip>
<TooltipTrigger
render={
<Button
data-testid="title-bar-app-name-button"
variant="outline"
size="sm"
className={`hidden @2xl:block no-app-region-drag text-xs max-w-38 truncate font-medium ${
selectedApp ? "cursor-pointer" : ""
}`}
onClick={handleAppClick}
/>
}
>
{displayText}
</TooltipTrigger>
<TooltipContent>
{selectedApp ? selectedApp.name : "No app selected"}
</TooltipContent>
</Tooltip>
{isDyadPro && <DyadProButton isDyadProEnabled={isDyadProEnabled} />}
<div className="flex-1 min-w-0 overflow-hidden no-app-region-drag">
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论