fix: prevent tooltip appearing on dropdown open (#20765)

jaaydenh · web-flow · commit c2319e5b4ea6 · 2025-11-20T08:38:07.000-05:00
The tooltip inside CopyButton inside Userdropdown is appearing automatically when the dropdown is opened. This feels a bit janky and the goal of this fix is to only show the tooltip content when the user hovers the copy button. https://github.com/user-attachments/assets/2e41da8d-08c5-476b-b0fc-a40d4f8e3d6c
diff --git a/site/src/components/CopyButton/CopyButton.tsx b/site/src/components/CopyButton/CopyButton.tsx
@@ -22,7 +22,7 @@ export const CopyButton: FC<CopyButtonProps> = ({
 	const { showCopiedSuccess, copyToClipboard } = useClipboard();
 
 	return (
-		<TooltipProvider>
+		<TooltipProvider delayDuration={100}>
 			<Tooltip>
 				<TooltipTrigger asChild>
 					<Button
diff --git a/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdown.tsx b/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdown.tsx
@@ -35,6 +35,7 @@ export const UserDropdown: FC<UserDropdownProps> = ({
 			<PopoverContent
 				align="end"
 				className="min-w-auto w-[260px] bg-surface-secondary border-surface-quaternary"
+				onOpenAutoFocus={(e) => e.preventDefault()}
 			>
 				<UserDropdownContent
 					user={user}

Original file line number	Diff line number	Diff line change
`@@ -35,6 +35,7 @@ export const UserDropdown: FC<UserDropdownProps> = ({`
`35`	`35`	`<PopoverContent`
`36`	`36`	`align="end"`
`37`	`37`	`className="min-w-auto w-[260px] bg-surface-secondary border-surface-quaternary"`
	`38`	`+ onOpenAutoFocus={(e) => e.preventDefault()}`
`38`	`39`	`>`
`39`	`40`	`<UserDropdownContent`
`40`	`41`	`user={user}`