Clarify agent harness defaults in create flow

desktop/src/features/agents/ui/AgentAiConfigurationMode.tsx

@@ -1,20 +1,64 @@
+import type * as React from "react";
 import { Tabs, TabsList, TabsTrigger } from "@/shared/ui/tabs";
 import type { AgentAiConfigurationMode } from "./agentAiConfigurationPolicy";
+import { AgentAiDefaultsNotice } from "./AgentAiDefaults";
+import type { InheritedDefault } from "./bakedEnvHelpers";
 
 export type { AgentAiConfigurationMode } from "./agentAiConfigurationPolicy";
 
 export function HarnessModelDefaultNotice({
+  harness,
   model,
 }: {
+  harness: string;
   model?: string | null;
 }) {
   return (
-    <div className="text-sm" data-testid="agent-harness-defaults-notice">
-      <span className="text-muted-foreground">Model</span>{" "}
-      <span className="text-foreground">
+    <dl
+      className="grid grid-cols-[auto_minmax(0,1fr)] gap-x-3 text-sm"
+      data-testid="agent-harness-defaults-notice"
+    >
+      <dt className="text-muted-foreground">Harness</dt>
+      <dd className="truncate text-foreground">
+        {harness || "Not configured"}
+      </dd>
+      <dt className="text-muted-foreground">Model</dt>
+      <dd className="truncate text-foreground">
         {model?.trim() || "Harness default"}
-      </span>
-    </div>
+      </dd>
+    </dl>
+  );
+}
+
+export function AgentCreateAiDefaultsSummary({
+  canChooseProvider,
+  harness,
+  inheritedModel,
+  inheritedProvider,
+  model,
+  onEditDefaults,
+  triggerRef,
+}: {
+  canChooseProvider: boolean;
+  harness: string;
+  inheritedModel: InheritedDefault;
+  inheritedProvider: InheritedDefault;
+  model?: string | null;
+  onEditDefaults: () => void;
+  triggerRef?: React.Ref<HTMLButtonElement>;
+}) {
+  return canChooseProvider ? (
+    <AgentAiDefaultsNotice
+      onEditDefaults={onEditDefaults}
+      triggerRef={triggerRef}
+      explicitModel=""
+      explicitProvider=""
+      harness={harness}
+      inheritedModel={inheritedModel}
+      inheritedProvider={inheritedProvider}
+    />
+  ) : (
+    <HarnessModelDefaultNotice harness={harness} model={model} />
   );
 }
 
@@ -36,22 +80,31 @@ export function AgentAiConfigurationModeField({
         }
         value={mode}
       >
-        <TabsList>
-          <TabsTrigger value="defaults">
+        <TabsList className="relative isolate grid h-9 w-full grid-cols-2 overflow-hidden rounded-lg bg-muted p-0.5">
+          <div
+            aria-hidden="true"
+            className="absolute bottom-0.5 left-0.5 top-0.5 z-0 rounded-md bg-background shadow-sm transition-transform duration-[250ms] ease-out"
+            style={{
+              transform: `translateX(${mode === "custom" ? 100 : 0}%)`,
+              width: "calc((100% - 4px) / 2)",
+            }}
+          />
+          <TabsTrigger
+            className="relative z-10 h-full rounded-md bg-transparent text-xs font-medium shadow-none transition-colors data-[state=active]:bg-transparent data-[state=active]:shadow-none"
+            value="defaults"
+          >
             {needsProviderSelection
               ? "Use agent defaults"
               : "Use harness defaults"}
           </TabsTrigger>
-          <TabsTrigger value="custom">Customize for this agent</TabsTrigger>
+          <TabsTrigger
+            className="relative z-10 h-full rounded-md bg-transparent text-xs font-medium shadow-none transition-colors data-[state=active]:bg-transparent data-[state=active]:shadow-none"
+            value="custom"
+          >
+            Customize for this agent
+          </TabsTrigger>
         </TabsList>
       </Tabs>
-      {mode === "custom" ? (
-        <p className="text-xs text-muted-foreground">
-          {needsProviderSelection
-            ? "Provider and model changes apply only to this agent."
-            : "Model changes apply only to this agent."}
-        </p>
-      ) : null}
     </div>
   );
 }

desktop/src/features/agents/ui/AgentAiDefaults.tsx

@@ -30,13 +30,15 @@ export function AgentAiDefaultsNotice({
   triggerRef,
   explicitModel,
   explicitProvider,
+  harness,
   inheritedModel,
   inheritedProvider,
 }: {
   onEditDefaults: () => void;
   triggerRef?: React.Ref<HTMLButtonElement>;
   explicitModel: string;
   explicitProvider: string;
+  harness?: string;
   inheritedModel: InheritedDefault;
   inheritedProvider: InheritedDefault;
 }) {
@@ -46,6 +48,14 @@ export function AgentAiDefaultsNotice({
   return (
     <div className="space-y-1" data-testid="agent-ai-defaults-notice">
       <dl className="grid grid-cols-[auto_minmax(0,1fr)] gap-x-3 text-sm">
+        {harness !== undefined ? (
+          <>
+            <dt className="text-muted-foreground">Harness</dt>
+            <dd className="truncate text-foreground">
+              {harness || "Not configured"}
+            </dd>
+          </>
+        ) : null}
         <dt className="text-muted-foreground">Provider</dt>
         <dd className="truncate text-foreground">
           {provider ? providerLabel(provider) : "Not configured"}