fix(editor): stabilize image workflows and editing controls

static/js/settings/imageModels.js

@@ -4,12 +4,14 @@
 // them from the same places, so load order and init sequence are untouched.
 
 import { byId as el } from './dom.js';
-import { postSettings as _postSettings } from './api.js';
+import { saveImagePreferences as _postSettings } from './imagePreferences.js';
 import { modelCaps } from '../editor/ai-models.js';
 import { sortModelIds } from '../modelSort.js';
+let preferencesListener = null;
 
 export async function initImageSettings() {
   const modelSel = el('set-imgModelSelect');
+  const editModelSel = el('set-imgEditModelSelect');
   const qualSel = el('set-imgQualitySelect');
   const msg = el('set-imgSettingsMsg');
   const enabledToggle = el('set-imgEnabledToggle');
@@ -18,23 +20,36 @@ export async function initImageSettings() {
     const endpointsRes = await fetch('/api/model-endpoints', { credentials: 'same-origin' });
     const endpoints = await endpointsRes.json();
     const imageModels = new Set();
+    const editModels = new Set();
     (Array.isArray(endpoints) ? endpoints : []).forEach(endpoint => {
       if (!endpoint.is_enabled || !endpoint.online) return;
       (Array.isArray(endpoint.models) ? endpoint.models : []).forEach(modelId => {
         if (modelId && modelCaps(modelId, '', endpoint.model_type).gen) imageModels.add(String(modelId));
+        if (modelId && modelCaps(modelId, '', endpoint.model_type).inpaint) editModels.add(String(modelId));
       });
     });
+    modelSel.length = 1;
     sortModelIds(Array.from(imageModels)).forEach(mid => {
       const opt = document.createElement('option');
       opt.value = mid;
       opt.textContent = mid;
       modelSel.appendChild(opt);
     });
+    if (editModelSel) {
+      editModelSel.length = 1;
+      for (const mid of sortModelIds(Array.from(editModels))) {
+        const option = document.createElement('option');
+        option.value = mid;
+        option.textContent = mid;
+        editModelSel.appendChild(option);
+      }
+    }
   } catch (e) { console.warn('Failed to load models for image settings', e); }
   try {
     const settingsRes = await fetch('/api/auth/settings', { credentials: 'same-origin' });
     const settings = await settingsRes.json();
     if (settings.image_model) modelSel.value = settings.image_model;
+    if (editModelSel) editModelSel.value = settings.image_edit_model || '';
     if (settings.image_quality) qualSel.value = settings.image_quality;
     if (enabledToggle) enabledToggle.checked = settings.image_gen_enabled === true;
   } catch (e) { console.warn('Failed to load settings', e); }
@@ -49,12 +64,19 @@ export async function initImageSettings() {
 
   async function saveSettings() {
     try {
-      const res = await _postSettings({ image_gen_enabled: enabledToggle ? enabledToggle.checked : false, image_model: modelSel.value, image_quality: qualSel.value });
+      const res = await _postSettings({ image_gen_enabled: enabledToggle ? enabledToggle.checked : false, image_model: modelSel.value, image_edit_model: editModelSel?.value || '', image_quality: qualSel.value });
       if (!res.ok) throw new Error(await res.text().catch(() => `HTTP ${res.status}`));
       msg.textContent = 'Saved'; msg.style.color = 'var(--fg)'; setTimeout(() => { msg.textContent = ''; }, 2000);
     } catch (e) { msg.textContent = e.status === 403 ? 'Admin access is required to change these settings.' : 'Failed to save'; msg.style.color = 'var(--red)'; }
   }
   modelSel.addEventListener('change', saveSettings);
+  editModelSel?.addEventListener('change', saveSettings);
+  if (preferencesListener) window.removeEventListener('image-preferences-changed', preferencesListener);
+  preferencesListener = event => {
+    if ('image_model' in event.detail) modelSel.value = event.detail.image_model || '';
+    if (editModelSel && 'image_edit_model' in event.detail) editModelSel.value = event.detail.image_edit_model || '';
+  };
+  window.addEventListener('image-preferences-changed', preferencesListener);
   qualSel.addEventListener('change', saveSettings);
   if (enabledToggle) enabledToggle.addEventListener('change', function() { syncImgDisabled(); saveSettings(); });
 }

static/js/settings/imagePreferences.js

@@ -0,0 +1,26 @@
+import { invalidateSettings } from '../appConfig.js';
+
+export async function readImagePreferences() {
+  const response = await fetch('/api/auth/settings', { credentials: 'same-origin' });
+  if (!response.ok) throw new Error('Could not load image settings');
+  return response.json();
+}
+
+let saveQueue = Promise.resolve();
+export function waitForImagePreferences() { return saveQueue; }
+export function saveImagePreferences(patch) {
+  const save = async () => {
+    const response = await fetch('/api/auth/settings', {
+      method: 'POST', credentials: 'same-origin',
+      headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(patch),
+    });
+    if (!response.ok) throw new Error(response.status === 403
+      ? 'Admin access is required to change image settings.' : 'Could not save image settings');
+    invalidateSettings();
+    window.dispatchEvent(new CustomEvent('image-preferences-changed', { detail: patch }));
+    return response;
+  };
+  const result = saveQueue.then(save);
+  saveQueue = result.catch(() => {});
+  return result;
+}