From abb4a0143e7e5696edc0afeead17fe18019e0358 Mon Sep 17 00:00:00 2001
From: Saoud Rizwan <7799382+saoudrizwan@users.noreply.github.com>
Date: Fri, 20 Sep 2024 10:56:26 -0400
Subject: [PATCH] Add Azure API version option

---
 src/api/openai.ts                        |  3 ++-
 src/providers/ClaudeDevProvider.ts       |  6 ++++++
 src/shared/api.ts                        |  1 +
 webview-ui/src/components/ApiOptions.tsx | 24 +++++++++++++++++++++++-
 4 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/api/openai.ts b/src/api/openai.ts
index 82584d90be..ce4a3ba8ea 100644
--- a/src/api/openai.ts
+++ b/src/api/openai.ts
@@ -17,7 +17,8 @@ export class OpenAiHandler implements ApiHandler {
 				apiKey: this.options.openAiApiKey,
 				// https://learn.microsoft.com/en-us/azure/ai-services/openai/api-version-deprecation
 				// https://learn.microsoft.com/en-us/azure/ai-services/openai/reference#api-specs
-				apiVersion: "2024-08-01-preview",
+				// (make sure to update API options placeholder)
+				apiVersion: this.options.azureApiVersion || "2024-08-01-preview",
 			})
 		} else {
 			this.client = new OpenAI({
diff --git a/src/providers/ClaudeDevProvider.ts b/src/providers/ClaudeDevProvider.ts
index b710bf0ea1..433567917e 100644
--- a/src/providers/ClaudeDevProvider.ts
+++ b/src/providers/ClaudeDevProvider.ts
@@ -44,6 +44,7 @@ type GlobalStateKey =
 	| "ollamaModelId"
 	| "ollamaBaseUrl"
 	| "anthropicBaseUrl"
+	| "azureApiVersion"
 
 export class ClaudeDevProvider implements vscode.WebviewViewProvider {
 	public static readonly sideBarId = "claude-dev.SidebarProvider" // used in package.json as the view's id. This value cannot be changed due to how vscode caches views based on their id, and updating the id would break existing instances of the extension.
@@ -346,6 +347,7 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider {
 								anthropicBaseUrl,
 								geminiApiKey,
 								openAiNativeApiKey,
+								azureApiVersion,
 							} = message.apiConfiguration
 							await this.updateGlobalState("apiProvider", apiProvider)
 							await this.updateGlobalState("apiModelId", apiModelId)
@@ -365,6 +367,7 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider {
 							await this.updateGlobalState("anthropicBaseUrl", anthropicBaseUrl)
 							await this.storeSecret("geminiApiKey", geminiApiKey)
 							await this.storeSecret("openAiNativeApiKey", openAiNativeApiKey)
+							await this.updateGlobalState("azureApiVersion", azureApiVersion)
 							this.claudeDev?.updateApi(message.apiConfiguration)
 						}
 						await this.postStateToWebview()
@@ -691,6 +694,7 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider {
 			anthropicBaseUrl,
 			geminiApiKey,
 			openAiNativeApiKey,
+			azureApiVersion,
 			lastShownAnnouncementId,
 			customInstructions,
 			alwaysAllowReadOnly,
@@ -714,6 +718,7 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider {
 			this.getGlobalState("anthropicBaseUrl") as Promise<string | undefined>,
 			this.getSecret("geminiApiKey") as Promise<string | undefined>,
 			this.getSecret("openAiNativeApiKey") as Promise<string | undefined>,
+			this.getGlobalState("azureApiVersion") as Promise<string | undefined>,
 			this.getGlobalState("lastShownAnnouncementId") as Promise<string | undefined>,
 			this.getGlobalState("customInstructions") as Promise<string | undefined>,
 			this.getGlobalState("alwaysAllowReadOnly") as Promise<boolean | undefined>,
@@ -754,6 +759,7 @@ export class ClaudeDevProvider implements vscode.WebviewViewProvider {
 				anthropicBaseUrl,
 				geminiApiKey,
 				openAiNativeApiKey,
+				azureApiVersion,
 			},
 			lastShownAnnouncementId,
 			customInstructions,
diff --git a/src/shared/api.ts b/src/shared/api.ts
index 03c09083f1..94e3120a29 100644
--- a/src/shared/api.ts
+++ b/src/shared/api.ts
@@ -26,6 +26,7 @@ export interface ApiHandlerOptions {
 	ollamaBaseUrl?: string
 	geminiApiKey?: string
 	openAiNativeApiKey?: string
+	azureApiVersion?: string
 }
 
 export type ApiConfiguration = ApiHandlerOptions & {
diff --git a/webview-ui/src/components/ApiOptions.tsx b/webview-ui/src/components/ApiOptions.tsx
index 7cc1510b0c..dcc9b21bb2 100644
--- a/webview-ui/src/components/ApiOptions.tsx
+++ b/webview-ui/src/components/ApiOptions.tsx
@@ -40,6 +40,7 @@ const ApiOptions = ({ showModelOptions, apiErrorMessage }: ApiOptionsProps) => {
 	const { apiConfiguration, setApiConfiguration, uriScheme } = useExtensionState()
 	const [ollamaModels, setOllamaModels] = useState<string[]>([])
 	const [anthropicBaseUrlSelected, setAnthropicBaseUrlSelected] = useState(!!apiConfiguration?.anthropicBaseUrl)
+	const [azureApiVersionSelected, setAzureApiVersionSelected] = useState(!!apiConfiguration?.azureApiVersion)
 
 	const handleInputChange = (field: keyof ApiConfiguration) => (event: any) => {
 		setApiConfiguration({ ...apiConfiguration, [field]: event.target.value })
@@ -414,10 +415,31 @@ const ApiOptions = ({ showModelOptions, apiErrorMessage }: ApiOptionsProps) => {
 						placeholder={"Enter Model ID..."}>
 						<span style={{ fontWeight: 500 }}>Model ID</span>
 					</VSCodeTextField>
+					<div style={{ marginTop: 2 }}>
+						<VSCodeCheckbox
+							checked={azureApiVersionSelected}
+							onChange={(e: any) => {
+								const isChecked = e.target.checked === true
+								setAzureApiVersionSelected(isChecked)
+								if (!isChecked) {
+									setApiConfiguration({ ...apiConfiguration, azureApiVersion: "" })
+								}
+							}}>
+							Set Azure API version
+						</VSCodeCheckbox>
+					</div>
+					{azureApiVersionSelected && (
+						<VSCodeTextField
+							value={apiConfiguration?.azureApiVersion || ""}
+							style={{ width: "100%", marginTop: 3 }}
+							onInput={handleInputChange("azureApiVersion")}
+							placeholder="Default: 2024-08-01-preview"
+						/>
+					)}
 					<p
 						style={{
 							fontSize: "12px",
-							marginTop: "5px",
+							marginTop: 3,
 							color: "var(--vscode-descriptionForeground)",
 						}}>
 						You can use any OpenAI compatible API with models that support tool use.{" "}