@starlove/orbit 1.2.0 → 1.3.0

package/public/index.html

@@ -37,10 +37,10 @@
         <!-- Boot splash — the canonical ss-ui loading screen (see the package's
              components/loader.css). Inline critical CSS so it paints before
              /js/main.js loads. The logo grows in then breathes; no spinner.
-             Keyframes namespaced `ss-loader-*`. Under reduced motion the grow-in
+             Keyframes namespaced `starscape-loader-*`. Under reduced motion the grow-in
              is dropped and the dot grid stops; the gentle breathe stays. -->
         <style>
-            .ss-loader {
+            .loader {
                 position: fixed;
                 inset: 0;
                 z-index: 99999;
@@ -60,7 +60,7 @@
                 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
                     Roboto, "Helvetica Neue", Arial, sans-serif;
             }
-            .ss-loader::before {
+            .loader::before {
                 content: "";
                 position: absolute;
                 width: 200%;
@@ -72,24 +72,28 @@
                 );
                 background-size: 50px 50px;
                 will-change: transform;
-                animation: ss-loader-drift 20s linear infinite;
+                animation: starscape-loader-drift 20s linear infinite;
             }
-            .ss-loader.is-hiding {
+            .loader.is-hiding {
                 opacity: 0;
                 pointer-events: none;
             }
-            .ss-loader__logo {
+            .loader__logo {
                 width: 120px;
                 height: 120px;
                 object-fit: contain;
                 filter: drop-shadow(0 0 20px rgba(255, 255, 255, 0.3));
                 transform-origin: center;
+                /* translateZ in the keyframes + backface-visibility keep the star
+                   on a stable GPU layer, so it doesn't snap ~1px as the grow
+                   starts. Keep in sync with the package components/loader.css. */
+                backface-visibility: hidden;
                 will-change: transform;
                 animation:
-                    ss-loader-grow 0.6s cubic-bezier(0.22, 1, 0.36, 1) both,
-                    ss-loader-breathe 3s ease-in-out 0.6s infinite;
+                    starscape-loader-grow 0.6s cubic-bezier(0.22, 1, 0.36, 1) both,
+                    starscape-loader-breathe 3s ease-in-out 0.6s infinite;
             }
-            .ss-loader__label {
+            .loader__label {
                 margin: 0;
                 color: #fff;
                 font-size: 1.25rem;
@@ -97,45 +101,45 @@
                 letter-spacing: 0.5px;
                 text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
             }
-            @keyframes ss-loader-drift {
+            @keyframes starscape-loader-drift {
                 from { transform: translate(0, 0); }
                 to { transform: translate(-50px, -50px); }
             }
-            @keyframes ss-loader-grow {
-                from { transform: scale(0); opacity: 0; }
-                to { transform: scale(1); opacity: 1; }
+            @keyframes starscape-loader-grow {
+                from { transform: scale(0) translateZ(0); opacity: 0; }
+                to { transform: scale(1) translateZ(0); opacity: 1; }
             }
-            @keyframes ss-loader-breathe {
-                0%, 100% { transform: scale(1); }
-                50% { transform: scale(1.06); }
+            @keyframes starscape-loader-breathe {
+                0%, 100% { transform: scale(1) translateZ(0); }
+                50% { transform: scale(1.06) translateZ(0); }
             }
             @media (prefers-reduced-motion: reduce) {
-                :root:not([data-motion="full"]) .ss-loader::before {
+                :root:not([data-motion="full"]) .loader::before {
                     animation: none;
                 }
-                :root:not([data-motion="full"]) .ss-loader__logo {
-                    animation: ss-loader-breathe 3s ease-in-out infinite;
+                :root:not([data-motion="full"]) .loader__logo {
+                    animation: starscape-loader-breathe 3s ease-in-out infinite;
                 }
             }
-            [data-motion="reduce"] .ss-loader::before {
+            [data-motion="reduce"] .loader::before {
                 animation: none;
             }
-            [data-motion="reduce"] .ss-loader__logo {
-                animation: ss-loader-breathe 3s ease-in-out infinite;
+            [data-motion="reduce"] .loader__logo {
+                animation: starscape-loader-breathe 3s ease-in-out infinite;
             }
         </style>
     </head>
     <body>
         <!-- Boot splash - shown immediately, removed once the app is ready. -->
-        <div id="ss-loader" class="ss-loader" role="status" aria-live="polite">
+        <div id="loader" class="loader" role="status" aria-live="polite">
             <img
-                class="ss-loader__logo"
+                class="loader__logo"
                 src="./orbits-logo.png"
                 alt="Orbit"
                 width="120"
                 height="120"
             />
-            <p class="ss-loader__label">Loading Orbit…</p>
+            <p class="loader__label">Loading Orbit…</p>
         </div>
 
         <div class="grain">
@@ -143,9 +147,40 @@
         </div>
         <header class="topbar">
             <div class="brand" aria-label="Orbit">
-                <img class="mark" src="./orbits-logo.png" alt="Orbits logo" />
+                <button
+                    id="brandFocusBtn"
+                    type="button"
+                    class="brand-focus-btn"
+                    data-variant="brand-focus"
+                    aria-label="Show board notes"
+                    aria-expanded="false"
+                    aria-controls="brandFocusPopover"
+                >
+                    <img class="mark" src="./orbits-logo.png" alt="Orbits logo" />
+                </button>
+                <div
+                    id="brandFocusPopover"
+                    class="brand-focus-popover"
+                    role="dialog"
+                    aria-label="Board notes"
+                    hidden
+                >
+                    <div class="brand-focus-popover__eyebrow">Board notes</div>
+                    <div id="brandFocusNotes" class="brand-focus-notes-body">No board notes yet</div>
+                </div>
             </div>
             <div class="controls">
+                <button
+                    id="brandNotesBtn"
+                    type="button"
+                    class="topbar-notes brand-notes-strip"
+                    data-variant="topbar-notes"
+                    aria-label="Show board notes"
+                    aria-expanded="false"
+                    aria-controls="brandFocusPopover"
+                >
+                    <span id="brandNotesText" class="topbar-notes__text"></span>
+                </button>
                 <span class="topbar-controls-gap" aria-hidden="true"></span>
                 <div class="topbar-search" id="topbarSearch">
                     <input
@@ -235,6 +270,32 @@
                         />
                     </svg>
                 </button>
+                <button
+                    id="helpBtn"
+                    type="button"
+                    class="topbar-btn topbar-ctl-shrink"
+                    data-variant="translucent"
+                    aria-haspopup="dialog"
+                    aria-controls="helpDialog"
+                >
+                    <svg
+                        class="topbar-icon"
+                        width="16"
+                        height="16"
+                        viewBox="0 0 24 24"
+                        fill="none"
+                        stroke="currentColor"
+                        stroke-width="2"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        aria-hidden="true"
+                    >
+                        <circle cx="12" cy="12" r="10" />
+                        <path d="M9.09 9a3 3 0 015.83 1c0 2-3 3-3 3" />
+                        <path d="M12 17h.01" />
+                    </svg>
+                    Help
+                </button>
                 <button
                     id="settingsBtn"
                     type="button"
@@ -424,6 +485,141 @@
             </div>
         </dialog>
 
+        <!-- Help & About. Reuses the .orbit-dialog shell + welcome-dialog-*
+             styling so it inherits the modal chrome; opened from the topbar
+             Help button and wired through modal.js (Escape/backdrop close). -->
+        <dialog
+            id="helpDialog"
+            class="orbit-dialog"
+            aria-labelledby="helpDialogTitle"
+        >
+            <div class="welcome-dialog-inner help-dialog-inner">
+                <div class="welcome-dialog-head">
+                    <img
+                        class="welcome-dialog-logo"
+                        src="./orbits-logo.png"
+                        alt=""
+                        aria-hidden="true"
+                    />
+                    <span
+                        class="welcome-dialog-edition-pill"
+                        id="helpDialogVersion"
+                        >Orbit</span
+                    >
+                    <button
+                        type="button"
+                        class="help-dialog-close"
+                        aria-label="Close"
+                        data-modal-close
+                    >
+                        ×
+                    </button>
+                </div>
+                <div class="welcome-dialog-body">
+                    <h2 id="helpDialogTitle" class="welcome-dialog-title">
+                        Starscape Orbit
+                    </h2>
+                    <p class="welcome-dialog-lede">
+                        A developer-first kanban board built for teams working
+                        alongside AI agents. Track the motion of your project —
+                        and hand work to your coding agent through the Orbit MCP
+                        tools.
+                    </p>
+
+                    <section
+                        class="help-dialog-section"
+                        aria-label="Getting started"
+                    >
+                        <h3 class="help-dialog-heading">Getting started</h3>
+                        <ol class="help-dialog-steps">
+                            <li class="help-dialog-step">
+                                <span class="help-dialog-step__index">01</span>
+                                <div>
+                                    <h4>Create a board</h4>
+                                    <p>
+                                        Use the <strong>Board</strong> menu →
+                                        New board. Optionally point it at a
+                                        coding project folder so Orbit can drop
+                                        <code>SKILL-ORBIT.md</code> and
+                                        <code>AGENTS.md</code> for your agent.
+                                    </p>
+                                </div>
+                            </li>
+                            <li class="help-dialog-step">
+                                <span class="help-dialog-step__index">02</span>
+                                <div>
+                                    <h4>Add cards &amp; the AI Ready lane</h4>
+                                    <p>
+                                        Capture work with
+                                        <strong>New Card</strong>. Move cards
+                                        into <strong>AI Ready</strong> to stage
+                                        them for an agent to claim.
+                                    </p>
+                                </div>
+                            </li>
+                            <li class="help-dialog-step">
+                                <span class="help-dialog-step__index">03</span>
+                                <div>
+                                    <h4>Connect your coding agent</h4>
+                                    <p>
+                                        Add the Orbit MCP server from
+                                        <strong>Settings</strong>, then ask your
+                                        agent to read <code>AGENTS.md</code> and
+                                        claim the next ticket.
+                                    </p>
+                                </div>
+                            </li>
+                        </ol>
+                    </section>
+
+                    <section
+                        class="help-dialog-section"
+                        aria-label="Links"
+                    >
+                        <h3 class="help-dialog-heading">Links</h3>
+                        <ul class="help-dialog-links">
+                            <li>
+                                <a
+                                    class="welcome-dialog-link"
+                                    href="https://orbit.starscape.app"
+                                    target="_blank"
+                                    rel="noopener"
+                                    >Documentation</a
+                                >
+                            </li>
+                            <li>
+                                <a
+                                    class="welcome-dialog-link"
+                                    href="https://github.com/brucestarlove/ss-orbit/blob/master/docs/MCP_SETUP.md"
+                                    target="_blank"
+                                    rel="noopener"
+                                    >MCP setup</a
+                                >
+                            </li>
+                            <li>
+                                <a
+                                    class="welcome-dialog-link"
+                                    href="https://orbit.starscape.app/support"
+                                    target="_blank"
+                                    rel="noopener"
+                                    >Support / Tip</a
+                                >
+                            </li>
+                        </ul>
+                    </section>
+                </div>
+                <footer class="welcome-dialog-footer">
+                    <button
+                        type="button"
+                        class="welcome-dialog-cta"
+                        data-modal-close
+                    >
+                        Got it
+                    </button>
+                </footer>
+            </div>
+        </dialog>
+
         <script src="/js/main.js" type="module"></script>
         <!-- Fade out the boot splash once the DOM is ready. The /js/main.js
              module runs before DOMContentLoaded, so theme/motion + wiring are
@@ -431,7 +627,7 @@
         <script>
             (function () {
                 function hideSplash() {
-                    var splash = document.getElementById("ss-loader");
+                    var splash = document.getElementById("loader");
                     if (!splash) return;
                     // Keep the splash up for a minimum of 786ms (measured from
                     // navigation start) so a fast load doesn't flash it in and out.

package/public/js/app.js

@@ -2,7 +2,7 @@
 // modules can import `load` / `render` without pulling in the entry-point
 // init wiring (which would create import cycles).
 
-import { state, syncBoardSelection } from "./state.js";
+import { state, syncBoardSelection, currentBoard } from "./state.js";
 import { api, bootstrapPath } from "./api.js";
 import { renderBoard, renderBoardSelection } from "./kanban.js";
 import { renderDetail } from "./ticket-detail.js";
@@ -10,6 +10,7 @@ import { closeMenuFlyouts, updateTopbarChips } from "./board-menu.js";
 import { connectEventStream } from "./sse.js";
 import { seedReadIfNeeded } from "./unread.js";
 import { features } from "./config.js";
+import { renderTopbarFocus } from "./topbar-notes.js";
 
 let sseBoardId = null;
 
@@ -30,6 +31,7 @@ export async function load() {
 export async function render() {
   syncBoardSelection();
   updateTopbarChips();
+  renderTopbarFocus(currentBoard());
   renderBoard();
   await renderDetail();
 }
@@ -37,6 +39,7 @@ export async function render() {
 export async function renderDetailOnly() {
   syncBoardSelection();
   updateTopbarChips();
+  renderTopbarFocus(currentBoard());
   renderBoardSelection();
   await renderDetail();
 }

package/public/js/board-menu.js

@@ -65,12 +65,18 @@ function renderBoardFlyoutInner() {
     <div class="menu-flyout-section">
       <h3 class="menu-flyout-heading">New board</h3>
       <form id="createBoardForm" class="menu-flyout-form">
+        <input name="name" type="text" required placeholder="Board name" autocomplete="off" />
         <div class="folder-picker-field">
-          <input id="repoPathInput" name="repo_path" type="text" required readonly placeholder="Choose a folder" autocomplete="off" />
+          <input id="repoPathInput" name="repo_path" type="text" readonly placeholder="Coding project folder (optional)" autocomplete="off" />
           <button type="button" id="pickRepoFolderBtn">Browse</button>
         </div>
-        <p class="menu-flyout-hint menu-flyout-hint--intro">Board data is stored in <code>.orbit/</code> under this folder.</p>
-        <input name="name" type="text" required placeholder="Board name" autocomplete="off" />
+        <div id="helperFilesReveal" hidden>
+          <p class="menu-flyout-hint menu-flyout-hint--intro">Orbit writes <code>SKILL-ORBIT.md</code> and <code>AGENTS.md</code> into this folder for your AI coding agent.</p>
+          <label class="menu-flyout-check">
+            <input id="helperFilesCheckbox" name="manage_helper_files" type="checkbox" checked />
+            <span>Generate AI helper files (<code>SKILL-ORBIT.md</code>, <code>AGENTS.md</code>)</span>
+          </label>
+        </div>
         <input name="slug" type="text" placeholder="Slug (optional)" autocomplete="off" />
         <input name="default_branch" type="text" placeholder="Default branch (optional)" autocomplete="off" />
         <input name="repo_url" type="text" placeholder="Repo URL (optional)" autocomplete="off" />
@@ -103,6 +109,14 @@ function wireBoardFlyout() {
   if (form) {
     const pickRepoFolderBtn = form.querySelector("#pickRepoFolderBtn");
     const repoPathInput = form.querySelector("#repoPathInput");
+    const helperFilesReveal = form.querySelector("#helperFilesReveal");
+    // The folder explanation and "Generate AI helper files" option only make
+    // sense once a folder is chosen — there's nowhere to write them otherwise.
+    // Reveal both with the folder value rather than disabling.
+    const syncHelperFilesVisibility = () => {
+      if (helperFilesReveal) helperFilesReveal.hidden = !repoPathInput.value.trim();
+    };
+    syncHelperFilesVisibility();
     pickRepoFolderBtn?.addEventListener("click", async (event) => {
       event.preventDefault();
       pickRepoFolderBtn.disabled = true;
@@ -111,6 +125,7 @@ function wireBoardFlyout() {
         if (result.path) {
           repoPathInput.value = result.path;
           repoPathInput.dispatchEvent(new Event("input", { bubbles: true }));
+          syncHelperFilesVisibility();
         }
       } catch (error) {
         toast.error(error?.message || "Folder picker unavailable");
@@ -125,15 +140,13 @@ function wireBoardFlyout() {
       const branch = String(fd.get("default_branch") || "").trim();
       const repo = String(fd.get("repo_url") || "").trim();
       const repoPath = String(fd.get("repo_path") || "").trim();
-      if (!repoPath) {
-        repoPathInput?.reportValidity();
-        return;
-      }
+      // Folder is optional. Only forward the helper-files choice when a folder
+      // is set; the server ignores it otherwise.
       const created = await api("/api/boards", {
         method: "POST",
         body: {
           name: fd.get("name"),
-          repo_path: repoPath,
+          ...(repoPath ? { repo_path: repoPath, manage_helper_files: fd.get("manage_helper_files") === "on" } : {}),
           ...(slug ? { slug } : {}),
           ...(branch ? { default_branch: branch } : {}),
           ...(repo ? { repo_url: repo } : {})

package/public/js/help-menu.js

@@ -0,0 +1,31 @@
+// Help & About dialog. The topbar "Help" button opens a centered
+// .orbit-dialog (same shell as the welcome dialog) describing what Orbit is,
+// how to get started, and where the docs live. modal.js owns the
+// Escape/backdrop/close-button behavior; this module only wires the open
+// trigger and best-effort fills the version pill from the build's version.json.
+
+import { openModal, wireModal } from "./modal.js";
+
+async function fillVersion(pill) {
+  if (!pill) return;
+  try {
+    const res = await fetch("./version.json", { cache: "no-store" });
+    if (!res.ok) return;
+    const info = await res.json();
+    if (info?.version) pill.textContent = `v${info.version}`;
+  } catch {
+    // Dev edition serves raw modules without version.json — leave the
+    // static "Orbit" label in place.
+  }
+}
+
+export function wireHelpMenu() {
+  const dialog = document.getElementById("helpDialog");
+  const helpBtn = document.getElementById("helpBtn");
+  if (!dialog || !helpBtn) return;
+
+  wireModal(dialog);
+  fillVersion(document.getElementById("helpDialogVersion"));
+
+  helpBtn.addEventListener("click", () => openModal(dialog));
+}

package/public/js/main.js

@@ -41,10 +41,14 @@ import { runSearch, hideSearch } from "./search.js";
 import { load } from "./app.js";
 import { edition } from "./config.js";
 import { openModal, wireModal } from "./modal.js";
+import { wireTopbarFocus } from "./topbar-notes.js";
+import { wireHelpMenu } from "./help-menu.js";
 
 async function init() {
   const welcomeDialog = document.getElementById("welcomeDialog");
   wireModal(welcomeDialog);
+  wireTopbarFocus();
+  wireHelpMenu();
   if (edition === "preview") {
     openModal(welcomeDialog);
   }

package/public/js/settings.js

@@ -118,6 +118,11 @@ const MCP_CLIENTS = {
     format: "MCP JSON",
     helper: "Paste this JSON into Cursor MCP settings. Cursor starts Orbit when an agent needs the tools."
   },
+  vscode: {
+    label: "VS Code",
+    format: "mcp.json",
+    helper: "Paste this JSON into VS Code's user or workspace MCP configuration."
+  },
   opencode: {
     label: "OpenCode",
     format: "opencode.json",
@@ -138,8 +143,9 @@ const MCP_CLIENTS = {
 function renderProjectAiTab(context) {
   const project = context.board;
   const aiEnabled = project.ai_enabled !== 0;
-  const aiDivider = aiEnabled ? `<div class="ai-section-divider" aria-hidden="true"></div>` : "";
+  const aiDivider = aiEnabled ? `<div class="separator" aria-hidden="true"></div>` : "";
   const agentContextSetup = aiEnabled ? renderAgentContextSection(project) : "";
+  const helperFilesSetup = aiEnabled && features.multiBoard ? renderHelperFilesSection(project) : "";
   const mcpSetup = aiEnabled ? renderMcpSetupSection(context) : "";
 
   return `
@@ -159,6 +165,7 @@ function renderProjectAiTab(context) {
     </div>
     ${aiDivider}
     ${agentContextSetup}
+    ${helperFilesSetup ? `${aiDivider}${helperFilesSetup}` : ""}
     ${aiDivider}
     ${mcpSetup}
   `;
@@ -174,7 +181,7 @@ function renderAgentContextSection(project) {
   return `
     <div class="section ai-subsection ai-context-setup">
       <div class="ai-context-title-row">
-        <span class="ai-context-inline-mark" aria-hidden="true">Context</span>
+        <span class="section-mark" aria-hidden="true">Context</span>
         <h3>Agent Instructions</h3>
       </div>
       <p class="description">This project-level context is provided to agents when they work on tickets.</p>
@@ -203,7 +210,7 @@ function renderMcpSetupSection(context) {
     <details class="section ai-subsection mcp-setup" data-mcp-setup>
       <summary>
         <div class="mcp-title-row">
-          <span class="mcp-inline-mark" aria-hidden="true">MCP</span>
+          <span class="section-mark" aria-hidden="true">MCP</span>
           <h3>Connect Your Agent to MCP</h3>
         </div>
       </summary>
@@ -302,6 +309,7 @@ function mcpConfigText(clientId, paths) {
   if (clientId === "claude-code") return claudeCodeMcpCommand(paths);
   if (clientId === "codex") return codexMcpToml(paths);
   if (clientId === "opencode") return opencodeMcpJson(paths);
+  if (clientId === "vscode") return vscodeMcpJson(paths);
 
   const config = {
     mcpServers: {
@@ -331,6 +339,22 @@ function opencodeMcpJson(paths) {
   );
 }
 
+function vscodeMcpJson(paths) {
+  return JSON.stringify(
+    {
+      servers: {
+        starscapeOrbit: {
+          type: "stdio",
+          command: "node",
+          args: [paths.serverPath]
+        }
+      }
+    },
+    null,
+    2
+  );
+}
+
 function codexMcpToml(paths) {
   return `[mcp_servers.starscape-orbit]
 command = "node"
@@ -426,6 +450,31 @@ function renderProjectRepositoryTab(context) {
   `;
 }
 
+function renderHelperFilesSection(project) {
+  const hasFolder = Boolean(project.system_path);
+  const managed = Boolean(project.manage_helper_files);
+  return `
+    <div class="section ai-subsection helper-files-section">
+      <div class="ai-context-title-row">
+        <span class="section-mark" aria-hidden="true">Files</span>
+        <h3>AI Helper Files</h3>
+      </div>
+      <p class="description">Orbit can keep <code>SKILL-ORBIT.md</code> and <code>AGENTS.md</code> in this board's coding project folder so your AI agent knows how to use Orbit.${hasFolder ? "" : " Link a folder to enable this."}</p>
+      <div class="folder-picker-field helper-files-folder">
+        <input id="helperFolderInput" type="text" readonly placeholder="No folder linked" value="${escapeHtml(project.system_path || "")}" />
+        <button type="button" id="helperPickFolderBtn">${hasFolder ? "Change" : "Browse"}</button>
+      </div>
+      <label class="orbit-check">
+        <input type="checkbox" id="manageHelperFilesToggle" ${managed ? "checked" : ""} ${hasFolder ? "" : "disabled"} />
+        <span class="orbit-check-box" aria-hidden="true">
+          <svg viewBox="0 0 16 16" class="orbit-check-tick"><path d="M3.5 8.5l3 3 6-7" /></svg>
+        </span>
+        <span>Generate &amp; maintain helper files in this folder</span>
+      </label>
+    </div>
+  `;
+}
+
 function renderBoardRenameSection(project) {
   return `
     <div class="section board-rename-section">
@@ -953,6 +1002,49 @@ function bindProjectTabHandlers(context, tab) {
       toast.success(enabled ? "AI features enabled — agent lanes provisioned" : "AI features disabled — AI Ready hidden");
     });
 
+    const helperPickFolderBtn = $("#helperPickFolderBtn");
+    helperPickFolderBtn?.addEventListener("click", async () => {
+      helperPickFolderBtn.disabled = true;
+      try {
+        const result = await api("/api/system/pick-folder", { method: "POST" });
+        if (!result.path) return;
+        await api(`/api/boards/${encodeURIComponent(project.id)}`, {
+          method: "PATCH",
+          body: { system_path: result.path }
+        });
+        await load();
+        state.detailMode = "settings";
+        toast.success("Linked coding project folder updated");
+      } catch (error) {
+        toast.error(error?.message || "Folder picker unavailable");
+      } finally {
+        helperPickFolderBtn.disabled = false;
+      }
+    });
+
+    const manageHelperFilesToggle = $("#manageHelperFilesToggle");
+    manageHelperFilesToggle?.addEventListener("change", async () => {
+      const enabled = manageHelperFilesToggle.checked;
+      manageHelperFilesToggle.disabled = true;
+      try {
+        await api(`/api/boards/${encodeURIComponent(project.id)}`, {
+          method: "PATCH",
+          body: { manage_helper_files: enabled }
+        });
+        await load();
+        state.detailMode = "settings";
+        toast.success(
+          enabled
+            ? "Generated SKILL-ORBIT.md and AGENTS.md — Orbit will keep them in sync"
+            : "Stopped maintaining helper files (existing files left in place)"
+        );
+      } catch (error) {
+        manageHelperFilesToggle.checked = !enabled;
+        manageHelperFilesToggle.disabled = false;
+        toast.error(error?.message || "Could not update helper files setting");
+      }
+    });
+
   }
 
   if (tab === "archive") {