@jacobbd/relay-ai 0.5.0 → 0.6.1

package/dist/{provider-templates-6XYKAZB5.js → provider-templates-BPGB5V2L.js}

@@ -7,7 +7,7 @@ import {
   listAddableTemplates,
   listSupportedTemplates,
   listVisibleOAuthTemplates
-} from "./chunk-MVBA7ABV.js";
+} from "./chunk-EJONCU3B.js";
 init_provider_templates();
 export {
   PROVIDER_TEMPLATES,
@@ -17,4 +17,4 @@ export {
   listSupportedTemplates,
   listVisibleOAuthTemplates
 };
-//# sourceMappingURL=provider-templates-6XYKAZB5.js.map
+//# sourceMappingURL=provider-templates-BPGB5V2L.js.map

package/dist/ui/public/app.js

@@ -3,7 +3,7 @@ import {
   getProviderModelPage,
   PROVIDER_MODEL_PAGE_SIZE,
 } from './provider-model-browser.js';
-import { copyDeviceCode, oauthConnectionLabel } from './oauth-device.js';
+import { copyDeviceCode, copyTextToClipboard, oauthConnectionLabel } from './oauth-device.js';
 import { providerInitial, providerLogoHtml } from './provider-logo.js';
 
 // ─── State ───────────────────────────────────────────────────────────────────
@@ -53,6 +53,7 @@ const state = {
       listenMode: 'local',        // 'local' | 'network'
       passwordMode: 'new',        // 'saved' | 'new'
       password: '',
+      passwordVisible: false,
       savePassword: false,
     },
   },
