From 5eafbf9e515010d49a9d349eaf89972d2d55bb4f Mon Sep 17 00:00:00 2001
From: Ludy <Ludy87@users.noreply.github.com>
Date: Sat, 20 Dec 2025 23:08:35 +0100
Subject: [PATCH] Sync provider settings with settings.yml in config UI (#5270)

# Description of Changes

This pull request improves the handling of provider settings in the
`ProviderCard` component to ensure settings are always in sync with the
latest values from `settings.yml`, and enhances how default values are
initialized for provider fields. It also updates the usage of
`ProviderCard` in the admin connections section to explicitly pass
provider settings.

**Provider settings synchronization and initialization:**

* Added a `useEffect` in `ProviderCard` to keep `localSettings` in sync
with incoming `settings` prop, ensuring that changes from `settings.yml`
are reflected in the UI.
* Improved default value initialization in `ProviderCard`: when opening
an unconfigured provider, it now merges defaults with any existing
values from `settings.yml`, rather than overwriting them.

**Integration with AdminConnectionsSection:**

* Updated `AdminConnectionsSection` to explicitly pass provider settings
to `ProviderCard` via the `settings` prop, ensuring the component always
receives the correct configuration.

---

## Checklist

### General

- [ ] I have read the [Contribution
Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md)
- [ ] I have read the [Stirling-PDF Developer
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md)
(if applicable)
- [ ] I have read the [How to add new languages to
Stirling-PDF](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md)
(if applicable)
- [ ] I have performed a self-review of my own code
- [ ] My changes generate no new warnings

### Documentation

- [ ] I have updated relevant docs on [Stirling-PDF's doc
repo](https://github.com/Stirling-Tools/Stirling-Tools.github.io/blob/main/docs/)
(if functionality has heavily changed)
- [ ] I have read the section [Add New Translation
Tags](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md#add-new-translation-tags)
(for new translation tags only)

### UI Changes (if applicable)

- [ ] Screenshots or videos demonstrating the UI changes are attached
(e.g., as comments or direct attachments in the PR)

### Testing (if applicable)

- [ ] I have tested my changes locally. Refer to the [Testing
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md#6-testing)
for more details.
---
 .../shared/config/configSections/ProviderCard.tsx  | 14 +++++++++++---
 .../configSections/AdminConnectionsSection.tsx     |  1 +
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/frontend/src/core/components/shared/config/configSections/ProviderCard.tsx b/frontend/src/core/components/shared/config/configSections/ProviderCard.tsx
index 3d07338ac..15eaadb41 100644
--- a/frontend/src/core/components/shared/config/configSections/ProviderCard.tsx
+++ b/frontend/src/core/components/shared/config/configSections/ProviderCard.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { Paper, Group, Text, Button, Collapse, Stack, TextInput, Textarea, Switch, PasswordInput } from '@mantine/core';
 import { useTranslation } from 'react-i18next';
 import LocalIcon from '@app/components/shared/LocalIcon';
@@ -25,14 +25,22 @@ export default function ProviderCard({
   const [expanded, setExpanded] = useState(false);
   const [localSettings, setLocalSettings] = useState<Record<string, any>>(settings);
 
+  // Keep local settings in sync with incoming settings (values loaded from settings.yml)
+  useEffect(() => {
+    if (!expanded) {
+      setLocalSettings(settings);
+    }
+  }, [settings, expanded]);
+
   // Initialize local settings with defaults when opening an unconfigured provider
   const handleConnectToggle = () => {
     if (!isConfigured && !expanded) {
       // First time opening an unconfigured provider - initialize with defaults
-      const defaultSettings: Record<string, any> = {};
+      // while preserving any values already present (from settings.yml)
+      const defaultSettings: Record<string, any> = { ...settings };
       provider.fields.forEach((field) => {
         if (field.defaultValue !== undefined) {
-          defaultSettings[field.key] = field.defaultValue;
+          defaultSettings[field.key] = defaultSettings[field.key] ?? field.defaultValue;
         }
       });
       setLocalSettings(defaultSettings);
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminConnectionsSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminConnectionsSection.tsx
index bbb19380a..6718b09f2 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminConnectionsSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminConnectionsSection.tsx
@@ -422,6 +422,7 @@ export default function AdminConnectionsSection() {
                 key={provider.id}
                 provider={provider}
                 isConfigured={false}
+                settings={getProviderSettings(provider)}
                 onSave={(providerSettings) => handleProviderSave(provider, providerSettings)}
                 disabled={!loginEnabled}
               />