@enigmax/dashboard 0.1.30 → 0.1.32

package/assets/index.html

@@ -214,6 +214,13 @@
             border: 1px solid var(--border); border-radius: 8px; padding: 12px;
             font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; line-height: 1.5;
         }
+        /* Per-app save targets in the skill editor. */
+        .se-agents { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 10px; }
+        .se-agents:empty { display: none; }
+        .se-ag-label { font-family: var(--mono); font-size: 12px; color: var(--muted); }
+        .se-ag { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text); cursor: pointer; }
+        .se-ag input { accent-color: var(--good); }
+        .se-ag .aicon { color: var(--muted); }
         .btn-danger {
             background: var(--surface2); color: var(--accent2); border: 1px solid var(--border);
             border-radius: 7px; padding: 5px 14px; font-size: 12px; cursor: pointer; font-family: inherit;
@@ -229,7 +236,7 @@
         .achip.on { background: var(--good); color: #06210f; border-color: var(--good); }
         .achip svg { width: 14px; height: 14px; display: block; }
         /* Inline app icons in the "where deployed" tag (static, name in tooltip). */
-        .aicons { display: inline-flex; gap: 5px; align-items: center; vertical-align: middle; }
+        .aicons { display: inline-flex; gap: 5px; align-items: center; vertical-align: middle; margin-left: 6px; }
         .aicon { display: inline-flex; align-items: center; color: var(--muted); }
         .aicon svg { width: 14px; height: 14px; display: block; }
         .set-ic { vertical-align: middle; margin-right: 7px; }
@@ -527,11 +534,16 @@
         <div id="skillEditor" class="panel" style="display:none">
             <div class="panel-head"><h2>Editing <span id="seName"></span> <small id="seWarn"></small></h2></div>
             <textarea id="seText" class="editor" spellcheck="false"></textarea>
+            <div id="seAgents" class="se-agents" data-has="0"></div>
             <div style="margin-top:10px;display:flex;gap:8px">
                 <button id="seSave" type="button" class="toggle on">Save</button>
                 <button id="seCancel" type="button" class="toggle">Cancel</button>
             </div>
         </div>
+        <div class="panel">
+            <div class="set-cat-h">Skill settings</div>
+            <div id="skillSettings" class="set-grid"></div>
+        </div>
         <div class="panel">
             <div id="skillsBody"><div class="empty" style="padding:24px 0">Loading skills...</div></div>
             <div id="skillsNote" class="set-note"></div>
@@ -2106,11 +2118,17 @@ export {
         // the label, so the Permissions list reads at a glance. AGENT_ICONS is defined below
         // but only referenced at render time, so it is initialised by then.
         const AGENT_LABEL_BY_NAME = { claude: "Claude Code", codex: "OpenAI Codex", opencode: "OpenCode" };
+        const GH_ICON = '<svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.52 11.52 0 0 1 12 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222 0 1.606-.014 2.898-.014 3.293 0 .322.216.694.825.576C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>';
+        // Map a setting key to the app/service logo prefixed to its label (per-agent bypass,
+        // the Claude-specific toggles, and the GitHub telemetry toggle).
         function settingIcon(key) {
-            const m = /^bypass-(claude|codex|opencode)$/.exec(key || "");
-            if (!m) return "";
-            const ic = (typeof AGENT_ICONS !== "undefined" && AGENT_ICONS[m[1]]) || "";
-            return ic ? '<span class="aicon set-ic" title="' + esc(AGENT_LABEL_BY_NAME[m[1]]) + '" aria-hidden="true">' + ic + "</span>" : "";
+            key = key || "";
+            let svg = "", title = "";
+            const bp = /^bypass-(claude|codex|opencode)$/.exec(key);
+            if (bp) { svg = (typeof AGENT_ICONS !== "undefined" && AGENT_ICONS[bp[1]]) || ""; title = AGENT_LABEL_BY_NAME[bp[1]]; }
+            else if (key === "claude-attribution" || key === "claude-survey" || key === "proxy") { svg = (typeof AGENT_ICONS !== "undefined" && AGENT_ICONS.claude) || ""; title = "Claude Code"; }
+            else if (key === "gh-telemetry") { svg = GH_ICON; title = "GitHub"; }
+            return svg ? '<span class="aicon set-ic" title="' + esc(title) + '" aria-hidden="true">' + svg + "</span>" : "";
         }
 
         function settingRow(s) {
@@ -2151,17 +2169,18 @@ export {
                 + '<div class="set-grid">' + c.settings.map(settingRow).join("") + "</div></div>").join("");
         }
 
-        async function postSetting(key, value, ctl) {
-            $("settingsNote").textContent = "Saving " + key + "...";
+        async function postSetting(key, value, ctl, noteEl) {
+            const note = noteEl || $("settingsNote");
+            note.textContent = "Saving " + key + "...";
             try {
                 const res = await fetch("/api/settings", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ key, value }) });
                 const out = await res.json();
-                if (!out.ok) { $("settingsNote").textContent = "Could not change " + key + ": " + (out.error || "error"); return; }
+                if (!out.ok) { note.textContent = "Could not change " + key + ": " + (out.error || "error"); return; }
                 const s = out.setting;
                 if (s && ctl.dataset.kind === "bool") { ctl.classList.toggle("on", s.value); ctl.textContent = s.value ? "On" : "Off"; ctl.dataset.on = s.value ? 1 : 0; }
                 else if (s) { ctl.value = s.choice; }
-                $("settingsNote").textContent = out.restartNote || ("Saved " + key + ".");
-            } catch { $("settingsNote").textContent = "Could not reach the server to change " + key + "."; }
+                note.textContent = out.restartNote || ("Saved " + key + ".");
+            } catch { note.textContent = "Could not reach the server to change " + key + "."; }
         }
 
         // List settings: add/remove one entry, then reload so the chips reflect disk truth.
