Add durable feedback and live skill updates

Author: gitcommit90

cloudflare/schema.sql

@@ -14,3 +14,25 @@ CREATE TABLE IF NOT EXISTS workspaces (
 );
 
 CREATE INDEX IF NOT EXISTS idx_workspaces_installation ON workspaces(installation_id);
+
+CREATE TABLE IF NOT EXISTS feedback_reports (
+  public_id TEXT PRIMARY KEY,
+  installation_id TEXT NOT NULL,
+  workspace_name TEXT NOT NULL DEFAULT '',
+  comment TEXT NOT NULL,
+  diagnostics TEXT NOT NULL DEFAULT '{}',
+  attachment_count INTEGER NOT NULL DEFAULT 0,
+  created_at INTEGER NOT NULL,
+  received_at INTEGER NOT NULL
+);
+CREATE INDEX IF NOT EXISTS idx_feedback_received ON feedback_reports(received_at DESC);
+
+CREATE TABLE IF NOT EXISTS feedback_attachments (
+  id INTEGER PRIMARY KEY AUTOINCREMENT,
+  report_id TEXT NOT NULL REFERENCES feedback_reports(public_id) ON DELETE CASCADE,
+  name TEXT NOT NULL,
+  mime TEXT NOT NULL,
+  size INTEGER NOT NULL,
+  data TEXT NOT NULL,
+  created_at INTEGER NOT NULL
+);

cloudflare/src/worker.ts

@@ -4,6 +4,8 @@ interface Env {
   CLOUDFLARE_ZONE_ID: string;
   CLOUDFLARE_RUNTIME_TOKEN: string;
   PROVISION_LIMIT?: RateLimit;
+  FEEDBACK_LIMIT?: RateLimit;
+  FEEDBACK_ADMIN_TOKEN?: string;
 }
 
 type WorkspaceRow = {
@@ -151,11 +153,72 @@ async function workspaceAction(request: Request, env: Env, slug: string): Promis
   return json({ workspace: { slug, hostname: workspace.hostname, status: workspace.status, enabled } });
 }
 
