From 47199ab475cc13cc912d34bc7baab6ffeb57a583 Mon Sep 17 00:00:00 2001
From: Kyle Carberry <kyle@coder.com>
Date: Tue, 3 Mar 2026 17:52:35 -0500
Subject: [PATCH] refactor(site): replace bespoke chat model provider UI with
 schema-driven rendering (#22577)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary

Replace hand-coded per-provider field components, form state types,
validation schemas, and builder functions with generic schema-driven
code that reads from the auto-generated
`chatModelOptionsGenerated.json`.

## Changes

### `ModelConfigFields.tsx` (492 → 341 lines)
- Remove 6 per-provider components (`OpenAIFields`, `AnthropicFields`,
`GoogleFields`, `OpenAICompatFields`, `OpenRouterFields`,
`VercelFields`)
- Remove exported option arrays (`modelConfigReasoningEffortOptions`,
etc.)
- Add `renderSchemaField()` that dispatches to
`InputField`/`SelectField`/`JSONField` based on `field.input_type` from
the generated schema
- `ModelConfigFields` now calls `getVisibleProviderFields()` instead of
a switch statement
- `GeneralModelConfigFields` now calls `getVisibleGeneralFields()`
instead of hard-coding 6 InputField instances

### `modelConfigFormLogic.ts` (742 → 525 lines)
- Remove 6 per-provider form state types and empty defaults
- Remove 6 per-provider Yup validation schemas
- Remove 6 per-provider builder functions (`buildOpenAIOptions`, etc.)
- Remove 2 switch-case dispatch blocks (validation + build)
- Add `buildEmptyProviderState()` that walks schema fields to create
empty form state
- Add schema-driven `extractModelConfigFormState()` and
`buildModelConfigFromForm()`
- Add `yupTestForField()` + `buildYupSchema()` generating Yup validation
from field metadata
- Lazy-cache per-provider Yup schemas for performance

### `modelConfigFormLogic.test.ts`
- All 83 tests updated for the new nested state shape
- Uses `toContain` for error message assertions since labels now come
from schema descriptions

## Motivation

The auto-generated schema (`chatModelOptionsGenerated.json`) was merged
in #22568 but not yet consumed by the UI. This PR wires it up so that
when a new provider or field is added in Go (`codersdk/chats.go`),
running `make gen` regenerates the JSON schema and the UI automatically
picks up the new fields — no manual TypeScript changes needed.

**Production code reduced from 1234 to 866 lines (-30%).**
---
 site/src/api/chatModelOptions.ts              |    2 +-
 .../ChatModelAdminPanel.stories.tsx           |  132 +++
 .../ChatModelAdminPanel/ModelConfigFields.tsx |  478 +++-----
 .../modelConfigFormLogic.test.ts              |  324 ++---
 .../modelConfigFormLogic.ts                   | 1048 +++++++----------
 5 files changed, 912 insertions(+), 1072 deletions(-)

diff --git a/site/src/api/chatModelOptions.ts b/site/src/api/chatModelOptions.ts
index 6757720956..9e6233ee16 100644
--- a/site/src/api/chatModelOptions.ts
+++ b/site/src/api/chatModelOptions.ts
@@ -102,7 +102,7 @@ export function isKnownProvider(provider: string): boolean {
  * Only the first character after each underscore is uppercased;
  * the leading character stays lowercase.
  */
-function snakeToCamel(s: string): string {
+export function snakeToCamel(s: string): string {
 	return s.replace(/_([a-z0-9])/g, (_, ch: string) => ch.toUpperCase());
 }
 
diff --git a/site/src/pages/AgentsPage/ChatModelAdminPanel/ChatModelAdminPanel.stories.tsx b/site/src/pages/AgentsPage/ChatModelAdminPanel/ChatModelAdminPanel.stories.tsx
index 236cf1b834..6d059d75d3 100644
--- a/site/src/pages/AgentsPage/ChatModelAdminPanel/ChatModelAdminPanel.stories.tsx
+++ b/site/src/pages/AgentsPage/ChatModelAdminPanel/ChatModelAdminPanel.stories.tsx
@@ -489,6 +489,138 @@ export const SubmitModelConfigExplicitly: Story = {
 	},
 };
 
+// ── Per-provider model form stories ────────────────────────────
+// Each story opens the "Add model" form for a specific provider
+// so you can visually verify the schema-driven fields render.
+
+const providerFormSetup = (provider: string, displayName: string) => ({
+	args: { section: "models" as ChatModelAdminSection },
+	beforeEach: () => {
+		setupChatSpies({
+			providerConfigs: [
+				createProviderConfig({
+					id: `provider-${provider}`,
+					provider,
+					display_name: displayName,
+					source: "database",
+					has_api_key: true,
+				}),
+			],
+			modelConfigs: [],
+			modelCatalog: { providers: [] },
+		});
+	},
+});
+
+export const ModelFormOpenAI: Story = {
+	...providerFormSetup("openai", "OpenAI"),
+	play: async ({ canvasElement }) => {
+		const body = within(canvasElement.ownerDocument.body);
+		await openAddModelForm(body, "OpenAI");
+		await expect(
+			await body.findByLabelText(/Reasoning Effort/i),
+		).toBeInTheDocument();
+		await expect(
+			await body.findByLabelText(/Parallel Tool Calls/i),
+		).toBeInTheDocument();
+	},
+};
+
+export const ModelFormAnthropic: Story = {
+	...providerFormSetup("anthropic", "Anthropic"),
+	play: async ({ canvasElement }) => {
+		const body = within(canvasElement.ownerDocument.body);
+		await openAddModelForm(body, "Anthropic");
+		await expect(
+			await body.findByLabelText(/Send Reasoning/i),
+		).toBeInTheDocument();
+		await expect(
+			await body.findByLabelText(/Thinking Budget Tokens/i),
+		).toBeInTheDocument();
+	},
+};
+
+export const ModelFormGoogle: Story = {
+	...providerFormSetup("google", "Google"),
+	play: async ({ canvasElement }) => {
+		const body = within(canvasElement.ownerDocument.body);
+		await openAddModelForm(body, "Google");
+		await expect(
+			await body.findByLabelText(/Thinking Config Thinking Budget/i),
+		).toBeInTheDocument();
+		await expect(
+			await body.findByLabelText(/Thinking Config Include Thoughts/i),
+		).toBeInTheDocument();
+	},
+};
+
+export const ModelFormOpenAICompat: Story = {
+	...providerFormSetup("openaicompat", "OpenAI-compatible"),
+	play: async ({ canvasElement }) => {
+		const body = within(canvasElement.ownerDocument.body);
+		await openAddModelForm(body, "OpenAI-compatible");
+		await expect(
+			await body.findByLabelText(/Reasoning Effort/i),
+		).toBeInTheDocument();
+	},
+};
+
+export const ModelFormOpenRouter: Story = {
+	...providerFormSetup("openrouter", "OpenRouter"),
+	play: async ({ canvasElement }) => {
+		const body = within(canvasElement.ownerDocument.body);
+		await openAddModelForm(body, "OpenRouter");
+		await expect(
+			await body.findByLabelText(/Reasoning Enabled/i),
+		).toBeInTheDocument();
+		await expect(
+			await body.findByLabelText(/Reasoning Max Tokens/i),
+		).toBeInTheDocument();
+	},
+};
+
+export const ModelFormVercel: Story = {
+	...providerFormSetup("vercel", "Vercel AI Gateway"),
+	play: async ({ canvasElement }) => {
+		const body = within(canvasElement.ownerDocument.body);
+		await openAddModelForm(body, "Vercel AI Gateway");
+		await expect(
+			await body.findByLabelText(/Reasoning Enabled/i),
+		).toBeInTheDocument();
+		await expect(
+			await body.findByLabelText(/Parallel Tool Calls/i),
+		).toBeInTheDocument();
+	},
+};
+
+export const ModelFormAzure: Story = {
+	...providerFormSetup("azure", "Azure OpenAI"),
+	play: async ({ canvasElement }) => {
+		const body = within(canvasElement.ownerDocument.body);
+		await openAddModelForm(body, "Azure OpenAI");
+		// Azure aliases to OpenAI fields.
+		await expect(
+			await body.findByLabelText(/Reasoning Effort/i),
+		).toBeInTheDocument();
+		await expect(
+			await body.findByLabelText(/Service Tier/i),
+		).toBeInTheDocument();
+	},
+};
+
+export const ModelFormBedrock: Story = {
+	...providerFormSetup("bedrock", "AWS Bedrock"),
+	play: async ({ canvasElement }) => {
+		const body = within(canvasElement.ownerDocument.body);
+		await openAddModelForm(body, "AWS Bedrock");
+		// Bedrock aliases to Anthropic fields.
+		await expect(
+			await body.findByLabelText(/Send Reasoning/i),
+		).toBeInTheDocument();
+		await expect(await body.findByLabelText(/Effort/i)).toBeInTheDocument();
+	},
+};
+
 export const ValidatesModelConfigFields: Story = {
 	args: { section: "models" as ChatModelAdminSection },
 	beforeEach: () => {
diff --git a/site/src/pages/AgentsPage/ChatModelAdminPanel/ModelConfigFields.tsx b/site/src/pages/AgentsPage/ChatModelAdminPanel/ModelConfigFields.tsx
index ff7f3ad84b..b2ca74ecd5 100644
--- a/site/src/pages/AgentsPage/ChatModelAdminPanel/ModelConfigFields.tsx
+++ b/site/src/pages/AgentsPage/ChatModelAdminPanel/ModelConfigFields.tsx
@@ -1,3 +1,11 @@
+import {
+	type FieldSchema,
+	getVisibleGeneralFields,
+	getVisibleProviderFields,
+	resolveProvider,
+	snakeToCamel,
+	toFormFieldKey,
+} from "api/chatModelOptions";
 import { Input } from "components/Input/Input";
 import { Label } from "components/Label/Label";
 import {
@@ -17,31 +25,43 @@ import type {
 	ModelFormValues,
 } from "./modelConfigFormLogic";
 
-export const modelConfigReasoningEffortOptions = [
-	"minimal",
-	"low",
-	"medium",
-	"high",
-	"xhigh",
-	"none",
-] as const;
-
-export const modelConfigAnthropicEffortOptions = [
-	"low",
-	"medium",
-	"high",
-	"max",
-] as const;
-
-export const modelConfigTextVerbosityOptions = [
-	"low",
-	"medium",
-	"high",
-] as const;
-
 /** Sentinel value for Select components to represent "no selection". */
 const unsetSelectValue = "__unset__";
 
+// ── Helpers ────────────────────────────────────────────────────
+
+/**
+ * Convert a dot-and-underscore-separated json_name into a
+ * human-readable label.
+ *
+ * @example
+ * snakeToPrettyLabel("thinking.budget_tokens") // "Thinking Budget Tokens"
+ * snakeToPrettyLabel("reasoning_effort")        // "Reasoning Effort"
+ */
+function snakeToPrettyLabel(jsonName: string): string {
+	return jsonName
+		.split(/[._]/)
+		.map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+		.join(" ");
+}
+
+/**
+ * Derive a sensible placeholder from the field schema type.
+ */
+function placeholderForField(field: FieldSchema): string {
+	switch (field.type) {
+		case "integer":
+		case "number":
+			return "";
+		case "array":
+			return "[]";
+		case "object":
+			return "{}";
+		default:
+			return "";
+	}
+}
+
 // ── Generic field renderers ────────────────────────────────────
 
 type FieldRenderContext = {
@@ -53,12 +73,23 @@ type FieldRenderContext = {
 const InputField: FC<
 	FieldRenderContext & {
 		fieldKey: string;
+		errorKey?: string;
 		label: string;
+		description?: string;
 		placeholder: string;
 	}
-> = ({ form, fieldErrors, disabled, fieldKey, label, placeholder }) => {
+> = ({
+	form,
+	fieldErrors,
+	disabled,
+	fieldKey,
+	errorKey,
+	label,
+	description,
+	placeholder,
+}) => {
 	const errorId = `${fieldKey}-error`;
-	const fieldError = fieldErrors[fieldKey];
+	const fieldError = fieldErrors[errorKey ?? fieldKey];
 	const fieldProps = form.getFieldProps(fieldKey);
 	return (
 		<div className="flex min-w-0 flex-col gap-1.5">
@@ -68,6 +99,9 @@ const InputField: FC<
 			>
 				{label}
 			</Label>
+			{description && (
+				<p className="m-0 text-xs text-content-secondary">{description}</p>
+			)}
 			<Input
 				id={fieldKey}
 				className={cn(
@@ -92,12 +126,23 @@ const InputField: FC<
 const SelectField: FC<
 	FieldRenderContext & {
 		fieldKey: string;
+		errorKey?: string;
 		label: string;
+		description?: string;
 		options: readonly string[];
 	}
-> = ({ form, fieldErrors, disabled, fieldKey, label, options }) => {
+> = ({
+	form,
+	fieldErrors,
+	disabled,
+	fieldKey,
+	errorKey,
+	label,
+	description,
+	options,
+}) => {
 	const errorId = `${fieldKey}-error`;
-	const fieldError = fieldErrors[fieldKey];
+	const fieldError = fieldErrors[errorKey ?? fieldKey];
 	const currentValue = (getIn(form.values, fieldKey) as string) || "";
 	return (
 		<div className="flex min-w-0 flex-col gap-1.5">
@@ -107,6 +152,9 @@ const SelectField: FC<
 			>
 				{label}
 			</Label>
+			{description && (
+				<p className="m-0 text-xs text-content-secondary">{description}</p>
+			)}
 			<Select
 				value={currentValue || unsetSelectValue}
 				onValueChange={(value) =>
@@ -149,12 +197,23 @@ const SelectField: FC<
 const JSONField: FC<
 	FieldRenderContext & {
 		fieldKey: string;
+		errorKey?: string;
 		label: string;
+		description?: string;
 		placeholder: string;
 	}
-> = ({ form, fieldErrors, disabled, fieldKey, label, placeholder }) => {
+> = ({
+	form,
+	fieldErrors,
+	disabled,
+	fieldKey,
+	errorKey,
+	label,
+	description,
+	placeholder,
+}) => {
 	const errorId = `${fieldKey}-error`;
-	const fieldError = fieldErrors[fieldKey];
+	const fieldError = fieldErrors[errorKey ?? fieldKey];
 	const fieldProps = form.getFieldProps(fieldKey);
 	return (
 		<div className="flex min-w-0 flex-col gap-1.5">
@@ -164,6 +223,9 @@ const JSONField: FC<
 			>
 				{label}
 			</Label>
+			{description && (
+				<p className="m-0 text-xs text-content-secondary">{description}</p>
+			)}
 			<Textarea
 				id={fieldKey}
 				className={cn(
@@ -185,213 +247,64 @@ const JSONField: FC<
 	);
 };
 
-// ── Provider-specific field sets ───────────────────────────────
+// ── Schema-driven field renderer ───────────────────────────────
 
-const OpenAIFields: FC<FieldRenderContext> = (props) => (
-	<div className="grid min-w-0 gap-3 sm:grid-cols-2">
-		<SelectField
-			{...props}
-			fieldKey="config.openai.reasoningEffort"
-			label="Reasoning Effort"
-			options={modelConfigReasoningEffortOptions}
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.openai.parallelToolCalls"
-			label="Parallel Tool Calls"
-			options={["true", "false"]}
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.openai.textVerbosity"
-			label="Text Verbosity"
-			options={modelConfigTextVerbosityOptions}
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.openai.serviceTier"
-			label="Service Tier"
-			placeholder="auto"
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.openai.reasoningSummary"
-			label="Reasoning Summary"
-			placeholder="detailed"
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.openai.user"
-			label="User"
-			placeholder="end-user-id"
-		/>
-	</div>
-);
+/**
+ * Render a single field from the schema using the appropriate
+ * generic renderer based on its `input_type`.
+ */
+function renderSchemaField(
+	field: FieldSchema,
+	fieldKey: string,
+	errorKey: string,
+	ctx: FieldRenderContext,
+): React.ReactNode {
+	const label = snakeToPrettyLabel(field.json_name);
 
-const AnthropicFields: FC<FieldRenderContext> = (props) => (
-	<div className="grid min-w-0 gap-3 sm:grid-cols-2">
-		<SelectField
-			{...props}
-			fieldKey="config.anthropic.effort"
-			label="Output Effort"
-			options={modelConfigAnthropicEffortOptions}
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.anthropic.thinkingBudgetTokens"
-			label="Thinking Budget Tokens"
-			placeholder="4000"
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.anthropic.sendReasoning"
-			label="Send Reasoning"
-			options={["true", "false"]}
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.anthropic.disableParallelToolUse"
-			label="Disable Parallel Tool Use"
-			options={["true", "false"]}
-		/>
-	</div>
-);
-
-const GoogleFields: FC<FieldRenderContext> = (props) => (
-	<div className="grid min-w-0 gap-3 sm:grid-cols-2">
-		<InputField
-			{...props}
-			fieldKey="config.google.thinkingBudget"
-			label="Thinking Budget"
-			placeholder="1024"
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.google.includeThoughts"
-			label="Include Thoughts"
-			options={["true", "false"]}
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.google.cachedContent"
-			label="Cached Content"
-			placeholder="cached-contents/abc123"
-		/>
-		<JSONField
-			{...props}
-			fieldKey="config.google.safetySettingsJSON"
-			label="Safety Settings JSON"
-			placeholder={`[
-  {"category":"HARM_CATEGORY_DANGEROUS_CONTENT","threshold":"BLOCK_ONLY_HIGH"}
-]`}
-		/>
-	</div>
-);
-
-const OpenAICompatFields: FC<FieldRenderContext> = (props) => (
-	<div className="grid min-w-0 gap-3 sm:grid-cols-2">
-		<SelectField
-			{...props}
-			fieldKey="config.openaicompat.reasoningEffort"
-			label="Reasoning Effort"
-			options={modelConfigReasoningEffortOptions}
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.openaicompat.user"
-			label="User"
-			placeholder="end-user-id"
-		/>
-	</div>
-);
-
-const OpenRouterFields: FC<FieldRenderContext> = (props) => (
-	<div className="grid min-w-0 gap-3 sm:grid-cols-2">
-		<SelectField
-			{...props}
-			fieldKey="config.openrouter.reasoningEnabled"
-			label="Reasoning Enabled"
-			options={["true", "false"]}
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.openrouter.reasoningEffort"
-			label="Reasoning Effort"
-			options={modelConfigReasoningEffortOptions}
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.openrouter.reasoningMaxTokens"
-			label="Reasoning Max Tokens"
-			placeholder="2048"
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.openrouter.reasoningExclude"
-			label="Reasoning Exclude"
-			options={["true", "false"]}
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.openrouter.parallelToolCalls"
-			label="Parallel Tool Calls"
-			options={["true", "false"]}
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.openrouter.includeUsage"
-			label="Include Usage"
-			options={["true", "false"]}
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.openrouter.user"
-			label="User"
-			placeholder="end-user-id"
-		/>
-	</div>
-);
-
-const VercelFields: FC<FieldRenderContext> = (props) => (
-	<div className="grid min-w-0 gap-3 sm:grid-cols-2">
-		<SelectField
-			{...props}
-			fieldKey="config.vercel.reasoningEnabled"
-			label="Reasoning Enabled"
-			options={["true", "false"]}
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.vercel.reasoningEffort"
-			label="Reasoning Effort"
-			options={modelConfigReasoningEffortOptions}
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.vercel.reasoningMaxTokens"
-			label="Reasoning Max Tokens"
-			placeholder="2048"
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.vercel.reasoningExclude"
-			label="Reasoning Exclude"
-			options={["true", "false"]}
-		/>
-		<SelectField
-			{...props}
-			fieldKey="config.vercel.parallelToolCalls"
-			label="Parallel Tool Calls"
-			options={["true", "false"]}
-		/>
-		<InputField
-			{...props}
-			fieldKey="config.vercel.user"
-			label="User"
-			placeholder="end-user-id"
-		/>
-	</div>
-);
+	switch (field.input_type) {
+		case "input":
+			return (
+				<InputField
+					key={fieldKey}
+					{...ctx}
+					fieldKey={fieldKey}
+					errorKey={errorKey}
+					label={label}
+					description={field.description}
+					placeholder={placeholderForField(field)}
+				/>
+			);
+		case "select": {
+			const options: readonly string[] =
+				field.enum ?? (field.type === "boolean" ? ["true", "false"] : []);
+			return (
+				<SelectField
+					key={fieldKey}
+					{...ctx}
+					fieldKey={fieldKey}
+					errorKey={errorKey}
+					label={label}
+					description={field.description}
+					options={options}
+				/>
+			);
+		}
+		case "json":
+			return (
+				<JSONField
+					key={fieldKey}
+					{...ctx}
+					fieldKey={fieldKey}
+					errorKey={errorKey}
+					label={label}
+					description={field.description}
+					placeholder={placeholderForField(field)}
+				/>
+			);
+		default:
+			return null;
+	}
+}
 
 // ── Main component ─────────────────────────────────────────────
 
@@ -405,6 +318,9 @@ type ModelConfigFieldsProps = {
 /**
  * Provider-specific fields (reasoning, tool calls, etc.) that
  * should be visible at the top level of the model form.
+ *
+ * Fields and their input types are driven by the auto-generated
+ * schema in `api/chatModelOptions`.
  */
 export const ModelConfigFields: FC<ModelConfigFieldsProps> = ({
 	provider,
@@ -412,34 +328,33 @@ export const ModelConfigFields: FC<ModelConfigFieldsProps> = ({
 	fieldErrors,
 	disabled,
 }) => {
-	const ctx: FieldRenderContext = { form, fieldErrors, disabled };
 	const normalized = normalizeProvider(provider);
+	const resolved = resolveProvider(normalized);
+	const fields = getVisibleProviderFields(normalized);
 
-	switch (normalized) {
-		case "openai":
-			return <OpenAIFields {...ctx} />;
-		case "azure":
-			return <OpenAIFields {...ctx} />;
-		case "anthropic":
-			return <AnthropicFields {...ctx} />;
-		case "bedrock":
-			return <AnthropicFields {...ctx} />;
-		case "google":
-			return <GoogleFields {...ctx} />;
-		case "openaicompat":
-			return <OpenAICompatFields {...ctx} />;
-		case "openrouter":
-			return <OpenRouterFields {...ctx} />;
-		case "vercel":
-			return <VercelFields {...ctx} />;
-		default:
-			return null;
+	if (fields.length === 0) {
+		return null;
 	}
+
+	const ctx: FieldRenderContext = { form, fieldErrors, disabled };
+
+	return (
+		<div className="grid min-w-0 gap-3 sm:grid-cols-2">
+			{fields.map((field) => {
+				const fieldKey = `config.${toFormFieldKey(resolved, field.json_name)}`;
+				const errorKey = toFormFieldKey(resolved, field.json_name);
+				return renderSchemaField(field, fieldKey, errorKey, ctx);
+			})}
+		</div>
+	);
 };
 
 /**
  * General model config fields (max output tokens, temperature,
  * top P, etc.) intended to be shown under an "Advanced" section.
+ *
+ * Fields are driven by the auto-generated schema in
+ * `api/chatModelOptions`.
  */
 export const GeneralModelConfigFields: FC<ModelConfigFieldsProps> = ({
 	form,
@@ -447,45 +362,30 @@ export const GeneralModelConfigFields: FC<ModelConfigFieldsProps> = ({
 	disabled,
 }) => {
 	const ctx: FieldRenderContext = { form, fieldErrors, disabled };
+	const fields = getVisibleGeneralFields();
 
 	return (
 		<>
-			<InputField
-				{...ctx}
-				fieldKey="config.maxOutputTokens"
-				label="Max Output Tokens"
-				placeholder="32000"
-			/>
-			<InputField
-				{...ctx}
-				fieldKey="config.temperature"
-				label="Temperature"
-				placeholder="0.2"
-			/>
-			<InputField
-				{...ctx}
-				fieldKey="config.topP"
-				label="Top P"
-				placeholder="0.95"
-			/>
-			<InputField
-				{...ctx}
-				fieldKey="config.topK"
-				label="Top K"
-				placeholder="40"
-			/>
-			<InputField
-				{...ctx}
-				fieldKey="config.presencePenalty"
-				label="Presence Penalty"
-				placeholder="0"
-			/>
-			<InputField
-				{...ctx}
-				fieldKey="config.frequencyPenalty"
-				label="Frequency Penalty"
-				placeholder="0"
-			/>
+			{fields.map((field) => {
+				// General field keys use camelCase of the json_name directly
+				// under "config.", matching the existing form state shape:
+				// config.maxOutputTokens, config.temperature, etc.
+				const camelName = snakeToCamel(field.json_name);
+				const fieldKey = `config.${camelName}`;
+				const label = snakeToPrettyLabel(field.json_name);
+
+				return (
+					<InputField
+						key={fieldKey}
+						{...ctx}
+						fieldKey={fieldKey}
+						errorKey={camelName}
+						label={label}
+						description={field.description}
+						placeholder={placeholderForField(field)}
+					/>
+				);
+			})}
 		</>
 	);
 };
diff --git a/site/src/pages/AgentsPage/ChatModelAdminPanel/modelConfigFormLogic.test.ts b/site/src/pages/AgentsPage/ChatModelAdminPanel/modelConfigFormLogic.test.ts
index 2bb7a38473..0c0d609b51 100644
--- a/site/src/pages/AgentsPage/ChatModelAdminPanel/modelConfigFormLogic.test.ts
+++ b/site/src/pages/AgentsPage/ChatModelAdminPanel/modelConfigFormLogic.test.ts
@@ -1,74 +1,81 @@
 import type * as TypesGen from "api/typesGenerated";
 import { describe, expect, it } from "vitest";
 import {
-	type AnthropicFormState,
 	buildModelConfigFromForm,
-	emptyAnthropicFormState,
-	emptyGoogleFormState,
 	emptyModelConfigFormState,
-	emptyOpenAICompatFormState,
-	emptyOpenAIFormState,
-	emptyOpenRouterFormState,
-	emptyVercelFormState,
 	extractModelConfigFormState,
-	type GoogleFormState,
 	type ModelConfigFormState,
-	type OpenAICompatFormState,
-	type OpenAIFormState,
-	type OpenRouterFormState,
 	parsePositiveInteger,
 	parseThresholdInteger,
-	type VercelFormState,
 } from "./modelConfigFormLogic";
 
 // ── Helpers ────────────────────────────────────────────────────
 
 /**
- * Return an empty form state with the given top-level overrides
- * applied. Provider sub-objects can be partially overridden.
+ * Return an empty form state with the given overrides applied.
+ * Provider sub-objects are deep-merged so callers can pass
+ * partial overrides for nested fields.
  */
-const formWith = (
-	overrides: Partial<
-		Omit<
-			ModelConfigFormState,
-			| "openai"
-			| "anthropic"
-			| "google"
-			| "openaicompat"
-			| "openrouter"
-			| "vercel"
-		> & {
-			openai: Partial<OpenAIFormState>;
-			anthropic: Partial<AnthropicFormState>;
-			google: Partial<GoogleFormState>;
-			openaicompat: Partial<OpenAICompatFormState>;
-			openrouter: Partial<OpenRouterFormState>;
-			vercel: Partial<VercelFormState>;
-		}
-	>,
-): ModelConfigFormState => {
+const formWith = (overrides: Record<string, unknown>): ModelConfigFormState => {
 	const base = structuredClone(emptyModelConfigFormState);
-	const {
-		openai,
-		anthropic,
-		google,
-		openaicompat,
-		openrouter,
-		vercel,
-		...topLevel
-	} = overrides;
-	return {
-		...base,
-		...topLevel,
-		openai: { ...base.openai, ...openai },
-		anthropic: { ...base.anthropic, ...anthropic },
-		google: { ...base.google, ...google },
-		openaicompat: { ...base.openaicompat, ...openaicompat },
-		openrouter: { ...base.openrouter, ...openrouter },
-		vercel: { ...base.vercel, ...vercel },
-	};
+
+	for (const [key, val] of Object.entries(overrides)) {
+		if (val && typeof val === "object" && !Array.isArray(val)) {
+			// Deep-merge provider sub-objects.
+			base[key] = deepMerge(
+				(base[key] as Record<string, unknown>) ?? {},
+				val as Record<string, unknown>,
+			);
+		} else {
+			(base as Record<string, unknown>)[key] = val;
+		}
+	}
+
+	return base;
 };
 
+/** Simple recursive merge for plain objects. */
+function deepMerge(
+	target: Record<string, unknown>,
+	source: Record<string, unknown>,
+): Record<string, unknown> {
+	const result = { ...target };
+	for (const [key, val] of Object.entries(source)) {
+		if (
+			val &&
+			typeof val === "object" &&
+			!Array.isArray(val) &&
+			result[key] &&
+			typeof result[key] === "object" &&
+			!Array.isArray(result[key])
+		) {
+			result[key] = deepMerge(
+				result[key] as Record<string, unknown>,
+				val as Record<string, unknown>,
+			);
+		} else {
+			result[key] = val;
+		}
+	}
+	return result;
+}
+
+/** Helper to read a nested value from the form state. */
+function deepGet(obj: unknown, path: string[]): unknown {
+	let current = obj;
+	for (const key of path) {
+		if (
+			current === undefined ||
+			current === null ||
+			typeof current !== "object"
+		) {
+			return undefined;
+		}
+		current = (current as Record<string, unknown>)[key];
+	}
+	return current;
+}
+
 /** Minimal ChatModelConfig with no model_config. */
 const baseChatModelConfig: TypesGen.ChatModelConfig = {
 	id: "test-id",
@@ -215,12 +222,13 @@ describe("extractModelConfigFormState", () => {
 			},
 		};
 		const result = extractModelConfigFormState(model);
-		expect(result.openai.reasoningEffort).toBe("high");
-		expect(result.openai.parallelToolCalls).toBe("true");
-		expect(result.openai.textVerbosity).toBe("medium");
-		expect(result.openai.serviceTier).toBe("auto");
-		expect(result.openai.reasoningSummary).toBe("concise");
-		expect(result.openai.user).toBe("test-user");
+		const openai = result.openai as Record<string, unknown>;
+		expect(openai.reasoningEffort).toBe("high");
+		expect(openai.parallelToolCalls).toBe("true");
+		expect(openai.textVerbosity).toBe("medium");
+		expect(openai.serviceTier).toBe("auto");
+		expect(openai.reasoningSummary).toBe("concise");
+		expect(openai.user).toBe("test-user");
 	});
 
 	it("extracts Anthropic provider options with thinking", () => {
@@ -238,10 +246,11 @@ describe("extractModelConfigFormState", () => {
 			},
 		};
 		const result = extractModelConfigFormState(model);
-		expect(result.anthropic.effort).toBe("high");
-		expect(result.anthropic.thinkingBudgetTokens).toBe("1024");
-		expect(result.anthropic.sendReasoning).toBe("true");
-		expect(result.anthropic.disableParallelToolUse).toBe("false");
+		const anthropic = result.anthropic as Record<string, unknown>;
+		expect(anthropic.effort).toBe("high");
+		expect(deepGet(anthropic, ["thinking", "budgetTokens"])).toBe("1024");
+		expect(anthropic.sendReasoning).toBe("true");
+		expect(anthropic.disableParallelToolUse).toBe("false");
 	});
 
 	it("extracts Google provider options with safety settings", () => {
@@ -262,12 +271,11 @@ describe("extractModelConfigFormState", () => {
 			},
 		};
 		const result = extractModelConfigFormState(model);
-		expect(result.google.thinkingBudget).toBe("2048");
-		expect(result.google.includeThoughts).toBe("true");
-		expect(result.google.cachedContent).toBe("cache-123");
-		expect(result.google.safetySettingsJSON).toBe(
-			JSON.stringify(safetySettings, null, 2),
-		);
+		const google = result.google as Record<string, unknown>;
+		expect(deepGet(google, ["thinkingConfig", "thinkingBudget"])).toBe("2048");
+		expect(deepGet(google, ["thinkingConfig", "includeThoughts"])).toBe("true");
+		expect(google.cachedContent).toBe("cache-123");
+		expect(google.safetySettings).toBe(JSON.stringify(safetySettings, null, 2));
 	});
 
 	it("returns empty string for google safety settings when absent", () => {
@@ -280,7 +288,8 @@ describe("extractModelConfigFormState", () => {
 			},
 		};
 		const result = extractModelConfigFormState(model);
-		expect(result.google.safetySettingsJSON).toBe("");
+		const google = result.google as Record<string, unknown>;
+		expect(google.safetySettings).toBe("");
 	});
 
 	it("extracts OpenAI-compatible provider options", () => {
@@ -296,8 +305,9 @@ describe("extractModelConfigFormState", () => {
 			},
 		};
 		const result = extractModelConfigFormState(model);
-		expect(result.openaicompat.reasoningEffort).toBe("low");
-		expect(result.openaicompat.user).toBe("compat-user");
+		const openaicompat = result.openaicompat as Record<string, unknown>;
+		expect(openaicompat.reasoningEffort).toBe("low");
+		expect(openaicompat.user).toBe("compat-user");
 	});
 
 	it("extracts OpenRouter provider options", () => {
@@ -320,13 +330,14 @@ describe("extractModelConfigFormState", () => {
 			},
 		};
 		const result = extractModelConfigFormState(model);
-		expect(result.openrouter.reasoningEnabled).toBe("true");
-		expect(result.openrouter.reasoningEffort).toBe("medium");
-		expect(result.openrouter.reasoningMaxTokens).toBe("500");
-		expect(result.openrouter.reasoningExclude).toBe("false");
-		expect(result.openrouter.parallelToolCalls).toBe("true");
-		expect(result.openrouter.includeUsage).toBe("true");
-		expect(result.openrouter.user).toBe("router-user");
+		const openrouter = result.openrouter as Record<string, unknown>;
+		expect(deepGet(openrouter, ["reasoning", "enabled"])).toBe("true");
+		expect(deepGet(openrouter, ["reasoning", "effort"])).toBe("medium");
+		expect(deepGet(openrouter, ["reasoning", "maxTokens"])).toBe("500");
+		expect(deepGet(openrouter, ["reasoning", "exclude"])).toBe("false");
+		expect(openrouter.parallelToolCalls).toBe("true");
+		expect(openrouter.includeUsage).toBe("true");
+		expect(openrouter.user).toBe("router-user");
 	});
 
 	it("extracts Vercel provider options", () => {
@@ -348,12 +359,13 @@ describe("extractModelConfigFormState", () => {
 			},
 		};
 		const result = extractModelConfigFormState(model);
-		expect(result.vercel.reasoningEnabled).toBe("false");
-		expect(result.vercel.reasoningEffort).toBe("high");
-		expect(result.vercel.reasoningMaxTokens).toBe("1000");
-		expect(result.vercel.reasoningExclude).toBe("true");
-		expect(result.vercel.parallelToolCalls).toBe("false");
-		expect(result.vercel.user).toBe("vercel-user");
+		const vercel = result.vercel as Record<string, unknown>;
+		expect(deepGet(vercel, ["reasoning", "enabled"])).toBe("false");
+		expect(deepGet(vercel, ["reasoning", "effort"])).toBe("high");
+		expect(deepGet(vercel, ["reasoning", "maxTokens"])).toBe("1000");
+		expect(deepGet(vercel, ["reasoning", "exclude"])).toBe("true");
+		expect(vercel.parallelToolCalls).toBe("false");
+		expect(vercel.user).toBe("vercel-user");
 	});
 
 	it("handles missing provider_options gracefully", () => {
@@ -366,19 +378,23 @@ describe("extractModelConfigFormState", () => {
 		const result = extractModelConfigFormState(model);
 		expect(result.temperature).toBe("0.5");
 		// All provider-specific fields should be empty.
-		expect(result.openai.reasoningEffort).toBe("");
-		expect(result.anthropic.effort).toBe("");
-		expect(result.google.thinkingBudget).toBe("");
+		const openai = result.openai as Record<string, unknown>;
+		expect(openai.reasoningEffort).toBe("");
+		const anthropic = result.anthropic as Record<string, unknown>;
+		expect(anthropic.effort).toBe("");
+		const google = result.google as Record<string, unknown>;
+		expect(deepGet(google, ["thinkingConfig", "thinkingBudget"])).toBe("");
 	});
 
 	it("returns deep copies of provider sub-objects", () => {
 		const result = extractModelConfigFormState(baseChatModelConfig);
-		expect(result.openai).not.toBe(emptyOpenAIFormState);
-		expect(result.anthropic).not.toBe(emptyAnthropicFormState);
-		expect(result.google).not.toBe(emptyGoogleFormState);
-		expect(result.openaicompat).not.toBe(emptyOpenAICompatFormState);
-		expect(result.openrouter).not.toBe(emptyOpenRouterFormState);
-		expect(result.vercel).not.toBe(emptyVercelFormState);
+		const empty = emptyModelConfigFormState;
+		expect(result.openai).not.toBe(empty.openai);
+		expect(result.anthropic).not.toBe(empty.anthropic);
+		expect(result.google).not.toBe(empty.google);
+		expect(result.openaicompat).not.toBe(empty.openaicompat);
+		expect(result.openrouter).not.toBe(empty.openrouter);
+		expect(result.vercel).not.toBe(empty.vercel);
 	});
 });
 
@@ -448,8 +464,8 @@ describe("buildModelConfigFromForm", () => {
 				"openai",
 				formWith({ maxOutputTokens: "abc" }),
 			);
-			expect(result.fieldErrors.maxOutputTokens).toBe(
-				"Max output tokens must be a valid number.",
+			expect(result.fieldErrors.maxOutputTokens).toContain(
+				"must be a valid integer",
 			);
 			expect(result.modelConfig).toBeUndefined();
 		});
@@ -459,8 +475,8 @@ describe("buildModelConfigFromForm", () => {
 				"openai",
 				formWith({ temperature: "hot" }),
 			);
-			expect(result.fieldErrors.temperature).toBe(
-				"Temperature must be a valid number.",
+			expect(result.fieldErrors.temperature).toContain(
+				"must be a valid number",
 			);
 		});
 
@@ -469,7 +485,7 @@ describe("buildModelConfigFromForm", () => {
 				"openai",
 				formWith({ topP: "not-a-number" }),
 			);
-			expect(result.fieldErrors.topP).toBe("Top P must be a valid number.");
+			expect(result.fieldErrors.topP).toContain("must be a valid number");
 		});
 
 		it("reports error for non-numeric topK", () => {
@@ -477,7 +493,7 @@ describe("buildModelConfigFromForm", () => {
 				"openai",
 				formWith({ topK: "xyz" }),
 			);
-			expect(result.fieldErrors.topK).toBe("Top K must be a valid number.");
+			expect(result.fieldErrors.topK).toContain("must be a valid integer");
 		});
 
 		it("skips empty string fields (no undefined values in output)", () => {
@@ -550,8 +566,8 @@ describe("buildModelConfigFromForm", () => {
 				"openai",
 				formWith({ openai: { reasoningEffort: "invalid_value" } }),
 			);
-			expect(result.fieldErrors["openai.reasoningEffort"]).toBe(
-				"Reasoning effort has an invalid value.",
+			expect(result.fieldErrors["openai.reasoningEffort"]).toContain(
+				"invalid value",
 			);
 		});
 
@@ -560,8 +576,8 @@ describe("buildModelConfigFromForm", () => {
 				"openai",
 				formWith({ openai: { parallelToolCalls: "maybe" } }),
 			);
-			expect(result.fieldErrors["openai.parallelToolCalls"]).toBe(
-				"Parallel tool calls must be true or false.",
+			expect(result.fieldErrors["openai.parallelToolCalls"]).toContain(
+				"must be true or false",
 			);
 		});
 
@@ -570,8 +586,8 @@ describe("buildModelConfigFromForm", () => {
 				"openai",
 				formWith({ openai: { textVerbosity: "invalid" } }),
 			);
-			expect(result.fieldErrors["openai.textVerbosity"]).toBe(
-				"Text verbosity has an invalid value.",
+			expect(result.fieldErrors["openai.textVerbosity"]).toContain(
+				"invalid value",
 			);
 		});
 
@@ -611,7 +627,9 @@ describe("buildModelConfigFromForm", () => {
 		it("builds Anthropic options with thinking budget", () => {
 			const result = buildModelConfigFromForm(
 				"anthropic",
-				formWith({ anthropic: { thinkingBudgetTokens: "2048" } }),
+				formWith({
+					anthropic: { thinking: { budgetTokens: "2048" } },
+				}),
 			);
 			expect(result.fieldErrors).toEqual({});
 			expect(result.modelConfig?.provider_options?.anthropic).toEqual({
@@ -625,7 +643,7 @@ describe("buildModelConfigFromForm", () => {
 				formWith({
 					anthropic: {
 						effort: "max",
-						thinkingBudgetTokens: "1024",
+						thinking: { budgetTokens: "1024" },
 						sendReasoning: "false",
 						disableParallelToolUse: "true",
 					},
@@ -645,18 +663,18 @@ describe("buildModelConfigFromForm", () => {
 				"anthropic",
 				formWith({ anthropic: { effort: "ultra" } }),
 			);
-			expect(result.fieldErrors["anthropic.effort"]).toBe(
-				"Output effort has an invalid value.",
-			);
+			expect(result.fieldErrors["anthropic.effort"]).toContain("invalid value");
 		});
 
 		it("reports error for non-numeric thinking budget tokens", () => {
 			const result = buildModelConfigFromForm(
 				"anthropic",
-				formWith({ anthropic: { thinkingBudgetTokens: "lots" } }),
+				formWith({
+					anthropic: { thinking: { budgetTokens: "lots" } },
+				}),
 			);
-			expect(result.fieldErrors["anthropic.thinkingBudgetTokens"]).toBe(
-				"Thinking budget tokens must be a valid number.",
+			expect(result.fieldErrors["anthropic.thinking.budgetTokens"]).toContain(
+				"must be a valid integer",
 			);
 		});
 	});
@@ -665,7 +683,9 @@ describe("buildModelConfigFromForm", () => {
 		it("builds Google provider options with thinking budget", () => {
 			const result = buildModelConfigFromForm(
 				"google",
-				formWith({ google: { thinkingBudget: "4096" } }),
+				formWith({
+					google: { thinkingConfig: { thinkingBudget: "4096" } },
+				}),
 			);
 			expect(result.fieldErrors).toEqual({});
 			expect(result.modelConfig?.provider_options?.google).toEqual({
@@ -676,7 +696,9 @@ describe("buildModelConfigFromForm", () => {
 		it("builds Google options with include_thoughts", () => {
 			const result = buildModelConfigFromForm(
 				"google",
-				formWith({ google: { includeThoughts: "true" } }),
+				formWith({
+					google: { thinkingConfig: { includeThoughts: "true" } },
+				}),
 			);
 			expect(result.fieldErrors).toEqual({});
 			const google = result.modelConfig?.provider_options?.google as Record<
@@ -691,8 +713,10 @@ describe("buildModelConfigFromForm", () => {
 				"google",
 				formWith({
 					google: {
-						thinkingBudget: "2048",
-						includeThoughts: "false",
+						thinkingConfig: {
+							thinkingBudget: "2048",
+							includeThoughts: "false",
+						},
 					},
 				}),
 			);
@@ -722,7 +746,7 @@ describe("buildModelConfigFromForm", () => {
 			const settings = [{ category: "harm", threshold: "block" }];
 			const result = buildModelConfigFromForm(
 				"google",
-				formWith({ google: { safetySettingsJSON: JSON.stringify(settings) } }),
+				formWith({ google: { safetySettings: JSON.stringify(settings) } }),
 			);
 			expect(result.fieldErrors).toEqual({});
 			const google = result.modelConfig?.provider_options?.google as Record<
@@ -735,31 +759,33 @@ describe("buildModelConfigFromForm", () => {
 		it("reports error for invalid JSON in safety settings", () => {
 			const result = buildModelConfigFromForm(
 				"google",
-				formWith({ google: { safetySettingsJSON: "not-json" } }),
+				formWith({ google: { safetySettings: "not-json" } }),
 			);
-			expect(result.fieldErrors["google.safetySettingsJSON"]).toBe(
-				"Safety settings JSON must be valid JSON.",
+			expect(result.fieldErrors["google.safetySettings"]).toContain(
+				"must be valid JSON",
 			);
 		});
 
 		it("reports error when safety settings JSON is an object (not array)", () => {
 			const result = buildModelConfigFromForm(
 				"google",
-				formWith({ google: { safetySettingsJSON: '{"key":"value"}' } }),
+				formWith({ google: { safetySettings: '{"key":"value"}' } }),
 			);
-			expect(result.fieldErrors["google.safetySettingsJSON"]).toBe(
-				"Safety settings JSON must be an array.",
+			expect(result.fieldErrors["google.safetySettings"]).toContain(
+				"must be a JSON array",
 			);
 		});
 
 		it("reports error for non-numeric thinking budget", () => {
 			const result = buildModelConfigFromForm(
 				"google",
-				formWith({ google: { thinkingBudget: "abc" } }),
-			);
-			expect(result.fieldErrors["google.thinkingBudget"]).toBe(
-				"Thinking budget must be a valid number.",
+				formWith({
+					google: { thinkingConfig: { thinkingBudget: "abc" } },
+				}),
 			);
+			expect(
+				result.fieldErrors["google.thinkingConfig.thinkingBudget"],
+			).toContain("must be a valid integer");
 		});
 	});
 
@@ -786,8 +812,8 @@ describe("buildModelConfigFromForm", () => {
 				"openaicompat",
 				formWith({ openaicompat: { reasoningEffort: "super" } }),
 			);
-			expect(result.fieldErrors["openaicompat.reasoningEffort"]).toBe(
-				"Reasoning effort has an invalid value.",
+			expect(result.fieldErrors["openaicompat.reasoningEffort"]).toContain(
+				"invalid value",
 			);
 		});
 
@@ -806,10 +832,12 @@ describe("buildModelConfigFromForm", () => {
 				"openrouter",
 				formWith({
 					openrouter: {
-						reasoningEnabled: "true",
-						reasoningEffort: "high",
-						reasoningMaxTokens: "500",
-						reasoningExclude: "false",
+						reasoning: {
+							enabled: "true",
+							effort: "high",
+							maxTokens: "500",
+							exclude: "false",
+						},
 					},
 				}),
 			);
@@ -855,20 +883,24 @@ describe("buildModelConfigFromForm", () => {
 		it("reports error for invalid reasoning effort", () => {
 			const result = buildModelConfigFromForm(
 				"openrouter",
-				formWith({ openrouter: { reasoningEffort: "turbo" } }),
+				formWith({
+					openrouter: { reasoning: { effort: "turbo" } },
+				}),
 			);
-			expect(result.fieldErrors["openrouter.reasoningEffort"]).toBe(
-				"Reasoning effort has an invalid value.",
+			expect(result.fieldErrors["openrouter.reasoning.effort"]).toContain(
+				"invalid value",
 			);
 		});
 
 		it("reports error for invalid boolean in reasoning enabled", () => {
 			const result = buildModelConfigFromForm(
 				"openrouter",
-				formWith({ openrouter: { reasoningEnabled: "yes" } }),
+				formWith({
+					openrouter: { reasoning: { enabled: "yes" } },
+				}),
 			);
-			expect(result.fieldErrors["openrouter.reasoningEnabled"]).toBe(
-				"Reasoning enabled must be true or false.",
+			expect(result.fieldErrors["openrouter.reasoning.enabled"]).toContain(
+				"must be true or false",
 			);
 		});
 	});
@@ -879,10 +911,12 @@ describe("buildModelConfigFromForm", () => {
 				"vercel",
 				formWith({
 					vercel: {
-						reasoningEnabled: "true",
-						reasoningEffort: "medium",
-						reasoningMaxTokens: "1000",
-						reasoningExclude: "true",
+						reasoning: {
+							enabled: "true",
+							effort: "medium",
+							maxTokens: "1000",
+							exclude: "true",
+						},
 					},
 				}),
 			);
diff --git a/site/src/pages/AgentsPage/ChatModelAdminPanel/modelConfigFormLogic.ts b/site/src/pages/AgentsPage/ChatModelAdminPanel/modelConfigFormLogic.ts
index 8bbb006a52..c289866f75 100644
--- a/site/src/pages/AgentsPage/ChatModelAdminPanel/modelConfigFormLogic.ts
+++ b/site/src/pages/AgentsPage/ChatModelAdminPanel/modelConfigFormLogic.ts
@@ -1,151 +1,36 @@
+import {
+	type FieldSchema,
+	getGeneralFields,
+	getProviderFields,
+	getProviderNames,
+	resolveProvider,
+	snakeToCamel,
+} from "api/chatModelOptions";
 import type * as TypesGen from "api/typesGenerated";
 import * as Yup from "yup";
-import { normalizeProvider } from "./helpers";
-import {
-	modelConfigAnthropicEffortOptions,
-	modelConfigReasoningEffortOptions,
-	modelConfigTextVerbosityOptions,
-} from "./ModelConfigFields";
 
-// ── Per-provider form state types ──────────────────────────────
+// ── Preserved public types ─────────────────────────────────────
 
-export type OpenAIFormState = {
-	reasoningEffort: string;
-	parallelToolCalls: string;
-	textVerbosity: string;
-	serviceTier: string;
-	reasoningSummary: string;
-	user: string;
-};
-
-export type AnthropicFormState = {
-	effort: string;
-	thinkingBudgetTokens: string;
-	sendReasoning: string;
-	disableParallelToolUse: string;
-};
-
-export type GoogleFormState = {
-	thinkingBudget: string;
-	includeThoughts: string;
-	cachedContent: string;
-	safetySettingsJSON: string;
-};
-
-export type OpenAICompatFormState = {
-	reasoningEffort: string;
-	user: string;
-};
-
-export type OpenRouterFormState = {
-	reasoningEnabled: string;
-	reasoningEffort: string;
-	reasoningMaxTokens: string;
-	reasoningExclude: string;
-	parallelToolCalls: string;
-	includeUsage: string;
-	user: string;
-};
-
-export type VercelFormState = {
-	reasoningEnabled: string;
-	reasoningEffort: string;
-	reasoningMaxTokens: string;
-	reasoningExclude: string;
-	parallelToolCalls: string;
-	user: string;
-};
-
-// ── Main form state type ───────────────────────────────────────
-
-export type ModelConfigFormState = {
-	maxOutputTokens: string;
-	temperature: string;
-	topP: string;
-	topK: string;
-	presencePenalty: string;
-	frequencyPenalty: string;
-	openai: OpenAIFormState;
-	anthropic: AnthropicFormState;
-	google: GoogleFormState;
-	openaicompat: OpenAICompatFormState;
-	openrouter: OpenRouterFormState;
-	vercel: VercelFormState;
-};
+export type ModelConfigFormState = Record<
+	string,
+	string | Record<string, unknown>
+>;
 
 export type ModelConfigFormBuildResult = {
 	modelConfig?: TypesGen.ChatModelCallConfig;
 	fieldErrors: Record<string, string>;
 };
 
-// ── Empty defaults ─────────────────────────────────────────────
-
-export const emptyOpenAIFormState: OpenAIFormState = {
-	reasoningEffort: "",
-	parallelToolCalls: "",
-	textVerbosity: "",
-	serviceTier: "",
-	reasoningSummary: "",
-	user: "",
+export type ModelFormValues = {
+	model: string;
+	displayName: string;
+	contextLimit: string;
+	compressionThreshold: string;
+	isDefault: boolean;
+	config: ModelConfigFormState;
 };
 
-export const emptyAnthropicFormState: AnthropicFormState = {
-	effort: "",
-	thinkingBudgetTokens: "",
-	sendReasoning: "",
-	disableParallelToolUse: "",
-};
-
-export const emptyGoogleFormState: GoogleFormState = {
-	thinkingBudget: "",
-	includeThoughts: "",
-	cachedContent: "",
-	safetySettingsJSON: "",
-};
-
-export const emptyOpenAICompatFormState: OpenAICompatFormState = {
-	reasoningEffort: "",
-	user: "",
-};
-
-export const emptyOpenRouterFormState: OpenRouterFormState = {
-	reasoningEnabled: "",
-	reasoningEffort: "",
-	reasoningMaxTokens: "",
-	reasoningExclude: "",
-	parallelToolCalls: "",
-	includeUsage: "",
-	user: "",
-};
-
-export const emptyVercelFormState: VercelFormState = {
-	reasoningEnabled: "",
-	reasoningEffort: "",
-	reasoningMaxTokens: "",
-	reasoningExclude: "",
-	parallelToolCalls: "",
-	user: "",
-};
-
-export const emptyModelConfigFormState: ModelConfigFormState = {
-	maxOutputTokens: "",
-	temperature: "",
-	topP: "",
-	topK: "",
-	presencePenalty: "",
-	frequencyPenalty: "",
-	openai: { ...emptyOpenAIFormState },
-	anthropic: { ...emptyAnthropicFormState },
-	google: { ...emptyGoogleFormState },
-	openaicompat: { ...emptyOpenAICompatFormState },
-	openrouter: { ...emptyOpenRouterFormState },
-	vercel: { ...emptyVercelFormState },
-};
-
-// ── Helpers ────────────────────────────────────────────────────
-
-const hasObjectKeys = (value: Record<string, unknown>): boolean =>
-	Object.keys(value).length > 0;
+// ── Preserved parsing utilities ────────────────────────────────
 
 export const parsePositiveInteger = (value: string): number | null => {
 	const trimmed = value.trim();
@@ -163,7 +48,128 @@ export const parseThresholdInteger = (value: string): number | null => {
 	return parsed;
 };
 
-// ── Extract model config form state from an existing model ────
+// ── Internal helpers ───────────────────────────────────────────
+
+/**
+ * Set a value inside a nested object, creating intermediate
+ * objects along the way. The path is an array of string keys.
+ */
+function deepSet(
+	obj: Record<string, unknown>,
+	path: string[],
+	value: unknown,
+): void {
+	let current = obj;
+	for (let i = 0; i < path.length - 1; i++) {
+		const key = path[i];
+		if (
+			current[key] === undefined ||
+			current[key] === null ||
+			typeof current[key] !== "object"
+		) {
+			current[key] = {};
+		}
+		current = current[key] as Record<string, unknown>;
+	}
+	current[path[path.length - 1]] = value;
+}
+
+/**
+ * Get a value from a nested object using an array of string keys.
+ * Returns `undefined` if any intermediate key is missing.
+ */
+function deepGet(obj: unknown, path: string[]): unknown {
+	let current = obj;
+	for (const key of path) {
+		if (
+			current === undefined ||
+			current === null ||
+			typeof current !== "object"
+		) {
+			return undefined;
+		}
+		current = (current as Record<string, unknown>)[key];
+	}
+	return current;
+}
+
+const hasObjectKeys = (value: Record<string, unknown>): boolean =>
+	Object.keys(value).length > 0;
+
+/**
+ * Convert a form string value to its API representation based on
+ * the field schema type. Empty strings yield `undefined` so
+ * callers can conditionally include fields.
+ */
+function convertFormValue(value: string, field: FieldSchema): unknown {
+	const trimmed = value.trim();
+	if (!trimmed) return undefined;
+
+	switch (field.type) {
+		case "integer":
+			return Number.parseInt(trimmed, 10);
+		case "number":
+			return Number(trimmed);
+		case "boolean":
+			return trimmed === "true";
+		case "array":
+		case "object":
+			return JSON.parse(trimmed);
+		default:
+			return trimmed;
+	}
+}
+
+/**
+ * Convert an API value to a form string. Arrays and objects are
+ * pretty-printed as JSON; null/undefined become empty strings.
+ */
+function toFormString(v: unknown): string {
+	if (v === undefined || v === null) return "";
+	if (typeof v === "object") return JSON.stringify(v, null, 2);
+	return String(v);
+}
+
+// ── Schema-driven form state generation ────────────────────────
+
+/**
+ * Build an empty form state object for a single provider by
+ * walking its field schemas. Nested `json_name` values
+ * (e.g. `"thinking.budget_tokens"`) produce nested objects with
+ * camelCase keys matching `toFormFieldKey`.
+ */
+function buildEmptyProviderState(provider: string): Record<string, unknown> {
+	const state: Record<string, unknown> = {};
+	for (const field of getProviderFields(provider)) {
+		const camelSegments = field.json_name.split(".").map(snakeToCamel);
+		deepSet(state, camelSegments, "");
+	}
+	return state;
+}
+
+/**
+ * The empty form state, generated from the schema at module load.
+ * Contains general fields as top-level camelCase keys and one
+ * nested object per canonical provider.
+ */
+export const emptyModelConfigFormState: ModelConfigFormState = (() => {
+	const state: ModelConfigFormState = {};
+
+	// General fields (e.g. maxOutputTokens, temperature).
+	for (const field of getGeneralFields()) {
+		const key = snakeToCamel(field.json_name);
+		state[key] = "";
+	}
+
+	// Provider sub-objects.
+	for (const provider of getProviderNames()) {
+		state[provider] = buildEmptyProviderState(provider);
+	}
+
+	return state;
+})();
+
+// ── Extract form state from an existing API model ──────────────
 
 export const extractModelConfigFormState = (
 	model: TypesGen.ChatModelConfig,
@@ -173,86 +179,45 @@ export const extractModelConfigFormState = (
 		return structuredClone(emptyModelConfigFormState);
 	}
 
-	const toFormString = (v: unknown): string =>
-		v !== undefined && v !== null ? String(v) : "";
+	const state: ModelConfigFormState = {};
 
+	// General fields — read from the top level of the API config
+	// using the snake_case json_name.
+	for (const field of getGeneralFields()) {
+		const camelKey = snakeToCamel(field.json_name);
+		const apiValue = (config as Record<string, unknown>)[field.json_name];
+		state[camelKey] = toFormString(apiValue);
+	}
+
+	// Provider sub-objects.
 	const po = config.provider_options;
-	const openai = po?.openai;
-	const anthropic = po?.anthropic;
-	const google = po?.google;
-	const openaicompat = po?.openaicompat;
-	const openrouter = po?.openrouter;
-	const vercel = po?.vercel;
+	for (const provider of getProviderNames()) {
+		const providerData = (po as Record<string, unknown> | undefined)?.[
+			provider
+		] as Record<string, unknown> | undefined;
+		const providerState: Record<string, unknown> = {};
 
-	return {
-		maxOutputTokens: toFormString(config.max_output_tokens),
-		temperature: toFormString(config.temperature),
-		topP: toFormString(config.top_p),
-		topK: toFormString(config.top_k),
-		presencePenalty: toFormString(config.presence_penalty),
-		frequencyPenalty: toFormString(config.frequency_penalty),
-		openai: {
-			reasoningEffort: toFormString(openai?.reasoning_effort),
-			parallelToolCalls: toFormString(openai?.parallel_tool_calls),
-			textVerbosity: toFormString(openai?.text_verbosity),
-			serviceTier: toFormString(openai?.service_tier),
-			reasoningSummary: toFormString(openai?.reasoning_summary),
-			user: toFormString(openai?.user),
-		},
-		anthropic: {
-			effort: toFormString(anthropic?.effort),
-			thinkingBudgetTokens: toFormString(anthropic?.thinking?.budget_tokens),
-			sendReasoning: toFormString(anthropic?.send_reasoning),
-			disableParallelToolUse: toFormString(
-				anthropic?.disable_parallel_tool_use,
-			),
-		},
-		google: {
-			thinkingBudget: toFormString(google?.thinking_config?.thinking_budget),
-			includeThoughts: toFormString(google?.thinking_config?.include_thoughts),
-			cachedContent: toFormString(google?.cached_content),
-			safetySettingsJSON: google?.safety_settings
-				? JSON.stringify(google.safety_settings, null, 2)
-				: "",
-		},
-		openaicompat: {
-			reasoningEffort: toFormString(openaicompat?.reasoning_effort),
-			user: toFormString(openaicompat?.user),
-		},
-		openrouter: {
-			reasoningEnabled: toFormString(openrouter?.reasoning?.enabled),
-			reasoningEffort: toFormString(openrouter?.reasoning?.effort),
-			reasoningMaxTokens: toFormString(openrouter?.reasoning?.max_tokens),
-			reasoningExclude: toFormString(openrouter?.reasoning?.exclude),
-			parallelToolCalls: toFormString(openrouter?.parallel_tool_calls),
-			includeUsage: toFormString(openrouter?.include_usage),
-			user: toFormString(openrouter?.user),
-		},
-		vercel: {
-			reasoningEnabled: toFormString(vercel?.reasoning?.enabled),
-			reasoningEffort: toFormString(vercel?.reasoning?.effort),
-			reasoningMaxTokens: toFormString(vercel?.reasoning?.max_tokens),
-			reasoningExclude: toFormString(vercel?.reasoning?.exclude),
-			parallelToolCalls: toFormString(vercel?.parallel_tool_calls),
-			user: toFormString(vercel?.user),
-		},
-	};
+		for (const field of getProviderFields(provider)) {
+			// Navigate into the API response using snake_case segments.
+			const snakeSegments = field.json_name.split(".");
+			const apiValue = providerData
+				? deepGet(providerData, snakeSegments)
+				: undefined;
+
+			// Store under camelCase segments to match the form field key
+			// structure produced by toFormFieldKey.
+			const camelSegments = field.json_name.split(".").map(snakeToCamel);
+			deepSet(providerState, camelSegments, toFormString(apiValue));
+		}
+
+		state[provider] = providerState;
+	}
+
+	return state;
 };
 
-// ── Unified form values type ─────────────────────────────────
+// ── Build initial model form values ────────────────────────────
 
-export type ModelFormValues = {
-	model: string;
-	displayName: string;
-	contextLimit: string;
-	compressionThreshold: string;
-	isDefault: boolean;
-	config: ModelConfigFormState;
-};
-
-/**
- * Build initial form values from an editing model or defaults.
- */
 export const buildInitialModelFormValues = (
 	editingModel?: TypesGen.ChatModelConfig,
 ): ModelFormValues => ({
@@ -268,141 +233,190 @@ export const buildInitialModelFormValues = (
 		: structuredClone(emptyModelConfigFormState),
 });
 
-// ── Parsing utilities ─────────────────────────────────────────
+// ── Schema-driven Yup validation ───────────────────────────────
+
+/**
+ * Build a Yup string test for a single field schema. All form
+ * values are strings; the test checks whether a non-empty value
+ * can be parsed according to the field's declared type and enum.
+ */
+function yupTestForField(field: FieldSchema): Yup.StringSchema {
+	const label = field.description ?? field.go_name;
+
+	switch (field.type) {
+		case "integer":
+			return Yup.string().test(
+				"optional-integer",
+				`${label} must be a valid integer.`,
+				(value) => {
+					const trimmed = value?.trim();
+					if (!trimmed) return true;
+					return Number.isFinite(Number.parseInt(trimmed, 10));
+				},
+			);
+
+		case "number":
+			return Yup.string().test(
+				"optional-number",
+				`${label} must be a valid number.`,
+				(value) => {
+					const trimmed = value?.trim();
+					if (!trimmed) return true;
+					return Number.isFinite(Number(trimmed));
+				},
+			);
+
+		case "boolean":
+			return Yup.string().test(
+				"optional-boolean",
+				`${label} must be true or false.`,
+				(value) => {
+					const trimmed = value?.trim();
+					if (!trimmed) return true;
+					return trimmed === "true" || trimmed === "false";
+				},
+			);
+
+		case "string":
+			if (field.enum && field.enum.length > 0) {
+				const allowed = field.enum;
+				return Yup.string().test(
+					"optional-select",
+					`${label} has an invalid value.`,
+					(value) => {
+						const trimmed = value?.trim();
+						if (!trimmed) return true;
+						return allowed.includes(trimmed);
+					},
+				);
+			}
+			// Plain strings are always valid.
+			return Yup.string();
+
+		case "array":
+			return Yup.string().test(
+				"optional-json-array",
+				"",
+				function validate(value) {
+					const trimmed = value?.trim();
+					if (!trimmed) return true;
+					let parsed: unknown;
+					try {
+						parsed = JSON.parse(trimmed);
+					} catch {
+						return this.createError({
+							message: `${label} must be valid JSON.`,
+						});
+					}
+					if (!Array.isArray(parsed)) {
+						return this.createError({
+							message: `${label} must be a JSON array.`,
+						});
+					}
+					return true;
+				},
+			);
+
+		case "object":
+			return Yup.string().test(
+				"optional-json-object",
+				"",
+				function validate(value) {
+					const trimmed = value?.trim();
+					if (!trimmed) return true;
+					let parsed: unknown;
+					try {
+						parsed = JSON.parse(trimmed);
+					} catch {
+						return this.createError({
+							message: `${label} must be valid JSON.`,
+						});
+					}
+					if (
+						typeof parsed !== "object" ||
+						parsed === null ||
+						Array.isArray(parsed)
+					) {
+						return this.createError({
+							message: `${label} must be a JSON object.`,
+						});
+					}
+					return true;
+				},
+			);
+	}
+}
+
+/**
+ * Build a Yup object schema for a list of field schemas. Each
+ * field is keyed by the **leaf** camelCase name of its json_name.
+ * For nested fields (e.g. `thinking.budget_tokens`) we build a
+ * nested Yup object shape.
+ */
+function buildYupSchema(
+	fields: FieldSchema[],
+): Yup.ObjectSchema<Record<string, unknown>> {
+	const shape: Record<string, Yup.AnySchema> = {};
+
+	// Group fields by their first camelCase segment so we can
+	// build nested Yup.object() shapes for dot-notation names.
+	const nested = new Map<string, FieldSchema[]>();
+
+	for (const field of fields) {
+		const segments = field.json_name.split(".");
+		if (segments.length === 1) {
+			// Top-level field.
+			shape[snakeToCamel(segments[0])] = yupTestForField(field);
+		} else {
+			// Nested — group by first segment.
+			const parentKey = snakeToCamel(segments[0]);
+			if (!nested.has(parentKey)) {
+				nested.set(parentKey, []);
+			}
+			nested.get(parentKey)!.push(field);
+		}
+	}
+
+	// Build nested object schemas.
+	for (const [parentKey, nestedFields] of nested) {
+		const nestedShape: Record<string, Yup.AnySchema> = {};
+		for (const field of nestedFields) {
+			const segments = field.json_name.split(".");
+			// Use the tail segments (after the first) as the nested key.
+			const leafKey = segments.slice(1).map(snakeToCamel).join(".");
+			nestedShape[leafKey] = yupTestForField(field);
+		}
+		shape[parentKey] = Yup.object(nestedShape);
+	}
+
+	return Yup.object(shape) as Yup.ObjectSchema<Record<string, unknown>>;
+}
+
+// Pre-built general-fields schema.
+const generalFieldsSchema = buildYupSchema(getGeneralFields());
+
+// Cache of per-provider Yup schemas, built lazily.
+const providerSchemaCache = new Map<
+	string,
+	Yup.ObjectSchema<Record<string, unknown>>
+>();
+
+function getProviderYupSchema(
+	provider: string,
+): Yup.ObjectSchema<Record<string, unknown>> {
+	const resolved = resolveProvider(provider);
+	let schema = providerSchemaCache.get(resolved);
+	if (!schema) {
+		schema = buildYupSchema(getProviderFields(resolved));
+		providerSchemaCache.set(resolved, schema);
+	}
+	return schema;
+}
+
+// ── Yup error collection ───────────────────────────────────────
 
 type FieldErrors = Record<string, string>;
 
-// ── Yup transforms ──────────────────────────────────────────
-
-function yupOptionalInteger(label: string) {
-	return Yup.string().test(
-		"optional-integer",
-		`${label} must be a valid number.`,
-		(value) => {
-			const trimmed = value?.trim();
-			if (!trimmed) return true;
-			return Number.isFinite(Number.parseInt(trimmed, 10));
-		},
-	);
-}
-
-function yupOptionalNumber(label: string) {
-	return Yup.string().test(
-		"optional-number",
-		`${label} must be a valid number.`,
-		(value) => {
-			const trimmed = value?.trim();
-			if (!trimmed) return true;
-			return Number.isFinite(Number(trimmed));
-		},
-	);
-}
-
-function yupOptionalBoolean(label: string) {
-	return Yup.string().test(
-		"optional-boolean",
-		`${label} must be true or false.`,
-		(value) => {
-			const trimmed = value?.trim();
-			if (!trimmed) return true;
-			return trimmed === "true" || trimmed === "false";
-		},
-	);
-}
-
-function yupOptionalSelect(label: string, options: readonly string[]) {
-	return Yup.string().test(
-		"optional-select",
-		`${label} has an invalid value.`,
-		(value) => {
-			const trimmed = value?.trim();
-			if (!trimmed) return true;
-			return options.includes(trimmed);
-		},
-	);
-}
-
-function yupOptionalJSONArray(label: string) {
-	return Yup.string().test("optional-json-array", "", function validate(value) {
-		const trimmed = value?.trim();
-		if (!trimmed) return true;
-		let parsed: unknown;
-		try {
-			parsed = JSON.parse(trimmed);
-		} catch {
-			return this.createError({
-				message: `${label} must be valid JSON.`,
-			});
-		}
-		if (!Array.isArray(parsed)) {
-			return this.createError({
-				message: `${label} must be an array.`,
-			});
-		}
-		return true;
-	});
-}
-
-// ── Per-provider Yup schemas ─────────────────────────────────
-
-const topLevelSchema = Yup.object({
-	maxOutputTokens: yupOptionalInteger("Max output tokens"),
-	temperature: yupOptionalNumber("Temperature"),
-	topP: yupOptionalNumber("Top P"),
-	topK: yupOptionalInteger("Top K"),
-	presencePenalty: yupOptionalNumber("Presence penalty"),
-	frequencyPenalty: yupOptionalNumber("Frequency penalty"),
-});
-
-const openaiSchema = Yup.object({
-	reasoningEffort: yupOptionalSelect(
-		"Reasoning effort",
-		modelConfigReasoningEffortOptions,
-	),
-	parallelToolCalls: yupOptionalBoolean("Parallel tool calls"),
-	textVerbosity: yupOptionalSelect(
-		"Text verbosity",
-		modelConfigTextVerbosityOptions,
-	),
-});
-
-const anthropicSchema = Yup.object({
-	effort: yupOptionalSelect("Output effort", modelConfigAnthropicEffortOptions),
-	thinkingBudgetTokens: yupOptionalInteger("Thinking budget tokens"),
-	sendReasoning: yupOptionalBoolean("Send reasoning"),
-	disableParallelToolUse: yupOptionalBoolean("Disable parallel tool use"),
-});
-
-const googleSchema = Yup.object({
-	thinkingBudget: yupOptionalInteger("Thinking budget"),
-	includeThoughts: yupOptionalBoolean("Include thoughts"),
-	safetySettingsJSON: yupOptionalJSONArray("Safety settings JSON"),
-});
-
-const openaiCompatSchema = Yup.object({
-	reasoningEffort: yupOptionalSelect(
-		"Reasoning effort",
-		modelConfigReasoningEffortOptions,
-	),
-});
-
-const reasoningProviderSchema = Yup.object({
-	reasoningEnabled: yupOptionalBoolean("Reasoning enabled"),
-	reasoningEffort: yupOptionalSelect(
-		"Reasoning effort",
-		modelConfigReasoningEffortOptions,
-	),
-	reasoningMaxTokens: yupOptionalInteger("Reasoning max tokens"),
-	reasoningExclude: yupOptionalBoolean("Reasoning exclude"),
-	parallelToolCalls: yupOptionalBoolean("Parallel tool calls"),
-});
-
-const openrouterExtraSchema = Yup.object({
-	includeUsage: yupOptionalBoolean("Include usage"),
-});
-
-// ── Yup error collection ─────────────────────────────────────
-
 function collectYupErrors(
 	schema: Yup.ObjectSchema<Record<string, unknown>>,
 	data: Record<string, unknown>,
@@ -421,174 +435,7 @@ function collectYupErrors(
 	}
 }
 
-// ── Post-validation transform helpers ────────────────────────
-// These assume validation has already passed. Empty strings
-// yield undefined so callers can conditionally include fields.
-
-function toInt(s: string): number | undefined {
-	const trimmed = s.trim();
-	if (!trimmed) return undefined;
-	return Number.parseInt(trimmed, 10);
-}
-
-function toNum(s: string): number | undefined {
-	const trimmed = s.trim();
-	if (!trimmed) return undefined;
-	return Number(trimmed);
-}
-
-function toBool(s: string): boolean | undefined {
-	const trimmed = s.trim();
-	if (!trimmed) return undefined;
-	return trimmed === "true";
-}
-
-function toTrimmedString(s: string): string | undefined {
-	const trimmed = s.trim();
-	return trimmed || undefined;
-}
-
-function toJSON(s: string): unknown | undefined {
-	const trimmed = s.trim();
-	if (!trimmed) return undefined;
-	return JSON.parse(trimmed);
-}
-
-// ── Per-provider option builders ──────────────────────────────
-
-/**
- * Build OpenAI/Azure provider options from form state.
- * Validation has already passed; uses transform helpers only.
- */
-function buildOpenAIOptions(form: OpenAIFormState): Record<string, unknown> {
-	const reasoningEffort = toTrimmedString(form.reasoningEffort);
-	const parallelToolCalls = toBool(form.parallelToolCalls);
-	const textVerbosity = toTrimmedString(form.textVerbosity);
-	const serviceTier = toTrimmedString(form.serviceTier);
-	const reasoningSummary = toTrimmedString(form.reasoningSummary);
-	const user = toTrimmedString(form.user);
-
-	return {
-		...(reasoningEffort ? { reasoning_effort: reasoningEffort } : {}),
-		...(parallelToolCalls !== undefined
-			? { parallel_tool_calls: parallelToolCalls }
-			: {}),
-		...(textVerbosity ? { text_verbosity: textVerbosity } : {}),
-		...(serviceTier ? { service_tier: serviceTier } : {}),
-		...(reasoningSummary ? { reasoning_summary: reasoningSummary } : {}),
-		...(user ? { user } : {}),
-	};
-}
-
-/**
- * Build Anthropic/Bedrock provider options from form state.
- * Validation has already passed; uses transform helpers only.
- */
-function buildAnthropicOptions(
-	form: AnthropicFormState,
-): Record<string, unknown> {
-	const effort = toTrimmedString(form.effort);
-	const budgetTokens = toInt(form.thinkingBudgetTokens);
-	const sendReasoning = toBool(form.sendReasoning);
-	const disableParallelToolUse = toBool(form.disableParallelToolUse);
-
-	return {
-		...(effort ? { effort } : {}),
-		...(budgetTokens !== undefined
-			? { thinking: { budget_tokens: budgetTokens } }
-			: {}),
-		...(sendReasoning !== undefined ? { send_reasoning: sendReasoning } : {}),
-		...(disableParallelToolUse !== undefined
-			? { disable_parallel_tool_use: disableParallelToolUse }
-			: {}),
-	};
-}
-
-/**
- * Build Google provider options from form state.
- * Validation has already passed; uses transform helpers only.
- */
-function buildGoogleOptions(form: GoogleFormState): Record<string, unknown> {
-	const thinkingBudget = toInt(form.thinkingBudget);
-	const includeThoughts = toBool(form.includeThoughts);
-	const cachedContent = toTrimmedString(form.cachedContent);
-	const safetySettings = toJSON(form.safetySettingsJSON) as
-		| unknown[]
-		| undefined;
-
-	return {
-		...(thinkingBudget !== undefined || includeThoughts !== undefined
-			? {
-					thinking_config: {
-						...(thinkingBudget !== undefined
-							? { thinking_budget: thinkingBudget }
-							: {}),
-						...(includeThoughts !== undefined
-							? { include_thoughts: includeThoughts }
-							: {}),
-					},
-				}
-			: {}),
-		...(cachedContent ? { cached_content: cachedContent } : {}),
-		...(safetySettings ? { safety_settings: safetySettings } : {}),
-	};
-}
-
-/**
- * Build OpenAI-compatible provider options from form state.
- * Validation has already passed; uses transform helpers only.
- */
-function buildOpenAICompatOptions(
-	form: OpenAICompatFormState,
-): Record<string, unknown> {
-	const reasoningEffort = toTrimmedString(form.reasoningEffort);
-	const user = toTrimmedString(form.user);
-
-	return {
-		...(reasoningEffort ? { reasoning_effort: reasoningEffort } : {}),
-		...(user ? { user } : {}),
-	};
-}
-
-/**
- * Shared builder for OpenRouter/Vercel provider options. Both
- * providers use an identical reasoning + parallel_tool_calls + user
- * structure. Validation has already passed.
- */
-function buildReasoningProviderOptions(form: {
-	reasoningEnabled: string;
-	reasoningEffort: string;
-	reasoningMaxTokens: string;
-	reasoningExclude: string;
-	parallelToolCalls: string;
-	user: string;
-}): Record<string, unknown> {
-	const reasoningEnabled = toBool(form.reasoningEnabled);
-	const reasoningEffort = toTrimmedString(form.reasoningEffort);
-	const reasoningMaxTokens = toInt(form.reasoningMaxTokens);
-	const reasoningExclude = toBool(form.reasoningExclude);
-	const parallelToolCalls = toBool(form.parallelToolCalls);
-	const user = toTrimmedString(form.user);
-
-	const reasoning: Record<string, unknown> = {
-		...(reasoningEnabled !== undefined ? { enabled: reasoningEnabled } : {}),
-		...(reasoningEffort ? { effort: reasoningEffort } : {}),
-		...(reasoningMaxTokens !== undefined
-			? { max_tokens: reasoningMaxTokens }
-			: {}),
-		...(reasoningExclude !== undefined ? { exclude: reasoningExclude } : {}),
-	};
-
-	return {
-		...(hasObjectKeys(reasoning) ? { reasoning } : {}),
-		...(parallelToolCalls !== undefined
-			? { parallel_tool_calls: parallelToolCalls }
-			: {}),
-		...(user ? { user } : {}),
-	};
-}
-
-// ── Form → model config builder ──────────────────────────────
+// ── Form → model config builder ────────────────────────────────
 
 export const buildModelConfigFromForm = (
 	provider: string | null | undefined,
@@ -596,146 +443,73 @@ export const buildModelConfigFromForm = (
 ): ModelConfigFormBuildResult => {
 	const fieldErrors: FieldErrors = {};
 
-	// Validate top-level fields.
-	collectYupErrors(topLevelSchema, form, fieldErrors);
+	// Validate general (top-level) fields.
+	collectYupErrors(
+		generalFieldsSchema,
+		form as Record<string, unknown>,
+		fieldErrors,
+	);
+
+	// Resolve the canonical provider name through the alias table.
+	const resolved = resolveProvider((provider ?? "").trim().toLowerCase());
 
 	// Validate provider-specific fields.
-	const normalizedProvider = normalizeProvider(provider ?? "");
-
-	switch (normalizedProvider) {
-		case "openai":
-		case "azure":
-			collectYupErrors(openaiSchema, form.openai, fieldErrors, "openai");
-			break;
-		case "anthropic":
-		case "bedrock":
-			collectYupErrors(
-				anthropicSchema,
-				form.anthropic,
-				fieldErrors,
-				"anthropic",
-			);
-			break;
-		case "google":
-			collectYupErrors(googleSchema, form.google, fieldErrors, "google");
-			break;
-		case "openaicompat":
-			collectYupErrors(
-				openaiCompatSchema,
-				form.openaicompat,
-				fieldErrors,
-				"openaicompat",
-			);
-			break;
-		case "openrouter":
-			collectYupErrors(
-				reasoningProviderSchema,
-				form.openrouter,
-				fieldErrors,
-				"openrouter",
-			);
-			collectYupErrors(
-				openrouterExtraSchema,
-				form.openrouter,
-				fieldErrors,
-				"openrouter",
-			);
-			break;
-		case "vercel":
-			collectYupErrors(
-				reasoningProviderSchema,
-				form.vercel,
-				fieldErrors,
-				"vercel",
-			);
-			break;
+	const providerFormState = form[resolved];
+	if (providerFormState && typeof providerFormState === "object") {
+		collectYupErrors(
+			getProviderYupSchema(resolved),
+			providerFormState as Record<string, unknown>,
+			fieldErrors,
+			resolved,
+		);
 	}
 
 	if (Object.keys(fieldErrors).length > 0) {
 		return { fieldErrors };
 	}
 
-	// Transform top-level fields.
-	const maxOutputTokens = toInt(form.maxOutputTokens);
-	const temperature = toNum(form.temperature);
-	const topP = toNum(form.topP);
-	const topK = toInt(form.topK);
-	const presencePenalty = toNum(form.presencePenalty);
-	const frequencyPenalty = toNum(form.frequencyPenalty);
+	// ── Transform general fields ──────────────────────────────
+	const modelConfig: Record<string, unknown> = {};
 
-	// Build provider-specific options.
-	let providerOptions: TypesGen.ChatModelProviderOptions | undefined;
-
-	switch (normalizedProvider) {
-		case "openai":
-		case "azure": {
-			const opts = buildOpenAIOptions(form.openai);
-			if (hasObjectKeys(opts)) {
-				providerOptions = { openai: opts };
-			}
-			break;
-		}
-		case "anthropic":
-		case "bedrock": {
-			const opts = buildAnthropicOptions(form.anthropic);
-			if (hasObjectKeys(opts)) {
-				providerOptions = { anthropic: opts };
-			}
-			break;
-		}
-		case "google": {
-			const opts = buildGoogleOptions(form.google);
-			if (hasObjectKeys(opts)) {
-				providerOptions = { google: opts };
-			}
-			break;
-		}
-		case "openaicompat": {
-			const opts = buildOpenAICompatOptions(form.openaicompat);
-			if (hasObjectKeys(opts)) {
-				providerOptions = { openaicompat: opts };
-			}
-			break;
-		}
-		case "openrouter": {
-			const opts = buildReasoningProviderOptions(form.openrouter);
-			const includeUsage = toBool(form.openrouter.includeUsage);
-			if (includeUsage !== undefined) {
-				opts.include_usage = includeUsage;
-			}
-			if (hasObjectKeys(opts)) {
-				providerOptions = { openrouter: opts };
-			}
-			break;
-		}
-		case "vercel": {
-			const opts = buildReasoningProviderOptions(form.vercel);
-			if (hasObjectKeys(opts)) {
-				providerOptions = { vercel: opts };
-			}
-			break;
+	for (const field of getGeneralFields()) {
+		const formValue = form[snakeToCamel(field.json_name)];
+		if (typeof formValue !== "string") continue;
+		const converted = convertFormValue(formValue, field);
+		if (converted !== undefined) {
+			modelConfig[field.json_name] = converted;
 		}
 	}
 
-	const modelConfig: TypesGen.ChatModelCallConfig = {
-		...(maxOutputTokens !== undefined
-			? { max_output_tokens: maxOutputTokens }
-			: {}),
-		...(temperature !== undefined ? { temperature } : {}),
-		...(topP !== undefined ? { top_p: topP } : {}),
-		...(topK !== undefined ? { top_k: topK } : {}),
-		...(presencePenalty !== undefined
-			? { presence_penalty: presencePenalty }
-			: {}),
-		...(frequencyPenalty !== undefined
-			? { frequency_penalty: frequencyPenalty }
-			: {}),
-		...(providerOptions ? { provider_options: providerOptions } : {}),
-	};
+	// ── Transform provider-specific fields ────────────────────
+	if (providerFormState && typeof providerFormState === "object") {
+		const providerPayload: Record<string, unknown> = {};
 
-	if (!hasObjectKeys(modelConfig as Record<string, unknown>)) {
+		for (const field of getProviderFields(resolved)) {
+			// Read the form value from the nested camelCase structure.
+			const camelSegments = field.json_name.split(".").map(snakeToCamel);
+			const formValue = deepGet(providerFormState, camelSegments);
+
+			if (typeof formValue !== "string") continue;
+			const converted = convertFormValue(formValue, field);
+			if (converted === undefined) continue;
+
+			// Write into the API payload using the snake_case
+			// json_name segments.
+			const snakeSegments = field.json_name.split(".");
+			deepSet(providerPayload, snakeSegments, converted);
+		}
+
+		if (hasObjectKeys(providerPayload)) {
+			modelConfig.provider_options = { [resolved]: providerPayload };
+		}
+	}
+
+	if (!hasObjectKeys(modelConfig)) {
 		return { fieldErrors: {} };
 	}
 
-	return { modelConfig, fieldErrors: {} };
+	return {
+		modelConfig: modelConfig as TypesGen.ChatModelCallConfig,
+		fieldErrors: {},
+	};
 };