fix(web): the undo notice no longer pushes the update button out of the sidebar

apps/web/src/components/sidebar/SidebarThreadUndoNotice.tsx

@@ -1,4 +1,5 @@
 import { useAtomValue } from "@effect/atom-react";
+import { Undo2Icon } from "lucide-react";
 import { useState } from "react";
 
 import {
@@ -29,8 +30,11 @@ export function SidebarThreadUndoNotice() {
   if (!text) return null;
 
   return (
-    // No min-w-0: the undo button sets this item's minimum, so a shared row squeezes its neighbour.
-    <SidebarMenuItem className="flex flex-1" aria-hidden={!summary} inert={!summary}>
+    <SidebarMenuItem
+      className="@container flex min-w-0 flex-1"
+      aria-hidden={!summary}
+      inert={!summary}
+    >
       <div
         onTransitionEnd={(event) => {
           if (!summary && event.target === event.currentTarget) setShownSummary(null);
@@ -43,7 +47,14 @@ export function SidebarThreadUndoNotice() {
           !summary && "opacity-0",
         )}
       >
-        <InlineButton onClick={undoLatestThreadAction}>{threadUndoLabel(keybindings)}</InlineButton>
+        <InlineButton className="min-w-0 shrink" onClick={undoLatestThreadAction}>
+          {/* The icon's negative margin cancels its width, so beside the label it sits in
+              clipped space; once the label is too wide it wraps away and the icon shows. */}
+          <span className="flex h-6 min-w-0 flex-wrap justify-end overflow-hidden">
+            <Undo2Icon className="-ml-4 h-6 w-4 @max-[1rem]:invisible" />
+            <span>{threadUndoLabel(keybindings)}</span>
+          </span>
+        </InlineButton>
         <span>{text},</span>
       </div>
     </SidebarMenuItem>

apps/web/src/components/sidebar/SidebarUpdateCapsule.tsx

@@ -88,7 +88,7 @@ export function SidebarUpdateCapsule({
     <Popover>
       <div
         className={cn(
-          "relative flex h-8 min-w-0 flex-1 items-center rounded-full bg-sidebar-control-surface text-sidebar-foreground",
+          "relative flex h-8 flex-1 items-center rounded-full bg-sidebar-control-surface text-sidebar-foreground",
           view.tone === "slow" && "ring-1 ring-warning/40 ring-inset",
           view.tone === "failed" && "ring-1 ring-destructive/40 ring-inset",
         )}
@@ -104,7 +104,9 @@ export function SidebarUpdateCapsule({
             />
           }
         />
-        <span className="pointer-events-none relative min-w-0 flex-1 truncate pl-3 text-xs">
+        {/* w-0 keeps the label out of the capsule's minimum width, so a shared footer row
+            can squeeze the label but never push the action past the sidebar edge. */}
+        <span className="pointer-events-none relative w-0 min-w-0 flex-1 truncate pl-3 text-xs">
           <span className={cn(view.tone === "failed" && "text-destructive")}>{view.label}</span>
           {view.slow ? (
             <span className="text-warning tabular-nums"> {view.slow.elapsed}</span>

apps/web/src/components/sidebar/SidebarUpdatePill.tsx

@@ -413,7 +413,7 @@ function SidebarUpdateControl() {
           ? { status: "downloading", percent: state.downloadPercent }
           : { status: "waiting" };
     return (
-      <SidebarMenuItem className="ml-auto flex min-w-0 flex-1">
+      <SidebarMenuItem className="ml-auto flex flex-1">
         <SidebarUpdateCapsule
           run={run}
           local={local}