npm - @raingor/pi-web-switch - Versions diffs - 0.6.1 → 0.7.0 - Mend

@raingor/pi-web-switch 0.6.1 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (13) hide show

package/dist/index.html +2 -2
package/package.json +1 -1
package/server/pi-reader.ts +54 -0
package/src/components/help/HelpButton.tsx +97 -0
package/src/components/layout/AppShell.tsx +3 -0
package/src/components/layout/Sidebar.tsx +14 -0
package/src/components/subagents/SubagentsPage.tsx +124 -10
package/src/index.css +53 -0
package/src/lib/translations/en.ts +49 -0
package/src/lib/translations/ja.ts +49 -0
package/src/lib/translations/zh-CN.ts +49 -0
package/src/lib/translations/zh-TW.ts +49 -0
package/vite.config.ts +16 -0

package/dist/index.html CHANGED Viewed

@@ -9,8 +9,8 @@
     <link rel="manifest" href="./manifest.webmanifest" />
     <meta name="theme-color" content="#05090d" />
     <meta name="description" content="Web UI for pi coding agent — configuration management, session browser, and usage dashboard" />
-    <script type="module" crossorigin src="./assets/main-CqkZxauO.js"></script>
-    <link rel="stylesheet" crossorigin href="./assets/main-DiEs78Xc.css">
+    <script type="module" crossorigin src="./assets/main-E7tKVWGH.js"></script>
+    <link rel="stylesheet" crossorigin href="./assets/main-DHTj6wfH.css">
   </head>
   <body>
     <div id="root"></div>

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@raingor/pi-web-switch",
   "private": false,
-  "version": "0.6.1",
+  "version": "0.7.0",
   "type": "module",
   "main": "dist/index.html",
   "description": "Web UI for pi coding agent — live configuration management, session browser, and memory viewer",

package/server/pi-reader.ts CHANGED Viewed

@@ -2754,6 +2754,60 @@ export function readSubagents(): SubagentsData {
   };
 }
+const AGENT_NAME_RE = /^[\w.-]+\.md$/;
+/**
+ * Patch a single agent's frontmatter field (model / thinking) in place while
+ * preserving the rest of the file byte-for-byte. Rewriting from the parsed
+ * AgentDef would be lossy (body is truncated to 500 chars in listAgents), so we
+ * edit the original file's YAML frontmatter line directly.
+ *
+ * - Updating `model` to a non-empty value replaces or inserts the line.
+ * - An empty string removes the field so the agent falls back to the default.
+ */
+export function updateAgentFields(
+  fileName: string,
+  patch: { model?: string; thinking?: string }
+): boolean {
+  try {
+    // Guard against path traversal: only bare *.md names in the agents dir.
+    if (!AGENT_NAME_RE.test(fileName)) return false;
+    const filePath = join(AGENTS_DIR, fileName);
+    if (!existsSync(filePath)) return false;
+    const raw = readFileSync(filePath, "utf-8");
+    if (raw.indexOf("---") !== 0) return false;
+    const second = raw.indexOf("---", 3);
+    if (second === -1) return false;
+    const fmBlock = raw.slice(3, second);
+    const rest = raw.slice(second); // starts at closing "---"
+    const lines = fmBlock.replace(/^\n/, "").split("\n");
+    const setField = (key: string, value: string | undefined) => {
+      const idx = lines.findIndex((l) => l.trimStart().toLowerCase().startsWith(`${key}:`));
+      if (value === undefined || value === "") {
+        // Remove the field entirely when cleared.
+        if (idx !== -1) lines.splice(idx, 1);
+        return;
+      }
+      const newLine = `${key}: ${value}`;
+      if (idx !== -1) lines[idx] = newLine;
+      else lines.push(newLine);
+    };
+    if (patch.model !== undefined) setField("model", patch.model.trim());
+    if (patch.thinking !== undefined) setField("thinking", patch.thinking.trim());
+    const newFm = lines.join("\n");
+    const out = `---\n${newFm}\n${rest}`;
+    writeFileSync(filePath, out, "utf-8");
+    return true;
+  } catch {
+    return false;
+  }
+}
 // ─── Built-in Provider Catalog (from the local pi install) ───
 // pi ships its full model catalog (same source as pi.dev/models) inside
 // @earendil-works/pi-ai as dist/providers/data/*.json. Reading it locally

package/src/components/help/HelpButton.tsx ADDED Viewed

