From efaf1ec10509aaa9d44c4f2f376da8fd86e9385d Mon Sep 17 00:00:00 2001
From: Cascade Bot <bot@cascade.dev>
Date: Mon, 16 Mar 2026 15:08:00 +0000
Subject: [PATCH] =?UTF-8?q?feat(ui):=20reorder=20engine/model/iterations?=
 =?UTF-8?q?=20fields=20=E2=80=94=20engine=20first=20across=20all=203=20loc?=
 =?UTF-8?q?ations?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../projects/project-agent-configs.tsx        | 86 ++++++++---------
 .../projects/project-harness-form.tsx         | 96 +++++++++----------
 .../settings/agent-config-form-dialog.tsx     | 54 +++++------
 3 files changed, 115 insertions(+), 121 deletions(-)

diff --git a/web/src/components/projects/project-agent-configs.tsx b/web/src/components/projects/project-agent-configs.tsx
index e02a9b4e..ae61877a 100644
--- a/web/src/components/projects/project-agent-configs.tsx
+++ b/web/src/components/projects/project-agent-configs.tsx
@@ -316,19 +316,45 @@ function DefinitionAgentSection({
 
 				{/* Engine Tab */}
 				<TabsContent value="engine" className="space-y-4 pt-4">
+					<div className="space-y-2">
+						<Label>Engine</Label>
+						<Select
+							value={agentEngine || '_none'}
+							onValueChange={(v) => setAgentEngine(v === '_none' ? '' : v)}
+						>
+							<SelectTrigger className="w-full">
+								<SelectValue placeholder="Optional" />
+							</SelectTrigger>
+							<SelectContent>
+								<SelectItem value="_none">Inherit from project ({inheritedEngine})</SelectItem>
+								{engines.map((engine) => (
+									<SelectItem key={engine.id} value={engine.id}>
+										{engine.label}
+									</SelectItem>
+								))}
+							</SelectContent>
+						</Select>
+					</div>
+					<div className="space-y-2">
+						<Label htmlFor={`${agentType}-model`}>Model</Label>
+						<ModelField
+							id={`${agentType}-model`}
+							value={model}
+							onChange={setModel}
+							engine={agentEngine}
+							defaultLabel={inheritedModel ? `Inherit from project (${inheritedModel})` : undefined}
+						/>
+					</div>
+					{effectiveEngine && (
+						<EngineSettingsFields
+							engine={effectiveEngine}
+							value={engineSettings}
+							onChange={setEngineSettings}
+							inheritLabel="Inherit from project"
+							engineDefaults={engineDefaults}
+						/>
+					)}
 					<div className="grid grid-cols-2 gap-4">
-						<div className="space-y-2">
-							<Label htmlFor={`${agentType}-model`}>Model</Label>
-							<ModelField
-								id={`${agentType}-model`}
-								value={model}
-								onChange={setModel}
-								engine={agentEngine}
-								defaultLabel={
-									inheritedModel ? `Inherit from project (${inheritedModel})` : undefined
-								}
-							/>
-						</div>
 						<div className="space-y-2">
 							<Label htmlFor={`${agentType}-iterations`}>Max Iterations</Label>
 							<Input
@@ -343,8 +369,6 @@ function DefinitionAgentSection({
 								}
 							/>
 						</div>
-					</div>
-					<div className="grid grid-cols-2 gap-4">
 						<div className="space-y-2">
 							<Label htmlFor={`${agentType}-concurrency`}>Max Concurrency</Label>
 							<Input
@@ -356,35 +380,7 @@ function DefinitionAgentSection({
 								placeholder="Optional"
 							/>
 						</div>
-						<div className="space-y-2">
-							<Label>Engine</Label>
-							<Select
-								value={agentEngine || '_none'}
-								onValueChange={(v) => setAgentEngine(v === '_none' ? '' : v)}
-							>
-								<SelectTrigger className="w-full">
-									<SelectValue placeholder="Optional" />
-								</SelectTrigger>
-								<SelectContent>
-									<SelectItem value="_none">Inherit from project ({inheritedEngine})</SelectItem>
-									{engines.map((engine) => (
-										<SelectItem key={engine.id} value={engine.id}>
-											{engine.label}
-										</SelectItem>
-									))}
-								</SelectContent>
-							</Select>
-						</div>
 					</div>
-					{effectiveEngine && (
-						<EngineSettingsFields
-							engine={effectiveEngine}
-							value={engineSettings}
-							onChange={setEngineSettings}
-							inheritLabel="Inherit from project"
-							engineDefaults={engineDefaults}
-						/>
-					)}
 				</TabsContent>
 
 				{/* Prompts Tab */}
@@ -552,9 +548,9 @@ function AgentRow({
 			<TableCell className="hidden sm:table-cell text-sm text-muted-foreground">
 				{displayModel || displayEngine ? (
 					<span>
-						{displayModel && <span>{displayModel}</span>}
-						{displayModel && displayEngine && <span> · </span>}
 						{displayEngine && <span>{displayEngine}</span>}
+						{displayEngine && displayModel && <span> · </span>}
+						{displayModel && <span>{displayModel}</span>}
 						{hasCustomEngineSettings && (
 							<span className="ml-1.5 inline-flex items-center rounded-sm bg-muted px-1.5 py-0.5 text-xs">
 								Custom settings
@@ -636,7 +632,7 @@ function AgentListView({
 							<TableRow>
 								<TableHead>Agent</TableHead>
 								<TableHead>Status</TableHead>
-								<TableHead className="hidden sm:table-cell">Model / Engine</TableHead>
+								<TableHead className="hidden sm:table-cell">Engine / Model</TableHead>
 								<TableHead className="hidden sm:table-cell">Active Triggers</TableHead>
 								<TableHead className="w-20" />
 							</TableRow>
diff --git a/web/src/components/projects/project-harness-form.tsx b/web/src/components/projects/project-harness-form.tsx
index 5a41d05c..bba36e43 100644
--- a/web/src/components/projects/project-harness-form.tsx
+++ b/web/src/components/projects/project-harness-form.tsx
@@ -187,62 +187,60 @@ export function ProjectHarnessForm({ project }: { project: Project }) {
 									Determines which AI SDK processes agent runs.
 								</p>
 							</div>
+							<div className="space-y-2">
+								<div className="flex items-center gap-1.5">
+									<Label htmlFor="model">Model</Label>
+									<Tooltip>
+										<TooltipTrigger asChild>
+											<HelpCircle className="h-3.5 w-3.5 text-muted-foreground cursor-help" />
+										</TooltipTrigger>
+										<TooltipContent>
+											Individual agents can override this in the Agents tab.
+										</TooltipContent>
+									</Tooltip>
+								</div>
+								<ModelField
+									id="model"
+									value={model}
+									onChange={setModel}
+									engine={effectiveEngineId}
+									defaultLabel={defaults ? defaults.model : undefined}
+								/>
+								<p className="text-xs text-muted-foreground">
+									Project default model. Per-agent overrides in the Agents tab.
+								</p>
+							</div>
 							<EngineSettingsFields
 								engine={effectiveEngine}
 								value={engineSettings}
 								onChange={(next) => setEngineSettings(next ?? {})}
 								engineDefaults={engineDefaults}
 							/>
-							<div className="grid grid-cols-2 gap-4">
-								<div className="space-y-2">
-									<div className="flex items-center gap-1.5">
-										<Label htmlFor="model">Model</Label>
-										<Tooltip>
-											<TooltipTrigger asChild>
-												<HelpCircle className="h-3.5 w-3.5 text-muted-foreground cursor-help" />
-											</TooltipTrigger>
-											<TooltipContent>
-												Individual agents can override this in the Agents tab.
-											</TooltipContent>
-										</Tooltip>
-									</div>
-									<ModelField
-										id="model"
-										value={model}
-										onChange={setModel}
-										engine={effectiveEngineId}
-										defaultLabel={defaults ? defaults.model : undefined}
-									/>
-									<p className="text-xs text-muted-foreground">
-										Project default model. Per-agent overrides in the Agents tab.
-									</p>
-								</div>
-								<div className="space-y-2">
-									<div className="flex items-center gap-1.5">
-										<Label htmlFor="maxIterations">Max Iterations</Label>
-										<Tooltip>
-											<TooltipTrigger asChild>
-												<HelpCircle className="h-3.5 w-3.5 text-muted-foreground cursor-help" />
-											</TooltipTrigger>
-											<TooltipContent>
-												Individual agents can override this in the Agents tab.
-											</TooltipContent>
-										</Tooltip>
-									</div>
-									<Input
-										id="maxIterations"
-										type="number"
-										min="1"
-										step="1"
-										className="w-32"
-										value={maxIterations}
-										onChange={(e) => setMaxIterations(e.target.value)}
-										placeholder={defaults ? `${defaults.maxIterations} (default)` : 'e.g. 50'}
-									/>
-									<p className="text-xs text-muted-foreground">
-										Safety limit on tool-call iterations per run.
-									</p>
+							<div className="space-y-2">
+								<div className="flex items-center gap-1.5">
+									<Label htmlFor="maxIterations">Max Iterations</Label>
+									<Tooltip>
+										<TooltipTrigger asChild>
+											<HelpCircle className="h-3.5 w-3.5 text-muted-foreground cursor-help" />
+										</TooltipTrigger>
+										<TooltipContent>
+											Individual agents can override this in the Agents tab.
+										</TooltipContent>
+									</Tooltip>
 								</div>
+								<Input
+									id="maxIterations"
+									type="number"
+									min="1"
+									step="1"
+									className="w-32"
+									value={maxIterations}
+									onChange={(e) => setMaxIterations(e.target.value)}
+									placeholder={defaults ? `${defaults.maxIterations} (default)` : 'e.g. 50'}
+								/>
+								<p className="text-xs text-muted-foreground">
+									Safety limit on tool-call iterations per run.
+								</p>
 							</div>
 						</form>
 					</CardContent>
diff --git a/web/src/components/settings/agent-config-form-dialog.tsx b/web/src/components/settings/agent-config-form-dialog.tsx
index 654daab8..e25d1aef 100644
--- a/web/src/components/settings/agent-config-form-dialog.tsx
+++ b/web/src/components/settings/agent-config-form-dialog.tsx
@@ -114,33 +114,6 @@ export function AgentConfigFormDialog({ open, onOpenChange, config }: AgentConfi
 							required
 						/>
 					</div>
-					<div className="grid grid-cols-2 gap-4">
-						<div className="space-y-2">
-							<Label htmlFor="gac-model">Model</Label>
-							<ModelField id="gac-model" value={model} onChange={setModel} engine={agentEngine} />
-						</div>
-						<div className="space-y-2">
-							<Label htmlFor="gac-iterations">Max Iterations</Label>
-							<Input
-								id="gac-iterations"
-								type="number"
-								value={maxIterations}
-								onChange={(e) => setMaxIterations(e.target.value)}
-								placeholder="Optional"
-							/>
-						</div>
-					</div>
-					<div className="space-y-2">
-						<Label htmlFor="gac-concurrency">Max Concurrency</Label>
-						<Input
-							id="gac-concurrency"
-							type="number"
-							min={1}
-							value={maxConcurrency}
-							onChange={(e) => setMaxConcurrency(e.target.value)}
-							placeholder="Optional — limits concurrent runs per project"
-						/>
-					</div>
 					<div className="space-y-2">
 						<Label>Engine</Label>
 						<Select
@@ -160,6 +133,10 @@ export function AgentConfigFormDialog({ open, onOpenChange, config }: AgentConfi
 							</SelectContent>
 						</Select>
 					</div>
+					<div className="space-y-2">
+						<Label htmlFor="gac-model">Model</Label>
+						<ModelField id="gac-model" value={model} onChange={setModel} engine={agentEngine} />
+					</div>
 					{effectiveEngine && (
 						<EngineSettingsFields
 							engine={effectiveEngine}
@@ -168,6 +145,29 @@ export function AgentConfigFormDialog({ open, onOpenChange, config }: AgentConfi
 							inheritLabel="Inherit from project"
 						/>
 					)}
+					<div className="grid grid-cols-2 gap-4">
+						<div className="space-y-2">
+							<Label htmlFor="gac-iterations">Max Iterations</Label>
+							<Input
+								id="gac-iterations"
+								type="number"
+								value={maxIterations}
+								onChange={(e) => setMaxIterations(e.target.value)}
+								placeholder="Optional"
+							/>
+						</div>
+						<div className="space-y-2">
+							<Label htmlFor="gac-concurrency">Max Concurrency</Label>
+							<Input
+								id="gac-concurrency"
+								type="number"
+								min={1}
+								value={maxConcurrency}
+								onChange={(e) => setMaxConcurrency(e.target.value)}
+								placeholder="Optional — limits concurrent runs per project"
+							/>
+						</div>
+					</div>
 					<div className="space-y-2">
 						<Label>Prompt</Label>
 						<p className="text-sm text-muted-foreground">