Update

devplacepy/static/js/ServiceMonitor.js

@@ -50,6 +50,11 @@ class ServiceMonitor {
                 event.preventDefault();
                 this.saveConfig(form);
             });
+            const markDirty = (event) => {
+                if (event.target.name) event.target.dataset.dirty = "1";
+            };
+            form.addEventListener("input", markDirty);
+            form.addEventListener("change", markDirty);
         });
     }
 
@@ -66,6 +71,10 @@ class ServiceMonitor {
         });
         try {
             const data = await Http.sendForm(`/admin/services/${name}/config`, params);
+            (data.saved || []).forEach((key) => {
+                const el = form.querySelector(`[name="${key}"]`);
+                if (el) delete el.dataset.dirty;
+            });
             if (data.ok) {
                 if (statusEl) Toast.flash(statusEl, "Saved", 2000, "");
                 await this.poll();
@@ -120,6 +129,22 @@ class ServiceMonitor {
         if (stopBtn) stopBtn.disabled = !svc.enabled;
         const metricsEl = root.querySelector("[data-metrics]");
         if (metricsEl) this.renderMetrics(metricsEl, svc.metrics);
+        this.syncConfigFields(root, svc.fields);
+    }
+
+    syncConfigFields(root, fields) {
+        if (!Array.isArray(fields)) return;
+        const form = root.querySelector("[data-config-form]");
+        if (!form) return;
+        for (const field of fields) {
+            if (field.secret) continue;
+            const input = form.querySelector(`[name="${field.key}"]`);
+            if (!input) continue;
+            if (input === document.activeElement) continue;
+            if (input.dataset.dirty === "1") continue;
+            const value = field.value == null ? "" : String(field.value);
+            if (input.value !== value) input.value = value;
+        }
     }
 
     setMeta(root, key, value) {