control auto-refresh models

javascript/contextMenus.js

@@ -103,7 +103,7 @@ function initContextMenu() {
     }
   };
 
-  for (const tab of ['txt2img', 'img2img']) {
+  for (const tab of ['txt2img', 'img2img', 'control']) {
     for (const el of ['generate', 'interrupt', 'skip', 'pause', 'paste', 'clear_prompt', 'extra_networks_btn']) {
       const id = `#${tab}_${el}`;
       appendContextMenuOption(id, 'Copy to clipboard', () => navigator.clipboard.writeText(document.querySelector(`#${tab}_prompt > label > textarea`).value));

javascript/control.js

@@ -11,6 +11,18 @@ function setupControlUI() {
       c.style.flexGrow = c.style.flexGrow === '0' ? '9' : '0';
     };
   }
+
+  const el = gradioApp().getElementById('control-input-column');
+  if (!el) return;
+  const intersectionObserver = new IntersectionObserver((entries) => {
+    if (entries[0].intersectionRatio > 0) {
+      const tab = gradioApp().querySelector('#control-tabs > .tab-nav > .selected')?.innerText.toLowerCase() || ''; // selected tab name
+      const btn = gradioApp().getElementById(`refresh_${tab}_models`);
+      if (btn) btn.click();
+    }
+  });
+  intersectionObserver.observe(el); // monitor visibility of tab
+
   log('initControlUI');
 }