@sean.holung/minicode 0.3.8 → 0.3.10

package/dist/src/web/app.js

@@ -1787,6 +1787,13 @@ function highlightAgentActivity(symbolName) {
 function resizeGraph() {
   if (cy) cy.resize();
 }
+function syncDetailPanelLayout({ fit = false } = {}) {
+  if (!cy) return;
+  cy.resize();
+  if (fit && cy.nodes().length > 0) {
+    cy.fit(80);
+  }
+}
 async function loadGraphSnapshot(refreshIndex) {
   if (refreshIndex) {
     const refreshRes = await fetch("/api/index/refresh", { method: "POST" });
@@ -1848,6 +1855,7 @@ function renderGraphAfterDataRefresh(previousVisibleIds, preserveVisible) {
   if (!cy) return;
   cy.elements().remove();
   document.getElementById("symbol-detail")?.classList.add("hidden");
+  syncDetailPanelLayout();
   const visibleIds = preserveVisible ? [...new Set(previousVisibleIds)].filter((id) => graphNodes.has(id)) : [];
   for (const id of visibleIds) {
     addNodeToGraph(id);
@@ -1936,6 +1944,7 @@ function focusFileInGraph(filePath) {
   });
   cy.elements().remove();
   document.getElementById("symbol-detail")?.classList.add("hidden");
+  syncDetailPanelLayout();
   if (selection.nodeIds.length === 0) {
     const cyEl = document.getElementById("cy");
     if (cyEl) showOnboardingHint(cyEl);
@@ -1951,13 +1960,15 @@ function focusFileInGraph(filePath) {
   refreshAnalysisGraphState();
   runLayout();
 }
-function getFilePreviewLanguage(filePath) {
+function getHljsLanguage(filePath) {
   const ext = filePath.split(".").pop()?.toLowerCase() || "";
   const langMap = {
     ts: "typescript",
     tsx: "typescript",
     js: "javascript",
     jsx: "javascript",
+    py: "python",
+    pyi: "python",
     json: "json",
     md: "markdown",
     css: "css",
@@ -2011,7 +2022,7 @@ async function openFilePreview(filePath) {
       return;
     }
     pathEl.textContent = data.filePath;
-    codeEl.className = `file-preview-code language-${getFilePreviewLanguage(data.filePath)}`;
+    codeEl.className = `file-preview-code language-${getHljsLanguage(data.filePath)}`;
     codeEl.textContent = data.source;
     if (typeof hljs !== "undefined") {
       hljs.highlightElement(codeEl);
@@ -2513,6 +2524,7 @@ function setupInteractions(cyInst, detailEl) {
   cyInst.on("tap", function(evt) {
     if (evt.target === cyInst) {
       detailEl.classList.add("hidden");
+      syncDetailPanelLayout();
     }
   });
 }
@@ -2568,6 +2580,7 @@ async function showDetail(node, detailEl) {
   html += '<div class="detail-section" id="detail-refs"><div class="detail-section-title">References</div><div class="detail-section-list">Loading...</div></div>';
   detailEl.innerHTML = '<div class="resize-handle"></div>' + html;
   detailEl.classList.remove("hidden");
+  syncDetailPanelLayout({ fit: true });
   const handle = detailEl.querySelector(".resize-handle");
   handle.addEventListener("mousedown", (e) => {
     e.preventDefault();
@@ -2577,6 +2590,7 @@ async function showDetail(node, detailEl) {
     function onMove(ev) {
       const newWidth = startWidth - (ev.clientX - startX);
       detailEl.style.width = Math.max(200, newWidth) + "px";
+      syncDetailPanelLayout();
     }
     function onUp() {
       handle.classList.remove("dragging");
@@ -2629,9 +2643,7 @@ async function loadSource(name, detailEl) {
     const res = await fetch(`/api/symbols/${encodeURIComponent(name)}/source`);
     if (res.ok) {
       const data = await res.json();
-      const ext = (data.filePath || "").split(".").pop() || "";
-      const langMap = { ts: "typescript", tsx: "typescript", js: "javascript", jsx: "javascript" };
-      const lang = langMap[ext] || "typescript";
+      const lang = getHljsLanguage(data.filePath || "");
       codeEl.className = "detail-code language-" + lang;
       codeEl.textContent = data.source;
       if (typeof hljs !== "undefined") {
@@ -2876,6 +2888,7 @@ function setupToolbar() {
     if (!cy) return;
     cy.elements().remove();
     document.getElementById("symbol-detail").classList.add("hidden");
+    syncDetailPanelLayout();
     const cyEl = document.getElementById("cy");
     if (cyEl) showOnboardingHint(cyEl);
     refreshAnalysisGraphState();
@@ -2939,6 +2952,13 @@ var chatForm = document.getElementById("chat-form");
 var chatInput = document.getElementById("chat-input");
 var sendBtn = document.getElementById("send-btn");
 var cancelBtn = document.getElementById("cancel-btn");
+var autoAllowMode = document.getElementById("auto-allow-mode");
+var permissionModal = document.getElementById("permission-modal");
+var permissionToolName = document.getElementById("permission-tool-name");
+var permissionToolInput = document.getElementById("permission-tool-input");
+var permissionAllowBtn = document.getElementById("permission-allow");
+var permissionDenyBtn = document.getElementById("permission-deny");
+var pendingPermissionRequestId = null;
 var statusBadge = document.getElementById("status-badge");
 var modelInfo = document.getElementById("model-info");
 var modelBtn = document.getElementById("model-btn");
@@ -2950,6 +2970,7 @@ var sessionDropdown = document.getElementById("session-dropdown");
 var sessionList = document.getElementById("session-list");
 var sessionUpdateRow = document.getElementById("session-update-row");
 var sessionUpdateBtn = document.getElementById("session-update-btn");
+var sessionAutoSaveToggle = document.getElementById("session-autosave-toggle");
 var saveBtn = document.getElementById("save-btn");
 var saveLabelInput = document.getElementById("save-label");
 var contextFill = document.getElementById("context-fill");
@@ -3010,6 +3031,8 @@ 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 SESSION_AUTOSAVE_KEY = "minicode:session:auto-save";
+var SESSION_AUTOSAVE_LABEL_PREFIX = "Autosave";
 var OPENAI_COMPATIBLE_PRESETS = {
   lmstudio: {
     baseUrl: "http://localhost:1234/v1",
@@ -3032,6 +3055,11 @@ var OPENAI_COMPATIBLE_PRESETS = {
     apiKeyPlaceholder: "Add an API key only if this endpoint requires auth"
   }
 };
+var sessionAutoSaveEnabled = loadSessionAutoSavePreference();
+var pendingAutoSaveLabel = null;
+var autoSaveInFlight = null;
+var autoSaveQueued = false;
+sessionAutoSaveToggle.checked = sessionAutoSaveEnabled;
 function connect() {
   const protocol = location.protocol === "https:" ? "wss:" : "ws:";
   ws = new WebSocket(`${protocol}//${location.host}`);
@@ -3422,6 +3450,7 @@ function handleServerMessage(msg) {
       if (msg.usage) {
         addUsageInfo(msg.usage);
       }
+      queueSessionAutoSave();
       break;
     case "error":
       addMessage(`Error: ${msg.message || ""}`, "error");
@@ -3449,6 +3478,12 @@ function handleServerMessage(msg) {
       void fetchStatus();
       break;
     }
+    case "permission_required":
+      showPermissionModal(msg.requestId, msg.toolName, msg.input);
+      break;
+    case "auto_allow_mode_changed":
+      autoAllowMode.value = msg.mode;
+      break;
   }
 }
 function addMessage(text, type, markdown = false) {
@@ -3568,7 +3603,8 @@ function updateContextIndicator(contextTokens, maxContextTokens) {
   }
   contextLabel.textContent = pct + "%";
   const indicator = document.getElementById("context-indicator");
-  indicator.title = `Context: ~${contextTokens.toLocaleString()} / ${maxContextTokens.toLocaleString()} tokens (${pct}%)`;
+  indicator.title = `Context: ~${contextTokens.toLocaleString()} / ${maxContextTokens.toLocaleString()} tokens (${pct}%)
+Adjust context size in Settings if you want it larger or smaller.`;
 }
 async function fetchContext() {
   try {
@@ -3874,6 +3910,52 @@ chatForm.addEventListener("submit", (e) => {
 cancelBtn.addEventListener("click", () => {
   ws.send(JSON.stringify({ type: "cancel" }));
 });
+function showPermissionModal(requestId, toolName, input) {
+  pendingPermissionRequestId = requestId;
+  permissionToolName.textContent = toolName;
+  permissionToolInput.textContent = formatPermissionInput(input);
+  permissionModal.classList.remove("hidden");
+  permissionModal.setAttribute("aria-hidden", "false");
+  permissionAllowBtn.focus();
+}
+function hidePermissionModal() {
+  pendingPermissionRequestId = null;
+  permissionModal.classList.add("hidden");
+  permissionModal.setAttribute("aria-hidden", "true");
+}
+function formatPermissionInput(input) {
+  const truncated = {};
+  const MAX_FIELD_CHARS = 800;
+  for (const [key, value] of Object.entries(input)) {
+    if (typeof value === "string" && value.length > MAX_FIELD_CHARS) {
+      truncated[key] = value.slice(0, MAX_FIELD_CHARS) + `\u2026 [${value.length - MAX_FIELD_CHARS} more chars]`;
+    } else {
+      truncated[key] = value;
+    }
+  }
+  return JSON.stringify(truncated, null, 2);
+}
+function respondToPermission(decision) {
+  if (pendingPermissionRequestId === null) return;
+  ws.send(
+    JSON.stringify({
+      type: "permission_response",
+      requestId: pendingPermissionRequestId,
+      decision
+    })
+  );
+  hidePermissionModal();
+}
+permissionAllowBtn.addEventListener("click", () => respondToPermission("allow"));
+permissionDenyBtn.addEventListener("click", () => respondToPermission("deny"));
+autoAllowMode.addEventListener("change", () => {
+  ws.send(
+    JSON.stringify({
+      type: "set_auto_allow_mode",
+      mode: autoAllowMode.value
+    })
+  );
+});
 chatInput.addEventListener("input", () => {
   chatInput.style.height = "auto";
   chatInput.style.height = Math.min(chatInput.scrollHeight, 150) + "px";
@@ -4040,23 +4122,122 @@ document.addEventListener("click", (e) => {
     sessionDropdown.classList.add("hidden");
   }
 });
+function loadSessionAutoSavePreference() {
+  try {
+    return localStorage.getItem(SESSION_AUTOSAVE_KEY) === "1";
+  } catch {
+    return false;
+  }
+}
+function persistSessionAutoSavePreference(enabled) {
+  try {
+    if (enabled) {
+      localStorage.setItem(SESSION_AUTOSAVE_KEY, "1");
+    } else {
+      localStorage.removeItem(SESSION_AUTOSAVE_KEY);
+    }
+  } catch {
+  }
+}
+function buildAutoSaveLabel() {
+  return `${SESSION_AUTOSAVE_LABEL_PREFIX} ${(/* @__PURE__ */ new Date()).toLocaleString()}`;
+}
+async function persistCurrentSession(label) {
+  const res = await fetch("/api/sessions/save", {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ label })
+  });
+  const body = await res.json();
+  if (!res.ok) {
+    throw new Error("error" in body ? body.error : `Failed to save session (${res.status})`);
+  }
+  return body;
+}
+async function deleteSavedSession(session) {
+  const isCurrentSavedSession = activeSavedSession?.id === session.id;
+  const confirmed = window.confirm(`Delete saved session "${session.label}"?`);
+  if (!confirmed) {
+    return;
+  }
+  try {
+    const res = await fetch(`/api/sessions/${encodeURIComponent(session.id)}`, {
+      method: "DELETE"
+    });
+    const body = await res.json();
+    if (!res.ok) {
+      throw new Error("error" in body ? body.error : `Failed to delete session (${res.status})`);
+    }
+    if (isCurrentSavedSession) {
+      activeSavedSession = null;
+    }
+    if (pendingAutoSaveLabel === session.label) {
+      pendingAutoSaveLabel = null;
+    }
+    addMessage(
+      isCurrentSavedSession ? `Deleted saved session "${session.label}". The current chat stays open until you load another session or refresh.` : `Session deleted: "${session.label}"`,
+      "thinking"
+    );
+    await refreshSessionList();
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "Failed to delete session";
+    addMessage(message, "error");
+  }
+}
+async function maybeAutoSaveSession() {
+  if (!sessionAutoSaveEnabled) {
+    return;
+  }
+  const label = activeSavedSession?.label ?? pendingAutoSaveLabel ?? buildAutoSaveLabel();
+  try {
+    const data = await persistCurrentSession(label);
+    pendingAutoSaveLabel = data.label;
+    await refreshSessionList();
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "Failed to auto-save session";
+    addMessage(message, "error");
+  }
+}
+function queueSessionAutoSave() {
+  if (!sessionAutoSaveEnabled) {
+    return;
+  }
+  if (autoSaveInFlight) {
+    autoSaveQueued = true;
+    return;
+  }
+  autoSaveInFlight = (async () => {
+    await maybeAutoSaveSession();
+  })();
+  void autoSaveInFlight.finally(() => {
+    autoSaveInFlight = null;
+    if (autoSaveQueued) {
+      autoSaveQueued = false;
+      queueSessionAutoSave();
+    }
+  });
+}
+sessionAutoSaveToggle.addEventListener("change", () => {
+  sessionAutoSaveEnabled = sessionAutoSaveToggle.checked;
+  persistSessionAutoSavePreference(sessionAutoSaveEnabled);
+  if (sessionAutoSaveEnabled) {
+    addMessage(
+      activeSavedSession ? `Auto-save enabled. minicode will update "${activeSavedSession.label}" after each completed turn.` : "Auto-save enabled. minicode will save this chat after the next completed turn.",
+      "thinking"
+    );
+  } else {
+    addMessage("Auto-save disabled.", "thinking");
+  }
+});
 saveBtn.addEventListener("click", async () => {
   const requestedLabel = saveLabelInput.value.trim();
   const label = requestedLabel || activeSavedSession?.label || void 0;
   const isUpdatingCurrentSession = !!activeSavedSession && (requestedLabel.length === 0 || requestedLabel === activeSavedSession.label);
   try {
     saveBtn.setAttribute("disabled", "true");
-    const res = await fetch("/api/sessions/save", {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ label })
-    });
-    const body = await res.json();
-    if (!res.ok) {
-      throw new Error("error" in body ? body.error : `Failed to save session (${res.status})`);
-    }
-    const data = body;
+    const data = await persistCurrentSession(label);
     saveLabelInput.value = "";
+    pendingAutoSaveLabel = data.label;
     addMessage(
       `${isUpdatingCurrentSession ? "Session updated" : "Session saved"}: "${data.label}"`,
       "thinking"
@@ -4086,6 +4267,7 @@ async function refreshSessionList() {
     const sessions = data.sessions;
     activeSavedSession = sessions.find((session) => session.id === data.currentSessionId) ?? null;
     if (activeSavedSession) {
+      pendingAutoSaveLabel = activeSavedSession.label;
       sessionUpdateRow.classList.remove("hidden");
       sessionUpdateBtn.textContent = `Update "${activeSavedSession.label}"`;
       sessionUpdateBtn.title = `Save changes back to "${activeSavedSession.label}"`;
@@ -4103,8 +4285,22 @@ async function refreshSessionList() {
       const el = document.createElement("div");
       const isActive = activeSavedSession?.id === s.id;
       el.className = "session-item" + (isActive ? " active" : "");
-      el.innerHTML = `<span class="session-label">${escapeHtml(s.label)}</span><span class="session-meta">${s.messageCount} msgs${isActive ? ' <span class="session-active-badge">\u2022 active</span>' : ""}</span>`;
-      el.addEventListener("click", () => loadSession(s.label));
+      const loadBtn = document.createElement("button");
+      loadBtn.type = "button";
+      loadBtn.className = "session-load-btn";
+      loadBtn.innerHTML = `<span class="session-label">${escapeHtml(s.label)}</span><span class="session-meta">${s.messageCount} msgs${isActive ? ' <span class="session-active-badge">\u2022 active</span>' : ""}</span>`;
+      loadBtn.addEventListener("click", () => loadSession(s.label));
+      const deleteBtn = document.createElement("button");
+      deleteBtn.type = "button";
+      deleteBtn.className = "session-delete-btn";
+      deleteBtn.textContent = "Delete";
+      deleteBtn.title = `Delete "${s.label}"`;
+      deleteBtn.addEventListener("click", (event) => {
+        event.stopPropagation();
+        void deleteSavedSession(s);
+      });
+      el.appendChild(loadBtn);
+      el.appendChild(deleteBtn);
       sessionList.appendChild(el);
     }
   } catch {
@@ -4126,6 +4322,7 @@ async function loadSession(label) {
     if (res.ok) {
       const body = await res.json();
       sessionDropdown.classList.add("hidden");
+      pendingAutoSaveLabel = body.label;
       renderLoadedSessionMessages(body.messages);
       if (body.messages.length === 0) {
         addMessage(`Session "${body.label}" restored`, "thinking");
@@ -4141,16 +4338,8 @@ sessionUpdateBtn.addEventListener("click", async () => {
   }
   try {
     sessionUpdateBtn.disabled = true;
-    const res = await fetch("/api/sessions/save", {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ label: activeSavedSession.label })
-    });
-    const body = await res.json();
-    if (!res.ok) {
-      throw new Error("error" in body ? body.error : `Failed to update session (${res.status})`);
-    }
-    const data = body;
+    const data = await persistCurrentSession(activeSavedSession.label);
+    pendingAutoSaveLabel = data.label;
     addMessage(`Session updated: "${data.label}"`, "thinking");
     await refreshSessionList();
   } catch (error) {

package/dist/src/web/index.html

@@ -5,18 +5,37 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>minicode</title>
   <link rel="stylesheet" href="style.css">
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600&display=swap" rel="stylesheet">
   <script src="https://unpkg.com/cytoscape@3.30.4/dist/cytoscape.min.js"></script>
   <link rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@11.11.1/styles/tokyo-night-dark.min.css">
   <script src="https://unpkg.com/@highlightjs/cdn-assets@11.11.1/highlight.min.js"></script>
   <script src="https://unpkg.com/@highlightjs/cdn-assets@11.11.1/languages/typescript.min.js"></script>
+  <script src="https://unpkg.com/@highlightjs/cdn-assets@11.11.1/languages/python.min.js"></script>
 </head>
 <body>
   <div id="app">
     <header>
       <div class="header-left">
-        <h1>minicode</h1>
+        <h1>
+          <span class="logo-glyph" aria-hidden="true">
+            <svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <line x1="9" y1="9" x2="22" y2="11" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" opacity="0.55"/>
+              <line x1="9" y1="9" x2="10" y2="22" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" opacity="0.55"/>
+              <line x1="22" y1="11" x2="23" y2="23" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" opacity="0.55"/>
+              <line x1="10" y1="22" x2="23" y2="23" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" opacity="0.55"/>
+              <line x1="9" y1="9" x2="23" y2="23" stroke="currentColor" stroke-width="1" stroke-linecap="round" opacity="0.35"/>
+              <circle cx="9"  cy="9"  r="3"   fill="currentColor"/>
+              <circle cx="22" cy="11" r="2.6" fill="currentColor" opacity="0.85"/>
+              <circle cx="10" cy="22" r="2.6" fill="currentColor" opacity="0.85"/>
+              <circle cx="23" cy="23" r="3"   fill="currentColor"/>
+            </svg>
+          </span>
+          minicode
+        </h1>
         <span id="status-badge" class="badge ready">ready</span>
-        <div id="context-indicator" title="Context window usage">
+        <div id="context-indicator" title="Context window usage. Adjust context size in Settings if you want it larger or smaller.">
           <div id="context-bar">
             <div id="context-fill"></div>
           </div>
@@ -45,6 +64,10 @@
               <div id="session-update-row" class="session-update-row hidden">
                 <button id="session-update-btn" class="dropdown-action" type="button">Update current saved session</button>
               </div>
+              <label id="session-autosave-row" class="session-autosave-row" title="Automatically save or update this chat after each completed turn.">
+                <input id="session-autosave-toggle" type="checkbox" />
+                <span>Auto-save after each turn</span>
+              </label>
               <div class="dropdown-row">
                 <input id="save-label" type="text" placeholder="Label (optional)" />
                 <button id="save-btn" class="dropdown-action">Save</button>
@@ -120,6 +143,15 @@ MODEL=your-model-name</pre>
         </div>
         <main id="messages"></main>
         <footer>
+          <label id="auto-allow-row" class="auto-allow-row" title="Skip the approval prompt for some or all of write_file, edit_file, and run_command. The mode persists for this session only.">
+            <span>Auto-allow:</span>
+            <select id="auto-allow-mode">
+              <option value="none">none — always prompt</option>
+              <option value="writes">writes only (write_file, edit_file)</option>
+              <option value="commands">commands only (run_command)</option>
+              <option value="all">all — write_file, edit_file, run_command</option>
+            </select>
+          </label>
           <form id="chat-form">
             <textarea id="chat-input" placeholder="Send a message..." rows="1" autofocus></textarea>
             <button type="submit" id="send-btn">Send</button>
@@ -355,6 +387,35 @@ MODEL=your-model-name</pre>
     </section>
   </div>
 
+  <div id="permission-modal" class="modal hidden" aria-hidden="true">
+    <div id="permission-backdrop" class="modal-backdrop"></div>
+    <section class="modal-panel modal-panel-compact" role="dialog" aria-modal="true" aria-labelledby="permission-title">
+      <div class="modal-header">
+        <div>
+          <h2 id="permission-title">Allow this action?</h2>
+          <p id="permission-subtitle" class="modal-subtitle">The agent wants to run a tool that modifies your workspace.</p>
+        </div>
+      </div>
+      <div class="permission-body">
+        <div class="permission-tool">
+          <span class="permission-label">Tool</span>
+          <code id="permission-tool-name"></code>
+        </div>
+        <div class="permission-tool">
+          <span class="permission-label">Input</span>
+          <pre id="permission-tool-input" class="permission-tool-input"></pre>
+        </div>
+      </div>
+      <div class="modal-footer">
+        <p class="settings-footnote">To skip future prompts for this session, change the <strong>Auto-allow</strong> dropdown below the chat input.</p>
+        <div class="settings-actions">
+          <button id="permission-deny" class="header-btn" type="button">Deny</button>
+          <button id="permission-allow" class="dropdown-action" type="button">Allow</button>
+        </div>
+      </div>
+    </section>
+  </div>
+
   <script type="module" src="app.js"></script>
 </body>
 </html>