+async function feedbackIntake(request: Request, env: Env): Promise<Response> {
+  const address = request.headers.get("cf-connecting-ip") || "unknown";
+  if (env.FEEDBACK_LIMIT && !(await env.FEEDBACK_LIMIT.limit({ key: address })).success) {
+    return json({ error: "Too many feedback reports. Try again shortly." }, 429);
+  }
+  const body = await request.json().catch(() => ({})) as Record<string, unknown>;
+  const publicId = String(body.public_id || "");
+  const installationId = String(body.installation_id || "");
+  const workspaceName = String(body.workspace_name || "").trim().slice(0, 100);
+  const comment = String(body.comment || "").trim().slice(0, 10_000);
+  const diagnostics = body.diagnostics && typeof body.diagnostics === "object" && !Array.isArray(body.diagnostics) ? body.diagnostics : {};
+  const attachments = Array.isArray(body.attachments) ? body.attachments.slice(0, 3) as Array<Record<string, unknown>> : [];
+  if (!/^fb_[a-f0-9]{24}$/.test(publicId) || !/^[a-f0-9]{16}$/.test(installationId)) {
+    return json({ error: "Feedback source could not be verified." }, 400);
+  }
+  if (!comment && !attachments.length) return json({ error: "Feedback is empty." }, 400);
+  if (JSON.stringify(diagnostics).length > 64 * 1024) return json({ error: "Diagnostics are too large." }, 413);
+  let total = 0;
+  for (const attachment of attachments) {
+    const size = Number(attachment.size || 0);
+    const data = String(attachment.data || "");
+    if (size < 0 || size > 5 * 1024 * 1024 || data.length > 7 * 1024 * 1024) {
+      return json({ error: "A feedback attachment is too large." }, 413);
+    }
+    total += size;
+  }
+  if (total > 10 * 1024 * 1024) return json({ error: "Feedback attachments are too large." }, 413);
+  const timestamp = Date.now();
+  await env.REGISTRY.prepare(`INSERT OR IGNORE INTO feedback_reports
+    (public_id,installation_id,workspace_name,comment,diagnostics,attachment_count,created_at,received_at)
+    VALUES (?,?,?,?,?,?,?,?)`).bind(publicId, installationId, workspaceName, comment, JSON.stringify(diagnostics), attachments.length, timestamp, timestamp).run();
+  const exists = await env.REGISTRY.prepare("SELECT 1 FROM feedback_attachments WHERE report_id=? LIMIT 1").bind(publicId).first();
+  if (!exists) {
+    for (const attachment of attachments) await env.REGISTRY.prepare(`INSERT INTO feedback_attachments
+      (report_id,name,mime,size,data,created_at) VALUES (?,?,?,?,?,?)`).bind(
+      publicId,
+      String(attachment.name || "attachment").slice(0, 255),
+      String(attachment.mime || "application/octet-stream").slice(0, 120),
+      Number(attachment.size || 0),
+      String(attachment.data || ""),
+      timestamp,
+    ).run();
+  }
+  return json({ id: publicId }, 202);
+}
+
+async function feedbackInbox(request: Request, env: Env): Promise<Response> {
+  const token = request.headers.get("authorization")?.replace(/^Bearer\s+/i, "") || "";
+  if (!env.FEEDBACK_ADMIN_TOKEN || token !== env.FEEDBACK_ADMIN_TOKEN) return json({ error: "Not found" }, 404);
+  const results = await env.REGISTRY.prepare(`SELECT public_id,installation_id,workspace_name,comment,diagnostics,
+    attachment_count,created_at created,received_at FROM feedback_reports ORDER BY received_at DESC LIMIT 500`).all<Record<string, unknown>>();
+  return json({ reports: (results.results || []).map((report) => ({
+    ...report,
+    diagnostics: JSON.parse(String(report.diagnostics || "{}")),
+    state: "delivered",
+    attachments: [],
+  })) });
+}
+
 export default {
   async fetch(request: Request, env: Env): Promise<Response> {
     if (request.method === "OPTIONS") return json({ ok: true });
     const url = new URL(request.url);
     if (url.pathname === "/health") return json({ ok: true });
+    if (url.pathname === "/v1/feedback" && request.method === "POST") return feedbackIntake(request, env);
+    if (url.pathname === "/v1/feedback" && request.method === "GET") return feedbackInbox(request, env);
     const availability = url.pathname.match(/^\/v1\/slugs\/([a-z0-9-]+)$/);
     if (availability && request.method === "GET") {
       const slug = availability[1].toLowerCase();

cloudflare/wrangler.jsonc

@@ -11,6 +11,11 @@
       "name": "PROVISION_LIMIT",
       "namespace_id": "1001",
       "simple": { "limit": 20, "period": 60 }
+    },
+    {
+      "name": "FEEDBACK_LIMIT",
+      "namespace_id": "1002",
+      "simple": { "limit": 30, "period": 60 }
     }
   ],
   "d1_databases": [

package.json

@@ -27,11 +27,12 @@
     "test:brief-browser": "node test/brief-regressions-browser.mjs",
     "test:production-browser": "node test/production-browser.mjs",
     "test:terminal-browser": "node --test test/terminal-reconnect-browser.mjs",
+    "test:feedback-browser": "node --test test/feedback-browser.mjs",
     "test:site": "node --test test/site.mjs",
     "benchmark:autonomy": "node scripts/autonomy-benchmark.mjs",
     "helm": "node scripts/1helm-cli.mjs",
     "test:live": "node test/live-smoke.mjs",
-    "test": "node test/native-world.mjs && node --test test/routing.mjs test/routing-disabled-account.mjs test/desktop.mjs test/update-service.mjs test/channel-computers.mjs test/cloudflare-worker.mjs test/connectors.mjs test/chatgpt-image.mjs test/autonomy-platform.mjs test/gmail.mjs test/photon.mjs test/site.mjs test/terminal-reconnect-contract.mjs test/terminal-reconnect-browser.mjs test/web-research.mjs test/workflows.mjs",
+    "test": "node test/native-world.mjs && node --test test/routing.mjs test/routing-disabled-account.mjs test/desktop.mjs test/update-service.mjs test/channel-computers.mjs test/cloudflare-worker.mjs test/connectors.mjs test/chatgpt-image.mjs test/autonomy-platform.mjs test/feedback.mjs test/feedback-browser.mjs test/gmail.mjs test/photon.mjs test/site.mjs test/terminal-reconnect-contract.mjs test/terminal-reconnect-browser.mjs test/web-research.mjs test/workflows.mjs",
     "ci": "npm run typecheck && npm run build && npm test",
     "test:pipeline": "node test/pipeline.mjs",
     "desktop": "electron .",

public/index.html

@@ -29,11 +29,11 @@
       document.querySelectorAll('meta[name="theme-color"]').forEach(function (m) { m.setAttribute("content", color); });
     })();
   </script>
