diff --git a/webview-ui/src/components/settings/ApiOptions.tsx b/webview-ui/src/components/settings/ApiOptions.tsx
index 8e6fe42..cad94a8 100644
--- a/webview-ui/src/components/settings/ApiOptions.tsx
+++ b/webview-ui/src/components/settings/ApiOptions.tsx
@@ -56,7 +56,7 @@ const ApiOptions = ({ apiErrorMessage, modelIdErrorMessage }: ApiOptionsProps) =
 	const handleInputChange = (field: keyof ApiConfiguration) => (event: any) => {
 		const apiConfig = { ...apiConfiguration, [field]: event.target.value }
 		onUpdateApiConfig(apiConfig)
-		setApiConfiguration(apiConfig)
+		// setApiConfiguration(apiConfig)
 	}
 
 	const { selectedProvider, selectedModelId, selectedModelInfo } = useMemo(() => {
diff --git a/webview-ui/src/context/ExtensionStateContext.tsx b/webview-ui/src/context/ExtensionStateContext.tsx
index f98abc4..868bc97 100644
--- a/webview-ui/src/context/ExtensionStateContext.tsx
+++ b/webview-ui/src/context/ExtensionStateContext.tsx
@@ -112,19 +112,19 @@ export const ExtensionStateContextProvider: React.FC<{ children: React.ReactNode
 
 	const setListApiConfigMeta = useCallback(
 		(value: ApiConfigMeta[]) => setState((prevState) => ({ ...prevState, listApiConfigMeta: value })),
-		[setState],
+		[],
 	)
 
-	const onUpdateApiConfig = useCallback(
-		(apiConfig: ApiConfiguration) => {
+	const onUpdateApiConfig = useCallback((apiConfig: ApiConfiguration) => {
+		setState((currentState) => {
 			vscode.postMessage({
 				type: "upsertApiConfiguration",
-				text: state.currentApiConfigName,
+				text: currentState.currentApiConfigName, // Access latest state
 				apiConfiguration: apiConfig,
 			})
-		},
-		[state],
-	)
+			return currentState // No state update needed
+		})
+	}, [])
 
 	const handleMessage = useCallback(
 		(event: MessageEvent) => {