agent-bridge-abweb 1.0.0 → 1.0.1

package/dist/src-ts/plugins/abweb/index.js

@@ -5,7 +5,7 @@ const node_fs_1 = require("node:fs");
 const node_path_1 = require("node:path");
 const MANIFEST = {
     id: "abweb",
-    version: "1.0.0",
+    version: "1.0.1",
     displayName: "Agent Bridge Web",
     entry: "dist/index.js",
     apiVersion: "1",

package/dist/src-ts/plugins/abweb/public/app.js

@@ -7,6 +7,8 @@
     const tokenNode = node("#token");
     const pairCodeNode = node("#pair-code");
     const packageNode = node("#package-name");
+    const packageSearchNode = node("#package-search");
+    const catalogNode = node("#catalog");
     const pluginPathNode = node("#plugin-path");
     const picker = node("#plugin-picker");
     const aidList = node("#aids");
@@ -17,6 +19,19 @@
     let pluginConfigs = {};
     let pluginVersions = {};
     function error(message) { errorNode.textContent = message; errorNode.hidden = !message; }
+    async function loadCatalog() {
+        const result = await request(`/api/plugins/catalog?q=${encodeURIComponent(packageSearchNode.value.trim())}`);
+        const items = result.plugins ?? [];
+        packageNode.replaceChildren(...[["Agent", "agent"], ["Channel", "channel"], ["管理", "management"]].flatMap(([label, type]) => {
+            const group = document.createElement("optgroup");
+            group.label = label;
+            group.append(...items.filter((item) => item.type === type).map((item) => new Option(`${item.name} · v${item.version}`, item.name)));
+            return group.children.length ? [group] : [];
+        }));
+        catalogNode.replaceChildren(...items.map((plugin) => { const item = document.createElement("div"); item.className = "catalog-row"; item.textContent = `${plugin.type} · ${plugin.name} · ${plugin.description || "无描述"}`; return item; }));
+        if (!(result.plugins ?? []).length)
+            catalogNode.textContent = "未找到已声明类型的 npm 插件";
+    }
     async function request(path, method = "GET", body) {
         const response = await fetch(path, { method, headers: {
                 accept: "application/json", ...(body ? { "content-type": "application/json" } : {}),
@@ -96,7 +111,13 @@
     function renderPlugins(items) {
         plugins = items;
         const selected = picker.value || items[0]?.id;
-        picker.replaceChildren(...items.map((plugin) => new Option(`${plugin.displayName || plugin.id} · v${plugin.version} · ${plugin.status}`, plugin.id)));
+        const groups = [["Agent", items.filter((plugin) => plugin.type === "agent" || (!plugin.type && plugin.capabilities?.includes("chat")))], ["Channel", items.filter((plugin) => plugin.type === "channel" || plugin.capabilities?.includes("channel"))], ["管理", items.filter((plugin) => plugin.type === "management" || (!plugin.type && plugin.capabilities?.includes("management")))]];
+        picker.replaceChildren(...groups.flatMap(([label, group]) => {
+            const options = document.createElement("optgroup");
+            options.label = label;
+            options.append(...group.map((plugin) => new Option(`${plugin.displayName || plugin.id} · v${plugin.version} · ${plugin.status}`, plugin.id)));
+            return group.length ? [options] : [];
+        }));
         picker.value = items.some((plugin) => plugin.id === selected) ? selected : items[0]?.id ?? "";
         pluginsNode.replaceChildren();
         for (const plugin of items.filter((item) => item.id === picker.value)) {
@@ -188,11 +209,20 @@
             return load();
         }).catch((cause) => error(String(cause)));
     };
-    node("#install-form").onsubmit = (event) => {
-        event.preventDefault();
+    node("#install-package").onclick = () => {
+        if (!packageNode.value)
+            return error("请先选择插件");
         void request("/api/plugins/install", "POST", { packageName: packageNode.value })
             .then(() => load()).catch((cause) => error(String(cause)));
     };
+    node("#install-name-form").onsubmit = (event) => {
+        event.preventDefault();
+        const packageName = node("#manual-package-name").value.trim();
+        void request("/api/plugins/install", "POST", { packageName }).then(() => load()).catch((cause) => error(String(cause)));
+    };
+    node("#search-packages").onclick = () => void loadCatalog().catch((cause) => error(String(cause)));
+    packageSearchNode.onkeydown = (event) => { if (event.key === "Enter")
+        void loadCatalog().catch((cause) => error(String(cause))); };
     node("#install-local-form").onsubmit = (event) => {
         event.preventDefault();
         void request("/api/plugins/install", "POST", { source: pluginPathNode.value.trim() })
@@ -210,4 +240,5 @@
         }).catch((cause) => { result.textContent = ""; error(String(cause)); });
     };
     void load();
+    void loadCatalog().catch((cause) => error(String(cause)));
 })();

package/dist/src-ts/plugins/abweb/public/app.ts

@@ -1,5 +1,5 @@
 (() => {
-  type Plugin = { id: string; displayName: string; version: string; status: string; error?: string; path: string };
+  type Plugin = { id: string; displayName: string; version: string; status: string; type?: string; capabilities?: string[]; error?: string; path: string };
   const node = <T extends HTMLElement>(selector: string): T => document.querySelector<T>(selector)!;
   const pluginsNode = node<HTMLDivElement>("#plugins");
   const messagesNode = node<HTMLTableSectionElement>("#messages");
@@ -8,6 +8,8 @@
   const tokenNode = node<HTMLInputElement>("#token");
   const pairCodeNode = node<HTMLInputElement>("#pair-code");
   const packageNode = node<HTMLSelectElement>("#package-name");
+  const packageSearchNode = node<HTMLInputElement>("#package-search");
+  const catalogNode = node<HTMLDivElement>("#catalog");
   const pluginPathNode = node<HTMLInputElement>("#plugin-path");
   const picker = node<HTMLSelectElement>("#plugin-picker");
   const aidList = node<HTMLDivElement>("#aids");
@@ -19,6 +21,17 @@
   let pluginVersions: Record<string, any> = {};
 
   function error(message: string): void { errorNode.textContent = message; errorNode.hidden = !message; }
+  async function loadCatalog(): Promise<void> {
+    const result = await request(`/api/plugins/catalog?q=${encodeURIComponent(packageSearchNode.value.trim())}`);
+    const items: Array<{ name: string; version: string; description: string; type: string }> = result.plugins ?? [];
+    packageNode.replaceChildren(...[["Agent", "agent"], ["Channel", "channel"], ["管理", "management"]].flatMap(([label, type]) => {
+      const group = document.createElement("optgroup"); group.label = label;
+      group.append(...items.filter((item) => item.type === type).map((item) => new Option(`${item.name} · v${item.version}`, item.name)));
+      return group.children.length ? [group] : [];
+    }));
+    catalogNode.replaceChildren(...items.map((plugin) => { const item = document.createElement("div"); item.className = "catalog-row"; item.textContent = `${plugin.type} · ${plugin.name} · ${plugin.description || "无描述"}`; return item; }));
+    if (!(result.plugins ?? []).length) catalogNode.textContent = "未找到已声明类型的 npm 插件";
+  }
   async function request(path: string, method = "GET", body?: unknown): Promise<any> {
     const response = await fetch(path, { method, headers: {
       accept: "application/json", ...(body ? { "content-type": "application/json" } : {}),
@@ -78,7 +91,12 @@
   function renderPlugins(items: Plugin[]): void {
     plugins = items;
     const selected = picker.value || items[0]?.id;
-    picker.replaceChildren(...items.map((plugin) => new Option(`${plugin.displayName || plugin.id} · v${plugin.version} · ${plugin.status}`, plugin.id)));
+    const groups = [["Agent", items.filter((plugin) => plugin.type === "agent" || (!plugin.type && plugin.capabilities?.includes("chat")))], ["Channel", items.filter((plugin) => plugin.type === "channel" || plugin.capabilities?.includes("channel"))], ["管理", items.filter((plugin) => plugin.type === "management" || (!plugin.type && plugin.capabilities?.includes("management")))]] as const;
+    picker.replaceChildren(...groups.flatMap(([label, group]) => {
+      const options = document.createElement("optgroup"); options.label = label;
+      options.append(...group.map((plugin) => new Option(`${plugin.displayName || plugin.id} · v${plugin.version} · ${plugin.status}`, plugin.id)));
+      return group.length ? [options] : [];
+    }));
     picker.value = items.some((plugin) => plugin.id === selected) ? selected : items[0]?.id ?? "";
     pluginsNode.replaceChildren();
     for (const plugin of items.filter((item) => item.id === picker.value)) {
@@ -140,11 +158,18 @@
       tokenNode.value = result.token; sessionStorage.setItem("mab-token", result.token); pairCodeNode.value = ""; return load();
     }).catch((cause) => error(String(cause)));
   };
-  node<HTMLFormElement>("#install-form").onsubmit = (event) => {
-    event.preventDefault();
+  node<HTMLButtonElement>("#install-package").onclick = () => {
+    if (!packageNode.value) return error("请先选择插件");
     void request("/api/plugins/install", "POST", { packageName: packageNode.value })
       .then(() => load()).catch((cause) => error(String(cause)));
   };
+  node<HTMLFormElement>("#install-name-form").onsubmit = (event) => {
+    event.preventDefault();
+    const packageName = node<HTMLInputElement>("#manual-package-name").value.trim();
+    void request("/api/plugins/install", "POST", { packageName }).then(() => load()).catch((cause) => error(String(cause)));
+  };
+  node<HTMLButtonElement>("#search-packages").onclick = () => void loadCatalog().catch((cause) => error(String(cause)));
+  packageSearchNode.onkeydown = (event) => { if (event.key === "Enter") void loadCatalog().catch((cause) => error(String(cause))); };
   node<HTMLFormElement>("#install-local-form").onsubmit = (event) => {
     event.preventDefault();
     void request("/api/plugins/install", "POST", { source: pluginPathNode.value.trim() })
@@ -161,5 +186,5 @@
       return load();
     }).catch((cause) => { result.textContent = ""; error(String(cause)); });
   };
-  void load();
+  void load(); void loadCatalog().catch((cause) => error(String(cause)));
 })();

package/dist/src-ts/plugins/abweb/public/index.html

@@ -13,7 +13,7 @@
     <nav class="tabs" role="tablist" aria-label="管理视图"><button id="settings-tab" type="button" role="tab" aria-selected="true" aria-controls="settings-panel">插件设置</button><button id="messages-tab" type="button" role="tab" aria-selected="false" aria-controls="messages-panel">通信记录</button></nav>
     <div id="settings-panel" role="tabpanel" aria-labelledby="settings-tab">
     <section><div class="section-heading"><h2>版本管理</h2><button id="check-versions" type="button">检查更新</button></div><div id="versions" class="muted"></div></section>
-    <section><div class="section-heading"><h2>插件</h2><select id="plugin-picker" aria-label="选择插件"></select></div><div id="plugins" class="plugins"></div><form id="install-form"><select id="package-name" aria-label="选择 npm 插件"><option value="agent-bridge-qwenwork">千问办公</option><option value="agent-bridge-abweb">管理页面</option><option value="agent-bridge-dsh">DeepSeek Harness</option><option value="agent-bridge-doubao">豆包</option></select><button type="submit">安装 npm 插件</button></form><form id="install-local-form"><input id="plugin-path" required placeholder="Windows 上的插件目录路径" aria-label="本地插件目录"><button type="submit">安装本地插件</button></form></section>
+    <section><div class="section-heading"><h2>插件</h2><select id="plugin-picker" aria-label="选择插件"></select></div><div id="plugins" class="plugins"></div><div class="plugin-catalog"><div class="section-heading"><h3>npm 插件目录</h3><button id="search-packages" type="button">刷新目录</button></div><input id="package-search" placeholder="搜索插件名称或功能" aria-label="搜索 npm 插件"><select id="package-name" aria-label="选择 npm 插件"></select><button id="install-package" type="button">安装选中插件</button><form id="install-name-form"><input id="manual-package-name" required pattern="agent-bridge-[a-z0-9-]+" placeholder="输入 npm 包名，例如 agent-bridge-workbuddy" aria-label="直接输入 npm 包名"><button type="submit">按包名安装</button></form><div id="catalog" class="catalog"></div></div><form id="install-local-form"><input id="plugin-path" required placeholder="Windows 上的插件目录路径" aria-label="本地插件目录"><button type="submit">安装本地插件</button></form></section>
     <section><div class="section-heading"><h2>已连接 AID</h2><span id="aid-count" class="muted"></span></div><div id="aids" class="aid-list"></div><form id="create-aid-form"><input id="new-aid" required placeholder="新 AID，例如 new.agentid.cn" aria-label="新 AID"><input id="owner-aid" required placeholder="owner AID" aria-label="owner AID"><button type="submit">创建 AID</button></form><p id="aid-result" class="muted" role="status"></p><p class="muted">在插件列表中选择插件，再用“关联 AID”下拉框保存对应身份。</p></section>
     </div>
     <div id="messages-panel" role="tabpanel" aria-labelledby="messages-tab" hidden><section><div class="section-heading"><h2>最近通信</h2></div><div class="table-scroll"><table><thead><tr><th scope="col">时间</th><th scope="col">插件</th><th scope="col">接收 AID</th><th scope="col">来源 Peer</th><th scope="col">方向</th><th scope="col">消息</th><th scope="col">错误</th></tr></thead><tbody id="messages"></tbody></table></div><p id="messages-empty" class="muted" hidden>暂无通信记录</p></section></div>

package/dist/src-ts/plugins/abweb/public/style.css

@@ -29,6 +29,12 @@ form { margin-top: 14px; flex-wrap: wrap; }
 .plugin-main { flex-wrap: wrap; }
 .controls { flex-wrap: wrap; }
 .controls select { max-width: 210px; }
+.plugin-catalog { border-top: 1px solid #e0e5e2; margin-top: 18px; padding-top: 14px; }
+.plugin-catalog h3 { font-size: 14px; margin: 0; }
+.plugin-catalog input { width: min(100%, 420px); margin: 10px 0; }
+.catalog { margin-top: 10px; }
+.catalog-row { padding: 7px 0; color: #566761; font-size: 13px; border-bottom: 1px solid #edf1ef; }
+.plugin-catalog form { margin-top: 8px; }
 .muted { color: #65736e; font-size: 13px; }
 .status { font-size: 12px; padding: 3px 7px; background: #e7ebea; border-radius: 4px; }
 .status-ready { color: #136a44; background: #def3e5; }

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "agent-bridge-abweb",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "agent-bridge 的网页管理插件。",
+  "keywords": ["mu-agent-bridge-plugin", "mu-agent-bridge-management"],
   "repository": { "type": "git", "url": "https://codeup.aliyun.com/6808da56fb3da14b899afd54/agent_bridge.git", "directory": "packages/abweb" },
   "main": "dist/src-ts/plugins/abweb/index.js",
   "files": [
@@ -11,7 +12,8 @@
     "README.md"
   ],
   "agentBridge": {
-    "plugin": "./plugin.json"
+    "plugin": "./plugin.json",
+    "type": "management"
   },
   "publishConfig": {
     "access": "public",

package/plugin.json

@@ -1,6 +1,7 @@
 {
   "id": "abweb",
-  "version": "1.0.0",
+  "version": "1.0.1",
+  "type": "management",
   "displayName": "Agent Bridge Web",
   "entry": "dist/src-ts/plugins/abweb/index.js",
   "apiVersion": "1",