fix(tangent): wrap the attach-agent command instead of scrolling it

src/routes/v2/pages/Tangent/components/AttachAgentButton.tsx

@@ -96,7 +96,7 @@ function AttachAgentDialog({
               <Markdown body={commandInstructions} />
               <CommandBlock
                 command={target.command(baseUrl, sessionId)}
-                contained
+                wrap
                 trackingId="projects.attach_agent.copy_command"
                 trackingMetadata={{ agent: target.id }}
               />

src/routes/v2/shared/components/CommandBlock.tsx

@@ -1,15 +1,16 @@
 import { InlineStack } from "@/components/ui/layout";
 import { Text } from "@/components/ui/typography";
+import { cn } from "@/lib/utils";
 import { CopyValueButton } from "@/routes/v2/shared/components/CopyValueButton";
 
 export function CommandBlock({
   command,
-  contained = false,
+  wrap = false,
   trackingId,
   trackingMetadata,
 }: {
   command: string;
-  contained?: boolean;
+  wrap?: boolean;
   trackingId?: string;
   trackingMetadata?: Record<string, unknown>;
 }) {
@@ -20,29 +21,18 @@ export function CommandBlock({
       wrap="nowrap"
       className="w-full min-w-0 rounded-md border border-border bg-muted px-3 py-2"
     >
-      {contained ? (
-        // Absolutely positioned so the long command never contributes to the
-        // intrinsic width of the dialog's nested grids, which would otherwise
-        // stretch the whole dialog wider than its box. The command then scrolls
-        // horizontally within the fixed-width container instead.
-        <div className="relative h-5 min-w-0 flex-1">
-          <Text
-            size="sm"
-            font="mono"
-            className="absolute inset-0 overflow-x-auto whitespace-pre leading-5"
-          >
-            {command}
-          </Text>
-        </div>
-      ) : (
-        <Text
-          size="sm"
-          font="mono"
-          className="min-w-0 flex-1 overflow-x-auto whitespace-pre"
-        >
-          {command}
-        </Text>
-      )}
+      <Text
+        size="sm"
+        font="mono"
+        className={cn(
+          "min-w-0 flex-1",
+          wrap
+            ? "whitespace-pre-wrap wrap-anywhere"
+            : "overflow-x-auto whitespace-pre",
+        )}
+      >
+        {command}
+      </Text>
       <CopyValueButton
         valueFn={() => command}
         trackingId={trackingId}