-  <link rel="stylesheet" href="/app.css?v=13afbaf9cae5" />
+  <link rel="stylesheet" href="/app.css?v=78175b6a3067" />
   <link rel="stylesheet" href="/bundle.css" />
 </head>
 <body class="h-screen w-screen overflow-hidden antialiased">
   <div id="app" class="h-full w-full"></div>
-  <script type="module" src="/bundle.js?v=b053ad3e9c4b"></script>
+  <script type="module" src="/bundle.js?v=a4d940f88c26"></script>
 </body>
 </html>

src/client/app.ts

@@ -1,6 +1,6 @@
 import { api, downloadAuthenticatedFile, openAuthenticatedFile, uploadFile, connectEvents, getToken, setToken, clearToken, workspacePhotoSrc, type User, type Channel, type Message, type Bot, type Computer, type Provider, type Workspace, type ModelPolicy, type AgentProgress, type AgentQuestions, type ThreadUsage, type RoutingModel } from "./api.ts";
 import { h, clear, add, md, color, initials, timeLabel, dayLabel, sameDay, beep, icon, helmMark, type ChannelLink } from "./dom.ts";
-import { openSettings, finishOpenRouterOAuth } from "./settings.ts";
+import { openSettings, finishOpenRouterOAuth, refreshOpenSkillsSettings } from "./settings.ts";
 import { pushRoutingActivity } from "./routing.ts";
 import { openOnboarding } from "./onboarding.ts";
 import { defaultTerminalComputer, openTerminals, refitChannelTerminals, getTerminalChrome } from "./term.ts";
