diff --git a/src/app/components/setup/AgentSettingsFieldMetadataSummary.tsx b/src/app/components/setup/AgentSettingsFieldMetadataSummary.tsx
index 82c7cb8..5b544a9 100644
--- a/src/app/components/setup/AgentSettingsFieldMetadataSummary.tsx
+++ b/src/app/components/setup/AgentSettingsFieldMetadataSummary.tsx
@@ -68,36 +68,54 @@ export function AgentSettingsFieldMetadataSummary({
return null;
}
+ const source = sourceLabel(metadata.source, t);
+
return (
-
-
-
- {t("config.agentSettings.meta.sourceLabel")}
-
-
- {sourceLabel(metadata.source, t)}
-
- {metadata.path ? (
-
- {metadata.path}
-
- ) : null}
-
- {metadata.writeActions.map((action) => (
+
+
+
+ {t("config.agentSettings.meta.sourceLabel")}: {source}
+
+
+ {t(
+ "config.agentSettings.meta.writeCount",
+ metadata.writeActions.length,
+ )}
+
+
+ {t("config.agentSettings.meta.details")}
+
+
+
- {t("config.agentSettings.meta.writeLabel")}
+ {t("config.agentSettings.meta.sourceLabel")}
-
- {writeActionLabel(action, t)}
+
+ {source}
+ {metadata.path ? (
+
+ {metadata.path}
+
+ ) : null}
- ))}
-
+ {metadata.writeActions.map((action) => (
+
+
+ {t("config.agentSettings.meta.writeLabel")}
+
+
+ {writeActionLabel(action, t)}
+
+
+ ))}
+
+
);
}
diff --git a/src/app/components/setup/AgentSettingsModule.tsx b/src/app/components/setup/AgentSettingsModule.tsx
index 690f15e..80b28d3 100644
--- a/src/app/components/setup/AgentSettingsModule.tsx
+++ b/src/app/components/setup/AgentSettingsModule.tsx
@@ -399,52 +399,240 @@ function ScopeFieldCard({
);
}
+function ScopeSection({
+ title,
+ description,
+ children,
+}: {
+ title: string;
+ description: string;
+ children: ReactNode;
+}) {
+ return (
+
+
+
+ {title}
+
+
+ {description}
+
+
+ );
+}
+
+function OverrideFieldRow({
+ step,
+ icon,
+ title,
+ hint,
+ metadata,
+ schema,
+ loading = false,
+ children,
+}: {
+ step: string;
+ icon: ReactNode;
+ title: string;
+ hint: string;
+ metadata?: GatewayAgentSettingsFieldMetadata | null;
+ schema?: GatewayConfigSchemaLookupResult | null;
+ loading?: boolean;
+ children: ReactNode;
+}) {
+ const tone = metadata?.source === "universal_defaults" ? "violet" : "emerald";
+ const toneClasses =
+ tone === "violet"
+ ? {
+ step:
+ "bg-violet-500 text-white shadow-violet-500/25 dark:bg-violet-400 dark:text-slate-950",
+ icon:
+ "bg-violet-100 text-violet-700 dark:bg-violet-950/70 dark:text-violet-300",
+ headingClassName: "text-violet-700 dark:text-violet-300",
+ shell:
+ "border-violet-200/60 bg-white/80 dark:border-violet-900/40 dark:bg-slate-950/45",
+ }
+ : {
+ step:
+ "bg-emerald-500 text-white shadow-emerald-500/25 dark:bg-emerald-400 dark:text-slate-950",
+ icon:
+ "bg-emerald-100 text-emerald-700 dark:bg-emerald-950/70 dark:text-emerald-300",
+ headingClassName: "text-emerald-700 dark:text-emerald-300",
+ shell:
+ "border-emerald-200/60 bg-white/80 dark:border-emerald-900/40 dark:bg-slate-950/45",
+ };
+
+ return (
+
+
+
+ {step}
+
+
+
+ {icon}
+
+
+ {title}
+
+
+ {hint}
+
+ {schema ? (
+
+
+
+ ) : null}
+
+
+
+
+ {children}
+
+
+ );
+}
+
+const MEMORY_SEARCH_SECTION_TONES = {
+ sky: {
+ shell:
+ "border-sky-100 bg-gradient-to-br from-sky-50/95 via-white/80 to-white/70 dark:border-sky-950/60 dark:from-sky-950/30 dark:via-slate-950/80 dark:to-slate-950/60",
+ marker:
+ "bg-sky-500 text-white shadow-sky-500/25 dark:bg-sky-400 dark:text-slate-950",
+ icon: "bg-sky-100 text-sky-700 dark:bg-sky-950/70 dark:text-sky-300",
+ },
+ cyan: {
+ shell:
+ "border-cyan-100 bg-gradient-to-br from-cyan-50/95 via-white/80 to-white/70 dark:border-cyan-950/60 dark:from-cyan-950/30 dark:via-slate-950/80 dark:to-slate-950/60",
+ marker:
+ "bg-cyan-500 text-white shadow-cyan-500/25 dark:bg-cyan-400 dark:text-slate-950",
+ icon: "bg-cyan-100 text-cyan-700 dark:bg-cyan-950/70 dark:text-cyan-300",
+ },
+ emerald: {
+ shell:
+ "border-emerald-100 bg-gradient-to-br from-emerald-50/95 via-white/80 to-white/70 dark:border-emerald-950/60 dark:from-emerald-950/25 dark:via-slate-950/80 dark:to-slate-950/60",
+ marker:
+ "bg-emerald-500 text-white shadow-emerald-500/25 dark:bg-emerald-400 dark:text-slate-950",
+ icon:
+ "bg-emerald-100 text-emerald-700 dark:bg-emerald-950/70 dark:text-emerald-300",
+ },
+ amber: {
+ shell:
+ "border-amber-100 bg-gradient-to-br from-amber-50/95 via-white/80 to-white/70 dark:border-amber-950/60 dark:from-amber-950/25 dark:via-slate-950/80 dark:to-slate-950/60",
+ marker:
+ "bg-amber-500 text-white shadow-amber-500/25 dark:bg-amber-400 dark:text-slate-950",
+ icon: "bg-amber-100 text-amber-700 dark:bg-amber-950/70 dark:text-amber-300",
+ },
+ rose: {
+ shell:
+ "border-rose-100 bg-gradient-to-br from-rose-50/95 via-white/80 to-white/70 dark:border-rose-950/60 dark:from-rose-950/25 dark:via-slate-950/80 dark:to-slate-950/60",
+ marker:
+ "bg-rose-500 text-white shadow-rose-500/25 dark:bg-rose-400 dark:text-slate-950",
+ icon: "bg-rose-100 text-rose-700 dark:bg-rose-950/70 dark:text-rose-300",
+ },
+ violet: {
+ shell:
+ "border-violet-100 bg-gradient-to-br from-violet-50/95 via-white/80 to-white/70 dark:border-violet-950/60 dark:from-violet-950/30 dark:via-slate-950/80 dark:to-slate-950/60",
+ marker:
+ "bg-violet-500 text-white shadow-violet-500/25 dark:bg-violet-400 dark:text-slate-950",
+ icon:
+ "bg-violet-100 text-violet-700 dark:bg-violet-950/70 dark:text-violet-300",
+ },
+} as const;
+
function MemorySearchSubsection({
icon,
+ step,
title,
description,
children,
+ tone = "violet",
className = "",
}: {
icon: ReactNode;
+ step: string;
title: string;
description: string;
children: ReactNode;
+ tone?: keyof typeof MEMORY_SEARCH_SECTION_TONES;
className?: string;
}) {
+ const toneClasses = MEMORY_SEARCH_SECTION_TONES[tone];
+
return (
-
-
-
{icon}
-
-
- {title}
+
+
+
+
+ {step}
+
+
+
+ {icon}
+
+
+ {title}
+
+
+ {description}
+
-
- {description}
-
+
{children}
- {children}
-
+
);
}
+function resolveMemorySearchSectionTone(
+ scope: AgentSettingsScopeId,
+): keyof typeof MEMORY_SEARCH_SECTION_TONES {
+ return scope === "universal_defaults" ? "violet" : "emerald";
+}
+
function MemorySearchToggleTile({
title,
description,
checked,
disabled,
onChange,
+ tone = "sky",
}: {
title: string;
description: string;
checked: boolean;
disabled: boolean;
onChange: (checked: boolean) => void;
+ tone?: keyof typeof MEMORY_SEARCH_SECTION_TONES;
}) {
+ const checkTone =
+ tone === "violet"
+ ? "text-violet-600 focus:ring-violet-500"
+ : tone === "emerald"
+ ? "text-emerald-600 focus:ring-emerald-500"
+ : "text-sky-600 focus:ring-sky-500";
+ const accentColor =
+ tone === "violet" ? "#7c3aed" : tone === "emerald" ? "#059669" : "#0284c7";
+
return (
- {[workspaceScope, modelScope, agentDirScope, defaultRoutingScope].some(
- (scope) => scope === activeScope,
- ) ? (
+ {hasEffectiveFieldsInActiveScope &&
+ activeScope !== "selected_agent_override" ? (
<>
-
-
-
- {t("config.agentSettings.effectiveSectionTitle")}
-
-
- {t("config.agentSettings.effectiveSectionDesc")}
-
+
+
+ {workspaceScope === activeScope ? (
+
+
+
+ {canEdit ? (
+ setWorkspaceDraft(event.target.value)}
+ placeholder={t("config.agentSettings.workspacePlaceholder")}
+ className="min-w-0 flex-1 bg-transparent text-sm text-slate-700 outline-none placeholder:text-slate-400 dark:text-slate-100 dark:placeholder:text-slate-500"
+ />
+ ) : (
+
+ {isLoadingSettings
+ ? t("config.agentSettings.loading")
+ : workspaceValue}
+
+ )}
+
+
+ ) : null}
+
+ {modelScope === activeScope ? (
+
+
+
+ {canEdit ? (
+
+ ) : (
+
+ {isLoadingSettings
+ ? t("config.agentSettings.loading")
+ : modelValue}
+
+ )}
+
+ {canEdit && readyModelOptions.length === 0 ? (
+
+ {t("config.agentSettings.modelNoReadyOptions")}
+
+ ) : null}
+
+ ) : null}
+
+ {agentDirScope === activeScope ? (
+
+
+
+ {canEdit ? (
+ setAgentDirDraft(event.target.value)}
+ placeholder={t("config.agentSettings.agentDirPlaceholder")}
+ className="min-w-0 flex-1 bg-transparent text-sm text-slate-700 outline-none placeholder:text-slate-400 dark:text-slate-100 dark:placeholder:text-slate-500"
+ />
+ ) : (
+
+ {isLoadingSettings
+ ? t("config.agentSettings.loading")
+ : agentDirValue}
+
+ )}
+
+
+ ) : null}
+
+ ) : null}
-
-
-
-
- {canEdit ? (
- setWorkspaceDraft(event.target.value)}
- placeholder={t("config.agentSettings.workspacePlaceholder")}
- className="min-w-0 flex-1 bg-transparent text-sm text-slate-700 outline-none placeholder:text-slate-400 dark:text-slate-100 dark:placeholder:text-slate-500"
- />
- ) : (
-
- {isLoadingSettings
- ? t("config.agentSettings.loading")
- : workspaceValue}
-
- )}
-
-
+ {defaultRoutingScope === activeScope ? (
+
+ ) : null}
-
-
-
- {canEdit ? (
-
- ) : (
-
- {isLoadingSettings
- ? t("config.agentSettings.loading")
- : modelValue}
-
- )}
-
- {canEdit && readyModelOptions.length === 0 ? (
-
- {t("config.agentSettings.modelNoReadyOptions")}
+ {activeScope === "selected_agent_override" ? (
+
+
+
+ {t("config.agentSettings.selectedOverrideWorkbenchTitle")}
+
+
+ {t("config.agentSettings.selectedOverrideWorkbenchDesc")}
+
+
+
+
+ {conditionalScopeHint}
+
+
+ {activeSchemaErrorEntries.length > 0 ? (
+
+
{t("config.agentSettings.schemaUnavailable")}
+
+ {activeSchemaErrorEntries.map(([path, message]) => (
+
+ {path}: {message}
- ) : null}
-
+ ))}
+
+
+ ) : null}
-
+
+ {agentDirScope === activeScope ? (
+ }
+ title={t("config.agentSettings.selectedOverrideIdentityTitle")}
+ hint={t("config.agentSettings.selectedOverrideIdentityDesc")}
metadata={agentDirMetadata}
- className="lg:col-span-2"
>
@@ -1398,51 +1719,178 @@ export function AgentSettingsModule() {
)}
-
-
-
+
+