@@ -2383,6 +2402,11 @@ export {
                 : s.update === "modified" ? '<span class="tag ext">modified</span>' : "";
             const edit = '<button type="button" class="iconbtn" title="Edit" aria-label="Edit" data-name="' + esc(s.name) + '" data-action="edit" data-enigma="' + (s.source === "enigma" ? 1 : 0) + '">'
                 + '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 20h9"/><path d="M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4Z"/></svg></button>';
+            // Propose an improvement: open the skill's source on GitHub (view / edit / open a PR).
+            const propose = s.source === "enigma"
+                ? '<button type="button" class="iconbtn" title="Propose an improvement (opens GitHub)" aria-label="Propose an improvement" data-name="' + esc(s.name) + '" data-action="propose">'
+                    + '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="6" y1="3" x2="6" y2="15"/><circle cx="18" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M18 9a9 9 0 0 1-9 9"/></svg></button>'
+                : "";
             const main = s.source === "enigma"
                 ? '<button type="button" class="toggle' + (s.discarded ? "" : " on") + '" data-kind="bool" title="'
                     + (s.discarded ? "Disabled - click to enable" : "Enabled - click to disable") + '" data-name="' + esc(s.name)
@@ -2399,10 +2423,12 @@ export {
                     + '">' + (agentSvg(a.name) || esc(a.label)) + "</button>").join("") + "</div>"
                 : "";
             return '<div class="set-row"><div class="set-meta"><div class="set-name">' + esc(s.name) + ext + ver + edited + upd + where + "</div>"
-                + '<div class="set-hint">' + esc(s.description || "") + "</div>" + agentChips + '</div><div class="set-ctl" style="display:flex;gap:8px">' + edit + main + "</div></div>";
+                + '<div class="set-hint">' + esc(s.description || "") + "</div>" + agentChips + '</div><div class="set-ctl" style="display:flex;gap:8px">' + edit + propose + main + "</div></div>";
         }
 
