From a7b0c3b22699a596b8efced9c4c590eb7562716d Mon Sep 17 00:00:00 2001
From: Roland Tannous <115670425+rolandtannous@users.noreply.github.com>
Date: Tue, 5 May 2026 21:46:50 +0400
Subject: [PATCH] Update chat-providers-dialog.tsx

---
 .../src/features/chat/chat-providers-dialog.tsx       | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/studio/frontend/src/features/chat/chat-providers-dialog.tsx b/studio/frontend/src/features/chat/chat-providers-dialog.tsx
index 8ea13d9868..90f6b276e7 100644
--- a/studio/frontend/src/features/chat/chat-providers-dialog.tsx
+++ b/studio/frontend/src/features/chat/chat-providers-dialog.tsx
@@ -30,7 +30,7 @@ import {
 } from "@hugeicons/core-free-icons";
 import { HugeiconsIcon } from "@hugeicons/react";
 import { AnimatePresence, motion, useReducedMotion } from "motion/react";
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 import { toast } from "sonner";
 import {
   createProviderConfig,
@@ -138,6 +138,7 @@ export function ChatProvidersDialog({
   const [mutatingProvider, setMutatingProvider] = useState(false);
   const [manualModelIds, setManualModelIds] = useState("");
   const [customProviderName, setCustomProviderName] = useState("Custom");
+  const providersRef = useRef(providers);
   const reduceMotion = useReducedMotion();
   const isCustomProvider = providerType === CUSTOM_PROVIDER_TYPE;
 
@@ -177,6 +178,10 @@ export function ChatProvidersDialog({
     [providers],
   );
 
+  useEffect(() => {
+    providersRef.current = providers;
+  }, [providers]);
+
   useEffect(() => {
     if (!open) return;
     let isMounted = true;
@@ -196,7 +201,9 @@ export function ChatProvidersDialog({
           }
           return registryRows[0]?.provider_type ?? "";
         });
-        const existingById = new Map(providers.map((provider) => [provider.id, provider]));
+        const existingById = new Map(
+          providersRef.current.map((provider) => [provider.id, provider]),
+        );
         const syncedProviders: ExternalProviderConfig[] = configRows
           .filter((config) => config.is_enabled)
           .map((config) => {