@@ -0,0 +1,97 @@
+import { useState } from "react";
+import { HelpCircle, Send } from "lucide-react";
+import { Modal } from "@/components/ui/Modal";
+import { useTranslation } from "@/lib/i18n";
+// Telegram group invite link. Clicking opens the Telegram app (or web) join
+// confirmation — Telegram has no API to add users to a group without their
+// consent, so an invite link is the compliant "one-click join" path.
+const TELEGRAM_GROUP_URL = "https://t.me/+ODpy7_7NlOE4NzA1";
+/**
+ * Floating help button (bottom-right) that opens a usage guide covering the
+ * whole app plus a per-module how-to. All copy is i18n-keyed so it tracks the
+ * active locale.
+ */
+// Module sections shown in the guide. Order mirrors the sidebar navigation.
+const SECTIONS: { titleKey: string; descKey: string; stepKeys: string[] }[] = [
+  { titleKey: "help.dashboard_title", descKey: "help.dashboard_desc", stepKeys: ["help.dashboard_s1", "help.dashboard_s2"] },
+  { titleKey: "help.sessions_title", descKey: "help.sessions_desc", stepKeys: ["help.sessions_s1", "help.sessions_s2", "help.sessions_s3"] },
+  { titleKey: "help.memory_title", descKey: "help.memory_desc", stepKeys: ["help.memory_s1", "help.memory_s2", "help.memory_s3"] },
+  { titleKey: "help.providers_title", descKey: "help.providers_desc", stepKeys: ["help.providers_s1", "help.providers_s2", "help.providers_s3"] },
+  { titleKey: "help.subagents_title", descKey: "help.subagents_desc", stepKeys: ["help.subagents_s1", "help.subagents_s2"] },
+  { titleKey: "help.settings_title", descKey: "help.settings_desc", stepKeys: ["help.settings_s1", "help.settings_s2"] },
+  { titleKey: "help.speedtest_title", descKey: "help.speedtest_desc", stepKeys: ["help.speedtest_s1", "help.speedtest_s2", "help.speedtest_s3"] },
+];
+export function HelpButton() {
+  const { t } = useTranslation();
+  const [open, setOpen] = useState(false);
+  return (
+    <>
+      <button
+        onClick={() => setOpen(true)}
+        className="help-fab"
+        aria-label={t("help.button")}
+        title={t("help.button")}
+      >
+        <HelpCircle className="h-5 w-5" />
+      </button>
+      <Modal open={open} onClose={() => setOpen(false)} title={t("help.title")} size="xl">
+        <div className="space-y-6">
+          {/* Project overview */}
+          <section>
+            <h3 className="text-sm font-semibold" style={{ color: "var(--page-text)" }}>{t("help.overview_title")}</h3>
+            <p className="mt-1.5 text-sm leading-relaxed" style={{ color: "var(--muted-text)" }}>{t("help.overview_desc")}</p>
+          </section>
+          {/* Per-module guide */}
+          <section className="space-y-4">
+            <h3 className="text-sm font-semibold" style={{ color: "var(--page-text)" }}>{t("help.modules_title")}</h3>
+            {SECTIONS.map((s) => (
+              <div
+                key={s.titleKey}
+                className="rounded-lg border px-4 py-3"
+                style={{ borderColor: "var(--card-border)", backgroundColor: "var(--card-bg)" }}
+              >
+                <h4 className="text-sm font-semibold" style={{ color: "var(--page-text)" }}>{t(s.titleKey)}</h4>
+                <p className="mt-1 text-xs leading-relaxed" style={{ color: "var(--muted-text)" }}>{t(s.descKey)}</p>
+                {s.stepKeys.length > 0 && (
+                  <ul className="mt-2 space-y-1">
+                    {s.stepKeys.map((k) => (
+                      <li key={k} className="flex gap-2 text-xs leading-relaxed" style={{ color: "var(--subtle-text)" }}>
+                        <span style={{ color: "var(--signal-cyan, #38bdf8)" }}>›</span>
+                        <span>{t(k)}</span>
+                      </li>
+                    ))}
+                  </ul>
+                )}
+              </div>
+            ))}
+          </section>
+          {/* Contact / join group */}
+          <section
+            className="rounded-lg border px-4 py-3"
+            style={{ borderColor: "color-mix(in srgb, var(--signal-cyan) 30%, var(--card-border))", backgroundColor: "var(--card-bg)" }}
+          >
+            <h3 className="text-sm font-semibold" style={{ color: "var(--page-text)" }}>{t("help.contact_title")}</h3>
+            <p className="mt-1 text-xs leading-relaxed" style={{ color: "var(--muted-text)" }}>{t("help.contact_desc")}</p>
+            <a
+              href={TELEGRAM_GROUP_URL}
+              target="_blank"
+              rel="noreferrer"
+              className="mt-3 inline-flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium text-white transition-colors"
+              style={{ backgroundColor: "#229ED9" }}
+            >
+              <Send className="h-4 w-4" />
+              {t("help.contact_join")}
+            </a>
+          </section>
+        </div>
+      </Modal>
+    </>
+  );
+}

package/src/components/layout/AppShell.tsx CHANGED Viewed

@@ -2,6 +2,7 @@ import { useState } from "react";
 import { Outlet, useLocation } from "react-router-dom";
 import { Menu, RadioTower } from "lucide-react";
 import { Sidebar } from "./Sidebar";
+import { HelpButton } from "@/components/help/HelpButton";
 export function AppShell() {
   const location = useLocation();
@@ -52,6 +53,8 @@ export function AppShell() {
           )}
         </main>
       </div>
