@yanglaofish/dsh-proxy-pro 1.0.10 → 2.0.1

package/lib/client.js

@@ -10,9 +10,10 @@
  *    NOT derived from settings), the editable config fields (mode / custom
  *    URL / NO_PROXY), and a per-URL route diagnostic.
  *
- * Both read and write the `proxy` settings namespace through the shared
- * `ctx.settingsScope` transport (same as dsh-plugin-proxy); runtime facts
- * come from the same-origin /dsh-proxy-pro/api endpoints served by the host
+ * Both read and write configuration through the host's own
+ * `/dsh-proxy-pro/api/config` endpoint (the browser settings transport
+ * `ctx.settingsScope` was removed in dsh 0.2 — LESSONS §33); runtime facts
+ * come from the same-origin `/dsh-proxy-pro/api` endpoints served by the host
  * half (browser-trust fenced, see lib/index.js).
  *
  * This hand-written module mirrors the loader format the in-repo client
@@ -34,6 +35,7 @@ window.__ModuleLoader__.load({
     var react = require("react");
     var useState = react.useState;
     var useEffect = react.useEffect;
+    var useCallback = react.useCallback;
     var useRef = react.useRef;
     var useSyncExternalStore = react.useSyncExternalStore;
 
@@ -107,18 +109,120 @@ window.__ModuleLoader__.load({
         .catch(function () { return null; });
     }
 
-    // ---- reactive settings scope (the `proxy` namespace) ----
-    /** @returns `{ value, writable, ready }` from a bound SettingsScope. */
-    function useProxySnapshot(scope) {
-      var snapshot = useSyncExternalStore(
-        function (onChange) { return scope.subscribe(onChange); },
-        function () { return scope.getSnapshot(); }
-      );
+    // ---- host-backed configuration store (dsh >= 0.2) ------------------
+    // The browser settings transport (`ctx.settingsScope`) was removed in dsh
+    // 0.2 (LESSONS §33), so the capsule and the settings page read/write the
+    // host's own /config API. The snapshot shape mirrors the old settings
+    // scope (`{ status, value, writable }`), so the render code below is
+    // unchanged; an older host simply has no /config route and the panel
+    // reports itself unavailable instead of crashing.
+    //
+    // ONE store for the whole client half: the header capsule and the settings
+    // page live in different React trees (the settings shell renders its own
+    // root), and per-apply stores left them showing different snapshots —
+    // "header ON but panel OFF" (LESSONS §39). A module-level singleton makes
+    // every contributor observe exactly one state.
+    var sharedProxyStore = null
+
+    function proxyStore() {
+      if (sharedProxyStore === null) sharedProxyStore = createProxyStore()
+      return sharedProxyStore
+    }
+
+    function createProxyStore() {
+      var listeners = [];
+      var snapshot = { status: "loading", value: undefined, writable: false, error: "" };
+      var inflight = null;
+      /** Cheap equality so an unchanged payload does not notify: every emit
+       *  re-renders its subscribers, and a needless emit inside a render path
+       *  is how a store turns into a request storm (review fix, LESSONS §40). */
+      function unchanged(a, b) {
+        return a.status === b.status
+          && a.writable === b.writable
+          && a.error === b.error
+          && JSON.stringify(a.value) === JSON.stringify(b.value);
+      }
+      function emit(next) {
+        if (unchanged(snapshot, next)) return;
+        snapshot = next;
+        listeners.slice().forEach(function (fn) {
+          try { fn(); } catch (error) { console.error("[dsh-proxy-pro] listener failed:", error); }
+        });
+      }
+      /** Keep the last known state but surface why a write was refused: a
+       *  silent rollback is how a rejected settings write looks like a UI bug
+       *  (LESSONS §36 — "点一下马上弹回"). */
+      function fail(message) {
+        emit({ status: snapshot.status, value: snapshot.value, writable: snapshot.writable, error: message });
+      }
+      function accept(data) {
+        if (data === null || data.ok !== true || data.config === undefined || data.config === null) {
+          emit({ status: "unavailable", value: undefined, writable: false, error: (data && data.error) || "" });
+          return false;
+        }
+        emit({ status: "ready", value: data.config, writable: data.writable !== false, error: "" });
+        return true;
+      }
+      function refresh() {
+        if (inflight !== null) return inflight;
+        inflight = fetchJson("/config").then(function (data) {
+          inflight = null;
+          accept(data);
+          return data;
+        }, function () { inflight = null; return null; });
+        return inflight;
+      }
+      function set(field, value) {
+        var body = {};
+        body[field] = value;
+        return fetchJson("/config", {
+          method: "POST",
+          headers: { "content-type": "application/json" },
+          body: JSON.stringify(body),
+        }).then(function (data) {
+          if (data === null || data.ok !== true) {
+            var message = (data && data.error) || "配置写入失败（宿主未返回原因）";
+            fail(message);
+            throw new Error(message);
+          }
+          accept(data);
+        }, function (error) {
+          fail("无法连接宿主配置接口：" + String(error && error.message ? error.message : error));
+          throw error;
+        });
+      }
+      return {
+        subscribe: function (fn) {
+          listeners.push(fn);
+          return function () {
+            var index = listeners.indexOf(fn);
+            if (index >= 0) listeners.splice(index, 1);
+          };
+        },
+        getSnapshot: function () { return snapshot; },
+        refresh: refresh,
+        set: set,
+        setEnabled: function (next) { return set("enabled", next === true); },
+      };
+    }
+
+    /** Subscribe to the host-backed config store → `{ value, writable, ready }`.
+     *  The subscribe/getSnapshot callbacks are identity-stable (`useCallback`)
+     *  and the first load lives in an effect: calling `refresh()` from inside
+     *  subscribe re-subscribed on every render and looped GET /config forever
+     *  (review fix, LESSONS §40). */
+    function useProxySettings(store) {
+      var subscribe = useCallback(function (onChange) { return store.subscribe(onChange); }, [store]);
+      var getSnapshot = useCallback(function () { return store.getSnapshot(); }, [store]);
+      var snapshot = useSyncExternalStore(subscribe, getSnapshot);
+      useEffect(function () { store.refresh(); }, [store]);
       var ready = snapshot.status === "ready" && snapshot.value !== undefined;
       return {
         value: ready ? snapshot.value : undefined,
         writable: snapshot.writable === true && ready,
         ready: snapshot.status === "unavailable" ? false : snapshot.status === "ready",
+        unavailable: snapshot.status === "unavailable",
+        error: snapshot.error || "",
       };
     }
 
@@ -177,8 +281,8 @@ window.__ModuleLoader__.load({
 
     // ---- conversation header capsule button ----
     function ProxyHeaderButton(props) {
-      var scope = props.scope;
-      var settings = useProxySnapshot(scope);
+      var store = props.store;
+      var settings = useProxySettings(store);
       // Local optimistic value (2026-09-18): the capsule flips its visual
       // immediately on click instead of waiting for scope.set's round-trip
       // (the settings-page switch already behaves this way). null means no
@@ -201,9 +305,14 @@ window.__ModuleLoader__.load({
         if (!settings.writable) return;
         var next = !shownEnabled;
         setOptimistic(next);
-        scope.set("enabled", next).catch(function (error) {
+        // The shared store receives the host's answer for this write, so the
+        // optimistic echo ends as soon as the round trip settles — success or
+        // failure. Waiting for "value === optimistic" left the capsule stuck ON
+        // whenever the host refused the write (LESSONS §39).
+        store.setEnabled(next).then(function () {
+          setOptimistic(null);
+        }, function (error) {
           console.error("[dsh-proxy-pro] toggle failed:", error);
-          // Roll back to the committed value on failure.
           setOptimistic(null);
         });
         // Toggle doubles as a manual "recheck now" even when the settings
@@ -217,6 +326,7 @@ window.__ModuleLoader__.load({
       var title = active
         ? "代理已开启（界面开关）· 点击关闭"
         : "代理已关闭 · 点击开启";
+      if (settings.error) title = title + "\n最近一次写入失败：" + settings.error;
       return react.createElement(
         "button",
         {
@@ -236,8 +346,8 @@ window.__ModuleLoader__.load({
 
     // ---- Settings page: 代理管理 ----
     function ProxyManagerPanel(props) {
-      var scope = props.scope;
-      var settings = useProxySnapshot(scope);
+      var store = props.store;
+      var settings = useProxySettings(store);
       // Re-fetch the host snapshot when the configuration changes (enabled /
       // mode / customUrl / noProxy are the only inputs that move the effKey);
       // no timed polling, mount + change-driven only (§17.3d).
@@ -260,7 +370,10 @@ window.__ModuleLoader__.load({
 
       if (!settings.ready) {
         return react.createElement("div", { className: "dsxprx", "data-proxy-settings": true },
-          react.createElement("p", { className: "dsxprx-hint" }, "代理设置加载中…"));
+          react.createElement("p", { className: "dsxprx-hint" },
+            settings.unavailable
+              ? "宿主未提供配置接口（/dsh-proxy-pro/api/config）——请确认插件已完整安装、宿主已重启。"
+              : "代理设置加载中…"));
       }
       var value = settings.value || { enabled: false, mode: "system", customUrl: "", noProxy: "" };
       var writable = settings.writable;
@@ -306,7 +419,7 @@ window.__ModuleLoader__.load({
 
       function setField(field) {
         return function (next) {
-          scope.set(field, next).catch(function (error) {
+          store.set(field, next).catch(function (error) {
             console.error("[dsh-proxy-pro] save failed:", error);
           });
         };
@@ -358,6 +471,15 @@ window.__ModuleLoader__.load({
             }))
         ),
 
+        // --- last write failure (never fail silently: LESSONS §36) ---
+        settings.error
+          ? react.createElement("div", { className: "dsxprx-status", "data-active": "false", "data-proxy-error": true },
+              react.createElement("span", { className: "dsxprx-dot" }),
+              react.createElement("div", { className: "dsxprx-statusbody" },
+                react.createElement("span", { className: "dsxprx-statusline" }, "配置写入失败"),
+                react.createElement("span", { className: "dsxprx-subline" }, settings.error)))
+          : null,
+
         // --- mode ---
         react.createElement("div", { className: "dsxprx-field" },
           react.createElement("label", { htmlFor: "dsxprx-mode" }, "代理地址来源"),
@@ -457,12 +579,13 @@ window.__ModuleLoader__.load({
     }
 
     /**
-     * Browser plugin body: bind the `proxy` settings scope, then register the
-     * conversation header button and the 代理配置 settings section.
+     * Browser plugin body: create the host-backed config store, then register
+     * the conversation header button and the 代理配置 settings section.
      * @param ctx - client cordis context.
      */
     function apply(ctx) {
-      var scope = ctx.settingsScope.bind({ namespace: "proxy" });
+      var store = proxyStore();
+      ctx.effect(function () { return function () { /* no timers to clear */ }; }, "dsh-proxy-pro: config store");
       ctx.slots.inject("settings.section", function () {
         return ctx.slots.register({
           name: "settings.section",
@@ -470,7 +593,7 @@ window.__ModuleLoader__.load({
           order: 20,
           label: "代理配置",
         }, function Section() {
-          return react.createElement(ProxyManagerPanel, { scope: scope });
+          return react.createElement(ProxyManagerPanel, { store: store });
         });
       });
       ctx.slots.inject("conversation.session.header.utilities", function () {
@@ -480,7 +603,7 @@ window.__ModuleLoader__.load({
           order: 10,
           label: "代理",
         }, function Header() {
-          return react.createElement(ProxyHeaderButton, { scope: scope });
+          return react.createElement(ProxyHeaderButton, { store: store });
         });
       });
     }
@@ -490,10 +613,11 @@ window.__ModuleLoader__.load({
     // Cordis service names the browser loader must wait for — NOT package
     // names (those belong in package.json's dsh.client.inject). Writing
     // package names here keeps the plugin permanently pending and blocks
-    // web boot (see docs/LESSONS.md §6).
+    // web boot (see docs/LESSONS.md §6). `settingsScope` was one of these
+    // until dsh 0.2 removed that service; requiring it now would keep the
+    // whole client half permanently pending (LESSONS §33).
     exports.inject = [
       "slots",
-      "settingsScope",
     ];
     return module.exports;
   },