From e4142a6def95ffbfe4d349bc583867d076ea5b84 Mon Sep 17 00:00:00 2001
From: David Kaya <david@kaya.sk>
Date: Sat, 28 Mar 2026 23:34:58 +0100
Subject: [PATCH] refactor: move Terminal and Prompts pills into composer

Declutter the pill row above the chat composer by relocating Terminal
and Prompts pills from the session-config rows into the composer's
bottom action bar (left side). The session-config row now only shows
session-scoped controls: Tools, Approval, Model, and Thinking.

The relocated pills use a lighter, borderless style matching the
inner-composer aesthetic alongside the existing Attach, Plan mode,
and Send buttons.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 src/renderer/components/ChatPane.tsx          | 52 +++++++++----------
 src/renderer/components/chat/InlinePills.tsx  |  8 +--
 .../components/chat/InlinePromptPill.tsx      |  4 +-
 3 files changed, 30 insertions(+), 34 deletions(-)

diff --git a/src/renderer/components/ChatPane.tsx b/src/renderer/components/ChatPane.tsx
index 95b5d49..6b6dc57 100644
--- a/src/renderer/components/ChatPane.tsx
+++ b/src/renderer/components/ChatPane.tsx
@@ -488,14 +488,6 @@ export function ChatPane({
           {/* Session config pills — tools/approval left, model/reasoning right */}
           {isSingleAgent && (
             <div className="mb-2 flex items-center gap-2">
-              {onTerminalToggle && (
-                <InlineTerminalPill
-                  disabled={false}
-                  isOpen={!!terminalOpen}
-                  isRunning={!!terminalRunning}
-                  onToggle={onTerminalToggle}
-                />
-              )}
               {hasConfigurableTools && onUpdateSessionTooling && (
                 <InlineToolsPill
                   disabled={isComposerDisabled}
@@ -553,14 +545,6 @@ export function ChatPane({
           {/* Session config pills — tool & approval controls (multi-agent) */}
           {!isSingleAgent && (hasConfigurableTools || hasToolCallApproval) && (
             <div className="mb-2 flex items-center gap-2">
-              {onTerminalToggle && (
-                <InlineTerminalPill
-                  disabled={false}
-                  isOpen={!!terminalOpen}
-                  isRunning={!!terminalRunning}
-                  onToggle={onTerminalToggle}
-                />
-              )}
               {hasConfigurableTools && onUpdateSessionTooling && (
                 <InlineToolsPill
                   disabled={isComposerDisabled}
@@ -585,17 +569,6 @@ export function ChatPane({
             </div>
           )}
 
-          {/* Prompt files pill */}
-          {!isScratchpad && promptFiles.length > 0 && (
-            <div className="mb-2 flex items-center gap-2">
-              <InlinePromptPill
-                disabled={isComposerDisabled}
-                onSubmit={(content) => void onSend(content)}
-                promptFiles={promptFiles}
-              />
-            </div>
-          )}
-
           {/* Attachment preview */}
           {pendingAttachments.length > 0 && (
             <div className="flex flex-wrap gap-2 px-1 pb-2">
@@ -643,7 +616,29 @@ export function ChatPane({
                             : 'Message...'
               }
             >
-              <div className="absolute bottom-2 right-2 flex items-center gap-1">
+              {/* Bottom action bar: left = shortcuts, right = buttons */}
+              <div className="absolute inset-x-2 bottom-2 flex items-center justify-between pointer-events-none">
+                {/* Left: quick actions */}
+                <div className="flex items-center gap-1.5 pointer-events-auto">
+                  {onTerminalToggle && (
+                    <InlineTerminalPill
+                      disabled={false}
+                      isOpen={!!terminalOpen}
+                      isRunning={!!terminalRunning}
+                      onToggle={onTerminalToggle}
+                    />
+                  )}
+                  {!isScratchpad && promptFiles.length > 0 && (
+                    <InlinePromptPill
+                      disabled={isComposerDisabled}
+                      onSubmit={(content) => void onSend(content)}
+                      promptFiles={promptFiles}
+                    />
+                  )}
+                </div>
+
+                {/* Right: attach, plan mode, send */}
+                <div className="flex items-center gap-1 pointer-events-auto">
                 {/* Attachment picker */}
                 <button
                   aria-label="Attach image"
@@ -732,6 +727,7 @@ export function ChatPane({
                     <ArrowUp className="size-4" />
                   )}
                 </button>
+                </div>
               </div>
             </MarkdownComposer>
             {isPlanMode && !isSessionBusy && (
diff --git a/src/renderer/components/chat/InlinePills.tsx b/src/renderer/components/chat/InlinePills.tsx
index bfaf2f6..cfa8ec6 100644
--- a/src/renderer/components/chat/InlinePills.tsx
+++ b/src/renderer/components/chat/InlinePills.tsx
@@ -677,17 +677,17 @@ export function InlineTerminalPill({
   return (
     <button
       aria-pressed={isOpen}
-      className={`inline-flex items-center gap-1 rounded border px-1.5 py-0.5 text-pill font-medium transition ${
+      className={`inline-flex items-center gap-1 rounded-lg px-2 py-1 text-[11px] font-medium transition ${
         isOpen
-          ? 'border-indigo-500/40 bg-indigo-500/10 text-indigo-300'
-          : 'border-zinc-700/60 bg-zinc-800/40 text-zinc-400 hover:border-zinc-600 hover:text-zinc-300'
+          ? 'bg-indigo-500/15 text-indigo-300 hover:bg-indigo-500/20'
+          : 'text-zinc-500 hover:bg-zinc-800 hover:text-zinc-300'
       } disabled:cursor-not-allowed disabled:opacity-50`}
       disabled={disabled}
       onClick={onToggle}
       type="button"
     >
       {isRunning && <span className="size-1.5 shrink-0 rounded-full bg-emerald-400" />}
-      <TerminalSquare className="size-2.5" />
+      <TerminalSquare className="size-3" />
       <span>Terminal</span>
     </button>
   );
diff --git a/src/renderer/components/chat/InlinePromptPill.tsx b/src/renderer/components/chat/InlinePromptPill.tsx
index 0eee617..a24a48b 100644
--- a/src/renderer/components/chat/InlinePromptPill.tsx
+++ b/src/renderer/components/chat/InlinePromptPill.tsx
@@ -66,14 +66,14 @@ export function InlinePromptPill({
       <button
         aria-expanded={open}
         aria-haspopup="listbox"
-        className="inline-flex items-center gap-1 rounded border border-zinc-700 bg-zinc-800 px-2 py-1 text-[11px] font-medium text-zinc-400 transition hover:border-zinc-600 hover:text-zinc-200"
+        className="inline-flex items-center gap-1 rounded-lg px-2 py-1 text-[11px] font-medium text-zinc-500 transition hover:bg-zinc-800 hover:text-zinc-300"
         disabled={disabled}
         onClick={() => setOpen(!open)}
         type="button"
       >
         <FileText className="size-3" />
         Prompts
-        <span className="ml-0.5 text-zinc-600">({promptFiles.length})</span>
+        <span className="text-zinc-600">({promptFiles.length})</span>
       </button>
 
       {open && !disabled && (