fix: add Azure config fields to Add API Key modal

The Add modal was missing the Azure-specific fields (endpoint, deployment,
API version, organization) — only the Edit modal had them.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
kundeng
2026-04-20 01:15:53 -04:00
parent 6ac3f4a97a
commit a66a04daab

View File

@@ -7,12 +7,20 @@ import { Button, Badge, Input, Modal, Select } from "@/shared/components";
export default function AddApiKeyModal({ isOpen, provider, providerName, isCompatible, isAnthropic, proxyPools, onSave, onClose }) {
const NONE_PROXY_POOL_VALUE = "__none__";
const isAzure = provider === "azure";
const [formData, setFormData] = useState({
name: "",
apiKey: "",
priority: 1,
proxyPoolId: NONE_PROXY_POOL_VALUE,
});
const [azureData, setAzureData] = useState({
azureEndpoint: "",
apiVersion: "2024-10-01-preview",
deployment: "",
organization: "",
});
const [validating, setValidating] = useState(false);
const [validationResult, setValidationResult] = useState(null);
const [saving, setSaving] = useState(false);
@@ -63,7 +71,12 @@ export default function AddApiKeyModal({ isOpen, provider, providerName, isCompa
priority: formData.priority,
proxyPoolId: formData.proxyPoolId === NONE_PROXY_POOL_VALUE ? null : formData.proxyPoolId,
testStatus: isValid ? "active" : "unknown",
providerSpecificData: undefined
providerSpecificData: isAzure ? {
azureEndpoint: azureData.azureEndpoint,
apiVersion: azureData.apiVersion,
deployment: azureData.deployment,
organization: azureData.organization,
} : undefined
});
} finally {
setSaving(false);
@@ -108,6 +121,38 @@ export default function AddApiKeyModal({ isOpen, provider, providerName, isCompa
}
</p>
)}
{isAzure && (
<div className="bg-sidebar/50 p-4 rounded-lg border border-accent/20">
<h3 className="font-semibold mb-3 text-sm">Azure OpenAI Configuration</h3>
<div className="flex flex-col gap-3">
<Input
label="Azure Endpoint"
value={azureData.azureEndpoint}
onChange={(e) => setAzureData({ ...azureData, azureEndpoint: e.target.value })}
placeholder="https://your-resource.openai.azure.com"
/>
<Input
label="Deployment Name"
value={azureData.deployment}
onChange={(e) => setAzureData({ ...azureData, deployment: e.target.value })}
placeholder="gpt-4"
/>
<Input
label="API Version"
value={azureData.apiVersion}
onChange={(e) => setAzureData({ ...azureData, apiVersion: e.target.value })}
placeholder="2024-10-01-preview"
/>
<Input
label="Organization (Optional)"
value={azureData.organization}
onChange={(e) => setAzureData({ ...azureData, organization: e.target.value })}
placeholder="Organization ID"
/>
</div>
</div>
)}
<Input
label="Priority"
type="number"
@@ -137,7 +182,7 @@ export default function AddApiKeyModal({ isOpen, provider, providerName, isCompa
</p>
<div className="flex gap-2">
<Button onClick={handleSubmit} fullWidth disabled={!formData.name || !formData.apiKey || saving}>
<Button onClick={handleSubmit} fullWidth disabled={!formData.name || !formData.apiKey || (isAzure && (!azureData.azureEndpoint || !azureData.deployment)) || saving}>
{saving ? "Saving..." : "Save"}
</Button>
<Button onClick={onClose} variant="ghost" fullWidth>