@sean.holung/minicode 0.3.7 → 0.3.8

package/dist/src/web/app.js

@@ -1678,6 +1678,7 @@ var activeAnalysisFilter = "all";
 var analysisExplanationCache = /* @__PURE__ */ new Map();
 var filePreviewModalInitialized = false;
 var latestFilePreviewRequestId = 0;
+var pendingGraphRefreshTimer = null;
 var LAYOUT_OPTIONS = {
   name: "cose",
   nodeRepulsion: function() {
@@ -1704,39 +1705,8 @@ async function initGraph() {
   const cyEl = document.getElementById("cy");
   const detailEl = document.getElementById("symbol-detail");
   setupFilePreviewModal();
+  cyEl.innerHTML = "";
   try {
-    const [graphRes, symbolsRes, focusRes] = await Promise.all([
-      fetch("/api/graph"),
-      fetch("/api/symbols"),
-      fetch("/api/focus")
-    ]);
-    if (!graphRes.ok || !symbolsRes.ok) {
-      cyEl.innerHTML = '<div class="graph-empty">No index available. Run minicode with a project to generate the code graph.</div>';
-      return;
-    }
-    const graphData = await graphRes.json();
-    const focusData = focusRes.ok ? await focusRes.json() : { pinned: [] };
-    if (!graphData.nodes || graphData.nodes.length === 0) {
-      cyEl.innerHTML = '<div class="graph-empty">No index available. Run minicode with a project to generate the code graph.</div>';
-      return;
-    }
-    for (const node of graphData.nodes) {
-      const id = node.qualifiedName || node.id || node.name || "";
-      graphNodes.set(id, node);
-    }
-    graphEdges = (graphData.edges || []).map((e) => ({
-      source: e.source || e.from || "",
-      target: e.target || e.to || "",
-      kind: (e.kind || e.type || "references").toLowerCase()
-    }));
-    edgeIndex = buildGraphEdgeIndex(graphEdges);
-    fileToSymbolIds = buildGraphFileIndex(graphNodes);
-    allSymbolNames = Array.from(graphNodes.keys()).sort();
-    const pinned = focusData.pinned || [];
-    for (const f of pinned) {
-      const name = typeof f === "string" ? f : f.name || f.qualifiedName;
-      if (name) pinnedNames.add(name);
-    }
     cy = cytoscape({
       container: cyEl,
       elements: [],
@@ -1746,20 +1716,64 @@ async function initGraph() {
     });
     setupInteractions(cy, detailEl);
     setupToolbar();
-    if (pinnedNames.size > 0) {
-      for (const name of pinnedNames) {
-        addNodeNeighborhood(name, 1);
-      }
-      runLayout();
-    } else {
-      showOnboardingHint(cyEl);
+    const loaded = await loadGraphSnapshot(false);
+    if (!loaded) {
+      showOnboardingHint(cyEl, "No project index is available yet. Refresh after files are available, or restart minicode serve.");
+      return;
     }
+    seedPinnedSymbolsOrOnboarding(
+      graphNodes.size === 0 ? "No JavaScript or TypeScript symbols are indexed yet. Create a file, then refresh the graph." : void 0
+    );
   } catch (err) {
     console.error("Graph init failed:", err);
     const msg = err instanceof Error ? err.message : String(err);
     cyEl.innerHTML = `<div class="graph-empty">Failed to load graph: ${msg}</div>`;
   }
 }
+async function refreshGraphData(options = {}) {
+  if (!initialized || !cy) return;
+  const {
+    refreshIndex = false,
+    preserveVisible = true,
+    showFeedback = false
+  } = options;
+  const refreshBtn = document.getElementById("graph-refresh");
+  const visibleIds = preserveVisible ? cy.nodes().map((node) => node.id()) : [];
+  if (showFeedback && refreshBtn) {
+    refreshBtn.disabled = true;
+    refreshBtn.textContent = "Refreshing...";
+  }
+  try {
+    const loaded = await loadGraphSnapshot(refreshIndex);
+    if (!loaded) {
+      throw new Error("No project index available");
+    }
+    renderGraphAfterDataRefresh(visibleIds, preserveVisible);
+  } catch (err) {
+    console.error("Graph refresh failed:", err);
+    if (showFeedback) {
+      const cyEl = document.getElementById("cy");
+      if (cyEl && graphNodes.size === 0) {
+        showOnboardingHint(cyEl, "Could not refresh the project index. Check the minicode serve logs, then try again.");
+      }
+    }
+  } finally {
+    if (showFeedback && refreshBtn) {
+      refreshBtn.disabled = false;
+      refreshBtn.textContent = "Refresh";
+    }
+  }
+}
+function scheduleGraphDataRefresh() {
+  if (!initialized) return;
+  if (pendingGraphRefreshTimer) {
+    clearTimeout(pendingGraphRefreshTimer);
+  }
+  pendingGraphRefreshTimer = setTimeout(() => {
+    pendingGraphRefreshTimer = null;
+    void refreshGraphData({ preserveVisible: true });
+  }, 250);
+}
 function highlightAgentActivity(symbolName) {
   if (!cy) return;
   void focusResolvedSymbolsInGraph(symbolName, {
@@ -1773,11 +1787,106 @@ function highlightAgentActivity(symbolName) {
 function resizeGraph() {
   if (cy) cy.resize();
 }
-function showOnboardingHint(container) {
-  if (container.querySelector(".graph-onboarding")) return;
+async function loadGraphSnapshot(refreshIndex) {
+  if (refreshIndex) {
+    const refreshRes = await fetch("/api/index/refresh", { method: "POST" });
+    if (!refreshRes.ok) {
+      return false;
+    }
+  }
+  const [graphRes, focusRes] = await Promise.all([
+    fetch("/api/graph"),
+    fetch("/api/focus")
+  ]);
+  if (!graphRes.ok) {
+    return false;
+  }
+  const graphData = await graphRes.json();
+  const focusData = focusRes.ok ? await focusRes.json() : { pinned: [] };
+  applyGraphSnapshot(graphData, focusData);
+  return true;
+}
+function applyGraphSnapshot(graphData, focusData) {
+  graphNodes.clear();
+  for (const node of graphData.nodes || []) {
+    const id = node.qualifiedName || node.id || node.name || "";
+    if (id) {
+      graphNodes.set(id, node);
+    }
+  }
+  graphEdges = (graphData.edges || []).map((e) => ({
+    source: e.source || e.from || "",
+    target: e.target || e.to || "",
+    kind: (e.kind || e.type || "references").toLowerCase()
+  })).filter((edge) => edge.source && edge.target);
+  edgeIndex = buildGraphEdgeIndex(graphEdges);
+  fileToSymbolIds = buildGraphFileIndex(graphNodes);
+  allSymbolNames = Array.from(graphNodes.keys()).sort();
+  pinnedNames.clear();
+  for (const pinned of focusData.pinned || []) {
+    const name = typeof pinned === "string" ? pinned : pinned.name || pinned.qualifiedName;
+    if (name) pinnedNames.add(name);
+  }
+  resetAnalysisForGraphRefresh();
+}
+function resetAnalysisForGraphRefresh() {
+  analysisReport = null;
+  activeAnalysisFindingId = null;
+  activeAnalysisFilter = "all";
+  analysisExplanationCache.clear();
+  clearAnalysisGraphClasses();
+  const panel = document.getElementById("analysis-panel");
+  if (!panel || panel.classList.contains("hidden")) {
+    return;
+  }
+  const { summary, findings } = getAnalysisPanelEls();
+  summary.innerHTML = "";
+  findings.innerHTML = '<div class="analysis-empty">Graph refreshed. Re-run analysis to inspect the latest dependency graph.</div>';
+  setAnalysisStatus("Graph refreshed. Re-run analysis to inspect the latest snapshot.");
+}
+function renderGraphAfterDataRefresh(previousVisibleIds, preserveVisible) {
+  if (!cy) return;
+  cy.elements().remove();
+  document.getElementById("symbol-detail")?.classList.add("hidden");
+  const visibleIds = preserveVisible ? [...new Set(previousVisibleIds)].filter((id) => graphNodes.has(id)) : [];
+  for (const id of visibleIds) {
+    addNodeToGraph(id);
+  }
+  connectExistingNodes();
+  if (cy.nodes().length > 0) {
+    refreshAnalysisGraphState();
+    runLayout();
+    return;
+  }
+  seedPinnedSymbolsOrOnboarding(
+    graphNodes.size === 0 ? "No JavaScript or TypeScript symbols are indexed yet. Create a file, then refresh the graph." : void 0
+  );
+}
+function seedPinnedSymbolsOrOnboarding(subtitle) {
+  if (!cy) return;
+  for (const name of pinnedNames) {
+    addNodeNeighborhood(name, 1);
+  }
+  connectExistingNodes();
+  if (cy.nodes().length > 0) {
+    refreshAnalysisGraphState();
+    runLayout();
+    return;
+  }
+  const cyEl = document.getElementById("cy");
+  if (cyEl) showOnboardingHint(cyEl, subtitle);
+  refreshAnalysisGraphState();
+}
+function showOnboardingHint(container, subtitle = "Search for a symbol or file above to start exploring.<br/>Nodes expand on click to reveal connections.") {
+  const existing = container.querySelector(".graph-onboarding");
+  if (existing) {
+    const subtitleEl = existing.querySelector(".graph-onboarding-subtitle");
+    if (subtitleEl) subtitleEl.innerHTML = subtitle;
+    return;
+  }
   const hint = document.createElement("div");
   hint.className = "graph-onboarding";
-  hint.innerHTML = '<div class="graph-onboarding-icon">&#9670; &#8212; &#9670;</div><div class="graph-onboarding-title">Code dependency graph</div><div class="graph-onboarding-subtitle">Search for a symbol or file above to start exploring.<br/>Nodes expand on click to reveal connections.</div>';
+  hint.innerHTML = `<div class="graph-onboarding-icon">&#9670; &#8212; &#9670;</div><div class="graph-onboarding-title">Code dependency graph</div><div class="graph-onboarding-subtitle">${subtitle}</div>`;
   container.appendChild(hint);
 }
 function removeOnboardingHint() {
@@ -2660,6 +2769,7 @@ async function togglePin(name, node, btnEl) {
 function setupToolbar() {
   const searchInput = document.getElementById("graph-search");
   const analyzeBtn = document.getElementById("graph-analyze");
+  const refreshBtn = document.getElementById("graph-refresh");
   const fitBtn = document.getElementById("graph-fit");
   const relayoutBtn = document.getElementById("graph-relayout");
   const clearBtn = document.getElementById("graph-clear");
@@ -2671,7 +2781,6 @@ function setupToolbar() {
   dropdown.className = "search-dropdown hidden";
   searchInput.parentNode.style.position = "relative";
   searchInput.parentNode.appendChild(dropdown);
-  const rankedSymbols = allSymbolNames.slice().sort((a, b2) => compareGraphNodeIds(a, b2, graphNodes));
   function showDropdownResults(results) {
     if (results.length === 0) {
       dropdown.classList.add("hidden");
@@ -2710,6 +2819,7 @@ function setupToolbar() {
     });
   }
   function updateDropdownResults() {
+    const rankedSymbols = allSymbolNames.slice().sort((a, b2) => compareGraphNodeIds(a, b2, graphNodes));
     const results = buildGraphSearchResults({
       query: searchInput.value,
       symbolIds: rankedSymbols,
@@ -2743,6 +2853,9 @@ function setupToolbar() {
       cy.fit(40);
     }
   });
+  refreshBtn.addEventListener("click", () => {
+    void refreshGraphData({ refreshIndex: true, preserveVisible: true, showFeedback: true });
+  });
   analyzeBtn.addEventListener("click", () => {
     void runStructuralAnalysis();
   });
@@ -2769,6 +2882,24 @@ function setupToolbar() {
   });
 }
 
+// src/model-utils.ts
+function getModelDisplayName(model) {
+  return (model.name ?? model.id).trim();
+}
+function normalizeModelSearchValue(value) {
+  return value.trim().toLocaleLowerCase().split(/\s+/).filter(Boolean);
+}
+function filterModelsByQuery(models, query) {
+  const tokens = normalizeModelSearchValue(query);
+  if (tokens.length === 0) {
+    return [...models];
+  }
+  return models.filter((model) => {
+    const haystack = `${getModelDisplayName(model)} ${model.id}`.toLocaleLowerCase();
+    return tokens.every((token) => haystack.includes(token));
+  });
+}
+
 // src/web/request-tracker.ts
 function createLatestRequestTracker() {
   let latestToken = 0;
@@ -2783,6 +2914,25 @@ function createLatestRequestTracker() {
   };
 }
 
+// src/web/setup-overlay-state.ts
+var DEFAULT_SETUP_INTRO = "minicode needs a model provider to run. Configure one of the following:";
+function deriveSetupOverlayState(input) {
+  const missingItems = input.missing ?? [];
+  const configuredProvider = input.configuredProvider ?? null;
+  const isOnlyModelMissing = missingItems.length === 1 && typeof missingItems[0] === "string" && missingItems[0].includes("MODEL");
+  const hasConfiguredProvider = isOnlyModelMissing && configuredProvider !== null;
+  const filteredMissingItems = hasConfiguredProvider ? missingItems : missingItems.filter((item) => !item.includes("MODEL"));
+  const introText = configuredProvider === "openrouter" && isOnlyModelMissing ? "OpenRouter is already configured. Select a model to continue:" : configuredProvider === "openai-compatible" && isOnlyModelMissing ? "An OpenAI-compatible provider is already configured. Select a model to continue:" : configuredProvider === "anthropic" && isOnlyModelMissing ? "Anthropic is already configured. Select a model to continue:" : DEFAULT_SETUP_INTRO;
+  return {
+    introText,
+    hideQuickConnects: hasConfiguredProvider,
+    hideOpenRouterSpotlight: configuredProvider === "openrouter" && isOnlyModelMissing,
+    missingItems: filteredMissingItems,
+    showModelSelectionHint: hasConfiguredProvider,
+    modelSelectionNote: configuredProvider === "openrouter" && isOnlyModelMissing ? 'If you are on the OpenRouter free tier, search "free" in the model dropdown to find supported free models.' : null
+  };
+}
+
 // src/web/app.ts
 var messagesEl = document.getElementById("messages");
 var chatForm = document.getElementById("chat-form");
@@ -2793,6 +2943,7 @@ var statusBadge = document.getElementById("status-badge");
 var modelInfo = document.getElementById("model-info");
 var modelBtn = document.getElementById("model-btn");
 var modelDropdown = document.getElementById("model-dropdown");
+var modelSearchInput = document.getElementById("model-search");
 var modelList = document.getElementById("model-list");
 var sessionBtn = document.getElementById("session-btn");
 var sessionDropdown = document.getElementById("session-dropdown");
@@ -2813,17 +2964,36 @@ var openRouterConnectCloseBtn = document.getElementById("openrouter-connect-clos
 var openRouterConnectCancelBtn = document.getElementById("openrouter-connect-cancel");
 var openRouterConnectContinueBtn = document.getElementById("openrouter-connect-continue");
 var openRouterPersistCheckbox = document.getElementById("openrouter-persist-checkbox");
+var openAiCompatibleConnectModal = document.getElementById("openai-compatible-connect-modal");
+var openAiCompatibleConnectBackdrop = document.getElementById("openai-compatible-connect-backdrop");
+var openAiCompatibleConnectCloseBtn = document.getElementById("openai-compatible-connect-close");
+var openAiCompatibleConnectCancelBtn = document.getElementById("openai-compatible-connect-cancel");
+var openAiCompatibleConnectContinueBtn = document.getElementById("openai-compatible-connect-continue");
+var openAiCompatiblePresetSelect = document.getElementById("openai-compatible-preset");
+var openAiCompatiblePresetHelp = document.getElementById("openai-compatible-preset-help");
+var openAiCompatibleBaseUrlInput = document.getElementById("openai-compatible-base-url");
+var openAiCompatibleApiKeyInput = document.getElementById("openai-compatible-api-key");
+var openAiCompatiblePersistCheckbox = document.getElementById("openai-compatible-persist-checkbox");
+var openAiCompatibleConnectStatus = document.getElementById("openai-compatible-connect-status");
 var settingsPath = document.getElementById("settings-path");
 var settingsList = document.getElementById("settings-list");
 var settingsBanner = document.getElementById("settings-banner");
 var settingsOpenRouterSession = document.getElementById("settings-openrouter-session");
 var settingsOpenRouterSessionMeta = document.getElementById("settings-openrouter-session-meta");
+var settingsOpenAiCompatibleSession = document.getElementById("settings-openai-compatible-session");
+var settingsOpenAiCompatibleSessionMeta = document.getElementById("settings-openai-compatible-session-meta");
 var settingsSaveBtn = document.getElementById("settings-save");
 var settingsResetBtn = document.getElementById("settings-reset");
 var disconnectOpenRouterBtn = document.getElementById("disconnect-openrouter-btn");
+var disconnectOpenAiCompatibleBtn = document.getElementById("disconnect-openai-compatible-btn");
 var connectOpenRouterButtons = Array.from(
   document.querySelectorAll("[data-openrouter-connect]")
 );
+var connectOpenAiCompatibleButtons = Array.from(
+  document.querySelectorAll("[data-openai-compatible-connect]")
+);
+var GRAPH_REFRESH_TOOL_NAMES = /* @__PURE__ */ new Set(["write_file", "edit_file", "run_command"]);
+var configOverlayQuickConnects = document.getElementById("config-overlay-quick-connects");
 var configOverlaySpotlight = document.getElementById("config-overlay-spotlight");
 var configOverlayIntro = document.getElementById("config-overlay-intro");
 var configConnectStatus = document.getElementById("config-connect-status");
@@ -2835,10 +3005,33 @@ var settingsPayload = null;
 var activeSavedSession = null;
 var activeBaseUrl = "";
 var sessionOpenRouterConnected = false;
+var sessionOpenAiCompatibleConnected = false;
 var sessionRefreshTracker = createLatestRequestTracker();
 var TOOL_RESULT_MAX = 500;
 var OPENROUTER_PKCE_VERIFIER_KEY = "minicode:openrouter:pkce-verifier";
 var OPENROUTER_PERSIST_TO_ENV_KEY = "minicode:openrouter:persist-to-env";
+var OPENAI_COMPATIBLE_PRESETS = {
+  lmstudio: {
+    baseUrl: "http://localhost:1234/v1",
+    helpText: "LM Studio pre-fills the default local server endpoint at http://localhost:1234/v1.",
+    apiKeyPlaceholder: "Leave blank for LM Studio unless local auth is enabled"
+  },
+  openai: {
+    baseUrl: "https://api.openai.com/v1",
+    helpText: "OpenAI uses https://api.openai.com/v1 and typically requires an API key.",
+    apiKeyPlaceholder: "Enter your OpenAI API key"
+  },
+  ollama: {
+    baseUrl: "http://localhost:11434/v1",
+    helpText: "Ollama pre-fills the default local server endpoint at http://localhost:11434/v1.",
+    apiKeyPlaceholder: "Leave blank for Ollama unless your proxy requires auth"
+  },
+  custom: {
+    baseUrl: "",
+    helpText: "Custom leaves the endpoint fully editable so you can point minicode at any OpenAI-compatible API.",
+    apiKeyPlaceholder: "Add an API key only if this endpoint requires auth"
+  }
+};
 function connect() {
   const protocol = location.protocol === "https:" ? "wss:" : "ws:";
   ws = new WebSocket(`${protocol}//${location.host}`);
@@ -2886,6 +3079,51 @@ function clearConfigConnectStatus() {
   configConnectStatus.textContent = "";
   configConnectStatus.className = "config-connect-status hidden";
 }
+function setOpenAiCompatibleConnectStatus(message, tone) {
+  openAiCompatibleConnectStatus.textContent = message;
+  openAiCompatibleConnectStatus.className = `config-connect-status ${tone}`;
+}
+function clearOpenAiCompatibleConnectStatus() {
+  openAiCompatibleConnectStatus.textContent = "";
+  openAiCompatibleConnectStatus.className = "config-connect-status hidden";
+}
+function normalizeBaseUrl(value) {
+  return value.trim().replace(/\/+$/, "");
+}
+function inferOpenAiCompatiblePreset(baseUrl) {
+  const normalizedBaseUrl = normalizeBaseUrl(baseUrl).toLowerCase();
+  if (normalizedBaseUrl === OPENAI_COMPATIBLE_PRESETS.lmstudio.baseUrl) {
+    return "lmstudio";
+  }
+  if (normalizedBaseUrl === OPENAI_COMPATIBLE_PRESETS.openai.baseUrl) {
+    return "openai";
+  }
+  if (normalizedBaseUrl === OPENAI_COMPATIBLE_PRESETS.ollama.baseUrl) {
+    return "ollama";
+  }
+  return "custom";
+}
+function applyOpenAiCompatiblePreset(preset, options = {}) {
+  const presetConfig = OPENAI_COMPATIBLE_PRESETS[preset];
+  openAiCompatiblePresetHelp.textContent = presetConfig.helpText;
+  openAiCompatibleApiKeyInput.placeholder = presetConfig.apiKeyPlaceholder;
+  if (preset === "custom" && options.preserveCustomValue) {
+    return;
+  }
+  openAiCompatibleBaseUrlInput.value = presetConfig.baseUrl;
+}
+function isModalOpen(modal) {
+  return !modal.classList.contains("hidden");
+}
+function isSettingsModalOpen() {
+  return isModalOpen(settingsModal);
+}
+function isOpenRouterConnectModalOpen() {
+  return isModalOpen(openRouterConnectModal);
+}
+function isOpenAiCompatibleConnectModalOpen() {
+  return isModalOpen(openAiCompatibleConnectModal);
+}
 function encodeBase64Url(bytes) {
   let binary = "";
   for (const byte of bytes) {
@@ -2958,6 +3196,7 @@ async function maybeHandleOpenRouterCallback() {
     if (onlyModelMissing) {
       modelDropdown.classList.remove("hidden");
       sessionDropdown.classList.add("hidden");
+      focusModelSearchInput();
     }
   } catch (error) {
     const message = error instanceof Error ? error.message : "Failed to connect OpenRouter";
@@ -2993,6 +3232,76 @@ async function disconnectOpenRouter() {
     disconnectOpenRouterBtn.disabled = false;
   }
 }
+async function connectOpenAiCompatible() {
+  const baseUrl = normalizeBaseUrl(openAiCompatibleBaseUrlInput.value);
+  const apiKey = openAiCompatibleApiKeyInput.value.trim();
+  if (!baseUrl) {
+    setOpenAiCompatibleConnectStatus("Endpoint is required.", "error");
+    return;
+  }
+  clearOpenAiCompatibleConnectStatus();
+  clearSettingsBanner();
+  openAiCompatibleConnectContinueBtn.disabled = true;
+  try {
+    const res = await fetch("/api/openai-compatible/connect", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        baseUrl,
+        apiKey,
+        persistToEnv: openAiCompatiblePersistCheckbox.checked
+      })
+    });
+    const body = await res.json();
+    if (!res.ok) {
+      throw new Error("error" in body ? body.error : `Failed to connect OpenAI-compatible provider (${res.status})`);
+    }
+    activeBaseUrl = body.baseUrl;
+    addMessage(body.message, "thinking");
+    const tone = body.persistWarning ? "info" : body.needsSetup ? "info" : "success";
+    setConfigConnectStatus(body.message, tone);
+    setSettingsBanner(body.message, tone === "success" ? "success" : "info");
+    closeOpenAiCompatibleConnectModal();
+    await fetchStatus();
+    await refreshModelList();
+    const onlyModelMissing = body.needsSetup && body.missing.length === 1 && body.missing[0]?.includes("MODEL");
+    if (onlyModelMissing) {
+      modelDropdown.classList.remove("hidden");
+      sessionDropdown.classList.add("hidden");
+      focusModelSearchInput();
+    }
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "Failed to connect OpenAI-compatible provider";
+    setOpenAiCompatibleConnectStatus(message, "error");
+  } finally {
+    openAiCompatibleConnectContinueBtn.disabled = false;
+  }
+}
+async function disconnectOpenAiCompatible() {
+  disconnectOpenAiCompatibleBtn.disabled = true;
+  clearSettingsBanner();
+  try {
+    const res = await fetch("/api/openai-compatible/disconnect", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" }
+    });
+    const body = await res.json();
+    if (!res.ok) {
+      throw new Error("error" in body ? body.error : `Failed to disconnect OpenAI-compatible provider (${res.status})`);
+    }
+    activeBaseUrl = body.baseUrl;
+    addMessage(body.message, "thinking");
+    setSettingsBanner(body.message, body.disconnected ? "success" : "info");
+    clearConfigConnectStatus();
+    await fetchStatus();
+    await refreshModelList();
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "Failed to disconnect OpenAI-compatible provider";
+    setSettingsBanner(message, "error");
+  } finally {
+    disconnectOpenAiCompatibleBtn.disabled = false;
+  }
+}
 async function fetchStatus() {
   try {
     const res = await fetch("/api/status");
@@ -3002,22 +3311,32 @@ async function fetchStatus() {
     activeModel = data.model;
     activeBaseUrl = data.baseUrl ?? "";
     sessionOpenRouterConnected = data.sessionOpenRouterConnected ?? false;
-    renderOpenRouterSessionControls();
+    sessionOpenAiCompatibleConnected = data.sessionOpenAiCompatibleConnected ?? false;
+    renderSessionProviderControls();
     if (data.needsSetup) {
       configOverlay.classList.remove("hidden");
       chatInput.disabled = true;
       sendBtn.disabled = true;
       const missingEl = document.getElementById("config-missing");
-      if (missingEl && data.missing && data.missing.length > 0) {
-        const isOnlyModelMissing = data.missing.length === 1 && data.missing[0].includes("MODEL");
-        const hasPersistedOpenRouter = isOnlyModelMissing && (data.baseUrl ?? "").includes("openrouter");
-        if (configOverlayIntro) {
-          configOverlayIntro.textContent = hasPersistedOpenRouter ? "OpenRouter is already configured. Select a model to continue:" : "minicode needs a model provider to run. Configure one of the following:";
+      const overlayState = deriveSetupOverlayState({
+        configuredProvider: data.configuredProvider ?? null,
+        missing: data.missing ?? []
+      });
+      if (configOverlayIntro) {
+        configOverlayIntro.textContent = overlayState.introText;
+      }
+      configOverlayQuickConnects?.classList.toggle("hidden", overlayState.hideQuickConnects);
+      configOverlaySpotlight?.classList.toggle("hidden", overlayState.hideOpenRouterSpotlight);
+      if (missingEl) {
+        if (overlayState.missingItems.length > 0) {
+          const hint = overlayState.showModelSelectionHint ? ` \u2014 select one from the <strong>model dropdown</strong> above, or set it in config` : "";
+          const note = overlayState.modelSelectionNote ? ` ${escapeHtml(overlayState.modelSelectionNote)}` : "";
+          missingEl.innerHTML = `<strong>Missing:</strong> ${overlayState.missingItems.map(escapeHtml).join(", ")}${hint}${note}`;
+          missingEl.classList.remove("hidden");
+        } else {
+          missingEl.classList.add("hidden");
+          missingEl.innerHTML = "";
         }
-        configOverlaySpotlight?.classList.toggle("hidden", hasPersistedOpenRouter);
-        const hint = isOnlyModelMissing ? ` \u2014 select one from the <strong>model dropdown</strong> above, or set it in config` : "";
-        missingEl.innerHTML = `<strong>Missing:</strong> ${data.missing.map(escapeHtml).join(", ")}${hint}`;
-        missingEl.classList.remove("hidden");
       }
     } else {
       configOverlay.classList.add("hidden");
@@ -3029,8 +3348,9 @@ async function fetchStatus() {
         missingEl.innerHTML = "";
       }
       if (configOverlayIntro) {
-        configOverlayIntro.textContent = "minicode needs a model provider to run. Configure one of the following:";
+        configOverlayIntro.textContent = DEFAULT_SETUP_INTRO;
       }
+      configOverlayQuickConnects?.classList.remove("hidden");
       configOverlaySpotlight?.classList.remove("hidden");
     }
   } catch {
@@ -3079,6 +3399,9 @@ function handleServerMessage(msg) {
       break;
     case "tool_call_end":
       finalizeToolCall(msg.name || "", msg.result || "", msg.elapsedMs || 0);
+      if (GRAPH_REFRESH_TOOL_NAMES.has(msg.name || "")) {
+        scheduleGraphDataRefresh();
+      }
       break;
     case "turn_end":
       if (hadToolCalls && msg.text) {
@@ -3264,8 +3587,12 @@ function addUsageInfo(usage) {
 function scrollToBottom() {
   messagesEl.scrollTop = messagesEl.scrollHeight;
 }
-function closeHeaderMenus() {
+function closeModelDropdown() {
   modelDropdown.classList.add("hidden");
+  modelSearchInput.value = "";
+}
+function closeHeaderMenus() {
+  closeModelDropdown();
   sessionDropdown.classList.add("hidden");
 }
 function formatSettingsValue(value) {
@@ -3279,16 +3606,31 @@ function clearSettingsBanner() {
   settingsBanner.textContent = "";
   settingsBanner.className = "settings-banner hidden";
 }
-function renderOpenRouterSessionControls() {
+function renderSessionProviderControls() {
   if (sessionOpenRouterConnected) {
     settingsOpenRouterSession.classList.remove("hidden");
     settingsOpenRouterSessionMeta.textContent = activeBaseUrl ? `Endpoint: ${activeBaseUrl}. This session-only connection overrides your original provider settings until you disconnect or restart serve.` : "This session-only connection overrides your original provider settings until you disconnect or restart serve.";
+    settingsOpenAiCompatibleSession.classList.add("hidden");
+    settingsOpenAiCompatibleSessionMeta.textContent = "";
+    disconnectOpenRouterBtn.disabled = false;
+    disconnectOpenAiCompatibleBtn.disabled = false;
+    return;
+  }
+  if (sessionOpenAiCompatibleConnected) {
+    settingsOpenAiCompatibleSession.classList.remove("hidden");
+    settingsOpenAiCompatibleSessionMeta.textContent = activeBaseUrl ? `Endpoint: ${activeBaseUrl}. This session-only connection overrides your original provider settings until you disconnect or restart serve.` : "This session-only connection overrides your original provider settings until you disconnect or restart serve.";
+    settingsOpenRouterSession.classList.add("hidden");
+    settingsOpenRouterSessionMeta.textContent = "";
     disconnectOpenRouterBtn.disabled = false;
+    disconnectOpenAiCompatibleBtn.disabled = false;
     return;
   }
   settingsOpenRouterSession.classList.add("hidden");
   settingsOpenRouterSessionMeta.textContent = "";
+  settingsOpenAiCompatibleSession.classList.add("hidden");
+  settingsOpenAiCompatibleSessionMeta.textContent = "";
   disconnectOpenRouterBtn.disabled = false;
+  disconnectOpenAiCompatibleBtn.disabled = false;
 }
 function createSettingsControl(entry, inputId) {
   const value = entry.persistedValue;
@@ -3499,6 +3841,27 @@ function closeOpenRouterConnectModal() {
   closeModal(openRouterConnectModal);
   openRouterConnectContinueBtn.disabled = false;
 }
+function openOpenAiCompatibleConnectModal() {
+  closeHeaderMenus();
+  openModal(openAiCompatibleConnectModal);
+  const preset = inferOpenAiCompatiblePreset(activeBaseUrl);
+  openAiCompatiblePresetSelect.value = preset;
+  openAiCompatibleBaseUrlInput.value = preset === "custom" ? activeBaseUrl : OPENAI_COMPATIBLE_PRESETS[preset].baseUrl;
+  openAiCompatibleApiKeyInput.value = "";
+  openAiCompatiblePersistCheckbox.checked = false;
+  openAiCompatibleConnectContinueBtn.disabled = false;
+  applyOpenAiCompatiblePreset(preset, { preserveCustomValue: preset === "custom" });
+  clearOpenAiCompatibleConnectStatus();
+  requestAnimationFrame(() => {
+    openAiCompatibleBaseUrlInput.focus();
+    openAiCompatibleBaseUrlInput.select();
+  });
+}
+function closeOpenAiCompatibleConnectModal() {
+  closeModal(openAiCompatibleConnectModal);
+  openAiCompatibleConnectContinueBtn.disabled = false;
+  clearOpenAiCompatibleConnectStatus();
+}
 chatForm.addEventListener("submit", (e) => {
   e.preventDefault();
   const message = chatInput.value.trim();
@@ -3522,30 +3885,99 @@ chatInput.addEventListener("keydown", (e) => {
   }
 });
 var activeModel = "";
+var availableModels = [];
+function focusModelSearchInput() {
+  requestAnimationFrame(() => {
+    modelSearchInput.focus();
+    modelSearchInput.select();
+  });
+}
+function renderModelList() {
+  const filteredModels = filterModelsByQuery(availableModels, modelSearchInput.value);
+  if (availableModels.length === 0) {
+    modelList.innerHTML = '<div class="dropdown-empty">No models available</div>';
+    return;
+  }
+  if (filteredModels.length === 0) {
+    modelList.innerHTML = '<div class="dropdown-empty">No matching models</div>';
+    return;
+  }
+  modelList.innerHTML = "";
+  for (const model of filteredModels) {
+    const el = document.createElement("button");
+    el.type = "button";
+    el.className = "model-item" + (model.id === activeModel ? " active" : "");
+    el.title = model.id;
+    const body = document.createElement("div");
+    body.className = "model-item-body";
+    const name = document.createElement("span");
+    name.className = "model-item-name";
+    name.textContent = getModelDisplayName(model);
+    body.appendChild(name);
+    if ((model.name ?? "").trim() && getModelDisplayName(model) !== model.id) {
+      const subtitle = document.createElement("span");
+      subtitle.className = "model-item-subtitle";
+      subtitle.textContent = model.id;
+      body.appendChild(subtitle);
+    }
+    el.appendChild(body);
+    if (model.id === activeModel) {
+      const badge = document.createElement("span");
+      badge.className = "model-item-badge";
+      badge.textContent = "Active";
+      el.appendChild(badge);
+    }
+    el.addEventListener("click", () => {
+      void switchModel(model.id);
+    });
+    modelList.appendChild(el);
+  }
+}
 modelBtn.addEventListener("click", (e) => {
   e.stopPropagation();
   const isOpen = !modelDropdown.classList.contains("hidden");
-  modelDropdown.classList.toggle("hidden");
-  sessionDropdown.classList.add("hidden");
-  if (!isOpen) {
-    refreshModelList();
+  if (isOpen) {
+    closeModelDropdown();
+    return;
   }
+  closeHeaderMenus();
+  modelDropdown.classList.remove("hidden");
+  modelSearchInput.value = "";
+  void refreshModelList({ focusSearch: true });
 });
 document.addEventListener("click", (e) => {
   if (!modelDropdown.contains(e.target) && e.target !== modelBtn) {
-    modelDropdown.classList.add("hidden");
+    closeModelDropdown();
+  }
+});
+modelSearchInput.addEventListener("input", () => {
+  renderModelList();
+});
+modelSearchInput.addEventListener("keydown", (e) => {
+  if (e.key === "Escape") {
+    if (modelSearchInput.value) {
+      modelSearchInput.value = "";
+      renderModelList();
+      return;
+    }
+    closeModelDropdown();
   }
 });
-async function refreshModelList() {
+modelSearchInput.addEventListener("click", (e) => {
+  e.stopPropagation();
+});
+async function refreshModelList(options = {}) {
   try {
     const res = await fetch("/api/models");
     const data = await res.json();
     activeModel = data.activeModel;
+    availableModels = data.models ?? [];
     const hasActiveModel = !!activeModel && data.models.some((model) => model.id === activeModel);
     if (!data.models || data.models.length === 0) {
       modelInfo.textContent = "Select model";
       modelInfo.classList.add("placeholder");
-      modelList.innerHTML = '<div class="dropdown-empty">No models available</div>';
+      availableModels = [];
+      renderModelList();
       return;
     }
     if (hasActiveModel) {
@@ -3555,18 +3987,12 @@ async function refreshModelList() {
       modelInfo.textContent = "Select model";
       modelInfo.classList.add("placeholder");
     }
-    modelList.innerHTML = "";
-    for (const m2 of data.models) {
-      const el = document.createElement("div");
-      el.className = "model-item" + (m2.id === activeModel ? " active" : "");
-      el.textContent = m2.name ?? m2.id;
-      el.title = m2.id;
-      el.addEventListener("click", () => {
-        void switchModel(m2.id);
-      });
-      modelList.appendChild(el);
+    renderModelList();
+    if (options.focusSearch && !modelDropdown.classList.contains("hidden")) {
+      focusModelSearchInput();
     }
   } catch {
+    availableModels = [];
     modelList.innerHTML = '<div class="dropdown-empty">Failed to load models</div>';
   }
 }
@@ -3587,7 +4013,8 @@ async function switchModel(modelId) {
     modelInfo.textContent = modelId || "Select model";
     modelInfo.classList.toggle("placeholder", !modelId);
     activeModel = modelId;
-    modelDropdown.classList.add("hidden");
+    renderModelList();
+    closeModelDropdown();
     if (body.persistedToEnv) {
       addMessage(`Model switched to: ${modelId}. Saved as the default in ~/.minicode/.env.`, "thinking");
     } else {
@@ -3603,7 +4030,7 @@ sessionBtn.addEventListener("click", (e) => {
   e.stopPropagation();
   const isOpen = !sessionDropdown.classList.contains("hidden");
   sessionDropdown.classList.toggle("hidden");
-  modelDropdown.classList.add("hidden");
+  closeModelDropdown();
   if (!isOpen) {
     refreshSessionList();
   }
@@ -3624,16 +4051,20 @@ saveBtn.addEventListener("click", async () => {
       headers: { "Content-Type": "application/json" },
       body: JSON.stringify({ label })
     });
-    if (res.ok) {
-      const data = await res.json();
-      saveLabelInput.value = "";
-      addMessage(
-        `${isUpdatingCurrentSession ? "Session updated" : "Session saved"}: "${data.label}"`,
-        "thinking"
-      );
-      await refreshSessionList();
+    const body = await res.json();
+    if (!res.ok) {
+      throw new Error("error" in body ? body.error : `Failed to save session (${res.status})`);
     }
-  } catch {
+    const data = body;
+    saveLabelInput.value = "";
+    addMessage(
+      `${isUpdatingCurrentSession ? "Session updated" : "Session saved"}: "${data.label}"`,
+      "thinking"
+    );
+    await refreshSessionList();
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "Failed to save session";
+    addMessage(message, "error");
   } finally {
     saveBtn.removeAttribute("disabled");
   }
@@ -3715,12 +4146,16 @@ sessionUpdateBtn.addEventListener("click", async () => {
       headers: { "Content-Type": "application/json" },
       body: JSON.stringify({ label: activeSavedSession.label })
     });
-    if (res.ok) {
-      const data = await res.json();
-      addMessage(`Session updated: "${data.label}"`, "thinking");
-      await refreshSessionList();
+    const body = await res.json();
+    if (!res.ok) {
+      throw new Error("error" in body ? body.error : `Failed to update session (${res.status})`);
     }
-  } catch {
+    const data = body;
+    addMessage(`Session updated: "${data.label}"`, "thinking");
+    await refreshSessionList();
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "Failed to update session";
+    addMessage(message, "error");
   } finally {
     sessionUpdateBtn.disabled = false;
   }
@@ -3743,10 +4178,19 @@ openRouterConnectCloseBtn.addEventListener("click", () => {
 openRouterConnectCancelBtn.addEventListener("click", () => {
   closeOpenRouterConnectModal();
 });
+openAiCompatibleConnectBackdrop.addEventListener("click", () => {
+  closeOpenAiCompatibleConnectModal();
+});
+openAiCompatibleConnectCloseBtn.addEventListener("click", () => {
+  closeOpenAiCompatibleConnectModal();
+});
+openAiCompatibleConnectCancelBtn.addEventListener("click", () => {
+  closeOpenAiCompatibleConnectModal();
+});
 settingsResetBtn.addEventListener("click", () => {
   clearSettingsBanner();
   renderSettings();
-  renderOpenRouterSessionControls();
+  renderSessionProviderControls();
 });
 settingsSaveBtn.addEventListener("click", async () => {
   if (!settingsPayload) {
@@ -3798,6 +4242,9 @@ settingsList.addEventListener("change", () => {
 disconnectOpenRouterBtn.addEventListener("click", () => {
   void disconnectOpenRouter();
 });
+disconnectOpenAiCompatibleBtn.addEventListener("click", () => {
+  void disconnectOpenAiCompatible();
+});
 document.addEventListener("keydown", (event) => {
   if (event.key !== "Escape") {
     return;
@@ -3806,6 +4253,10 @@ document.addEventListener("keydown", (event) => {
     closeOpenRouterConnectModal();
     return;
   }
+  if (isOpenAiCompatibleConnectModalOpen()) {
+    closeOpenAiCompatibleConnectModal();
+    return;
+  }
   if (isSettingsModalOpen()) {
     closeSettings();
   }
@@ -3815,11 +4266,29 @@ for (const button of connectOpenRouterButtons) {
     openOpenRouterConnectModal();
   });
 }
+for (const button of connectOpenAiCompatibleButtons) {
+  button.addEventListener("click", () => {
+    openOpenAiCompatibleConnectModal();
+  });
+}
+openAiCompatiblePresetSelect.addEventListener("change", () => {
+  applyOpenAiCompatiblePreset(openAiCompatiblePresetSelect.value);
+  clearOpenAiCompatibleConnectStatus();
+});
+openAiCompatibleBaseUrlInput.addEventListener("input", () => {
+  clearOpenAiCompatibleConnectStatus();
+});
+openAiCompatibleApiKeyInput.addEventListener("input", () => {
+  clearOpenAiCompatibleConnectStatus();
+});
 openRouterConnectContinueBtn.addEventListener("click", () => {
   openRouterConnectContinueBtn.disabled = true;
   closeOpenRouterConnectModal();
   void startOpenRouterConnect(openRouterPersistCheckbox.checked);
 });
+openAiCompatibleConnectContinueBtn.addEventListener("click", () => {
+  void connectOpenAiCompatible();
+});
 var chatPane = document.getElementById("chat-pane");
 var divider = document.getElementById("pane-divider");
 divider.addEventListener("mousedown", (e) => {