@@ -207,7 +208,7 @@ async function initUpdateIndicator() {
 
   document.getElementById('update-copy-btn')?.addEventListener('click', async () => {
     try {
-      await navigator.clipboard.writeText(UPDATE_COMMAND);
+      await copyTextToClipboard(UPDATE_COMMAND);
       showToast('Update command copied');
     } catch {
       showToast('Could not copy the update command');
@@ -1059,6 +1060,8 @@ function buildProviderBodyContent(provider) {
       const countEl = document.querySelector(`[data-id="${CSS.escape(provider.id)}"] .provider-models-count`);
       if (countEl) countEl.textContent = `${result.count} models`;
       provider.modelCount = result.count;
+      state.modelsLoaded = false;
+      await initModels();
     } else {
       feedback.textContent = result.error ?? 'Refresh failed';
       feedback.className = 'key-feedback error';
@@ -1179,6 +1182,8 @@ function buildOAuthProviderBodyContent(provider) {
       feedback.className = 'key-feedback success';
       const countEl = document.querySelector(`[data-id="${CSS.escape(provider.id)}"] .provider-models-count`);
       if (countEl) countEl.textContent = `${result.count} models`;
+      state.modelsLoaded = false;
+      await initModels();
     } else {
       feedback.textContent = result.error ?? 'Refresh failed';
       feedback.className = 'key-feedback error';
@@ -1519,8 +1524,15 @@ function updateAgyCounter() {
 
 // ─── Sidebar nav highlight ────────────────────────────────────────────────────
 
+function isServerAdminUi() {
+  return document.documentElement.dataset.uiMode === 'server';
+}
+
 function initNav() {
-  const sectionIds = ['providers', 'favorites', 'antigravity', 'apps', 'server'];
+  // Host-only sections stay in the DOM but are CSS-hidden in server admin mode.
+  const sectionIds = isServerAdminUi()
+    ? ['providers', 'favorites', 'server']
+    : ['providers', 'favorites', 'antigravity', 'apps', 'server'];
   const navItems = document.querySelectorAll('.nav-item');
   const content = document.getElementById('content');
 
@@ -1605,6 +1617,18 @@ async function initModels() {
     state.modelsError = String(err);
     state.modelsLoaded = true;
   }
+  // Keep the Providers header counts in sync after add / delete / OAuth / refresh.
+  renderProviderStats();
+  // Server tab caches its provider checklist — invalidate so new providers appear without a full reload.
+  invalidateServerProviderCache();
+}
+
+function invalidateServerProviderCache() {
+  state.server.form.providersLoaded = false;
+  if (state.server.status?.running) return;
+  if (state.server.form.expose !== 'specific') return;
+  if (!document.getElementById('server-panel')) return;
+  void loadServerProviders().then(() => renderServerPanel());
 }
 
 async function init() {
@@ -1616,11 +1640,13 @@ async function init() {
 
   await loadConfig();
   renderFavList();
-  renderAgyList();
-  updateAgyCounter();
   updateGeneralCounter();
-  await loadApps();
-  renderApps();
+  if (!isServerAdminUi()) {
+    renderAgyList();
+    updateAgyCounter();
+    await loadApps();
+    renderApps();
+  }
   renderProviders(); // shows skeletons
 
   initServerPolling();
@@ -1631,12 +1657,12 @@ async function init() {
   initModels().then(() => {
     renderProviders();
     renderProviderStats();
-    renderApps();
+    if (!isServerAdminUi()) renderApps();
     // Re-render favorites now that we have full provider names
     renderFavList();
-    renderAgyList();
+    if (!isServerAdminUi()) renderAgyList();
     if (state.modelFilter) buildModelResults(state.modelFilter, 'general');
-    if (state.agyFilter)   buildModelResults(state.agyFilter, 'agy');
+    if (!isServerAdminUi() && state.agyFilter) buildModelResults(state.agyFilter, 'agy');
     syncProviderModelBrowserFromHash();
   });
 
@@ -2220,15 +2246,28 @@ document.addEventListener('click', (e) => {
 async function refreshServerStatus() {
   try {
     const data = await api('GET', '/api/server/status');
+    const wasRunning = Boolean(state.server.status?.running);
     state.server.status = data;
     if (!data.running) seedServerFormFromSaved(data.saved);
+    const runningChanged = wasRunning !== Boolean(data.running);
+    // Full innerHTML replace steals focus from password / search fields — skip while typing.
+    if (runningChanged || !isEditingInside(document.getElementById('server-panel'))) {
+      renderServerPanel();
+    }
   } catch {
     // Transient poll failure — keep showing the last known state.
   }
-  renderServerPanel();
   updateServerNavBadge();
 }
 
+function isEditingInside(root) {
+  if (!root) return false;
+  const el = document.activeElement;
+  if (!el || !root.contains(el)) return false;
+  const tag = el.tagName;
+  return tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT' || el.isContentEditable;
+}
+
 function seedServerFormFromSaved(saved) {
   const f = state.server.form;
   if (f.seeded || !saved) return;
@@ -2240,8 +2279,16 @@ function seedServerFormFromSaved(saved) {
   f.freeModelsOnly = Boolean(saved.freeModelsOnly);
   f.exposedProviders = saved.exposedProviders ? [...saved.exposedProviders] : [];
   f.maskGatewayIds = saved.maskGatewayIds;
-  f.listenMode = saved.listenMode === 'network' ? 'network' : 'local';
-  f.passwordMode = saved.hasSavedPassword ? 'saved' : 'new';
+  // Published Docker ports only reach 0.0.0.0 inside the container.
+  f.listenMode = isServerAdminUi() || saved.listenMode === 'network' ? 'network' : 'local';
+  // Env password (Docker): prefill the field so Start works and clients can copy it.
+  // Keychain-saved password: keep "Use saved" (value never sent to the browser).
+  if (saved.prefillPassword && !f.password) {
+    f.password = saved.prefillPassword;
+    f.passwordMode = 'new';
+  } else {
+    f.passwordMode = saved.hasSavedPassword ? 'saved' : 'new';
+  }
   if (f.expose === 'specific') loadServerProviders().then(renderServerPanel);
 }
 
@@ -2282,6 +2329,10 @@ function renderServerPanel() {
     panel.innerHTML = '<div class="skeleton skeleton-card"></div>';
     return;
   }
+  // Lazy-load (or re-load after invalidate) when the specific-provider checklist is visible.
+  if (!s.status.running && s.form.expose === 'specific' && !s.form.providersLoaded) {
+    void loadServerProviders().then(() => renderServerPanel());
+  }
   panel.innerHTML = s.status.running ? renderServerRunning(s.status) : renderServerSetup(s);
 }
 
@@ -2341,16 +2392,22 @@ function renderServerNetworkOptions() {
   const s = state.server;
   const f = s.form;
   const hasSaved = Boolean(s.status?.saved?.hasSavedPassword);
+  const hasEnv = Boolean(s.status?.saved?.hasEnvPassword);
   const showPasswordInput = f.passwordMode === 'new' || !hasSaved;
+  const inputType = f.passwordVisible ? 'text' : 'password';
 
   return `
     <div class="server-network-options">
-      ${hasSaved ? toggleGroupHtml([
+      ${hasSaved && !hasEnv ? toggleGroupHtml([
         { label: 'Use saved password', active: f.passwordMode === 'saved', onClick: "setServerPasswordMode('saved')" },
         { label: 'Enter new password', active: f.passwordMode === 'new', onClick: "setServerPasswordMode('new')" },
       ]) : ''}
+      ${hasEnv && f.passwordMode === 'new' ? '<div class="server-field-hint">Prefilled from RELAY_AI_SERVER_PASSWORD</div>' : ''}
       ${showPasswordInput ? `
-        <input type="password" class="key-input" placeholder="Server password" value="${escapeHtml(f.password)}" oninput="setServerPassword(this.value)">
+        <div class="server-password-row">
+          <input type="${inputType}" class="key-input" id="server-password-input" placeholder="Server password" value="${escapeHtml(f.password)}" oninput="setServerPassword(this.value)" autocomplete="off">
+          <button type="button" class="btn btn-ghost server-password-reveal" onclick="toggleServerPasswordVisible()" aria-pressed="${f.passwordVisible ? 'true' : 'false'}">${f.passwordVisible ? 'Hide' : 'Reveal'}</button>
+        </div>
         <label class="server-toggle-row">
           <input type="checkbox" ${f.savePassword ? 'checked' : ''} onchange="setServerSavePassword(this.checked)">
           <span>Save this password for next time</span>
@@ -2360,6 +2417,17 @@ function renderServerNetworkOptions() {
   `;
 }
 
+function renderServerListenField(f) {
+  if (isServerAdminUi()) {
+    return `<div class="server-field-hint">Network (required in container — use the published host port from the URL cards)</div>${renderServerNetworkOptions()}`;
+  }
+  const toggle = toggleGroupHtml([
+    { label: 'Local only', active: f.listenMode === 'local', onClick: "setServerListenMode('local')" },
+    { label: 'Network', active: f.listenMode === 'network', onClick: "setServerListenMode('network')" },
+  ]);
+  return f.listenMode === 'network' ? `${toggle}${renderServerNetworkOptions()}` : toggle;
+}
+
 function renderServerSetup(s) {
   const f = s.form;
   const specific = f.expose === 'specific';
@@ -2410,11 +2478,7 @@ function renderServerSetup(s) {
 
       <div class="server-field">
         <div class="server-field-label">Listen</div>
-        ${toggleGroupHtml([
-          { label: 'Local only', active: f.listenMode === 'local', onClick: "setServerListenMode('local')" },
-          { label: 'Network', active: f.listenMode === 'network', onClick: "setServerListenMode('network')" },
-        ])}
-        ${f.listenMode === 'network' ? renderServerNetworkOptions() : ''}
+        ${renderServerListenField(f)}
       </div>
 
       ${s.error ? `<div class="key-feedback error server-start-error">${escapeHtml(s.error)}</div>` : ''}
@@ -2551,6 +2615,12 @@ function setServerPassword(value) {
   state.server.form.password = value;
 }
 
+function toggleServerPasswordVisible() {
+  state.server.form.passwordVisible = !state.server.form.passwordVisible;
+  renderServerPanel();
+  document.getElementById('server-password-input')?.focus();
+}
+
 function setServerSavePassword(checked) {
   state.server.form.savePassword = checked;
 }
@@ -2618,7 +2688,7 @@ function serverIdCell(id) {
 
 async function copyPlainText(text) {
   try {
-    await navigator.clipboard.writeText(text);
+    await copyTextToClipboard(text);
     showToast('Copied to clipboard');
   } catch {
     showToast('Could not copy — copy manually');
@@ -2646,6 +2716,7 @@ window.setServerFreeModelsOnly = setServerFreeModelsOnly;
 window.setServerListenMode = setServerListenMode;
 window.setServerPasswordMode = setServerPasswordMode;
 window.setServerPassword = setServerPassword;
+window.toggleServerPasswordVisible = toggleServerPasswordVisible;
 window.setServerSavePassword = setServerSavePassword;
 window.submitServerStart = submitServerStart;
 window.stopServerGateway = stopServerGateway;

package/dist/ui/public/index.html

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" data-ui-mode="{{UI_MODE}}">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">

package/dist/ui/public/oauth-device.js

@@ -1,30 +1,55 @@
-/** Return the short credential label used on a provider card. */
-export function oauthConnectionLabel(provider) {
-  if (!provider?.hasKey) return provider?.freeAccess ? 'Free models' : 'Not configured';
-  if (provider.authType !== 'oauth') return 'Key stored';
-  const planLabel = provider.subscription?.label;
-  return typeof planLabel === 'string' && planLabel.trim()
-    ? `Connected · ${planLabel.trim()}`
-    : 'Connected';
-}
+/** Clipboard helpers for the web UI (works on http://LAN as well as https/localhost). */
 
-/** Copy a device code, with a small legacy fallback for older browser contexts. */
-export async function copyDeviceCode(code, clipboard = globalThis.navigator?.clipboard) {
-  if (clipboard?.writeText) {
-    await clipboard.writeText(code);
-    return;
+/**
+ * Copy text to the clipboard. Prefer the async Clipboard API in secure contexts;
+ * fall back to a hidden textarea + execCommand for plain HTTP (LAN Docker UI).
+ */
+export async function copyTextToClipboard(
+  text,
+  clipboard = globalThis.navigator?.clipboard,
+  doc = globalThis.document,
+) {
+  const secure = typeof globalThis.isSecureContext === 'boolean'
+    ? globalThis.isSecureContext
+    : Boolean(clipboard?.writeText);
+
+  if (secure && clipboard?.writeText) {
+    try {
+      await clipboard.writeText(text);
+      return;
+    } catch {
+      // Fall through — common on http://192.168.x.x where the API exists but throws.
+    }
   }
-  if (!globalThis.document?.body || typeof globalThis.document.execCommand !== 'function') {
+
+  if (!doc?.body || typeof doc.execCommand !== 'function') {
     throw new Error('Clipboard access is unavailable');
   }
-  const input = globalThis.document.createElement('textarea');
-  input.value = code;
+  const input = doc.createElement('textarea');
+  input.value = text;
   input.setAttribute('readonly', '');
   input.style.position = 'fixed';
+  input.style.left = '-9999px';
   input.style.opacity = '0';
-  globalThis.document.body.appendChild(input);
+  doc.body.appendChild(input);
   input.select();
-  const copied = globalThis.document.execCommand('copy');
+  input.setSelectionRange(0, input.value.length);
+  const copied = doc.execCommand('copy');
   input.remove();
   if (!copied) throw new Error('Copy failed');
 }
+
+/** @deprecated Prefer copyTextToClipboard — kept for existing call sites / tests. */
+export async function copyDeviceCode(code, clipboard = globalThis.navigator?.clipboard) {
+  return copyTextToClipboard(code, clipboard);
+}
+
+/** Return the short credential label used on a provider card. */
+export function oauthConnectionLabel(provider) {
+  if (!provider?.hasKey) return provider?.freeAccess ? 'Free models' : 'Not configured';
+  if (provider.authType !== 'oauth') return 'Key stored';
+  const planLabel = provider.subscription?.label;
+  return typeof planLabel === 'string' && planLabel.trim()
+    ? `Connected · ${planLabel.trim()}`
+    : 'Connected';
+}

package/dist/ui/public/style.css

@@ -1,4 +1,12 @@
 /* ─── Tokens ─────────────────────────────────────────────────────────────── */
+/* Server admin UI (Docker): hide host-only sections before JS runs */
+html[data-ui-mode="server"] .nav-item[data-section="apps"],
+html[data-ui-mode="server"] .nav-item[data-section="antigravity"],
+html[data-ui-mode="server"] #apps,
+html[data-ui-mode="server"] #antigravity {
+  display: none !important;
+}
+
 :root {
   /* Deep navy background — NOT flat black */
   --bg:              oklch(12% 0.038 265);
@@ -1868,6 +1876,22 @@ input { font-family: inherit; }
   gap: 10px;
 }
 
+.server-password-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.server-password-row .key-input {
+  flex: 1;
+  min-width: 0;
+}
+
+.server-password-reveal {
+  flex-shrink: 0;
+  white-space: nowrap;
+}
+
 .server-provider-chips {
   display: flex;
   flex-wrap: wrap;