openclacky 1.3.8 → 1.3.10

data/lib/clacky/web/features/extensions/store.js

@@ -19,9 +19,11 @@
 
 const ExtensionsStore = (() => {
   // ── State (single source of truth) ─────────────────────────────────────
-  let _extensions = [];        // [{ id, name, name_zh, description, ..., units }]
-  let _query      = "";        // current search text
-  let _sort       = "newest";  // "newest" | "updated" | "downloads"
+  let _extensions      = [];        // [{ id, name, name_zh, description, ..., units }]
+  let _allExtensions   = [];        // unfiltered result from server
+  let _query           = "";        // current search text
+  let _sort            = "newest";  // "newest" | "updated" | "downloads"
+  let _filterInstalled = false;     // when true, show only installed extensions
   let _loading    = false;
   let _error      = null;      // soft warning when the store is unreachable
   let _detail     = null;      // currently opened extension detail, or null
@@ -50,6 +52,7 @@ const ExtensionsStore = (() => {
     get extensions() { return _extensions; },
     get query()      { return _query; },
     get sort()       { return _sort; },
+    get filterInstalled() { return _filterInstalled; },
     get loading()    { return _loading; },
     get error()      { return _error; },
     get detail()        { return _detail; },
@@ -73,10 +76,15 @@ const ExtensionsStore = (() => {
         const qs   = params.toString();
         const res  = await fetch("/api/store/extensions" + (qs ? "?" + qs : ""));
         const data = await res.json();
-        _extensions = data.extensions || [];
+        _allExtensions = data.extensions || [];
         _error      = data.warning || null;
         _loading    = false;
-        _emit("extensions:changed", { extensions: _extensions, warning: _error });
+        if (_filterInstalled) {
+          await Extensions.setFilterInstalled(true);
+        } else {
+          _extensions = _allExtensions;
+          _emit("extensions:changed", { extensions: _extensions, warning: _error });
+        }
       } catch (e) {
         console.error("[Extensions] load failed", e);
         _extensions = [];
@@ -100,6 +108,28 @@ const ExtensionsStore = (() => {
       return Extensions.load();
     },
 
+    /** Toggle the "installed only" filter — fetches from local store when enabled. */
+    async setFilterInstalled(onlyInstalled) {
+      _filterInstalled = !!onlyInstalled;
+      if (_filterInstalled) {
+        _loading = true;
+        _emit("extensions:loading");
+        try {
+          const res  = await fetch("/api/store/extensions/installed");
+          const data = await res.json();
+          _extensions = data.extensions || [];
+        } catch (e) {
+          console.error("[Extensions] load installed failed", e);
+          _extensions = [];
+        } finally {
+          _loading = false;
+        }
+        _emit("extensions:changed", { extensions: _extensions, warning: _error });
+      } else {
+        return Extensions.load();
+      }
+    },
+
     /** Open the detail view for one extension (fetches contributes + versions). */
     async loadDetail(id) {
       if (!id) return;
@@ -147,8 +177,7 @@ const ExtensionsStore = (() => {
         });
         const data = await res.json();
         if (!res.ok || !data.ok) throw new Error(data.error || "toggle failed");
-        await Extensions.loadDetail(id);
-        Extensions.load();
+        location.reload();
       } catch (e) {
         console.error("[Extensions] setEnabled failed", e);
         _detailError = e.message;
@@ -156,6 +185,31 @@ const ExtensionsStore = (() => {
       }
     },
 
+    /** Install a marketplace extension by fetching its download_url then posting to the local server. */
+    async install(id) {
+      if (!id) return;
+      try {
+        const detailRes  = await fetch("/api/store/extension?id=" + encodeURIComponent(id));
+        const detailData = await detailRes.json();
+        if (!detailRes.ok || !detailData.ok) throw new Error(detailData.error || "fetch detail failed");
+        const ext          = detailData.extension;
+        const download_url = ext.download_url;
+        if (!download_url) throw new Error("No download URL available");
+        const res = await fetch("/api/store/extension/install", {
+          method:  "POST",
+          headers: { "Content-Type": "application/json" },
+          body:    JSON.stringify({ download_url, name: ext.name }),
+        });
+        const data = await res.json();
+        if (!res.ok || !data.ok) throw new Error(data.error || "install failed");
+        location.reload();
+      } catch (e) {
+        console.error("[Extensions] install failed", e);
+        _detailError = e.message;
+        _emit("extensions:detail");
+      }
+    },
+
     /** Remove an installed extension, then return to the list. */
     async uninstall(id) {
       if (!id) return;
@@ -167,8 +221,7 @@ const ExtensionsStore = (() => {
         });
         const data = await res.json();
         if (!res.ok || !data.ok) throw new Error(data.error || "uninstall failed");
-        Extensions.closeDetail();
-        Extensions.load();
+        location.reload();
       } catch (e) {
         console.error("[Extensions] uninstall failed", e);
         _detailError = e.message;

data/lib/clacky/web/features/extensions/view.js

@@ -89,12 +89,16 @@ const ExtensionsView = (() => {
       ? `<span class="extension-version">v${escapeHtml(String(ext.version))}</span>` : "";
     const installedHtml = ext.installed
       ? `<span class="extension-installed">${escapeHtml(I18n.t("extensions.installed"))}</span>` : "";
+    const unlistedHtml = (ext.unlisted && ext.installed)
+      ? `<span class="extension-unlisted">${escapeHtml(I18n.t("extensions.unlisted"))}</span>` : "";
     const unitsText = _formatUnits(ext.units);
     const unitsHtml = unitsText
       ? `<span class="extension-units">${escapeHtml(unitsText)}</span>` : "";
     const homepageHtml = ext.homepage
       ? `<a class="extension-homepage" href="${escapeHtml(ext.homepage)}" target="_blank" rel="noopener noreferrer">${I18n.t("extensions.homepage")}</a>`
       : "";
+    const authorHtml = ext.author
+      ? `<span class="extension-author">· ${escapeHtml(ext.author)}</span>` : "";
 
     const card = document.createElement("div");
     card.className = "extension-card extension-card-clickable";
@@ -105,14 +109,14 @@ const ExtensionsView = (() => {
         <div class="extension-info">
           <div class="extension-title">
             <span class="extension-name">${escapeHtml(name)}</span>
+            ${authorHtml}
             ${versionHtml}
             ${installedHtml}
+            ${unlistedHtml}
             ${unitsHtml}
           </div>
-          <div class="extension-desc">${escapeHtml(description)}</div>
-          <div class="extension-meta">
-            ${homepageHtml}
-          </div>
+          ${description ? `<div class="extension-desc">${escapeHtml(description)}</div>` : ""}
+          ${homepageHtml ? `<div class="extension-meta">${homepageHtml}</div>` : ""}
         </div>
       </div>`;
     return card;
@@ -147,9 +151,8 @@ const ExtensionsView = (() => {
     }
 
     if (st.detailError) {
-      panel.innerHTML = _detailShell(`
-        <div class="extensions-empty">${escapeHtml(st.detailError)}</div>`);
-      _wireDetail();
+      console.warn("[Extensions] detail error, navigating back:", st.detailError);
+      _backToList();
       return;
     }
 
@@ -189,6 +192,16 @@ const ExtensionsView = (() => {
         if (ok) Extensions.uninstall(id);
       });
     }
+
+    const installBtn = document.querySelector("[data-ext-install]");
+    if (installBtn) {
+      installBtn.addEventListener("click", () => {
+        const id = installBtn.getAttribute("data-ext-install");
+        installBtn.disabled = true;
+        installBtn.textContent = I18n.t("extensions.action.installing");
+        Extensions.install(id);
+      });
+    }
   }
 
   function _backToList() {
@@ -209,12 +222,16 @@ const ExtensionsView = (() => {
       ? `<span class="extension-version">v${escapeHtml(String(ext.version))}</span>` : "";
     const installedHtml = ext.installed
       ? `<span class="extension-installed">${escapeHtml(I18n.t("extensions.installed"))}</span>` : "";
+    const unlistedHtml = ext.unlisted
+      ? `<span class="extension-unlisted">${escapeHtml(I18n.t("extensions.unlisted"))}</span>` : "";
     const unitsText = _formatUnits(ext.units);
     const unitsHtml = unitsText
       ? `<span class="extension-units">${escapeHtml(unitsText)}</span>` : "";
     const homepageHtml = ext.homepage
       ? `<a class="extension-homepage" href="${escapeHtml(ext.homepage)}" target="_blank" rel="noopener noreferrer">${I18n.t("extensions.homepage")}</a>`
       : "";
+    const authorHtml = ext.author
+      ? `<span class="extension-author">· ${escapeHtml(ext.author)}</span>` : "";
 
     return `
       <div class="extension-detail-hero">
@@ -222,14 +239,14 @@ const ExtensionsView = (() => {
         <div class="extension-detail-heading">
           <div class="extension-title">
             <span class="extension-name extension-name-lg">${escapeHtml(name)}</span>
+            ${authorHtml}
             ${versionHtml}
             ${installedHtml}
+            ${unlistedHtml}
             ${unitsHtml}
           </div>
-          <div class="extension-desc">${escapeHtml(description)}</div>
-          <div class="extension-meta">
-            ${homepageHtml}
-          </div>
+          ${description ? `<div class="extension-desc extension-desc-detail">${escapeHtml(description)}</div>` : ""}
+          ${homepageHtml ? `<div class="extension-meta">${homepageHtml}</div>` : ""}
           ${_renderActions(ext)}
         </div>
       </div>
@@ -240,8 +257,17 @@ const ExtensionsView = (() => {
   // Manage buttons for a locally installed extension: enable/disable toggle
   // (always available when installed) plus remove (installed layer only).
   function _renderActions(ext) {
-    if (!ext.installed) return "";
-    const slug = ext.name || ext.slug || (ext.id != null ? String(ext.id) : "");
+    const id = ext.id != null ? String(ext.id) : (ext.name || ext.slug || "");
+    if (!ext.installed) {
+      if (ext.origin === "marketplace" && ext.download_url) {
+        return `
+      <div class="extension-detail-actions">
+        <button type="button" class="extension-action extension-action-install" data-ext-install="${escapeHtml(id)}">${escapeHtml(I18n.t("extensions.action.install"))}</button>
+      </div>`;
+      }
+      return "";
+    }
+    const slug = ext.name || ext.slug || id;
     const toggleKey = ext.disabled ? "extensions.action.enable" : "extensions.action.disable";
     const toggleCls = ext.disabled ? "extension-action-enable" : "extension-action-disable";
     const disabledBadge = ext.disabled
@@ -274,10 +300,13 @@ const ExtensionsView = (() => {
       const singular = type.replace(/s$/, "");
       const heading = _sectionHeading(type);
       const rows = items.map((it) => {
-        const title = (currentLang === "zh" && it.title_zh) ? it.title_zh
-          : (it.title || it.name || it.id || singular);
-        const desc = (currentLang === "zh" && it.description_zh) ? it.description_zh
-          : (it.description || "");
+        const isStr = typeof it === "string";
+        const title = isStr ? it
+          : ((currentLang === "zh" && it.title_zh) ? it.title_zh
+            : (it.title || it.name || it.id || singular));
+        const desc = isStr ? ""
+          : ((currentLang === "zh" && it.description_zh) ? it.description_zh
+            : (it.description || ""));
         return `
           <li class="extension-contrib-item">
             <span class="extension-contrib-title">${escapeHtml(String(title))}</span>
@@ -340,6 +369,14 @@ const ExtensionsView = (() => {
       sortSelect.addEventListener("change", () => Extensions.setSort(sortSelect.value));
     }
 
+    document.querySelectorAll(".extensions-filter-tab").forEach(btn => {
+      btn.addEventListener("click", () => {
+        document.querySelectorAll(".extensions-filter-tab").forEach(b => b.classList.remove("extensions-filter-tab-active"));
+        btn.classList.add("extensions-filter-tab-active");
+        Extensions.setFilterInstalled(btn.dataset.filter === "installed");
+      });
+    });
+
     const list = $("extensions-list");
     if (list) {
       list.addEventListener("click", (e) => {

data/lib/clacky/web/features/new-session/view.js

@@ -110,7 +110,7 @@ const NewSessionView = (() => {
       }
 
       const author = (a.author || "").trim();
-      if (author) {
+      if (author && !_isBuiltin(a)) {
         const by = document.createElement("div");
         by.className = "agent-card-author";
         by.textContent = _isZh() ? `作者 ${author}` : `by ${author}`;

data/lib/clacky/web/i18n.js

@@ -508,16 +508,20 @@ const I18n = (() => {
       "mcp.title":                "MCP Servers",
       "mcp.subtitle":             "Standard Model Context Protocol servers (Claude Desktop / Cursor compatible). Edit ~/.clacky/mcp.json to add or remove servers.",
       "extensions.title":         "Extension Market",
-      "extensions.subtitle":      "Browse and manage your extensions to enhance OpenClacky with agents, skills, and panels.",
+      "extensions.subtitle":      "Browse and manage extensions — add agents, skills, and panels to supercharge your workflow.",
       "extensions.searchPlaceholder": "Search extensions…",
       "extensions.sort.newest":   "Newest",
       "extensions.sort.updated":  "Recently updated",
       "extensions.sort.downloads": "Most downloaded",
+      "extensions.filter.all":       "All",
+      "extensions.filter.installed": "Installed",
       "extensions.empty":         "No extensions available yet.",
       "extensions.noResults":     "No extensions match your search.",
       "extensions.loadFailed":    "Could not reach the extension store.",
       "extensions.homepage":      "Homepage",
+      "extensions.by":            "by",
       "extensions.installed":     "Installed",
+      "extensions.unlisted":      "Unlisted",
       "extensions.unit.skill":    "skill",
       "extensions.unit.skills":   "skills",
       "extensions.unit.agent":    "agent",
@@ -534,10 +538,12 @@ const I18n = (() => {
       "extensions.section.panels":     "Panels",
       "extensions.section.api":        "APIs",
       "extensions.disabled":               "Disabled",
+      "extensions.action.install":         "Install",
+      "extensions.action.installing":      "Installing…",
       "extensions.action.disable":         "Disable",
       "extensions.action.enable":          "Enable",
       "extensions.action.remove":          "Remove",
-      "extensions.action.removeConfirm":   "Remove this extension? Its files will be deleted. You can reinstall it from your license package later.",
+      "extensions.action.removeConfirm":   "Remove this extension? Its files will be deleted. You can reinstall it later.",
       "mcp.loading":              "Loading…",
       "mcp.empty.title":          "No MCP servers configured",
       "mcp.empty.body":           "Create ~/.clacky/mcp.json to plug in MCP servers. The format matches Claude Desktop and Cursor, so existing configs work as-is.",
@@ -1465,16 +1471,20 @@ const I18n = (() => {
       "mcp.title":                "MCP 工具",
       "mcp.subtitle":             "标准 Model Context Protocol 服务（与 Claude Desktop / Cursor 兼容）。编辑 ~/.clacky/mcp.json 添加或移除服务。",
       "extensions.title":         "扩展市场",
-      "extensions.subtitle":      "浏览并管理你的扩展，用 Agent、技能与面板增强 OpenClacky。",
+      "extensions.subtitle":      "浏览并管理扩展，用 Agent、技能与面板增强你的工作流。",
       "extensions.searchPlaceholder": "搜索扩展…",
       "extensions.sort.newest":   "最新",
       "extensions.sort.updated":  "最近更新",
       "extensions.sort.downloads": "下载最多",
+      "extensions.filter.all":       "全部",
+      "extensions.filter.installed": "已安装",
       "extensions.empty":         "暂无可用扩展。",
       "extensions.noResults":     "没有匹配的扩展。",
       "extensions.loadFailed":    "无法连接扩展市场。",
       "extensions.homepage":      "主页",
+      "extensions.by":            "作者",
       "extensions.installed":     "已安装",
+      "extensions.unlisted":      "已下架",
       "extensions.unit.skill":    "个技能",
       "extensions.unit.skills":   "个技能",
       "extensions.unit.agent":    "个 Agent",
@@ -1491,10 +1501,12 @@ const I18n = (() => {
       "extensions.section.panels":     "面板",
       "extensions.section.api":        "API",
       "extensions.disabled":               "已禁用",
+      "extensions.action.install":         "安装",
+      "extensions.action.installing":      "安装中…",
       "extensions.action.disable":         "禁用",
       "extensions.action.enable":          "启用",
       "extensions.action.remove":          "移除",
-      "extensions.action.removeConfirm":   "确定移除此扩展？相关文件会被删除，之后可从授权包重新安装。",
+      "extensions.action.removeConfirm":   "确定移除此扩展？相关文件会被删除，之后可重新安装。",
       "mcp.loading":              "加载中…",
       "mcp.empty.title":          "尚未配置 MCP 服务",
       "mcp.empty.body":           "新建 ~/.clacky/mcp.json 即可接入 MCP 服务。格式与 Claude Desktop、Cursor 一致，现有配置可直接复用。",

data/lib/clacky/web/index.html

@@ -662,12 +662,18 @@
         </div>
 
         <div class="extensions-toolbar">
-          <select id="extensions-sort" class="extensions-sort">
-            <option value="newest" data-i18n="extensions.sort.newest">Newest</option>
-            <option value="updated" data-i18n="extensions.sort.updated">Recently updated</option>
-            <option value="downloads" data-i18n="extensions.sort.downloads">Most downloaded</option>
-          </select>
-          <input type="text" id="extensions-search-input" class="extensions-search" placeholder="Search extensions…" />
+          <div class="extensions-filter-tabs">
+            <button type="button" class="extensions-filter-tab extensions-filter-tab-active" data-filter="all" data-i18n="extensions.filter.all">All</button>
+            <button type="button" class="extensions-filter-tab" data-filter="installed" data-i18n="extensions.filter.installed">Installed</button>
+          </div>
+          <div class="extensions-toolbar-right">
+            <input type="text" id="extensions-search-input" class="extensions-search" placeholder="Search extensions…" />
+            <select id="extensions-sort" class="extensions-sort">
+              <option value="newest" data-i18n="extensions.sort.newest">Newest</option>
+              <option value="updated" data-i18n="extensions.sort.updated">Recently updated</option>
+              <option value="downloads" data-i18n="extensions.sort.downloads">Most downloaded</option>
+            </select>
+          </div>
         </div>
 
         <div id="extensions-warning" class="brand-skills-warning" style="display:none"></div>

data/lib/clacky/web/sessions.js

@@ -113,6 +113,33 @@ const Sessions = (() => {
     return html;
   }
 
+  // Encode file:// URLs inside raw markdown BEFORE marked parses it. The AI
+  // emits raw paths (spaces / non-ASCII / % literal); marked's link tokenizer
+  // treats a space as the end of the URL, so links with spaces are never
+  // recognized. Re-encoding the path (decode then encode, idempotent) turns
+  // spaces into %20 and a literal % into %25 so marked sees a valid URL.
+  function _encodeFileUrlsInMarkdown(text) {
+    return text.replace(
+      /(!?\[[^\]]*\]\()(file:\/{2,3})([^)]+)(\))/g,
+      (_m, open, scheme, path, close) => {
+        try { path = decodeURI(path); } catch (_) { /* keep raw if malformed */ }
+        return open + scheme + encodeURI(path) + close;
+      }
+    );
+  }
+
+  // Normalize a file:// href for use in <a href>. The AI emits raw paths
+  // (Chinese chars / spaces literal); encode them to a valid percent-encoded
+  // URL. Idempotent: an already-encoded path is decoded first so it isn't
+  // double-encoded. Non file:// links pass through untouched.
+  function _normalizeFileHref(href) {
+    if (typeof href !== "string" || !href.startsWith("file://")) return href;
+    const prefix = href.match(/^file:\/{2,3}/)[0];
+    let path = href.slice(prefix.length);
+    try { path = decodeURI(path); } catch (_) { /* keep raw if malformed */ }
+    return prefix + encodeURI(path);
+  }
+
   // Run marked on a text string. Returns HTML. Falls back to escaped plain text
   // if the marked library is unavailable.
   function _markedParse(text) {
@@ -122,6 +149,7 @@ const Sessions = (() => {
     const math = [];
     const PLACEHOLDER = (i) => `\u0000KTX${i}\u0000`;
     let prepared = _extractMath(text, math, PLACEHOLDER);
+    prepared = _encodeFileUrlsInMarkdown(prepared);
 
     let html;
     if (typeof marked !== "undefined") {
@@ -138,7 +166,7 @@ const Sessions = (() => {
       const renderer = new marked.Renderer();
       renderer.link = function({ href, title, text }) {
         const titleAttr = title ? ` title="${title}"` : "";
-        return `<a href="${href}"${titleAttr} target="_blank" rel="noopener noreferrer">${text}</a>`;
+        return `<a href="${_normalizeFileHref(href)}"${titleAttr} target="_blank" rel="noopener noreferrer">${text}</a>`;
       };
       // Override code block rendering: apply syntax highlighting + header with
       // language label and copy button.
@@ -2307,7 +2335,9 @@ const Sessions = (() => {
         const link = e.target.closest("a[href^='file://']");
         if (!link) return;
         e.preventDefault();
-        let filePath = decodeURIComponent(link.getAttribute("href").replace(/^file:\/\//, ""));
+        const rawHref = link.getAttribute("href").replace(/^file:\/\//, "");
+        let filePath;
+        try { filePath = decodeURIComponent(rawHref); } catch (_) { filePath = rawHref; }
         // file:///C:/foo → /C:/foo after replace; strip the leading slash for Windows drive letters
         if (/^\/[A-Za-z]:/.test(filePath)) filePath = filePath.substring(1);
         if (!filePath) return;

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: openclacky
 version: !ruby/object:Gem::Version
-  version: 1.3.8
+  version: 1.3.10
 platform: ruby
 authors:
 - windy