fix(secrets): eliminate slow save by parallelizing DB ops and fixing stuck button

Sequential per-variable, per-workspace DB round-trips in syncPersonalEnvCredentialsForUser caused O(W×K) latency (800–1600ms for 10 workspaces). Replaced with parallel workspace processing and batched upserts. Also parallelized secret decryption in the GET handler.

On the client, removed the changeToken bug that left the Save button permanently disabled after a failed save, split the shared hasSavedRef into two independent flags to eliminate ordering races, and moved ref updates to after mutation success so optimistic state can never get stuck.

Author: waleedlatif1

apps/sim/app/api/environment/route.ts

@@ -120,17 +120,22 @@ export const GET = withRouteHandler(async (request: Request) => {
     }
 
     const encryptedVariables = result[0].variables as Record<string, string>
-    const decryptedVariables: Record<string, EnvironmentVariable> = {}
-
-    for (const [key, encryptedValue] of Object.entries(encryptedVariables)) {
-      try {
-        const { decrypted } = await decryptSecret(encryptedValue)
-        decryptedVariables[key] = { key, value: decrypted }
-      } catch (error) {
-        logger.error(`[${requestId}] Error decrypting variable ${key}`, error)
-        decryptedVariables[key] = { key, value: '' }
-      }
-    }
+
+    const decryptedEntries = await Promise.all(
+      Object.entries(encryptedVariables).map(async ([key, encryptedValue]) => {
+        try {
+          const { decrypted } = await decryptSecret(encryptedValue)
+          return [key, { key, value: decrypted }] as const
+        } catch (error) {
+          logger.error(`[${requestId}] Error decrypting variable ${key}`, error)
+          return [key, { key, value: '' }] as const
+        }
+      })
+    )
+    const decryptedVariables = Object.fromEntries(decryptedEntries) as Record<
+      string,
+      EnvironmentVariable
+    >
 
     return NextResponse.json({ data: decryptedVariables }, { status: 200 })
   } catch (error: any) {

apps/sim/app/workspace/[workspaceId]/settings/components/credentials/credentials-manager.tsx

@@ -413,8 +413,6 @@ export function CredentialsManager() {
   const [workspaceVars, setWorkspaceVars] = useState<Record<string, string>>({})
   const [renamingKey, setRenamingKey] = useState<string | null>(null)
   const [pendingKeyValue, setPendingKeyValue] = useState<string>('')
-  const [changeToken, setChangeToken] = useState(0)
-
   const [selectedCredentialId, setSelectedCredentialId] = useState<string | null>(null)
   const [prevSelectedCredentialId, setPrevSelectedCredentialId] = useState<
     string | null | undefined
@@ -431,7 +429,8 @@ export function CredentialsManager() {
   const scrollContainerRef = useRef<HTMLDivElement>(null)
   const initialVarsRef = useRef<UIEnvironmentVariable[]>([])
   const hasChangesRef = useRef(false)
-  const hasSavedRef = useRef(false)
+  const hasSavedPersonalRef = useRef(false)
+  const hasSavedWorkspaceRef = useRef(false)
   const shouldBlockNavRef = useRef(false)
   const pendingNavigationUrlRef = useRef<string | null>(null)
 
@@ -558,7 +557,7 @@ export function CredentialsManager() {
     if (newWorkspaceRows.some((row) => row.key && row.value)) return true
 
     return false
-  }, [envVars, workspaceVars, newWorkspaceRows, changeToken])
+  }, [envVars, workspaceVars, newWorkspaceRows])
 
   const hasConflicts = useMemo(() => {
     return envVars.some((envVar) => !!envVar.key && allWorkspaceKeys.has(envVar.key))
@@ -588,7 +587,10 @@ export function CredentialsManager() {
   useEffect(() => () => resetNavGuard(), [resetNavGuard])
 
   useEffect(() => {
-    if (hasSavedRef.current) return
+    if (hasSavedPersonalRef.current) {
+      hasSavedPersonalRef.current = false
+      return
+    }
 
     const existingVars = Object.values(personalEnvData || {})
     const initialVars = [
@@ -604,12 +606,12 @@ export function CredentialsManager() {
 
   useEffect(() => {
     if (!workspaceEnvData) return
-    if (hasSavedRef.current) {
-      hasSavedRef.current = false
-    } else {
-      setWorkspaceVars(workspaceEnvData.workspace || {})
-      initialWorkspaceVarsRef.current = workspaceEnvData.workspace || {}
+    if (hasSavedWorkspaceRef.current) {
+      hasSavedWorkspaceRef.current = false
+      return
     }
+    setWorkspaceVars(workspaceEnvData.workspace || {})
+    initialWorkspaceVarsRef.current = workspaceEnvData.workspace || {}
   }, [workspaceEnvData])
 
   const scrollToBottom = useCallback(() => {
@@ -967,86 +969,86 @@ export function CredentialsManager() {
   const handleSave = async () => {
     if (isListSaving) return
 
-    const prevInitialVars = [...initialVarsRef.current]
-    const prevInitialWorkspaceVars = { ...initialWorkspaceVarsRef.current }
     const mutations: Promise<unknown>[] = []
 
-    try {
-      setShowUnsavedChanges(false)
-      hasSavedRef.current = true
-
-      const mergedWorkspaceVars = { ...workspaceVars }
-      for (const row of newWorkspaceRows) {
-        if (row.key && row.value) {
-          mergedWorkspaceVars[row.key] = row.value
-        }
+    setShowUnsavedChanges(false)
+
+    const mergedWorkspaceVars = { ...workspaceVars }
+    for (const row of newWorkspaceRows) {
+      if (row.key && row.value) {
+        mergedWorkspaceVars[row.key] = row.value
       }
+    }
 
-      initialWorkspaceVarsRef.current = { ...mergedWorkspaceVars }
-      initialVarsRef.current = JSON.parse(JSON.stringify(envVars.filter((v) => v.key && v.value)))
+    const validVariables = envVars
+      .filter((v) => v.key && v.value)
+      .reduce<Record<string, string>>((acc, { key, value }) => ({ ...acc, [key]: value }), {})
 
-      setChangeToken((prev) => prev + 1)
+    const before = initialWorkspaceVarsRef.current
+    const after = mergedWorkspaceVars
+    const toUpsert: Record<string, string> = {}
+    const toDelete: string[] = []
 
-      const validVariables = envVars
-        .filter((v) => v.key && v.value)
-        .reduce<Record<string, string>>((acc, { key, value }) => ({ ...acc, [key]: value }), {})
+    for (const [k, v] of Object.entries(after)) {
+      if (!(k in before) || before[k] !== v) {
+        toUpsert[k] = v
+      }
+    }
 
-      const before = prevInitialWorkspaceVars
-      const after = mergedWorkspaceVars
-      const toUpsert: Record<string, string> = {}
-      const toDelete: string[] = []
+    for (const k of Object.keys(before)) {
+      if (!(k in after)) toDelete.push(k)
+    }
 
-      for (const [k, v] of Object.entries(after)) {
-        if (!(k in before) || before[k] !== v) {
-          toUpsert[k] = v
-        }
+    const personalChanged = (() => {
+      const initialMap = new Map(
+        initialVarsRef.current.filter((v) => v.key && v.value).map((v) => [v.key, v.value])
+      )
+      const currentKeys = Object.keys(validVariables)
+      if (initialMap.size !== currentKeys.length) return true
+      for (const [key, value] of Object.entries(validVariables)) {
+        if (initialMap.get(key) !== value) return true
       }
+      return false
+    })()
 
-      for (const k of Object.keys(before)) {
-        if (!(k in after)) toDelete.push(k)
-      }
+    const workspaceChanged =
+      workspaceId && (Object.keys(toUpsert).length > 0 || toDelete.length > 0)
 
-      const personalChanged = (() => {
-        const initialMap = new Map(
-          prevInitialVars.filter((v) => v.key && v.value).map((v) => [v.key, v.value])
-        )
-        const currentKeys = Object.keys(validVariables)
-        if (initialMap.size !== currentKeys.length) return true
-        for (const [key, value] of Object.entries(validVariables)) {
-          if (initialMap.get(key) !== value) return true
-        }
-        return false
-      })()
-
-      if (personalChanged) {
-        mutations.push(savePersonalMutation.mutateAsync({ variables: validVariables }))
-      }
-      if (workspaceId && (Object.keys(toUpsert).length || toDelete.length)) {
-        mutations.push(
-          (async () => {
-            if (Object.keys(toUpsert).length) {
-              await upsertWorkspaceMutation.mutateAsync({ workspaceId, variables: toUpsert })
-            }
-            if (toDelete.length) {
-              await removeWorkspaceMutation.mutateAsync({ workspaceId, keys: toDelete })
-            }
-          })()
-        )
-      }
+    if (personalChanged) {
+      mutations.push(savePersonalMutation.mutateAsync({ variables: validVariables }))
+    }
+    if (workspaceChanged) {
+      mutations.push(
+        (async () => {
+          if (Object.keys(toUpsert).length) {
+            await upsertWorkspaceMutation.mutateAsync({ workspaceId, variables: toUpsert })
+          }
+          if (toDelete.length) {
+            await removeWorkspaceMutation.mutateAsync({ workspaceId, keys: toDelete })
+          }
+        })()
+      )
+    }
+
+    hasSavedPersonalRef.current = personalChanged
+    hasSavedWorkspaceRef.current = Boolean(workspaceChanged)
 
+    try {
       const results = await Promise.allSettled(mutations)
       const firstFailure = results.find((r): r is PromiseRejectedResult => r.status === 'rejected')
       if (firstFailure) throw firstFailure.reason
 
+      initialWorkspaceVarsRef.current = { ...mergedWorkspaceVars }
+      initialVarsRef.current = JSON.parse(JSON.stringify(envVars.filter((v) => v.key && v.value)))
+
       setWorkspaceVars(mergedWorkspaceVars)
       setNewWorkspaceRows([createEmptyEnvVar()])
       if (mutations.length > 0) {
         toast.success('Secrets saved')
       }
     } catch (error) {
-      hasSavedRef.current = false
-      initialVarsRef.current = prevInitialVars
-      initialWorkspaceVarsRef.current = prevInitialWorkspaceVars
+      hasSavedPersonalRef.current = false
+      hasSavedWorkspaceRef.current = false
       logger.error('Failed to save environment variables:', error)
       toast.error('Failed to save secrets')
     } finally {