@max-null/dsh-plugin-center 0.1.7 → 0.2.1

package/client.js

@@ -30,6 +30,7 @@ __export(index_exports, {
   inject: () => inject
 });
 module.exports = __toCommonJS(index_exports);
+var import_react_dom = require("react-dom");
 var import_react = require("react");
 var import_jsx_runtime = require("react/jsx-runtime");
 var CSS = `
@@ -60,11 +61,27 @@ var CSS = `
 .pc-badge.local, .pc-badge.builtin { background: var(--dsw-alias-bg-module-platform); color: var(--dsw-alias-label-tertiary); }
 .pc-tag { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 6px; font-size: 12px; line-height: 1; background: var(--dsw-alias-bg-module-platform); color: var(--dsw-alias-label-secondary); }
 .pc-tag.danger { background: var(--dsw-alias-interactive-bg-hover-danger); color: var(--dsw-alias-state-error-primary); }
-.pc-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--dsw-alias-state-success-primary); }
-.pc-dot.failed { background: var(--dsw-alias-state-error-primary); }
+.pc-switch { position: relative; flex: none; width: 36px; height: 20px; border-radius: 10px; border: none; background: rgba(0,0,0,.22); cursor: pointer; transition: background .2s ease; padding: 0; }
+.pc-switch::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: left .2s ease; }
+.pc-switch.on { background: var(--dsw-alias-state-success-primary); }
+.pc-switch.on::after { left: 18px; }
+.pc-switch:disabled { opacity: .6; cursor: default; }
+body[data-ds-dark-theme] .pc-switch { background: rgba(255,255,255,.28); }
+body[data-ds-dark-theme] .pc-switch.on { background: var(--dsw-alias-state-success-primary); }
 
 .pc-toolbar { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 4px 0; }
-.pc-chip { height: 28px; padding: 0 12px; border-radius: 18px; border: 1px solid var(--dsw-alias-border-l2); background: var(--dsw-alias-bg-base); color: var(--dsw-alias-label-secondary); font-size: 13px; cursor: pointer; font-family: inherit; }
+/* \u7B5B\u9009\u533A\u7EB5\u5411\u5BB9\u5668\uFF1AAI \u63A8\u8350\u884C / \u4E3B\u7B5B\u9009\u884C / \u5206\u7C7B\u884C\u4E09\u6BB5\uFF0C\u95F4\u8DDD\u7EDF\u4E00\u3002 */
+.pc-filter { display: flex; flex-direction: column; gap: 6px; flex: none; margin-top: 2px; }
+/* \u4E3B\u7B5B\u9009\u884C\uFF1A\u4E00\u884C\u653E\u641C\u7D22 + \u6765\u6E90 + \u5DE5\u4F5C\u533A\u6309\u94AE\uFF0C\u4E0D\u6362\u884C\u3002 */
+.pc-toolbar-main { flex-wrap: nowrap; }
+/* \u5206\u7C7B\u884C\uFF1A\u72EC\u7ACB\u4E00\u884C\u3001\u6A2A\u5411\u6EDA\u52A8\uFF08\u4E0D wrap \u6210\u6298\u884C\u4E71\u6392\uFF09\uFF0Cchip \u4E0D\u538B\u7F29\u3002 */
+.pc-catbar { display: flex; align-items: center; gap: 6px; overflow-x: auto; padding: 2px 0 4px; scrollbar-width: thin; scrollbar-color: var(--dsw-alias-border-l3, rgba(0,0,0,.2)) transparent; }
+.pc-catbar .pc-chip { flex: none; white-space: nowrap; }
+/* \u5E02\u573A\u8D85\u91CF\u63D0\u793A\uFF1A\u5C0F\u53F7\u5F31\u5316\u6587\u5B57\uFF0C\u4E0E\u7B5B\u9009\u533A\u89C6\u89C9\u5206\u79BB\u3002 */
+.pc-limit { margin: 2px 0 8px; font-size: 12px; line-height: 16px; color: var(--dsw-alias-label-caption); }
+.pc-ai-row { display: flex; gap: 8px; align-items: center; }
+.pc-ai-row .pc-btn { height: 28px; }
+.pc-chip { height: 28px; padding: 0 12px; border-radius: 18px; border: 1px solid var(--dsw-alias-border-l2); background: var(--dsw-alias-bg-base); color: var(--dsw-alias-label-secondary); font-size: 13px; cursor: pointer; font-family: inherit; transition: background .15s ease, color .15s ease, border-color .15s ease; }
 .pc-chip:hover { background: var(--dsw-alias-interactive-bg-hover); }
 .pc-chip.active { background: var(--dsw-alias-state-business-primary); border-color: var(--dsw-alias-state-business-primary); color: var(--dsw-alias-bg-base); }
 
@@ -77,7 +94,12 @@ var CSS = `
 .pc-search { height: 28px; padding: 0 12px; border-radius: 18px; border: 1px solid var(--dsw-alias-border-l2); background: var(--dsw-alias-bg-base); color: var(--dsw-alias-label-primary); font-size: 13px; outline: none; width: 200px; font-family: inherit; }
 .pc-search:focus { border-color: var(--dsw-alias-state-business-primary); }
 .pc-search::placeholder { color: var(--dsw-alias-label-caption); }
-.pc-select { height: 28px; padding: 0 8px; border-radius: 18px; border: 1px solid var(--dsw-alias-border-l2); background: var(--dsw-alias-bg-base); color: var(--dsw-alias-label-secondary); font-size: 13px; cursor: pointer; font-family: inherit; }
+/* \u5B9A\u5236 select\uFF1A\u5265\u79BB\u6D4F\u89C8\u5668\u539F\u751F\u5916\u89C2\uFF08\u9AD8\u5EA6/\u5185\u8FB9\u8DDD/padding \u5DEE\u5F02\u662F\u8DE8\u63A7\u4EF6\u4E0D\u9F50\u7684
+   \u4E3B\u56E0\uFF09\uFF0C\u7528\u80CC\u666F chevron \u66FF\u4EE3\u7CFB\u7EDF\u7BAD\u5934\uFF0C\u4E0E chip/\u641C\u7D22\u6846\u540C\u9AD8\u540C\u5706\u89D2\u3002 */
+.pc-select { height: 28px; padding: 0 26px 0 12px; border-radius: 18px; border: 1px solid var(--dsw-alias-border-l2); background-color: var(--dsw-alias-bg-base); color: var(--dsw-alias-label-secondary); font-size: 13px; cursor: pointer; font-family: inherit; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none' stroke='%23777777' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3.5l3 3 3-3'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; background-size: 10px 10px; }
+.pc-select:hover { background-color: var(--dsw-alias-interactive-bg-hover); }
+.pc-select:focus-visible { outline: none; border-color: var(--dsw-alias-state-business-primary); }
+body[data-ds-dark-theme] .pc-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none' stroke='%23b0b0b0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3.5l3 3 3-3'/%3E%3C/svg%3E"); }
 .pc-iconbtn { width: 28px; height: 28px; padding: 0; border-radius: 18px; border: 1px solid var(--dsw-alias-border-l2); background: var(--dsw-alias-bg-base); color: var(--dsw-alias-label-secondary); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
 .pc-iconbtn:hover { background: var(--dsw-alias-interactive-bg-hover); }
 
@@ -97,9 +119,24 @@ var CSS = `
 .pc-wn-item { border-bottom: 1px solid var(--dsw-alias-border-l1); padding: 14px 0; }
 .pc-wn-item:last-child { border-bottom: none; }
 .pc-wn-list { margin-top: 8px; padding-left: 20px; color: var(--dsw-alias-label-secondary); font-size: 13px; }