+        <HelpButton />
     </div>
   );
 }

package/src/components/layout/Sidebar.tsx CHANGED Viewed

@@ -11,11 +11,15 @@ import {
   X,
   Orbit,
   Gauge,
+  Send,
 } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { useTranslation, LANGUAGES } from "@/lib/i18n";
 import { useState } from "react";
+// Telegram group invite link (same as the help dialog).
+const TELEGRAM_GROUP_URL = "https://t.me/+ODpy7_7NlOE4NzA1";
 const navItems = [
   { to: "/", icon: LayoutDashboard, key: "nav.dashboard", code: "01" },
   { to: "/sessions", icon: History, key: "nav.sessions", code: "02" },
@@ -76,6 +80,16 @@ export function Sidebar({ mobileOpen = false, onClose }: SidebarProps) {
       </nav>
       <div className="sidebar-footer">
+        <a
+          href={TELEGRAM_GROUP_URL}
+          target="_blank"
+          rel="noreferrer"
+          className="sidebar-telegram"
+        >
+          <Send className="h-4 w-4" />
+          <span>{t("help.contact_join")}</span>
+        </a>
         <div className="node-status">
           <div className="node-status-icon"><Orbit className="h-4 w-4" /></div>
           <div>

package/src/components/subagents/SubagentsPage.tsx CHANGED Viewed

@@ -1,5 +1,6 @@
 import { useEffect, useState } from "react";
 import { useTranslation } from "@/lib/i18n";
+import { useConfigStore } from "@/store/config-store";
 import { Badge } from "@/components/ui/Badge";
 import { EmptyState } from "@/components/ui/EmptyState";
 import { formatTokens } from "@/lib/utils";
@@ -16,6 +17,9 @@ import {
   Loader2,
   Search,
   ExternalLink,
+  Pencil,
+  Check,
+  X,
 } from "lucide-react";
 const API_BASE = "/api/pi";
@@ -226,7 +230,7 @@ function AgentList({
       {/* Right: Agent detail */}
       <div className="min-w-0 flex-1 p-6">
         {selected ? (
-          <AgentDetail agent={selected} />
+          <AgentDetail agent={selected} onSaved={onRefresh} />
         ) : (
           <div className="flex h-40 items-center justify-center text-sm text-gray-500">
             {t("providers_models.select_hint")}
@@ -237,8 +241,47 @@ function AgentList({
   );
 }
-function AgentDetail({ agent }: { agent: AgentDef }) {
+function AgentDetail({ agent, onSaved }: { agent: AgentDef; onSaved: () => void }) {
   const { t } = useTranslation();
+  const { allModels } = useConfigStore();
+  const [editing, setEditing] = useState(false);
+  const [model, setModel] = useState(agent.model ?? "");
+  const [thinking, setThinking] = useState(agent.thinking ?? "");
+  const [saving, setSaving] = useState(false);
+  const [msg, setMsg] = useState<{ ok: boolean; text: string } | null>(null);
+  // Reset the draft whenever a different agent is selected.
+  useEffect(() => {
+    setModel(agent.model ?? "");
+    setThinking(agent.thinking ?? "");
+    setEditing(false);
+    setMsg(null);
+  }, [agent.fileName]);
+  const handleSave = async () => {
+    setSaving(true);
+    setMsg(null);
+    try {
+      const res = await fetch(`${API_BASE}/subagents/update-agent`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ fileName: agent.fileName, model: model.trim(), thinking: thinking.trim() }),
+      });
+      const { success } = (await res.json()) as { success: boolean };
+      if (success) {
+        setMsg({ ok: true, text: t("subagents.saved") });
+        setEditing(false);
+        onSaved();
+      } else {
+        setMsg({ ok: false, text: t("subagents.save_failed") });
+      }
+    } catch {
+      setMsg({ ok: false, text: t("subagents.save_failed") });
+    } finally {
+      setSaving(false);
+    }
+  };
   return (
     <div className="space-y-4">
       <div className="flex items-center gap-3">
@@ -246,23 +289,94 @@ function AgentDetail({ agent }: { agent: AgentDef }) {
         <Badge variant={agent.package === "custom" ? "default" : "info"}>
           {agent.package}
         </Badge>
+        {agent.package === "custom" && !editing && (
+          <button
+            onClick={() => { setMsg(null); setEditing(true); }}
+            className="ml-auto flex items-center gap-1.5 rounded-lg border border-gray-700 px-2.5 py-1 text-xs text-gray-300 hover:bg-gray-800"
+          >
+            <Pencil className="h-3.5 w-3.5" />
+            {t("subagents.edit")}
+          </button>
+        )}
       </div>
       <p className="text-sm text-gray-400">{agent.description}</p>
       <div className="grid grid-cols-2 gap-4 rounded-lg border border-gray-800 bg-gray-900/70 p-4">
-        {agent.model && (
-          <div>
-            <span className="text-xs text-gray-500">{t("subagents.model")}</span>
-            <p className="mt-0.5 text-sm text-gray-200 font-mono">{agent.model}</p>
+        {/* Model — editable for custom agents */}
+        <div className={editing ? "col-span-2" : ""}>
+          <span className="text-xs text-gray-500">{t("subagents.model")}</span>
+          {editing ? (
+            <>
+              <input
+                type="text"
+                list="agent-model-options"
+                value={model}
+                onChange={(e) => setModel(e.target.value)}
+                placeholder={t("subagents.model_placeholder")}
+                className="mt-1 w-full rounded-lg border border-gray-700 bg-gray-800 px-3 py-1.5 font-mono text-sm text-gray-100 outline-none focus:ring-1 focus:ring-blue-500"
+              />
+              <datalist id="agent-model-options">
+                {allModels.map((m) => (
+                  <option key={`${m.providerId}/${m.id}`} value={`${m.providerId}/${m.id}`}>
+                    {m.providerName} · {m.name ?? m.id}
+                  </option>
+                ))}
+              </datalist>
+            </>
+          ) : (
+            <p className="mt-0.5 text-sm text-gray-200 font-mono">{agent.model || t("subagents.model_default")}</p>
+          )}
+        </div>
+        {/* Thinking — editable for custom agents */}
+        <div>
+          <span className="text-xs text-gray-500">{t("subagents.thinking")}</span>
+          {editing ? (
+            <select
+              value={thinking}
+              onChange={(e) => setThinking(e.target.value)}
+              className="mt-1 w-full rounded-lg border border-gray-700 bg-gray-800 px-3 py-1.5 text-sm text-gray-100 outline-none focus:ring-1 focus:ring-blue-500"
+            >
+              <option value="">{t("subagents.thinking_default")}</option>
+              {["off", "minimal", "low", "medium", "high", "xhigh"].map((lvl) => (
+                <option key={lvl} value={lvl}>{lvl}</option>
+              ))}
+            </select>
+          ) : (
+            <p className="mt-0.5 text-sm text-gray-200">{agent.thinking || t("subagents.thinking_default")}</p>
+          )}
+        </div>
+        {editing && (
+          <div className="col-span-2 flex items-center gap-3">
+            <button
+              onClick={handleSave}
+              disabled={saving}
+              className="flex items-center gap-1.5 rounded-lg bg-blue-600 px-4 py-1.5 text-sm font-medium text-white hover:bg-blue-500 disabled:opacity-50"
+            >
+              {saving ? <Loader2 className="h-3.5 w-3.5 animate-spin" /> : <Check className="h-3.5 w-3.5" />}
+              {saving ? t("subagents.saving") : t("subagents.save")}
+            </button>
+            <button
+              onClick={() => { setEditing(false); setModel(agent.model ?? ""); setThinking(agent.thinking ?? ""); }}
+              disabled={saving}
+              className="flex items-center gap-1.5 rounded-lg border border-gray-700 px-4 py-1.5 text-sm text-gray-300 hover:bg-gray-800"
+            >
+              <X className="h-3.5 w-3.5" />
+              {t("subagents.cancel")}
+            </button>
+            {msg && (
+              <span className={`text-xs ${msg.ok ? "text-emerald-400" : "text-red-400"}`}>{msg.text}</span>
+            )}
           </div>
         )}
-        {agent.thinking && (
-          <div>
-            <span className="text-xs text-gray-500">{t("subagents.thinking")}</span>
-            <p className="mt-0.5 text-sm text-gray-200">{agent.thinking}</p>
+        {!editing && msg && (
+          <div className="col-span-2">
+            <span className={`text-xs ${msg.ok ? "text-emerald-400" : "text-red-400"}`}>{msg.text}</span>
           </div>
         )}
         {agent.tools && (
           <div className="col-span-2">
             <span className="text-xs text-gray-500">{t("subagents.tools")}</span>

package/src/index.css CHANGED Viewed

@@ -657,3 +657,56 @@ table { border-collapse: collapse; }
   .official-usage-field-wide { grid-column: auto; }
   .official-usage-cards { grid-template-columns: 1fr; }
 }
+/* ─── Help floating action button ───────────────────────── */
+.help-fab {
+  position: fixed;
+  right: 22px;
+  bottom: 22px;
+  z-index: 55;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 44px;
+  height: 44px;
+  border-radius: 50%;
+  border: 1px solid color-mix(in srgb, var(--signal-cyan) 40%, var(--card-border));
+  background: var(--card-bg-solid);
+  color: var(--signal-cyan);
+  box-shadow: 0 10px 30px rgba(0,0,0,.28), 0 0 24px color-mix(in srgb, var(--signal-cyan) 14%, transparent);
+  cursor: pointer;
+  transition: transform 160ms ease, box-shadow 160ms ease, color 160ms ease;
+}
+.help-fab:hover {
+  transform: translateY(-2px);
+  color: var(--signal-cyan-bright);
+  box-shadow: 0 14px 38px rgba(0,0,0,.34), 0 0 34px color-mix(in srgb, var(--signal-cyan) 22%, transparent);
+}
+@media (max-width: 768px) {
+  .help-fab { right: 14px; bottom: 14px; width: 40px; height: 40px; }
+}
+/* ─── Sidebar Telegram join button ──────────────────────── */
+.sidebar-telegram {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  width: 100%;
+  margin-bottom: 10px;
+  padding: 9px 12px;
+  border-radius: 9px;
+  border: 1px solid color-mix(in srgb, #229ED9 45%, var(--card-border));
+  background: color-mix(in srgb, #229ED9 12%, transparent);
+  color: #229ED9;
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: .01em;
+  cursor: pointer;
+  transition: background 160ms ease, transform 160ms ease, box-shadow 160ms ease;
+}
+.sidebar-telegram:hover {
+  background: color-mix(in srgb, #229ED9 20%, transparent);
+  transform: translateY(-1px);
+  box-shadow: 0 8px 22px color-mix(in srgb, #229ED9 22%, transparent);
+}

package/src/lib/translations/en.ts CHANGED Viewed

@@ -140,6 +140,15 @@ const en: Record<string, string> = {
   "subagents.no_history": "No run history",
   "subagents.no_history_desc": "Subagent run history will appear here after agents are executed.",
   "subagents.model": "Model",
+  "subagents.edit": "Edit",
+  "subagents.save": "Save",
+  "subagents.saving": "Saving…",
+  "subagents.cancel": "Cancel",
+  "subagents.saved": "Saved",
+  "subagents.save_failed": "Save failed",
+  "subagents.model_placeholder": "provider/model-id (blank = default)",
+  "subagents.model_default": "(default)",
+  "subagents.thinking_default": "(default)",
   "subagents.thinking": "Thinking Level",
   "subagents.tools": "Tools",
   "subagents.system_prompt_mode": "System Prompt Mode",
@@ -474,6 +483,46 @@ const en: Record<string, string> = {
   "language.zh-CN": "简体中文",
   "language.zh-TW": "繁體中文",
   "language.ja": "日本語",
+  "help.button": "User Guide",
+  "help.title": "User Guide",
+  "help.overview_title": "About this project",
+  "help.overview_desc": "pi-web-switch is a visual control panel for the pi coding agent: review sessions, manage long-term memory, configure providers and models, edit subagents, benchmark models, and adjust global settings. All changes write directly to the config files under ~/.pi/agent and take effect immediately.",
+  "help.modules_title": "Modules",
+  "help.dashboard_title": "01 Dashboard",
+  "help.dashboard_desc": "Overview of usage and recent activity.",
+  "help.dashboard_s1": "See token usage, cost, and per-model stats.",
+  "help.dashboard_s2": "Click \"Refresh now\" to rescan session data.",
+  "help.sessions_title": "02 Sessions",
+  "help.sessions_desc": "Browse, preview, and manage past sessions.",
+  "help.sessions_s1": "Sessions are grouped by project; expand/collapse each.",
+  "help.sessions_s2": "Deleting a session moves it to Trash — restore or purge.",
+  "help.sessions_s3": "In Trash you can select and permanently delete in bulk.",
+  "help.memory_title": "03 Memory",
+  "help.memory_desc": "View and optimize pi-hermes-memory long-term memory.",
+  "help.memory_s1": "Progress bars show each file’s capacity usage (by characters).",
+  "help.memory_s2": "\"Optimize Memory\" runs a model to merge duplicates and drop stale entries.",
+  "help.memory_s3": "\"Memory Model\" sets the auto-write model, thinking level, and capacity limits.",
+  "help.providers_title": "04 Providers & Models",
+  "help.providers_desc": "Manage API providers and their models.",
+  "help.providers_s1": "Add a custom provider with its baseUrl and API key.",
+  "help.providers_s2": "Use \"Fetch models\" to pull and search available models, then enable them.",
+  "help.providers_s3": "Adjust per-model params like maxTokens.",
+  "help.subagents_title": "05 Subagents",
+  "help.subagents_desc": "View and edit subagents, chains, and run history.",
+  "help.subagents_s1": "In \"Agents\", select a custom agent and click \"Edit\" to change its model and thinking level.",
+  "help.subagents_s2": "The model field has a dropdown of all configured models.",
+  "help.settings_title": "06 Settings",
+  "help.settings_desc": "Appearance, model defaults, and advanced options.",
+  "help.settings_s1": "Switch theme, font size, UI zoom, and language.",
+  "help.settings_s2": "Manage pi packages and check for updates.",
+  "help.speedtest_title": "07 Model Speed Test",
+  "help.speedtest_desc": "Batch-test custom provider models for availability and latency.",
+  "help.speedtest_s1": "Pick a provider and use \"Fetch models\" to load the test set (stored separately).",
+  "help.speedtest_s2": "Run the test to see success rate, average latency, and latency range.",
+  "help.speedtest_s3": "Enable \"Slow mode\" to reduce 429 rate limits.",
+  "help.contact_title": "Need help?",
+  "help.contact_desc": "For questions, suggestions, or bug reports, join our Telegram group — click the button below to join.",
+  "help.contact_join": "Join Telegram group",
 };
 export default en;

package/src/lib/translations/ja.ts CHANGED Viewed

@@ -138,6 +138,15 @@ const ja: Record<string, string> = {
   "subagents.no_history": "実行履歴がありません",
   "subagents.no_history_desc": "エージェントを実行すると、履歴がここに表示されます。",
   "subagents.model": "モデル",
+  "subagents.edit": "編集",
+  "subagents.save": "保存",
+  "subagents.saving": "保存中…",
+  "subagents.cancel": "キャンセル",
+  "subagents.saved": "保存しました",
+  "subagents.save_failed": "保存に失敗",
+  "subagents.model_placeholder": "provider/model-id（空欄で既定）",
+  "subagents.model_default": "（既定）",
+  "subagents.thinking_default": "（既定）",
   "subagents.thinking": "思考レベル",
   "subagents.tools": "ツール",
   "subagents.system_prompt_mode": "システムプロンプトモード",
@@ -464,6 +473,46 @@ const ja: Record<string, string> = {
   "language.zh-CN": "简体中文",
   "language.zh-TW": "繁體中文",
   "language.ja": "日本語",
+  "help.button": "使い方",
+  "help.title": "使い方ガイド",
+  "help.overview_title": "このプロジェクトについて",
+  "help.overview_desc": "pi-web-switch は pi コーディングエージェントのビジュアル設定パネルです。セッション確認、長期メモリ管理、プロバイダーとモデルの設定、サブエージェント編集、モデル速度計測、全体設定の調整ができます。変更は ~/.pi/agent 配下の設定ファイルに直接書き込まれ、即時反映されます。",
+  "help.modules_title": "各モジュール",
+  "help.dashboard_title": "01 ダッシュボード",
+  "help.dashboard_desc": "使用量と最近の活動の概要。",
+  "help.dashboard_s1": "トークン使用量、コスト、モデル別統計を確認。",
+  "help.dashboard_s2": "「今すぐ更新」でセッションデータを再スキャン。",
+  "help.sessions_title": "02 セッション",
+  "help.sessions_desc": "過去のセッションを閲覧・プレビュー・管理。",
+  "help.sessions_s1": "セッションはプロジェクト別にグループ化、展開/折りたたみ可能。",
+  "help.sessions_s2": "削除はゴミ箱へ移動 — 復元または完全削除。",
+  "help.sessions_s3": "ゴミ箱で選択して一括完全削除できます。",
+  "help.memory_title": "03 メモリ",
+  "help.memory_desc": "pi-hermes-memory の長期メモリを表示・最適化。",
+  "help.memory_s1": "プログレスバーが各ファイルの容量（文字数）を表示。",
+  "help.memory_s2": "「メモリを最適化」でモデルが重複統合と古い項目の削除を実行。",
+  "help.memory_s3": "「メモリモデル設定」で自動書き込みモデル、思考レベル、容量上限を設定。",
+  "help.providers_title": "04 プロバイダーとモデル",
+  "help.providers_desc": "API プロバイダーとそのモデルを管理。",
+  "help.providers_s1": "baseUrl と API キーでカスタムプロバイダーを追加。",
+  "help.providers_s2": "「モデル取得」で利用可能なモデルを取得・検索し、有効化。",
+  "help.providers_s3": "モデルごとの maxTokens などを調整。",
+  "help.subagents_title": "05 サブエージェント",
+  "help.subagents_desc": "サブエージェント、チェーン、実行履歴を表示・編集。",
+  "help.subagents_s1": "「エージェント」でカスタムエージェントを選び「編集」でモデルと思考レベルを変更。",
+  "help.subagents_s2": "モデル入力欄に設定済みモデルのドロップダウン候補付き。",
+  "help.settings_title": "06 設定",
+  "help.settings_desc": "外観、モデル既定値、詳細オプション。",
+  "help.settings_s1": "テーマ、フォントサイズ、UI ズーム、言語を切替。",
+  "help.settings_s2": "pi パッケージ管理と更新確認。",
+  "help.speedtest_title": "07 モデル速度計測",
+  "help.speedtest_desc": "カスタムプロバイダーのモデルの可用性と遅延を一括テスト。",
+  "help.speedtest_s1": "プロバイダーを選び「モデル取得」でテスト対象を読み込み（別途保存）。",
+  "help.speedtest_s2": "テスト実行で成功率、平均遅延、遅延範囲を確認。",
+  "help.speedtest_s3": "レート制限時は「低速モード」で 429 を軽減。",
+  "help.contact_title": "お困りですか？",
+  "help.contact_desc": "ご質問・ご提案・バグ報告は Telegram グループへ。下のボタンから参加できます。",
+  "help.contact_join": "Telegram グループに参加",
 };
 export default ja;

package/src/lib/translations/zh-CN.ts CHANGED Viewed

@@ -138,6 +138,15 @@ const zhCN: Record<string, string> = {
   "subagents.no_history": "暂无运行记录",
   "subagents.no_history_desc": "运行子代理后，运行记录将显示在这里。",
   "subagents.model": "模型",
+  "subagents.edit": "编辑",
+  "subagents.save": "保存",
+  "subagents.saving": "保存中…",
+  "subagents.cancel": "取消",
+  "subagents.saved": "已保存",
+  "subagents.save_failed": "保存失败",
+  "subagents.model_placeholder": "provider/model-id（留空用默认）",
+  "subagents.model_default": "（默认）",
+  "subagents.thinking_default": "（默认）",
   "subagents.thinking": "思考级别",
   "subagents.tools": "工具",
   "subagents.system_prompt_mode": "系统提示模式",
@@ -464,6 +473,46 @@ const zhCN: Record<string, string> = {
   "language.zh-CN": "简体中文",
   "language.zh-TW": "繁體中文",
   "language.ja": "日本語",
+  "help.button": "使用说明",
+  "help.title": "使用说明",
+  "help.overview_title": "关于本项目",
+  "help.overview_desc": "pi-web-switch 是 pi 编码助手的可视化配置面板：查看会话、管理长期记忆、配置提供商与模型、编辑子代理、测速模型，并调整全局设置。所有改动直接写入 ~/.pi/agent 下的配置文件，实时生效。",
+  "help.modules_title": "各板块说明",
+  "help.dashboard_title": "01 仪表盘",
+  "help.dashboard_desc": "总览用量与近期活动。",
+  "help.dashboard_s1": "查看 token 用量、成本和各模型统计。",
+  "help.dashboard_s2": "点击「立即刷新」重新扫描会话数据。",
+  "help.sessions_title": "02 会话",
+  "help.sessions_desc": "浏览、预览和管理历史会话。",
+  "help.sessions_s1": "按项目分组查看会话，可展开/折叠。",
+  "help.sessions_s2": "删除会话会移入回收站，可恢复或永久删除。",
+  "help.sessions_s3": "回收站中可勾选批量永久删除。",
+  "help.memory_title": "03 记忆",
+  "help.memory_desc": "查看和优化 pi-hermes-memory 长期记忆。",
+  "help.memory_s1": "进度条显示三个记忆文件的容量占用（按字符）。",
+  "help.memory_s2": "「一键优化记忆」调用模型合并重复、清理过时条目。",
+  "help.memory_s3": "「记忆模型配置」设置自动写入所用模型、思考级别和容量上限。",
+  "help.providers_title": "04 提供商与模型",
+  "help.providers_desc": "管理 API 提供商和它们的模型。",
+  "help.providers_s1": "添加自定义提供商，填写 baseUrl 和 API Key。",
+  "help.providers_s2": "用「获取模型列表」拉取并搜索可用模型，勾选启用。",
+  "help.providers_s3": "可调整每个模型的 maxTokens 等参数。",
+  "help.subagents_title": "05 子代理",
+  "help.subagents_desc": "查看和编辑子代理、链和运行历史。",
+  "help.subagents_s1": "在「代理」选中自定义代理，点「编辑」可改模型和思考级别。",
+  "help.subagents_s2": "模型输入框带全部已配置模型的下拉候选。",
+  "help.settings_title": "06 设置",
+  "help.settings_desc": "外观、模型默认值和高级选项。",
+  "help.settings_s1": "切换主题、字体大小、界面缩放和语言。",
+  "help.settings_s2": "管理 pi 包并检查更新。",
+  "help.speedtest_title": "07 模型测速",
+  "help.speedtest_desc": "批量测试自定义提供商模型的可用性与延迟。",
+  "help.speedtest_s1": "选择提供商，用「获取模型」拉取待测模型（独立存储）。",
+  "help.speedtest_s2": "运行测速，查看成功率、平均延迟和延迟区间。",
+  "help.speedtest_s3": "遇限流可开「慢速模式」降低 429。",
+  "help.contact_title": "遇到问题？",
+  "help.contact_desc": "有任何疑问、建议或 bug 反馈，欢迎加入 Telegram 交流群，点击下方按钮即可加入。",
+  "help.contact_join": "加入 Telegram 交流群",
 };
 export default zhCN;

package/src/lib/translations/zh-TW.ts CHANGED Viewed

@@ -137,6 +137,15 @@ const zhTW: Record<string, string> = {
   "subagents.no_history": "暫無執行記錄",
   "subagents.no_history_desc": "執行子代理後，執行記錄將顯示在這裡。",
   "subagents.model": "模型",
+  "subagents.edit": "編輯",
+  "subagents.save": "儲存",
+  "subagents.saving": "儲存中…",
+  "subagents.cancel": "取消",
+  "subagents.saved": "已儲存",
+  "subagents.save_failed": "儲存失敗",
+  "subagents.model_placeholder": "provider/model-id（留空用預設）",
+  "subagents.model_default": "（預設）",
+  "subagents.thinking_default": "（預設）",
   "subagents.thinking": "思考級別",
   "subagents.tools": "工具",
   "subagents.system_prompt_mode": "系統提示模式",
@@ -463,6 +472,46 @@ const zhTW: Record<string, string> = {
   "language.zh-CN": "简体中文",
   "language.zh-TW": "繁體中文",
   "language.ja": "日本語",
+  "help.button": "使用說明",
+  "help.title": "使用說明",
+  "help.overview_title": "關於本專案",
+  "help.overview_desc": "pi-web-switch 是 pi 編碼助手的可視化配置面板：查看會話、管理長期記憶、配置提供商與模型、編輯子代理、測速模型，並調整全域設定。所有改動直接寫入 ~/.pi/agent 下的配置檔，即時生效。",
+  "help.modules_title": "各板塊說明",
+  "help.dashboard_title": "01 儀表板",
+  "help.dashboard_desc": "總覽用量與近期活動。",
+  "help.dashboard_s1": "查看 token 用量、成本和各模型統計。",
+  "help.dashboard_s2": "點擊「立即刷新」重新掃描會話資料。",
+  "help.sessions_title": "02 會話",
+  "help.sessions_desc": "瀏覽、預覽和管理歷史會話。",
+  "help.sessions_s1": "按專案分組查看會話，可展開/摺疊。",
+  "help.sessions_s2": "刪除會話會移入回收站，可還原或永久刪除。",
+  "help.sessions_s3": "回收站中可勾選批次永久刪除。",
+  "help.memory_title": "03 記憶",
+  "help.memory_desc": "查看和優化 pi-hermes-memory 長期記憶。",
+  "help.memory_s1": "進度條顯示三個記憶檔的容量佔用（按字元）。",
+  "help.memory_s2": "「一鍵優化記憶」呼叫模型合併重複、清理過時條目。",
+  "help.memory_s3": "「記憶模型設定」設定自動寫入所用模型、思考級別和容量上限。",
+  "help.providers_title": "04 提供商與模型",
+  "help.providers_desc": "管理 API 提供商和它們的模型。",
+  "help.providers_s1": "新增自訂提供商，填寫 baseUrl 和 API Key。",
+  "help.providers_s2": "用「獲取模型列表」拉取並搜尋可用模型，勾選啟用。",
+  "help.providers_s3": "可調整每個模型的 maxTokens 等參數。",
+  "help.subagents_title": "05 子代理",
+  "help.subagents_desc": "查看和編輯子代理、鏈和執行歷史。",
+  "help.subagents_s1": "在「代理」選中自訂代理，點「編輯」可改模型和思考級別。",
+  "help.subagents_s2": "模型輸入框帶全部已配置模型的下拉候選。",
+  "help.settings_title": "06 設定",
+  "help.settings_desc": "外觀、模型預設值和進階選項。",
+  "help.settings_s1": "切換主題、字型大小、介面縮放和語言。",
+  "help.settings_s2": "管理 pi 套件並檢查更新。",
+  "help.speedtest_title": "07 模型測速",
+  "help.speedtest_desc": "批次測試自訂提供商模型的可用性與延遲。",
+  "help.speedtest_s1": "選擇提供商，用「獲取模型」拉取待測模型（獨立儲存）。",
+  "help.speedtest_s2": "執行測速，查看成功率、平均延遲和延遲區間。",
+  "help.speedtest_s3": "遇限流可開「慢速模式」降低 429。",
+  "help.contact_title": "遇到問題？",
+  "help.contact_desc": "有任何疑問、建議或 bug 回報，歡迎加入 Telegram 交流群，點擊下方按鈕即可加入。",
+  "help.contact_join": "加入 Telegram 交流群",
 };
 export default zhTW;

package/vite.config.ts CHANGED Viewed

@@ -148,6 +148,22 @@ function piApiPlugin(): Plugin {
           res.setHeader("Content-Type", "application/json");
           res.end(JSON.stringify(data));
         },
+        "POST /api/pi/subagents/update-agent"(req, res) {
+          let body = "";
+          req.on("data", (chunk: string) => (body += chunk));
+          req.on("end", () => {
+            try {
+              const { fileName, model, thinking } = JSON.parse(body) as { fileName: string; model?: string; thinking?: string };
+              const ok = pi.updateAgentFields(fileName, { model, thinking });
+              res.setHeader("Content-Type", "application/json");
+              res.end(JSON.stringify({ success: ok }));
+            } catch {
+              res.statusCode = 400;
+              res.setHeader("Content-Type", "application/json");
+              res.end(JSON.stringify({ success: false, error: "Invalid request body" }));
+            }
+          });
+        },
         "GET /api/pi/memory/config"(_, res) {
           res.setHeader("Content-Type", "application/json");
           res.end(JSON.stringify(pi.readHermesMemoryConfig() ?? {}));