@@ -488,6 +488,13 @@ function onEvent(e: any): void {
     if (S.view === "settings") renderChannelView();
   } else if (e.type === "providers_changed") {
     void reloadProviders().then(() => { if (S.view === "settings") renderChannelView(); });
+  } else if (e.type === "skills_changed") {
+    void loadWorkspace().then(() => {
+      renderSidebar();
+      renderHeader();
+      if (S.view === "settings") renderChannelView();
+      refreshOpenSkillsSettings();
+    });
   } else if (e.type === "bot_update" && e.bot) {
     const i = S.bots.findIndex((b) => b.id === e.bot.id);
     if (i >= 0) S.bots[i] = e.bot; else S.bots = [...S.bots, e.bot];
@@ -777,13 +784,111 @@ function sidebar(drawer = false): HTMLElement {
       archived.length ? h("div", {}, h("div", { class: "eyebrow px-2 pb-1 text-sidebar-muted" }, "Archived"), h("div", { class: "space-y-px opacity-65" }, ...archived.map(chan))) : null,
       collab.length ? h("div", {}, h("div", { class: "eyebrow px-2 pb-1 text-sidebar-muted" }, "Human space"), h("div", { class: "space-y-px" }, ...collab.map(chan))) : null,
       h("div", {}, sbSection("Direct messages", () => newDM()), h("div", { class: "space-y-px" }, ...dms.map(chan), dms.length === 0 && h("p", { class: "px-2 py-1 text-[13px] text-sidebar-muted" }, "No conversations yet")))),
+    h("button", {
+      class: "mx-2 mb-1 flex min-h-10 items-center gap-2 rounded-md px-2 py-1.5 text-xs text-sidebar-muted hover:bg-sidebar-hover hover:text-white",
+      type: "button",
+      dataset: { feedbackAction: "" },
+      onclick: () => { closeMobileMenu(); openFeedback(); },
+    }, icon("chat", 14), "Feedback"),
     h("div", { class: "flex items-center gap-1 border-t border-white/10 p-1.5" },
       h("button", { class: "flex min-w-0 flex-1 items-center gap-2 rounded-md px-1.5 py-1 text-left hover:bg-sidebar-hover", title: "Open profile", onclick: (event: MouseEvent) => { closeMobileMenu(); openProfile(event.currentTarget as HTMLElement); } },
         avatar(S.me.display, "user", 8, S.me.avatar),
         h("div", { class: "min-w-0 flex-1" }, h("div", { class: "truncate text-sm font-semibold text-white" }, S.me.display), h("div", { class: "flex items-center gap-1.5 truncate font-mono text-[10.5px] text-sidebar-muted" }, h("span", { class: "h-1.5 w-1.5 rounded-full bg-ok" }), "@" + S.me.username + (S.me.is_admin ? " · admin" : "")))),
       h("button", { class: "grid h-10 w-10 shrink-0 place-items-center rounded-md text-sidebar-muted hover:bg-sidebar-hover hover:text-white", title: S.me.is_admin ? "Settings" : "Provider settings", "aria-label": "Open settings", onclick: () => { closeMobileMenu(); openSettings(S.me.is_admin ? "agents" : "providers"); } }, icon("gear"))));
 }
 
