From 2d7e639b6c2c5f571cd262209fced78d295d0a08 Mon Sep 17 00:00:00 2001
From: vutuanlinh2k2 <vutuanlinh2002@gmail.com>
Date: Thu, 16 Jul 2026 13:45:06 +0700
Subject: [PATCH] feat(chat): lead the composer bottom row with the attach
 buttons
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The paperclip (and folder) buttons sat after the flex-1 control strip, so
they landed in the middle of the row — between the profile/harness/model
pickers and the send button. Attachment is the composer's primary left-side
affordance, so the row now runs attach · folder · controls · trailing · send:
the attach buttons come first and the control strip keeps its flex-1 growth,
pushing trailing + send to the far right exactly as before. Pure reorder — no
change to the attach handlers, drag-and-drop, or paste ingress.
---
 src/chat/agent-composer.tsx | 33 +++++++++++++++++++--------------
 1 file changed, 19 insertions(+), 14 deletions(-)

diff --git a/src/chat/agent-composer.tsx b/src/chat/agent-composer.tsx
index 0f66855..b581d18 100644
--- a/src/chat/agent-composer.tsx
+++ b/src/chat/agent-composer.tsx
@@ -163,8 +163,9 @@ export interface AgentComposerProps {
 
 /**
  * The canonical agent chat input: one rounded surface holding an auto-growing
- * textarea, the embedded control strip (profile · harness · model · effort) at
- * the bottom-left, and the send button at the bottom-right. The strip's pickers
+ * textarea and a bottom row that runs left → right — attach buttons, the
+ * embedded control strip (profile · harness · model · effort), trailing slot,
+ * and the send button on the far right. The strip's pickers
  * snap the harness↔model pair automatically; which controls appear is driven
  * purely by which control objects are passed, so the same component is the
  * router-backed composer (no harness) and the sandbox-backed one (with harness).
@@ -457,19 +458,11 @@ export function AgentComposer({
           )}
         />
 
+        {/* Bottom row, left → right: attach · folder · control strip
+            (profile · harness · model · effort) · trailing · send. The attach
+            buttons lead so the paperclip sits at the far left, ahead of the
+            control pickers. */}
         <div className="flex items-end gap-2">
-          <div className="flex min-w-0 flex-1 items-center gap-2">
-            {controls ?? (
-              <AgentSessionControls
-                context={context}
-                harness={harness}
-                profile={profile}
-                model={model}
-                reasoning={reasoning}
-              />
-            )}
-          </div>
-
           {onAttach && (
             <>
               <button
@@ -525,6 +518,18 @@ export function AgentComposer({
             </>
           )}
 
+          <div className="flex min-w-0 flex-1 items-center gap-2">
+            {controls ?? (
+              <AgentSessionControls
+                context={context}
+                harness={harness}
+                profile={profile}
+                model={model}
+                reasoning={reasoning}
+              />
+            )}
+          </div>
+
           {trailing && (
             <div className="flex shrink-0 items-center gap-2">{trailing}</div>
           )}