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>
This commit is contained in:
David Kaya
2026-03-28 23:34:58 +01:00
co-authored by Copilot
parent edd4c7381a
commit e4142a6def
3 changed files with 30 additions and 34 deletions
+4 -4
View File
@@ -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>
);
@@ -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 && (