-.pc-toast { position: fixed; bottom: 32px; left: 50%; transform: translateX(-50%); padding: 10px 18px; border-radius: 10px; background: var(--dsw-alias-bg-layer-1); border: 1px solid var(--dsw-alias-border-l2); color: var(--dsw-alias-label-primary); font-size: 13px; box-shadow: 0 8px 32px rgba(0,0,0,.18); z-index: 200; max-width: 80vw; }
+.pc-toast { position: fixed; bottom: 32px; left: 50%; transform: translateX(-50%); padding: 10px 18px; border-radius: 10px; background: var(--dsw-alias-bg-layer-1); border: 1px solid var(--dsw-alias-border-l2); color: var(--dsw-alias-label-primary); font-size: 13px; box-shadow: 0 8px 32px rgba(0,0,0,.18); z-index: 1500; max-width: 80vw; }
 .pc-toast.ok { border-color: var(--dsw-alias-state-success-primary); }
 .pc-toast.error { border-color: var(--dsw-alias-state-error-primary); }
+/* DSH 0.1.x \u8BBE\u7F6E\u5BFC\u822A\u65E0 icon \u5951\u7EA6\uFF08external section \u4E00\u5F8B\u9ED8\u8BA4\u9F7F\u8F6E\uFF09\u3002settings-nav-icon
+   \u6807\u8BB0\u672C\u63D2\u4EF6\u884C\u540E\uFF1A\u9690\u85CF\u58F3\u6E32\u67D3\u7684\u9F7F\u8F6E SVG\uFF0C\u7528\u4E0E\u53F3\u4E0A\u89D2 HeaderButton \u76F8\u540C\u7684 2\xD72 \u7F51\u683C
+   \u56FE\u6807\uFF08currentColor mask\uFF09\u66FF\u6362\uFF0C\u8DDF\u968F\u539F\u751F\u5BFC\u822A hover/active \u989C\u8272\u4E14\u4E0D\u6539\u53D8\u58F3\u7684
+   16px \u56FE\u6807\u8282\u594F\u3002\u9009\u62E9\u5668\u517C\u5BB9\u56FE\u6807\u76F4\u63A5\u4E3A button \u9996\u5B50\u5143\u7D20\u4E0E\u5305\u4E00\u5C42 wrapper \u4E24\u79CD\u60C5\u51B5\u3002 */
+[data-dsh-plugin-center-settings-nav] > svg:first-child,
+[data-dsh-plugin-center-settings-nav] > *:first-child > svg:first-child { display: none; }
+[data-dsh-plugin-center-settings-nav]::before {
+  content: '';
+  flex: none;
+  width: 16px;
+  height: 16px;
+  background: currentColor;
+  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Crect x='2' y='2' width='5' height='5' rx='1'/%3E%3Crect x='9' y='2' width='5' height='5' rx='1'/%3E%3Crect x='2' y='9' width='5' height='5' rx='1'/%3E%3Crect x='9' y='9' width='5' height='5' rx='1'/%3E%3C/svg%3E") center / contain no-repeat;
+  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Crect x='2' y='2' width='5' height='5' rx='1'/%3E%3Crect x='9' y='2' width='5' height='5' rx='1'/%3E%3Crect x='2' y='9' width='5' height='5' rx='1'/%3E%3Crect x='9' y='9' width='5' height='5' rx='1'/%3E%3C/svg%3E") center / contain no-repeat;
+}
 `;
 var cssInjected = false;
 function injectCss() {
@@ -110,6 +147,30 @@ function injectCss() {
   style.textContent = CSS;
   document.head.append(style);
 }
+var SETTINGS_NAV_MARKER = "data-dsh-plugin-center-settings-nav";
+function registerSettingsNavIcon(label) {
+  let disposed = false;
+  const sync = () => {
+    if (disposed) return;
+    const currentLabel = label().trim();
+    const buttons = document.querySelectorAll('[role="dialog"] nav button');
+    for (const button of buttons) {
+      const matches = currentLabel.length > 0 && button.textContent?.trim() === currentLabel;
+      if (matches) button.setAttribute(SETTINGS_NAV_MARKER, "");
+      else button.removeAttribute(SETTINGS_NAV_MARKER);
+    }
+  };
+  sync();
+  const observer = new MutationObserver(sync);
+  observer.observe(document.body, { childList: true, subtree: true, characterData: true });
+  return () => {
+    disposed = true;
+    observer.disconnect();
+    document.querySelectorAll(`[${SETTINGS_NAV_MARKER}]`).forEach((element) => {
+      element.removeAttribute(SETTINGS_NAV_MARKER);
+    });
+  };
+}
 var rpc = async () => {
   throw new Error("plugin-center: rpc not wired");
 };
@@ -164,6 +225,82 @@ function useWhatsNewOpen() {
 var readCache = {};
 var installedCache = null;
 var marketCache = {};
+var countsState = { installed: 0, market: 0, dshMarket: 0, failed: 0 };
+var countListeners = /* @__PURE__ */ new Set();
+function setCounts(partial) {
+  const next = { ...countsState, ...partial };
+  if (next.installed === countsState.installed && next.market === countsState.market && next.dshMarket === countsState.dshMarket && next.failed === countsState.failed) return;
+  countsState = next;
+  countListeners.forEach((l) => l());
+}
+var updatingPlugins = /* @__PURE__ */ new Set();
+var updatingListeners = /* @__PURE__ */ new Set();
+function setUpdating(name, on) {
+  if (on) updatingPlugins.add(name);
+  else updatingPlugins.delete(name);
+  updatingListeners.forEach((l) => l());
+}
+var pendingToggles = /* @__PURE__ */ new Map();
+var pendingListeners = /* @__PURE__ */ new Set();
+function setPendingToggle(id, action) {
+  if (action === "disable") pendingToggles.set(id, true);
+  else if (action === "enable") pendingToggles.set(id, false);
+  else pendingToggles.delete(id);
+  pendingListeners.forEach((l) => l());
+}
+function usePendingVersion() {
+  const [v, setV] = (0, import_react.useState)(0);
+  (0, import_react.useEffect)(() => {
+    const l = () => {
+      setV((x) => x + 1);
+    };
+    pendingListeners.add(l);
+    return () => {
+      pendingListeners.delete(l);
+    };
+  }, []);
+  return v;
+}
+var installedListeners = /* @__PURE__ */ new Set();
+function useInstalledVersion() {
+  const [v, setV] = (0, import_react.useState)(0);
+  (0, import_react.useEffect)(() => {
+    const l = () => {
+      setV((x) => x + 1);
+    };
+    installedListeners.add(l);
+    return () => {
+      installedListeners.delete(l);
+    };
+  }, []);
+  return v;
+}
+function useUpdatingVersion() {
+  const [v, setV] = (0, import_react.useState)(0);
+  (0, import_react.useEffect)(() => {
+    const l = () => {
+      setV((x) => x + 1);
+    };
+    updatingListeners.add(l);
+    return () => {
+      updatingListeners.delete(l);
+    };
+  }, []);
+  return v;
+}
+function useCounts() {
+  const [v, setV] = (0, import_react.useState)(0);
+  (0, import_react.useEffect)(() => {
+    const l = () => {
+      setV((x) => x + 1);
+    };
+    countListeners.add(l);
+    return () => {
+      countListeners.delete(l);
+    };
+  }, []);
+  return countsState;
+}
 var toastState = null;
 var toastListeners = /* @__PURE__ */ new Set();
 function showToast(message, kind = "ok", duration = 3200) {
@@ -260,7 +397,32 @@ var STRINGS = {
     close: "\u5173\u95ED",
     checkFail: "\u68C0\u67E5\u66F4\u65B0\u5931\u8D25\uFF0C\u8BF7\u7A0D\u540E\u91CD\u8BD5",
     foundUpdates: "\u53D1\u73B0 {n} \u4E2A\u53EF\u66F4\u65B0\u63D2\u4EF6",
-    allUpToDate: "\u6240\u6709\u63D2\u4EF6\u5747\u4E3A\u6700\u65B0"
+    allUpToDate: "\u6240\u6709\u63D2\u4EF6\u5747\u4E3A\u6700\u65B0",
+    disable: "\u7981\u7528",
+    enable: "\u542F\u7528",
+    toggling: "\u5904\u7406\u4E2D\u2026",
+    disabledOk: "\u5DF2\u7981\u7528 {n}\uFF0C\u91CD\u542F\u540E\u751F\u6548",
+    enabledOk: "\u5DF2\u542F\u7528 {n}\uFF0C\u91CD\u542F\u540E\u751F\u6548",
+    toggleFailed: "\u64CD\u4F5C\u5931\u8D25\uFF1A{e}",
+    revertedDisable: "\u5DF2\u64A4\u9500\u7981\u7528 {n}",
+    revertedEnable: "\u5DF2\u64A4\u9500\u542F\u7528 {n}",
+    tabDiagnose: "\u8BCA\u65AD",
+    diagExport: "\u5BFC\u51FA\u8BCA\u65AD\u65E5\u5FD7",
+    diagCopied: "\u8BCA\u65AD\u5DF2\u590D\u5236\u5230\u526A\u8D34\u677F",
+    diagTitle: "\u73AF\u5883\u4E0E\u63D2\u4EF6\u8BCA\u65AD",
+    diagInstalled: "\u5DF2\u5B89\u88C5\u63D2\u4EF6\uFF08{n}\uFF09",
+    diagDisabled: "\u7981\u7528\u72B6\u6001",
+    diagPnpmLog: "pnpm \u65E5\u5FD7\uFF08\u5C3E\u90E8\uFF09",
+    aiTitle: "AI \u63A8\u8350",
+    aiPlaceholder: "\u63CF\u8FF0\u4F60\u7684\u9700\u6C42\uFF0C\u8BA9 AI \u63A8\u8350\u63D2\u4EF6\u2026\uFF08\u4F8B\u5982\uFF1A\u80FD\u9884\u89C8 Markdown \u7684\u63D2\u4EF6\uFF09",
+    aiAsk: "\u63A8\u8350",
+    aiAsking: "AI \u601D\u8003\u4E2D\u2026",
+    aiFail: "AI \u63A8\u8350\u5931\u8D25\uFF1A{e}",
+    scoreLabel: "\u8BC4\u5206",
+    screenshot: "\u622A\u56FE",
+    noScreenshot: "\u65E0\u622A\u56FE",
+    screenshotFail: "\u622A\u56FE\u83B7\u53D6\u5931\u8D25",
+    marketTooMany: "\u4EC5\u663E\u793A\u524D {n} \u4E2A\uFF08\u5171 {m}\uFF09\uFF0C\u641C\u7D22\u53EF\u7F29\u5C0F\u8303\u56F4"
   },
   en: {
     title: "Plugin Center",
@@ -314,7 +476,32 @@ var STRINGS = {
     close: "Close",
     checkFail: "Failed to check updates, please retry later",
     foundUpdates: "{n} updates found",
-    allUpToDate: "All plugins are up to date"
+    allUpToDate: "All plugins are up to date",
+    disable: "Disable",
+    enable: "Enable",
+    toggling: "Working\u2026",
+    disabledOk: "Disabled {n}; restart to take effect",
+    enabledOk: "Enabled {n}; restart to take effect",
+    toggleFailed: "Failed: {e}",
+    revertedDisable: "Disable of {n} reverted",
+    revertedEnable: "Enable of {n} reverted",
+    tabDiagnose: "Diagnostics",
+    diagExport: "Export diagnostics",
+    diagCopied: "Diagnostics copied to clipboard",
+    diagTitle: "Environment & plugin diagnostics",
+    diagInstalled: "Installed plugins ({n})",
+    diagDisabled: "Disabled state",
+    diagPnpmLog: "pnpm log (tail)",
+    aiTitle: "AI recommendation",
+    aiPlaceholder: "Describe what you need \u2014 e.g. a Markdown preview plugin\u2026",
+    aiAsk: "Recommend",
+    aiAsking: "AI is thinking\u2026",
+    aiFail: "AI recommendation failed: {e}",
+    scoreLabel: "Score",
+    screenshot: "Screenshot",
+    noScreenshot: "No screenshot",
+    screenshotFail: "Screenshot fetch failed",
+    marketTooMany: "Showing first {n} of {m}; search to narrow down"
   }
 };
 var localeId = "zh";
@@ -339,15 +526,22 @@ function useT() {
       localeListeners.delete(l);
     };
   }, []);
-  return (key, vars) => fmt(STRINGS[id][key] ?? STRINGS.zh[key], vars);
+  return (0, import_react.useCallback)((key, vars) => fmt(STRINGS[id][key] ?? STRINGS.zh[key], vars), [id]);
 }
-function InstalledView({ search, category, source }) {
+function InstalledView({ search, category, source, onToggle, togglingId }) {
   const t = useT();
+  const installedVersion = useInstalledVersion();
+  usePendingVersion();
   const [items, setItems] = (0, import_react.useState)(installedCache);
   const [error, setError] = (0, import_react.useState)(null);
   (0, import_react.useEffect)(() => {
-    if (installedCache !== null) return;
     let alive = true;
+    if (installedCache !== null) {
+      setItems(installedCache);
+      return () => {
+        alive = false;
+      };
+    }
     void rpc("listInstalled").then(
       (v) => {
         installedCache = v;
@@ -360,7 +554,11 @@ function InstalledView({ search, category, source }) {
     return () => {
       alive = false;
     };
-  }, []);
+  }, [installedVersion]);
+  const handleToggleLocal = (p) => {
+    setItems((prev) => prev === null ? prev : prev.map((item) => item.entryId === p.entryId ? { ...item, enabled: !item.enabled } : item));
+    onToggle(p);
+  };
   if (error !== null) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("loadFailed", { e: error }) });
   if (items === null) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("loading") });
   const srcLabel = {
@@ -385,22 +583,42 @@ function InstalledView({ search, category, source }) {
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: `pc-badge ${p.source}`, children: srcLabel[p.source] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-spacer" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: `pc-dot${p.fiberPhase === "failed" ? " failed" : ""}` })
+      p.fiberPhase === "failed" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-dot failed", title: "failed" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "button",
+        {
+          type: "button",
+          role: "switch",
+          "aria-checked": p.enabled,
+          "aria-label": p.enabled ? t("disable") : t("enable"),
+          title: p.enabled ? t("disable") : t("enable"),
+          className: `pc-switch${p.enabled ? " on" : ""}`,
+          disabled: togglingId !== null,
+          onClick: () => {
+            handleToggleLocal(p);
+          }
+        }
+      )
     ] }),
     p.description !== null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pc-desc", children: p.description }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-meta", children: [
       p.categories.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: c }, c)),
       p.compatRange !== null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: t("requiresDsh", { r: p.compatRange }) }),
-      !p.enabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: t("disabledTag") })
+      !p.enabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: t("disabledTag") }),
+      pendingToggles.has(p.entryId) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: t("pendingRestart") })
     ] })
   ] }, p.entryId)) });
 }
 function MarketView({ category, single, source, search, onCount }) {
   const t = useT();
-  const [items, setItems] = (0, import_react.useState)(marketCache[source]?.plugins ?? []);
-  const [done, setDone] = (0, import_react.useState)(marketCache[source]?.done ?? false);
+  const [items, setItems] = (0, import_react.useState)(marketCache[source]?.plugins ?? marketCache.all?.plugins ?? []);
+  const [done, setDone] = (0, import_react.useState)(marketCache[source]?.done ?? marketCache.all?.done ?? false);
   const [error, setError] = (0, import_react.useState)(null);
   const [busy, setBusy] = (0, import_react.useState)(null);
+  const [shotBusy, setShotBusy] = (0, import_react.useState)(null);
+  const [shotUrl, setShotUrl] = (0, import_react.useState)(null);
+  const [shotName, setShotName] = (0, import_react.useState)(null);
+  const [shotZoom, setShotZoom] = (0, import_react.useState)(false);
   (0, import_react.useEffect)(() => {
     let alive = true;
     let timer;
@@ -411,9 +629,10 @@ function MarketView({ category, single, source, search, onCount }) {
       onCount(cached.plugins.length);
       if (cached.done) return;
     } else {
-      setItems([]);
-      setDone(false);
-      onCount(0);
+      const fallback = marketCache.all;
+      setItems(fallback?.plugins ?? []);
+      setDone(fallback?.done ?? false);
+      if (fallback !== void 0) onCount(fallback.plugins.length);
     }
     const poll = async () => {
       try {
@@ -441,12 +660,14 @@ function MarketView({ category, single, source, search, onCount }) {
     const matchSearch = q === "" || m.name.toLowerCase().includes(q) || (m.description.zh || m.description.en).toLowerCase().includes(q);
     return matchSearch && (category === null || m.categories.includes(category));
   });
+  const shown = filtered.slice(0, 200);
   const descOf = (m) => localeId === "en" ? m.description.en || m.description.zh : m.description.zh || m.description.en;
   const install = (m) => {
     setBusy(m.name);
     void rpc("install", { spec: m.spec }).then(
       (v) => {
-        if (v !== true) throw new Error(t("installNotApplied"));
+        const durationMs = typeof v === "object" && v !== null ? v.durationMs : void 0;
+        if (v !== true && durationMs === void 0) throw new Error(t("installNotApplied"));
         setBusy(null);
         pendingInstall.add(m.spec);
         for (const key of Object.keys(marketCache)) {
@@ -454,18 +675,44 @@ function MarketView({ category, single, source, search, onCount }) {
           if (c !== void 0) c.plugins = c.plugins.map((p) => p.name === m.name ? { ...p, installed: true } : p);
         }
         setItems((prev) => prev.map((p) => p.name === m.name ? { ...p, installed: true } : p));
-        showToast(t("installQueued", { n: m.name }), "ok", 5e3);
+        showToast(t("installQueued", { n: m.name }) + (durationMs !== void 0 ? `\uFF08${(durationMs / 1e3).toFixed(1)}s\uFF09` : ""), "ok", 5e3);
       },
       (e) => {
         setBusy(null);
-        showToast(t("installFailed", { e: e instanceof Error ? e.message : String(e) }), "error", 8e3);
+        showToast(t("installFailed", { e: e instanceof Error ? e.message : String(e) }), "error", 15e3);
+      }
+    );
+  };
+  const showScreenshot = (m) => {
+    if (shotBusy !== null) return;
+    setShotBusy(m.name);
+    void rpc("screenshot", { name: m.name }).then(
+      (url) => {
+        setShotBusy(null);
+        if (typeof url !== "string" || url === "") {
+          showToast(t("noScreenshot"), "error", 6e3);
+          return;
+        }
+        setShotName(m.name);
+        setShotUrl(url);
+        setShotZoom(false);
+      },
+      () => {
+        setShotBusy(null);
+        showToast(t("screenshotFail"), "error", 6e3);
       }
     );
   };
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `pc-grid ${single ? "single" : "double"}`, children: filtered.map((m) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-card", children: [
+    filtered.length > 200 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-limit", children: t("marketTooMany", { n: shown.length, m: filtered.length }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `pc-grid ${single ? "single" : "double"}`, children: shown.map((m) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-card", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-row", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-name", children: m.name }),
+        m.score !== null && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "pc-tag", title: `${m.score.total}${m.score.explanation !== "" ? `\uFF1A${m.score.explanation}` : ""}`, children: [
+          t("scoreLabel"),
+          " ",
+          m.score.total
+        ] }),
         m.stars !== null && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "pc-ver", children: [
           "\u2605 ",
           m.stars
@@ -477,18 +724,49 @@ function MarketView({ category, single, source, search, onCount }) {
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pc-desc", children: descOf(m) }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-meta", children: [
-        m.categories.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: c }, c)),
+        m.categories.slice(0, 4).map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: c }, c)),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-spacer" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", className: "pc-iconbtn", title: t("screenshot"), "aria-label": t("screenshot"), disabled: shotBusy !== null, onClick: () => {
+          showScreenshot(m);
+        }, children: shotBusy === m.name ? "\u2026" : "\u{1F4F7}" }),
         m.installed || pendingInstall.has(m.spec) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: pendingInstall.has(m.spec) ? t("pendingRestart") : t("installedTag") }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "pc-btn primary", disabled: busy !== null, onClick: () => {
           install(m);
         }, children: busy === m.name ? t("installing") : t("install") })
       ] })
     ] }, m.name)) }),
-    !done && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("loadMore", { n: items.length }) })
+    !done && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("loadMore", { n: items.length }) }),
+    shotUrl !== null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pc-overlay", role: "presentation", onClick: () => {
+      setShotUrl(null);
+      setShotName(null);
+    }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-panel", role: "dialog", "aria-modal": "true", onClick: (e) => {
+      e.stopPropagation();
+    }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-panel-head", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-title", children: shotName ?? "" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-spacer" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", className: "pc-close", onClick: () => {
+          setShotUrl(null);
+          setShotName(null);
+        }, "aria-label": t("close"), children: "\u2715" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pc-panel-body", style: { alignItems: "center", overflow: shotZoom ? "auto" : "hidden" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "img",
+        {
+          src: shotUrl,
+          alt: shotName ?? "",
+          onClick: () => {
+            setShotZoom((v) => !v);
+          },
+          title: shotZoom ? "\u7F29\u5C0F" : "\u70B9\u51FB\u653E\u5927",
+          style: shotZoom ? { maxWidth: "none", maxHeight: "none", width: "auto", borderRadius: 8 } : { maxWidth: "100%", maxHeight: "70vh", borderRadius: 8, objectFit: "contain" }
+        }
+      ) })
+    ] }) })
   ] });
 }
 function UpdatesView({ updates, refresh, updateOne, busy }) {
   const t = useT();
+  useUpdatingVersion();
   if (updates === null) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("checkingUpdates") });
   if (updates.length === 0) return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("noUpdates") }),
@@ -504,11 +782,101 @@ function UpdatesView({ updates, refresh, updateOne, busy }) {
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-spacer" }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "pc-btn primary", disabled: busy !== null, onClick: () => {
         updateOne(u.name, u.toVersion);
-      }, children: busy === u.name || busy === "__all__" ? t("updating") : t("update") })
+      }, children: busy === u.name || busy === "__all__" || updatingPlugins.has(u.name) ? t("updating") : t("update") })
     ] }),
     u.changelog.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { className: "pc-wn-list", children: u.changelog.slice(0, 5).map((line, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("li", { children: line }, i)) })
   ] }, u.name)) });
 }
+function DiagnoseView() {
+  const t = useT();
+  const [report, setReport] = (0, import_react.useState)(null);
+  const [error, setError] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    let alive = true;
+    void rpc("diagnostics").then(
+      (v) => {
+        if (alive) setReport(v);
+      },
+      (e) => {
+        if (alive) setError(e instanceof Error ? e.message : String(e));
+      }
+    );
+    return () => {
+      alive = false;
+    };
+  }, []);
+  const textOf = () => {
+    if (report === null) return "no diagnostics";
+    const lines = [
+      "=== dsh-plugin-center diagnostics ===",
+      `dsh: ${report.dshVersion}`,
+      `node: ${report.node}`,
+      `profile: ${report.baseUrl}`,
+      `installed (${report.installed.length}):`,
+      ...report.installed.map((p) => `  ${p.enabled ? "" : "[disabled] "}${p.name}@${p.version ?? "?"} (${p.source}, ${p.fiberPhase ?? "?"})`),
+      "patch disabled:",
+      ...Object.entries(report.disabled).map(([id, v]) => `  ${id}: ${v ? "disabled" : "force-enabled"}`),
+      "pnpm log tail:",
+      report.pnpmLogTail
+    ];
+    return lines.join("\n");
+  };
+  const exportLog = () => {
+    const blob = new Blob([textOf()], { type: "text/plain;charset=utf-8" });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = `plugin-center-diagnostics-${(/* @__PURE__ */ new Date()).toISOString().slice(0, 19).replace(/[:T]/gu, "-")}.txt`;
+    a.click();
+    URL.revokeObjectURL(url);
+  };
+  const copy = () => {
+    void navigator.clipboard?.writeText(textOf()).then(() => {
+      showToast(t("diagCopied"), "ok", 3e3);
+    }).catch(() => {
+    });
+  };
+  if (error !== null) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("loadFailed", { e: error }) });
+  if (report === null) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("loading") });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-toolbar", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "pc-btn", onClick: exportLog, children: t("diagExport") }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "pc-btn", onClick: copy, children: t("diagCopied") })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("diagTitle") }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-card", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-row", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-name", children: "dsh" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-ver", children: report.dshVersion })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-row", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-name", children: "node" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-ver", children: report.node })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-row", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-name", children: "profile" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-ver", style: { wordBreak: "break-all" }, children: report.baseUrl })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("diagInstalled", { n: report.installed.length }) }),
+    report.installed.map((p) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pc-card", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-name", children: p.name }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "pc-ver", children: [
+        "v",
+        p.version ?? "?"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: `pc-badge ${p.source}`, children: p.source }),
+      !p.enabled && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: t("disabledTag") })
+    ] }) }, p.name)),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("diagDisabled") }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pc-card", children: Object.keys(report.disabled).length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-ver", children: "\u2014" }) : Object.entries(report.disabled).map(([id, v]) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-name", children: id }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-ver", children: v ? "disabled" : "enabled" })
+    ] }, id)) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", children: t("diagPnpmLog") }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("pre", { className: "pc-desc", style: { whiteSpace: "pre-wrap", fontSize: 11 }, children: report.pnpmLogTail === "" ? "\u2014" : report.pnpmLogTail })
+  ] });
+}
 function CenterPanel({ variant = "section" }) {
   const t = useT();
   const [view, setView] = (0, import_react.useState)("installed");
@@ -519,12 +887,65 @@ function CenterPanel({ variant = "section" }) {
   const [installedCategory, setInstalledCategory] = (0, import_react.useState)(null);
   const [marketSearch, setMarketSearch] = (0, import_react.useState)("");
   const [installedSource, setInstalledSource] = (0, import_react.useState)(null);
-  const [installedCount, setInstalledCount] = (0, import_react.useState)(0);
-  const [failedCount, setFailedCount] = (0, import_react.useState)(0);
-  const [marketCount, setMarketCount] = (0, import_react.useState)(0);
+  const counts = useCounts();
   const [updates, setUpdates] = (0, import_react.useState)(null);
   const [busyUpdate, setBusyUpdate] = (0, import_react.useState)(null);
   const [checking, setChecking] = (0, import_react.useState)(false);
+  const [togglingId, setTogglingId] = (0, import_react.useState)(null);
+  const [aiQuery, setAiQuery] = (0, import_react.useState)("");
+  const [aiBusy, setAiBusy] = (0, import_react.useState)(false);
+  const [aiResult, setAiResult] = (0, import_react.useState)(null);
+  const [aiError, setAiError] = (0, import_react.useState)(null);
+  const handleToggle = (p) => {
+    if (togglingId !== null) return;
+    const id = p.entryId;
+    const nextEnabled = !p.enabled;
+    const wasPending = pendingToggles.has(id);
+    console.log("[plugin-center] toggle", { id, fromEnabled: p.enabled, toEnabled: nextEnabled, wasPending });
+    setTogglingId(p.name);
+    void rpc("toggle", { id, disabled: !nextEnabled }).then(
+      (v) => {
+        setTogglingId(null);
+        const nowDisabled = typeof v === "object" && v !== null ? v.nowDisabled : null;
+        console.log("[plugin-center] toggle result", { id, nowDisabled });
+        if (nowDisabled === true && !wasPending) {
+          setPendingToggle(id, "disable");
+          showToast(t("disabledOk", { n: p.name }), "ok", 5e3);
+        } else if (nowDisabled === false && !wasPending) {
+          setPendingToggle(id, "enable");
+          showToast(t("enabledOk", { n: p.name }), "ok", 5e3);
+        } else if (wasPending) {
+          setPendingToggle(id, null);
+          showToast(nowDisabled === true ? t("revertedDisable", { n: p.name }) : t("revertedEnable", { n: p.name }), "ok", 5e3);
+        }
+        if (installedCache !== null) {
+          installedCache = installedCache.map((item) => item.entryId === id ? { ...item, enabled: nextEnabled } : item);
+        }
+      },
+      (e) => {
+        setTogglingId(null);
+        console.log("[plugin-center] toggle failed", { id, error: e instanceof Error ? e.message : String(e) });
+        showToast(t("toggleFailed", { e: e instanceof Error ? e.message : String(e) }), "error", 15e3);
+      }
+    );
+  };
+  const askAi = () => {
+    const q = aiQuery.trim();
+    if (q === "" || aiBusy) return;
+    setAiBusy(true);
+    setAiResult(null);
+    setAiError(null);
+    void rpc("suggest", { query: q }).then(
+      (v) => {
+        setAiBusy(false);
+        setAiResult(v);
+      },
+      (e) => {
+        setAiBusy(false);
+        setAiError(e instanceof Error ? e.message : String(e));
+      }
+    );
+  };
   const refreshUpdates = (0, import_react.useCallback)((silent = false) => {
     setChecking(true);
     void rpc("checkUpdates", { since: new Date(Date.now() - 30 * 864e5).toISOString() }).then(
@@ -550,8 +971,8 @@ function CenterPanel({ variant = "section" }) {
     void rpc("listInstalled").then(
       (v) => {
         const items = v;
-        setInstalledCount(items.length);
-        setFailedCount(items.filter((p) => p.fiberPhase === "failed").length);
+        installedCache = items;
+        setCounts({ installed: items.length, failed: items.filter((p) => p.fiberPhase === "failed").length });
       },
       () => {
       }
@@ -560,40 +981,51 @@ function CenterPanel({ variant = "section" }) {
   }, [refreshUpdates]);
   (0, import_react.useEffect)(() => {
     let alive = true;
-    let timer = null;
-    const poll = async () => {
+    const timers = [];
+    const poll = async (src) => {
       if (!alive) return;
       try {
-        const r = await rpc("listMarket", { source: "all" });
+        const r = await rpc("listMarket", { source: src });
         if (!alive) return;
-        marketCache.all = { plugins: r.plugins, done: r.done };
-        setMarketCount(r.plugins.length);
-        if (!r.done) timer = setTimeout(() => {
-          void poll();
-        }, 5e3);
+        marketCache[src] = { plugins: r.plugins, done: r.done };
+        if (src === "all") setCounts({ market: r.plugins.length });
+        if (src === "dsh-market") setCounts({ dshMarket: r.plugins.length });
+        if (!r.done) timers.push(setTimeout(() => {
+          void poll(src);
+        }, 5e3));
       } catch {
-        if (alive) timer = setTimeout(() => {
-          void poll();
-        }, 15e3);
+        if (alive) timers.push(setTimeout(() => {
+          void poll(src);
+        }, 15e3));
       }
     };
-    void poll();
+    void poll("all");
+    void poll("awesome");
+    void poll("oh-my-dsh");
     return () => {
       alive = false;
-      if (timer !== null) clearTimeout(timer);
+      for (const timer of timers) clearTimeout(timer);
     };
   }, []);
+  const handleMarketCount = (0, import_react.useCallback)((n) => {
+    setCounts({ market: n });
+  }, []);
   const updateOne = (name, version) => {
     setBusyUpdate(name);
+    setUpdating(name, true);
     void rpc("update", { name, version }).then(
       (v) => {
-        if (v !== true) throw new Error(t("updateNotApplied"));
+        const durationMs = typeof v === "object" && v !== null ? v.durationMs : void 0;
+        if (v !== true && durationMs === void 0) throw new Error(t("updateNotApplied"));
+        setUpdating(name, false);
         setBusyUpdate(null);
-        showToast(t("updatedOne", { n: name }), "ok", 5e3);
+        showToast(t("updatedOne", { n: name }) + (durationMs !== void 0 ? `\uFF08${(durationMs / 1e3).toFixed(1)}s\uFF09` : ""), "ok", 5e3);
+        refreshUpdates(true);
       },
       (e) => {
+        setUpdating(name, false);
         setBusyUpdate(null);
-        showToast(t("updateFailed", { e: e instanceof Error ? e.message : String(e) }), "error", 8e3);
+        showToast(t("updateFailed", { e: e instanceof Error ? e.message : String(e) }), "error", 15e3);
       }
     );
   };
@@ -604,20 +1036,24 @@ function CenterPanel({ variant = "section" }) {
     const okNames = [];
     const failures = [];
     for (const u of updates) {
+      setUpdating(u.name, true);
       try {
         const v = await rpc("update", { name: u.name, version: u.toVersion });
-        if (v !== true) throw new Error(t("updateNotApplied"));
+        const durationMs = typeof v === "object" && v !== null ? v.durationMs : void 0;
+        if (v !== true && durationMs === void 0) throw new Error(t("updateNotApplied"));
         okCount++;
-        okNames.push(u.name);
+        okNames.push(durationMs !== void 0 ? `${u.name}\uFF08${(durationMs / 1e3).toFixed(1)}s\uFF09` : u.name);
       } catch (e) {
         failures.push(`${u.name}\uFF1A${e instanceof Error ? e.message : String(e)}`);
+      } finally {
+        setUpdating(u.name, false);
       }
     }
     setBusyUpdate(null);
     if (failures.length === 0) {
       showToast(t("updatedMany", { n: okCount }) + `\uFF08${okNames.join("\u3001")}\uFF09`, "ok", 6e3);
     } else {
-      showToast(t("updateSummary", { a: okCount, b: failures.length, c: failures.join("\uFF1B") }), "error", 8e3);
+      showToast(t("updateSummary", { a: okCount, b: failures.length, c: failures.join("\uFF1B") }), "error", 15e3);
     }
     refreshUpdates();
   };
@@ -628,13 +1064,14 @@ function CenterPanel({ variant = "section" }) {
     count !== null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-count", children: count })
   ] }, v);
   const tabs = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-tabs", children: [
-    tab("installed", t("tabInstalled"), installedCount),
-    tab("market", t("tabMarket"), marketCount),
-    tab("updates", t("tabUpdates"), updates?.length ?? 0)
+    tab("installed", t("tabInstalled"), counts.installed),
+    tab("market", t("tabMarket"), counts.market),
+    tab("updates", t("tabUpdates"), updates?.length ?? 0),
+    tab("diagnose", t("tabDiagnose"), null)
   ] });
   const head = (showTitle) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-head", children: [
     showTitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-title", children: t("title") }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-sub", children: t("headSummary", { a: installedCount, b: updates?.length ?? 0, c: failedCount }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-sub", children: t("headSummary", { a: counts.installed, b: updates?.length ?? 0, c: counts.failed }) }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-spacer" }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "pc-btn", disabled: checking, onClick: () => {
       refreshUpdates();
@@ -643,61 +1080,131 @@ function CenterPanel({ variant = "section" }) {
       void updateAll();
     }, children: t("updateAll", { n: updates?.length ?? 0 }) })
   ] });
-  const installedToolbar = view === "installed" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-toolbar", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { className: "pc-search", value: search, onChange: (e) => {
-      setSearch(e.target.value);
-    }, placeholder: t("searchInstalled") }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("select", { className: "pc-select", value: installedSource ?? "", onChange: (e) => {
-      setInstalledSource(e.target.value === "" ? null : e.target.value);
-    }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "", children: t("allSources") }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "official", children: t("srcOfficial") }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "installed", children: t("srcInstalled") }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "local", children: t("srcLocal") }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "builtin", children: t("srcBuiltin") })
+  const installedToolbar = view === "installed" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-filter", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-toolbar pc-toolbar-main", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { className: "pc-search", value: search, onChange: (e) => {
+        setSearch(e.target.value);
+      }, placeholder: t("searchInstalled") }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("select", { className: "pc-select", value: installedSource ?? "", onChange: (e) => {
+        setInstalledSource(e.target.value === "" ? null : e.target.value);
+      }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "", children: t("allSources") }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "official", children: t("srcOfficial") }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "installed", children: t("srcInstalled") }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "local", children: t("srcLocal") }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "builtin", children: t("srcBuiltin") })
+      ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: `pc-chip${installedCategory === null ? " active" : ""}`, onClick: () => {
-      setInstalledCategory(null);
-    }, children: t("all") }),
-    CATEGORIES.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: `pc-chip${installedCategory === c ? " active" : ""}`, onClick: () => {
-      setInstalledCategory(c);
-    }, children: c }, c))
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-catbar", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: `pc-chip${installedCategory === null ? " active" : ""}`, onClick: () => {
+        setInstalledCategory(null);
+      }, children: t("all") }),
+      CATEGORIES.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: `pc-chip${installedCategory === c ? " active" : ""}`, onClick: () => {
+        setInstalledCategory(c);
+      }, children: c }, c))
+    ] })
   ] }) : null;
-  const marketToolbar = view === "market" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-toolbar", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { className: "pc-search", value: marketSearch, onChange: (e) => {
-      setMarketSearch(e.target.value);
-    }, placeholder: t("searchMarket") }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("select", { className: "pc-select", value: source, onChange: (e) => {
-      setSource(e.target.value);
-      setCategory(null);
-    }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "awesome", children: "awesome-dsh-plugin" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "oh-my-dsh", children: "Oh-My-DSH" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "all", children: t("allMarkets") })
+  const aiBar = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 6, flex: "none" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-ai-row", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "input",
+        {
+          className: "pc-search",
+          style: { flex: 1 },
+          value: aiQuery,
+          onChange: (e) => {
+            setAiQuery(e.target.value);
+          },
+          onKeyDown: (e) => {
+            if (e.key === "Enter") askAi();
+          },
+          placeholder: t("aiPlaceholder")
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "pc-btn primary", disabled: aiBusy || aiQuery.trim() === "", onClick: askAi, children: aiBusy ? t("aiAsking") : t("aiAsk") })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: `pc-chip${category === null ? " active" : ""}`, onClick: () => {
-      setCategory(null);
-    }, children: t("all") }),
-    CATEGORIES.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: `pc-chip${category === c ? " active" : ""}`, onClick: () => {
-      setCategory(c);
-    }, children: c }, c)),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-spacer" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", title: single ? t("gridDouble") : t("gridSingle"), "aria-label": single ? t("gridDouble") : t("gridSingle"), className: "pc-iconbtn", onClick: () => {
-      setSingle((v) => !v);
-    }, children: single ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "2", width: "5", height: "5", rx: "1" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "9", y: "2", width: "5", height: "5", rx: "1" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "9", width: "5", height: "5", rx: "1" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "9", y: "9", width: "5", height: "5", rx: "1" })
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "2", width: "12", height: "5", rx: "1" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "9", width: "12", height: "5", rx: "1" })
-    ] }) })
+    aiError !== null && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "pc-sub", style: { color: "var(--dsw-alias-state-error-primary)" }, children: t("aiFail", { e: aiError }) }),
+    aiResult !== null && aiResult.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pc-grid single", children: aiResult.map((item) => {
+      const installed = (installedCache ?? []).some((p) => p.name === item.name || p.spec === item.spec || p.name === item.spec);
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-card", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-row", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-name", children: item.name }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-spacer" }),
+          item.stars != null && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "pc-ver", children: [
+            "\u2605 ",
+            item.stars
+          ] }),
+          installed ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-tag", children: t("installedTag") }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              className: "pc-btn primary",
+              onClick: () => {
+                if (item.spec === void 0 || item.spec === null || item.spec === "") {
+                  showToast(t("installFailed", { e: "\u672A\u627E\u5230\u8BE5\u63D2\u4EF6\u7684\u5B89\u88C5 spec" }), "error", 8e3);
+                  return;
+                }
+                void rpc("install", { spec: item.spec }).then(
+                  () => {
+                    pendingInstall.add(item.spec);
+                    showToast(t("installQueued", { n: item.name }), "ok", 5e3);
+                  },
+                  (e) => showToast(t("installFailed", { e: e instanceof Error ? e.message : String(e) }), "error", 15e3)
+                );
+              },
+              children: t("install")
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pc-desc", children: item.reason })
+      ] }, item.name);
+    }) })
+  ] });
+  const marketToolbar = view === "market" ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-filter", children: [
+    aiBar,
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-toolbar pc-toolbar-main", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", { className: "pc-search", style: { flex: 1, minWidth: 120 }, value: marketSearch, onChange: (e) => {
+        setMarketSearch(e.target.value);
+      }, placeholder: t("searchMarket") }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("select", { className: "pc-select", value: source, onChange: (e) => {
+        setSource(e.target.value);
+        setCategory(null);
+      }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "awesome", children: "awesome-dsh-plugin" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "oh-my-dsh", children: "Oh-My-DSH" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("option", { value: "dsh-market", children: [
+          "dsh-market\uFF08",
+          counts.dshMarket,
+          "\uFF09"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", { value: "all", children: t("allMarkets") })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pc-spacer" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { type: "button", title: single ? t("gridDouble") : t("gridSingle"), "aria-label": single ? t("gridDouble") : t("gridSingle"), className: "pc-iconbtn", onClick: () => {
+        setSingle((v) => !v);
+      }, children: single ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "2", width: "5", height: "5", rx: "1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "9", y: "2", width: "5", height: "5", rx: "1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "9", width: "5", height: "5", rx: "1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "9", y: "9", width: "5", height: "5", rx: "1" })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "2", width: "12", height: "5", rx: "1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { x: "2", y: "9", width: "12", height: "5", rx: "1" })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "pc-catbar", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: `pc-chip${category === null ? " active" : ""}`, onClick: () => {
+        setCategory(null);
+      }, children: t("all") }),
+      CATEGORIES.map((c) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: `pc-chip${category === c ? " active" : ""}`, onClick: () => {
+        setCategory(c);
+      }, children: c }, c))
+    ] })
   ] }) : null;
   const body = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-    view === "installed" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(InstalledView, { search, category: installedCategory, source: installedSource }),
-    view === "market" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MarketView, { category, single, source, search: marketSearch, onCount: setMarketCount }),
-    view === "updates" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(UpdatesView, { updates, refresh: refreshUpdates, updateOne, busy: busyUpdate })
+    view === "installed" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(InstalledView, { search, category: installedCategory, source: installedSource, onToggle: handleToggle, togglingId }),
+    view === "market" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MarketView, { category, single, source, search: marketSearch, onCount: handleMarketCount }),
+    view === "updates" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(UpdatesView, { updates, refresh: refreshUpdates, updateOne, busy: busyUpdate }),
+    view === "diagnose" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(DiagnoseView, {})
   ] });
   if (variant === "overlay") {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "flex", flexDirection: "column", flex: 1, minHeight: 0 }, children: [
@@ -751,7 +1258,7 @@ function OverlayPanel() {
 function Toast() {
   const t = useToast();
   if (t === null) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `pc-toast ${t.kind}`, children: t.message });
+  return (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `pc-toast ${t.kind}`, children: t.message }), document.body);
 }
 function WhatsNewDialog() {
   const t = useT();
@@ -822,6 +1329,7 @@ function cleanupGlobals() {
 }
 function apply(ctx) {
   injectCss();
+  ctx.effect?.(() => registerSettingsNavIcon(() => STRINGS[localeId].title), "dsh-plugin-center: settings navigation icon");
   if (window.__pluginCenterGlobalsInstalled !== true) {
     installGlobals();
     window.addEventListener("unload", cleanupGlobals);