+function openFeedback(): void {
+  document.getElementById("feedback-modal")?.remove();
+  const overlay = h("div", {
+    id: "feedback-modal",
+    class: "modal-overlay fixed inset-0 z-[90] grid place-items-center bg-black/70 p-3",
+    role: "dialog",
+    "aria-modal": "true",
+    "aria-label": "Send feedback",
+  });
+  const comment = h("textarea", {
+    class: "field min-h-36 resize-y",
+    maxlength: 10000,
+    placeholder: "What happened? What did you expect?",
+    dataset: { feedbackComment: "" },
+  }) as HTMLTextAreaElement;
+  const picker = h("input", {
+    type: "file",
+    multiple: true,
+    class: "hidden",
+    accept: "image/*,application/pdf,text/plain,application/json",
+    dataset: { feedbackFiles: "" },
+  }) as HTMLInputElement;
+  const fileList = h("div", { class: "space-y-1 text-xs text-muted" });
+  const diagnostics = h("input", {
+    type: "checkbox",
+    checked: false,
+    class: "accent-accent",
+    dataset: { feedbackDiagnostics: "" },
+  }) as HTMLInputElement;
+  const status = h("p", { class: "min-h-5 text-sm text-muted", dataset: { feedbackStatus: "" } });
+  let files: File[] = [];
+  const showFiles = (): void => {
+    clear(fileList);
+    fileList.append(...files.map((file) => h("div", { class: "truncate" }, `${file.name} · ${Math.ceil(file.size / 1024)} KB`)));
+  };
+  picker.onchange = () => {
+    const selected = [...(picker.files || [])].slice(0, 3);
+    if (selected.some((file) => file.size > 5 * 1024 * 1024) || selected.reduce((sum, file) => sum + file.size, 0) > 10 * 1024 * 1024) {
+      status.textContent = "Attachments are limited to 5 MB each and 10 MB total.";
+      return;
+    }
+    files = selected;
+    status.textContent = "";
+    showFiles();
+  };
+  const close = (): void => overlay.remove();
+  const submit = h("button", {
+    class: "btn-primary text-sm",
+    type: "button",
+    dataset: { feedbackSubmit: "" },
+    onclick: async () => {
+      submit.disabled = true;
+      status.textContent = "Saving feedback…";
+      try {
+        const uploads = [];
+        for (const file of files) uploads.push(await uploadFile(file));
+        const result = await api<{ feedback: { id: string; state: string } }>("/api/feedback", {
+          body: { comment: comment.value, send_diagnostics: diagnostics.checked, uploads },
+        });
+        status.textContent = `Saved as ${result.feedback.id}. Delivery will retry automatically if this host is offline.`;
+        setTimeout(close, 1400);
+      } catch (error) {
+        status.textContent = (error as Error).message;
+        submit.disabled = false;
+      }
+    },
+  }, "Send feedback") as HTMLButtonElement;
+  const card = h("section", { class: "card w-full max-w-xl space-y-4 p-5 shadow-2xl" },
+    h("div", { class: "flex items-start justify-between gap-3" },
+      h("div", {},
+        h("h2", { class: "font-display text-xl text-fg" }, "Send feedback"),
+        h("p", { class: "mt-1 text-sm leading-6 text-muted" }, "Tell us what feels broken or what would make 1Helm better.")),
+      h("button", { class: "grid h-8 w-8 place-items-center rounded text-muted hover:bg-hover", "aria-label": "Close feedback", onclick: close }, icon("x"))),
+    comment,
+    h("div", {},
+      h("button", { class: "btn-subtle text-sm", type: "button", onclick: () => picker.click() }, "Add attachments"),
+      picker,
+      fileList),
+    h("label", { class: "flex items-start gap-2 rounded-lg border border-line bg-panel p-3 text-sm text-fg" },
+      diagnostics,
+      h("span", {}, "Include privacy-bounded diagnostics",
+        h("span", { class: "mt-1 block text-xs leading-5 text-muted" }, "Optional. Includes app version, platform, runtime health, failed capability names/statuses, and connector health. Never includes chats, prompts, account content, terminal output, tokens, keys, or OAuth data."))),
+    status,
+    h("div", { class: "flex justify-end gap-2" },
+      h("button", { class: "btn-subtle text-sm", onclick: close }, "Cancel"),
+      submit));
+  overlay.onclick = (event) => { if (event.target === overlay) close(); };
+  overlay.append(card);
+  document.body.append(overlay);
+  comment.focus();
+}
+
 function openProfile(anchor: HTMLElement): void {
   document.getElementById("profile-popover")?.remove();
   const display = h("input", { class: "field", value: S.me.display, maxlength: 100 }) as HTMLInputElement;

src/client/channel.ts

@@ -716,7 +716,7 @@ export function renderChannelSettings(container: HTMLElement, channel: Channel,
         await api(`/api/channels/${channel.id}`, { method: "DELETE", body: { confirm: confirmation } }); onChanged(true);
       } }, icon("trash", 14), "Delete permanently") : null));
 
-  const assignedSkills = h("div", { class: "mt-3 flex flex-wrap gap-2" }, ...((channel.agent?.skills || []).map((skill) => h("span", { class: "chip border-accent/25" }, skill.name))));
+  const assignedSkills = h("div", { class: "mt-3 flex flex-wrap gap-2", dataset: { assignedSkills: "" } }, ...((channel.agent?.skills || []).map((skill) => h("span", { class: "chip border-accent/25", dataset: { assignedSkill: skill.slug } }, skill.name))));
   const computer = channel.computer;
   const computerCard = computer ? h("div", { class: "card p-4" },
     h("div", { class: "flex flex-wrap items-center gap-2" },