From 06bdf15cdf28a68a02e7ebea9af189f645ad4a80 Mon Sep 17 00:00:00 2001
From: Neil <4138956+nwparker@users.noreply.github.com>
Date: Wed, 29 Apr 2026 16:42:30 -0700
Subject: [PATCH] =?UTF-8?q?fix(new-workspace):=20move=20tabs=20to=20modal?=
 =?UTF-8?q?=20header=20row,=20rename=20Quick=20=E2=86=92=20Form=20(#1261)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Orca <help@stably.ai>
---
 .../components/NewWorkspaceComposerModal.tsx  | 27 +++++++++++--------
 1 file changed, 16 insertions(+), 11 deletions(-)

diff --git a/src/renderer/src/components/NewWorkspaceComposerModal.tsx b/src/renderer/src/components/NewWorkspaceComposerModal.tsx
index b604d172722..a6e3d1721e7 100644
--- a/src/renderer/src/components/NewWorkspaceComposerModal.tsx
+++ b/src/renderer/src/components/NewWorkspaceComposerModal.tsx
@@ -141,15 +141,6 @@ function ComposerModalBody({
           trigger?.focus({ preventScroll: true })
         }}
       >
-        <DialogHeader className="gap-1">
-          <DialogTitle className="text-base font-semibold">Create Workspace</DialogTitle>
-          <DialogDescription className="text-xs text-muted-foreground">
-            {activeTab === 'quick'
-              ? 'Pick a repository and agent to spin up a new workspace.'
-              : 'Start from an existing PR, issue, branch, or Linear ticket.'}
-          </DialogDescription>
-        </DialogHeader>
-
         <Tabs
           value={activeTab}
           onValueChange={(next) => setActiveTab(next as 'quick' | 'create-from')}
@@ -164,12 +155,17 @@ function ComposerModalBody({
               read as "tabs" — the default pill variant fought the sub-tabs
               inside Create-from for visual weight. The bottom border on the
               list gives it clear separation from the content below. */}
+          {/* Why: DialogContent has p-6 (24px top) and the close button sits
+              absolutely at top-4 (16px), so its 16px icon centers around 24px
+              from the top. Pull the h-8 tab list up with -mt-4 so its center
+              (8 + 16 = 24px) lines up with the X on the same row. Reserve
+              right padding so the last trigger doesn't slide under the X. */}
           <TabsList
             variant="line"
-            className="h-8 w-full justify-start gap-6 border-b border-border/60 px-0"
+            className="-mt-4 h-8 w-full justify-start gap-6 border-b border-border/60 px-0 pr-8"
           >
             <TabsTrigger value="quick" className="flex-none gap-2 px-0 text-xs font-medium">
-              Quick
+              Form
               <ShortcutHint>{tabShortcut.quick}</ShortcutHint>
             </TabsTrigger>
             <TabsTrigger value="create-from" className="flex-none gap-2 px-0 text-xs font-medium">
@@ -178,6 +174,15 @@ function ComposerModalBody({
             </TabsTrigger>
           </TabsList>
 
+          <DialogHeader className="gap-1 pt-4">
+            <DialogTitle className="text-base font-semibold">Create Workspace</DialogTitle>
+            <DialogDescription className="text-xs text-muted-foreground">
+              {activeTab === 'quick'
+                ? 'Pick a repository and agent to spin up a new workspace.'
+                : 'Start from an existing PR, issue, branch, or Linear ticket.'}
+            </DialogDescription>
+          </DialogHeader>
+
           <AnimatedTabPanels active={activeTab}>
             {{
               quick: (