Commit ab099178a7b7f9728843e90fc95ed90bb61d710d | the-knife

author	Bear Huddleston <bear@bearhuddleston.dev> 2026-09-26 22:29:54-05:00
committer	GitHub <noreply@github.com> 2026-09-26 22:29:54-05:00
log	ab099178a7b7f9728843e90fc95ed90bb61d710d
tree	90dc7223907109cc97d694a0c71a09659c2f20ed
parent	cb97415948cc2c0662a5504ccfe7e97981825ed5
signature	Signed by PGP key B5690EEEBB952194

fix(web): environment status tooltip resizes when the status changes (#13845)

1 files changed, 16 insertions(+), 8 deletions(-)

apps
- web
  - src
    components
    settings
    ConnectionsSettings.tsx

apps/web/src/components/settings/ConnectionsSettings.tsx+16-8

 @@ -1549,6 +1549,18 @@ function SavedBackendListRow({
     versionMismatch !== null &&
     (serverUpdateState.status === "idle" || serverUpdateState.status === "failed");
+  const statusTooltip = `${
+    unsupported
+      ? (environment.connection.error ?? connectionStatusText(environment.connection))
+      : enabled
+        ? connectionStatusText(environment.connection)
+        : "Switched off"
+  }${
+    versionMismatch
+      ? `\nUpdate available: ${versionMismatch.serverVersion} → ${versionMismatch.clientVersion}`
+      : ""
+  }`;
   return (
     <EnvironmentRow
       kind={machineKind}
 @@ -1556,7 +1568,10 @@ function SavedBackendListRow({
       dimmed={!enabled}
       subtitle={
         <Tooltip>
+          {/* The status can change while the tooltip is open, and base-ui only
+              re-measures the popup when the trigger's payload changes. */}
           <TooltipTrigger
+            payload={statusTooltip}
             render={
               <span
                 className={cn(
 @@ -1569,14 +1584,7 @@ function SavedBackendListRow({
             {subtitleText}
           </TooltipTrigger>
           <TooltipPopup side="top" className="whitespace-pre-wrap">
-            {unsupported
+            {statusTooltip}
-              ? (environment.connection.error ?? connectionStatusText(environment.connection))
-              : enabled
-                ? connectionStatusText(environment.connection)
-                : "Switched off"}
-            {versionMismatch
-              ? `\nUpdate available: ${versionMismatch.serverVersion} → ${versionMismatch.clientVersion}`
-              : ""}
           </TooltipPopup>
         </Tooltip>
       }