+        let lastSkills = [];
         function renderSkills(skills) {
+            lastSkills = skills; // kept so the editor can offer per-app save targets
             const enigma = skills.filter((s) => s.source === "enigma");
             const ext = skills.filter((s) => s.source === "external");
             const section = (title, blurb, list, emptyText) => '<div class="set-cat"><div class="set-cat-h">' + title + "</div>"
@@ -2434,8 +2460,9 @@ export {
                 if (!out.ok) { $("skillsNote").textContent = "Could not open " + name + ": " + (out.error || "error"); return; }
                 editing = name;
                 $("seName").textContent = name;
-                $("seWarn").textContent = isEnigma ? "managed by enigma - local edits revert on the next update/sync" : "external skill";
+                $("seWarn").textContent = isEnigma ? "managed by enigma - see Customized-skill updates below for whether edits survive an update" : "external skill";
                 $("seText").value = out.content || "";
+                editorAgents(lastSkills.find((s) => s.name === name));
                 $("skillEditor").style.display = "";
                 $("skillsNote").textContent = "";
                 window.scrollTo({ top: 0, behavior: "smooth" });
@@ -2443,11 +2470,29 @@ export {
             } catch { $("skillsNote").textContent = "Could not reach the server."; }
         }
         function closeEditor() { editing = null; $("skillEditor").style.display = "none"; }
+        // Render per-app save targets (one checkbox per app that holds the skill), only when
+        // the skill is on more than one app - with a single app there is nothing to choose.
+        function editorAgents(skill) {
+            const el = $("seAgents");
+            const states = (skill && skill.agentStates) ? skill.agentStates.filter((a) => a.deployed) : [];
+            if (states.length <= 1) { el.innerHTML = ""; el.dataset.has = "0"; return; }
+            el.dataset.has = "1";
+            el.innerHTML = '<span class="se-ag-label">Save to:</span>' + states.map((a) =>
+                '<label class="se-ag"><input type="checkbox" checked data-agent="' + esc(a.name) + '">'
+                + '<span class="aicon" aria-hidden="true">' + (agentSvg(a.name) || "") + "</span>" + esc(a.label) + "</label>").join("");
+        }
         async function saveEditor() {
             if (!editing) return;
+            const agEl = $("seAgents");
+            let content = $("seText").value;
+            if (agEl.dataset.has === "1") {
+                const agents = [...agEl.querySelectorAll("input[type=checkbox]:checked")].map((i) => i.dataset.agent);
+                if (!agents.length) { $("skillsNote").textContent = "Pick at least one app to save to."; return; }
+                content = { text: $("seText").value, agents }; // per-app save
+            }
             $("skillsNote").textContent = "Saving " + editing + "...";
             try {
-                const res = await fetch("/api/skills", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ name: editing, action: "save", content: $("seText").value }) });
+                const res = await fetch("/api/skills", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ name: editing, action: "save", content }) });
                 const out = await res.json();
                 if (!out.ok) { $("skillsNote").textContent = "Could not save " + editing + ": " + (out.error || "error"); return; }
                 if (out.skills) renderSkills(out.skills);
@@ -2462,17 +2507,42 @@ export {
                 if (!b) return;
                 const { name, action } = b.dataset;
                 if (action === "edit") { openEditor(name, b.dataset.enigma === "1"); return; }
+                if (action === "propose") { window.open("https://github.com/FJRG2007/enigma/blob/main/packages/enigma-cli/assets/skills/" + encodeURIComponent(name) + "/SKILL.md", "_blank", "noopener"); return; }
                 if (action === "agent-toggle") { postSkill(name, action, { agent: b.dataset.agent, off: b.dataset.off === "1" }); return; }
                 if (action === "remove" && !(await askConfirm("Remove skill", 'Remove the external skill "' + name + '" from all agents? This deletes it from disk.', true))) return;
                 postSkill(name, action);
             });
+            // Skill-related settings live in this tab too; reuse the settings POST, with the note here.
+            $("skillSettings").addEventListener("click", (e) => {
+                const t = e.target.closest("button.toggle[data-skey]");
+                if (t) postSetting(t.dataset.skey, t.dataset.on !== "1", t, $("skillsNote"));
+            });
+            $("skillSettings").addEventListener("change", (e) => {
+                const sel = e.target.closest("select.choice[data-skey]");
+                if (sel) postSetting(sel.dataset.skey, sel.value, sel, $("skillsNote"));
+            });
             $("seSave").addEventListener("click", saveEditor);
             $("seCancel").addEventListener("click", closeEditor);
             $("skillsCheck").addEventListener("click", () => postSkill("*", "check-updates"));
         }
 
+        // The skill-related settings surfaced inside the Skills tab (a better-organised dashboard
+        // than burying them under Settings). They still live in the one settings registry.
+        const SKILL_SETTING_KEYS = ["remote-skills", "skill-update-policy", "auto-sync"];
+        function renderSkillSettings(cats) {
+            const all = (cats || []).flatMap((c) => c.settings || []);
+            const rows = SKILL_SETTING_KEYS.map((k) => all.find((s) => s.key === k)).filter(Boolean);
+            $("skillSettings").innerHTML = rows.length ? rows.map(settingRow).join("")
+                : '<div class="empty" style="padding:8px 0">No skill settings available.</div>';
+        }
+        async function loadSkillSettings() {
+            try { renderSkillSettings((await (await fetch("/api/settings", { cache: "no-store" })).json()).categories || []); }
+            catch { $("skillSettings").innerHTML = ""; }
+        }
+
         let skillsLoaded = false;
         async function loadSkills() {
+            loadSkillSettings();
             try {
                 const res = await fetch("/api/skills", { cache: "no-store" });
                 renderSkills((await res.json()).skills || []);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@enigmax/dashboard",
-  "version": "0.1.30",
+  "version": "0.1.32",
   "description": "Local browser dashboard UI for enigma: the static page and chart assets enigma serves on its loopback dashboard (savings, real tool usage, in-browser settings). Installed on demand by enigma-cli; not a runtime dependency.",
   "type": "module",
   "files": [