@firstpick/pi-package-webui 0.2.1 → 0.2.3

package/README.md

@@ -119,7 +119,7 @@ Environment variables:
 - Multi-tab Pi sessions with isolated processes, working directories, prompt drafts, and activity state.
 - Streaming chat transcript with Markdown, thinking output, tool/bash cards, queue and compaction events, and abort controls.
 - Prompt composer with uploads, drag/drop/paste, inline image support, slash-command autocomplete, and `@` file/path references.
-- Browser dialogs for common Pi selectors such as `/model`, `/settings`, `/theme`, `/fork`, `/clone`, `/resume`, `/tree`, and `/scoped-models`.
+- Browser dialogs for common Pi selectors such as `/model`, `/settings`, `/theme`, `/fork`, `/clone`, `/resume`, `/tree`, `/scoped-models`, `/tools`, and `/skills`.
 - Model, thinking, session, workspace, theme, optional-feature, Codex usage, network, event, and notification controls in the side panel.
 - Per-tab cwd changes, a clickable footer cwd picker, saved path fast picks, and restart-safe restoration of open tabs.
 - Browser support for Pi extension UI prompts, widgets, status updates, and notifications.
@@ -135,7 +135,9 @@ Optional companions:
 - `@firstpick/pi-prompts-git-pr` — guided Git commit/push workflow.
 - `@firstpick/pi-extension-release-npm` — NPM publish menu and release widgets.
 - `@firstpick/pi-extension-release-aur` — AUR publish menu and release widgets.
+- `@firstpick/pi-extension-setup-skills` — TUI `/skills` setup command alongside WebUI-native skill toggles.
 - `@firstpick/pi-extension-todo-progress` — todo-progress rendering.
+- `@firstpick/pi-extension-tools` — TUI `/tools` active-tool manager alongside WebUI-native tool toggles.
 - `@firstpick/pi-extension-git-footer-status` — richer git/footer status.
 - `@firstpick/pi-extension-stats` — stats commands and status data.
 - `@firstpick/pi-themes-bundle` — Web UI and Pi theme resources.
@@ -161,7 +163,7 @@ This requires `/git-staged-msg` from `@firstpick/pi-prompts-git-pr`. Review the
 ## Network safety
 
 - Default bind is localhost-only: `127.0.0.1:31415`.
-- The side-panel **Open to network** button rebinds the server to `0.0.0.0` and shows LAN URLs when available.
+- The side-panel **Open to network** button rebinds the server to `0.0.0.0`, shows LAN URLs when available, and toggles to "Close for network".
 - `--host 0.0.0.0` also exposes the Web UI to the local network.
 - Any connected browser client can control Pi and run Web UI bash actions as the Web UI process user.
 - Treat Pi Web UI as a local companion, not a hardened multi-user web service.

package/WEBUI_TUI_NATIVE_PARITY.json

@@ -56,6 +56,32 @@
       "currentBehavior": "Informational dialog plus footer scoped picker.",
       "targetBehavior": "Searchable model table, provider toggles, ordered explicit provider/model IDs, advanced patterns, and safe global/project persistence."
     },
+    {
+      "id": "/tools",
+      "kind": "slash-command",
+      "category": "native-command",
+      "title": "Tool enable/disable selector",
+      "command": { "name": "tools", "description": "Enable/disable tools for the active tab" },
+      "webStatus": "implemented",
+      "priority": "P1",
+      "sensitive": false,
+      "guards": ["confirmation"],
+      "currentBehavior": "Browser-native selector uses a hidden Web UI RPC helper extension to read all tools, set active tools, and persist selection on the session branch.",
+      "targetBehavior": "Keep browser-native runtime tool toggles in parity with Pi's TUI tools extension while exposing provenance and branch-persistent state."
+    },
+    {
+      "id": "/skills",
+      "kind": "slash-command",
+      "category": "native-command",
+      "title": "Skill enable/disable selector",
+      "command": { "name": "skills", "description": "Enable/disable skills for automatic model invocation" },
+      "webStatus": "implemented",
+      "priority": "P1",
+      "sensitive": false,
+      "guards": ["confirmation"],
+      "currentBehavior": "Browser-native selector uses a hidden Web UI RPC helper extension to filter disabled skills out of the system prompt, block disabled /skill:name invocations, and persist selection on the session branch.",
+      "targetBehavior": "Keep browser-native skill toggles runtime-scoped with clear distinction from package-level pi config enable/disable."
+    },
     {
       "id": "/export",
       "kind": "slash-command",

package/bin/pi-webui.mjs

@@ -8,19 +8,25 @@ import { access, copyFile, mkdir, readFile, readdir, rename, stat, writeFile } f
 import { homedir, networkInterfaces, tmpdir } from "node:os";
 import path from "node:path";
 import { StringDecoder } from "node:string_decoder";
-import { fileURLToPath } from "node:url";
-import { AuthStorage, SessionManager } from "@earendil-works/pi-coding-agent";
+import { fileURLToPath, pathToFileURL } from "node:url";
+import { AuthStorage, SessionManager, SettingsManager } from "@earendil-works/pi-coding-agent";
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 const require = createRequire(import.meta.url);
 const packageRoot = path.resolve(__dirname, "..");
 const publicDir = path.join(packageRoot, "public");
+const webuiHelperExtensionPath = path.join(packageRoot, "webui-rpc-helper.mjs");
+const agentDir = process.env.PI_CODING_AGENT_DIR || path.join(homedir(), ".pi", "agent");
 const packageJson = JSON.parse(await readFile(path.join(packageRoot, "package.json"), "utf8"));
 const nativeParityMatrix = JSON.parse(await readFile(path.join(packageRoot, "WEBUI_TUI_NATIVE_PARITY.json"), "utf8"));
+const webuiDevServer = isTruthyEnv(process.env.PI_WEBUI_DEV) || isSourceCheckout(packageRoot);
 
 const DEFAULT_HOST = "127.0.0.1";
 const DEFAULT_PORT = 31415;
 const REQUEST_TIMEOUT_MS = 5 * 60 * 1000;
+const WEBUI_HELPER_TIMEOUT_MS = 8 * 1000;
+const WEBUI_HELPER_COMMAND = "webui-helper";
+const WEBUI_HELPER_RESPONSE_PREFIX = "__PI_WEBUI_HELPER_RESPONSE__:";
 const CODEX_USAGE_TIMEOUT_MS = 15 * 1000;
 const CODEX_TOKEN_REFRESH_SKEW_MS = 5 * 60 * 1000;
 const OPENAI_CODEX_PROVIDER_ID = "openai-codex";
@@ -100,6 +106,15 @@ const MIME_TYPES = new Map([
   [".webmanifest", "application/manifest+json; charset=utf-8"],
 ]);
 
+function isTruthyEnv(value) {
+  return ["1", "true", "yes", "dev"].includes(String(value || "").trim().toLowerCase());
+}
+
+function isSourceCheckout(root) {
+  const normalized = String(root || "").replace(/\\/g, "/");
+  return normalized.includes("/npm-packages/") && !normalized.includes("/node_modules/");
+}
+
 function nativeParitySurfaces(matrix = nativeParityMatrix) {
   return Array.isArray(matrix?.surfaces) ? matrix.surfaces : [];
 }
@@ -131,7 +146,9 @@ const OPTIONAL_FEATURE_PACKAGES = new Map([
   ["gitWorkflow", "@firstpick/pi-prompts-git-pr"],
   ["releaseNpm", "@firstpick/pi-extension-release-npm"],
   ["releaseAur", "@firstpick/pi-extension-release-aur"],
+  ["tuiSkillsCommand", "@firstpick/pi-extension-setup-skills"],
   ["todoProgressWidget", "@firstpick/pi-extension-todo-progress"],
+  ["tuiToolsCommand", "@firstpick/pi-extension-tools"],
   ["gitFooterStatus", "@firstpick/pi-extension-git-footer-status"],
   ["statsCommand", "@firstpick/pi-extension-stats"],
   ["themeBundle", "@firstpick/pi-themes-bundle"],
@@ -2004,6 +2021,12 @@ if (options.version) {
   process.exit(0);
 }
 
+const startupDelayMs = Number.parseInt(process.env.PI_WEBUI_START_DELAY_MS || "", 10);
+delete process.env.PI_WEBUI_START_DELAY_MS;
+if (Number.isFinite(startupDelayMs) && startupDelayMs > 0) {
+  await delay(Math.min(startupDelayMs, 10_000));
+}
+
 const restoreTabs = readRestoreTabsFromEnv();
 
 function normalizedRestoreString(value, maxLength) {
@@ -2051,6 +2074,11 @@ function buildPiArgsForTab(tabIndex, title) {
   const args = ["--mode", "rpc"];
   if (options.noSession) args.push("--no-session");
 
+  // Load a browser-safe RPC helper into every Web UI tab. It exposes hidden
+  // extension commands for Web UI-native /tools and /skills selectors without
+  // depending on TUI-only extension UIs.
+  args.push("--extension", webuiHelperExtensionPath);
+
   // Keep tab naming inside Web UI metadata. Some bundled Pi CLI versions do not
   // support --name, and passing Web UI-generated tab titles through to child
   // RPC processes makes every tab after the first exit immediately.
@@ -2418,6 +2446,7 @@ function attachRpcToTab(tab, rpc) {
   tab.rpcUnsubscribe?.();
   tab.rpc = rpc;
   tab.rpcUnsubscribe = rpc.onEvent((event) => {
+    if (resolveWebuiHelperResponse(tab, event) || resolveWebuiHelperRpcResponse(tab, event)) return;
     updateTabActivityFromEvent(tab, event);
     let scopedEvent = { ...event, tabId: tab.id, tabTitle: tab.title, tabActivity: tabActivitySnapshot(tab) };
     if (event?.type === "pi_process_exit" || event?.type === "pi_process_error") clearPendingExtensionUiRequests(tab);
@@ -2454,6 +2483,8 @@ async function createTab({ id: requestedId, index, title, titleSource, conversat
     lastState: null,
     activity: createTabActivity(createdAt),
     pendingExtensionUiRequests: new Map(),
+    webuiHelperRequests: new Map(),
+    webuiHelperResponseIds: new Set(),
     bashQueue: [],
     bashQueueDraining: false,
     rpc: undefined,
@@ -2547,6 +2578,33 @@ function mergeRestorableTabDescriptors(...sources) {
     .slice(0, RESTORE_TAB_LIMIT);
 }
 
+async function restorableTabsForRestart() {
+  const liveDescriptors = await Promise.all([...tabs.values()].map(async (tab) => {
+    const state = await currentSessionState(tab).catch(() => tab.lastState || null);
+    return restorableTabDescriptor(tab, state);
+  }));
+  return mergeRestorableTabDescriptors(liveDescriptors, closedRestorableTabs);
+}
+
+function spawnRestartServer(restorableTabs) {
+  const env = {
+    ...process.env,
+    PI_WEBUI_RESTORE_TABS: JSON.stringify(restorableTabs || []),
+    PI_WEBUI_START_DELAY_MS: "1200",
+  };
+  if (webuiDevServer) env.PI_WEBUI_DEV = "1";
+  else delete env.PI_WEBUI_DEV;
+  const child = spawn(process.execPath, process.argv.slice(1), {
+    cwd: process.cwd(),
+    env,
+    detached: true,
+    stdio: "ignore",
+    windowsHide: true,
+  });
+  child.unref();
+  return child;
+}
+
 function rememberClosedRestorableTab(tab, state = null) {
   const descriptor = restorableTabDescriptor(tab, state);
   if (!descriptor) return;
@@ -2717,11 +2775,271 @@ async function safeRpcResponse(tab, command, timeoutMs = REQUEST_TIMEOUT_MS) {
   }
 }
 
+function parseWebuiHelperResponseEvent(event) {
+  if (event?.type !== "extension_ui_request" || event.method !== "notify") return undefined;
+  const message = String(event.message || "");
+  if (!message.startsWith(WEBUI_HELPER_RESPONSE_PREFIX)) return undefined;
+  try {
+    return JSON.parse(message.slice(WEBUI_HELPER_RESPONSE_PREFIX.length));
+  } catch (error) {
+    return { ok: false, error: `Invalid Web UI helper response: ${sanitizeError(error)}` };
+  }
+}
+
+function resolveWebuiHelperResponse(tab, event) {
+  const payload = parseWebuiHelperResponseEvent(event);
+  if (!payload) return false;
+  const requestId = String(payload.requestId || "");
+  const pending = tab?.webuiHelperRequests?.get(requestId);
+  if (pending) {
+    tab.webuiHelperRequests.delete(requestId);
+    clearTimeout(pending.timeout);
+    if (payload.ok === false) pending.reject(makeHttpError(400, payload.error || "Web UI helper command failed"));
+    else pending.resolve(payload.data || {});
+  }
+  return true;
+}
+
+function resolveWebuiHelperRpcResponse(tab, event) {
+  if (event?.type !== "response" || event.command !== "prompt" || !event.id) return false;
+  return tab?.webuiHelperResponseIds?.delete(String(event.id)) === true;
+}
+
+function webuiHelperRequestMap(tab) {
+  if (!tab.webuiHelperRequests) tab.webuiHelperRequests = new Map();
+  return tab.webuiHelperRequests;
+}
+
+async function sendWebuiHelperCommand(tab, action, payload = {}, timeoutMs = WEBUI_HELPER_TIMEOUT_MS) {
+  const requestId = randomUUID();
+  const pending = new Promise((resolve, reject) => {
+    const timeout = setTimeout(() => {
+      webuiHelperRequestMap(tab).delete(requestId);
+      tab.webuiHelperResponseIds?.delete(requestId);
+      reject(makeHttpError(504, `Timed out waiting for Web UI helper action: ${action}. Try /reload in this tab, then retry.`));
+    }, timeoutMs);
+    webuiHelperRequestMap(tab).set(requestId, { resolve, reject, timeout });
+  });
+  pending.catch(() => {});
+
+  try {
+    tab.webuiHelperResponseIds?.add(requestId);
+    const response = await tab.rpc.send({
+      id: requestId,
+      type: "prompt",
+      message: `/${WEBUI_HELPER_COMMAND} ${JSON.stringify({ requestId, action, payload })}`,
+    }, timeoutMs);
+    if (response.success === false) throw makeHttpError(400, response.error || `Web UI helper action failed: ${action}`);
+    return await pending;
+  } catch (error) {
+    tab.webuiHelperResponseIds?.delete(requestId);
+    const request = webuiHelperRequestMap(tab).get(requestId);
+    if (request) {
+      clearTimeout(request.timeout);
+      webuiHelperRequestMap(tab).delete(requestId);
+    }
+    throw error;
+  }
+}
+
+async function getToolConfigData(tab) {
+  return sendWebuiHelperCommand(tab, "tools-state");
+}
+
+let packageManagerModulePromise;
+async function loadPackageManagerModule() {
+  if (!packageManagerModulePromise) {
+    const packageMain = fileURLToPath(import.meta.resolve("@earendil-works/pi-coding-agent"));
+    const codingAgentRoot = path.dirname(path.dirname(packageMain));
+    packageManagerModulePromise = import(pathToFileURL(path.join(codingAgentRoot, "dist", "core", "package-manager.js")).href);
+  }
+  return packageManagerModulePromise;
+}
+
+function parseSkillFrontmatter(text, filePath) {
+  const frontmatter = String(text || "").match(/^---\s*\n([\s\S]*?)\n---/);
+  const fields = {};
+  if (frontmatter) {
+    for (const line of frontmatter[1].split(/\r?\n/)) {
+      const match = line.match(/^([A-Za-z0-9_-]+):\s*(.*)$/);
+      if (match) fields[match[1]] = match[2].replace(/^['"]|['"]$/g, "").trim();
+    }
+  }
+  const parent = path.basename(path.dirname(filePath));
+  const base = path.basename(filePath, path.extname(filePath));
+  return {
+    name: fields.name || (path.basename(filePath) === "SKILL.md" ? parent : base),
+    description: fields.description || "",
+  };
+}
+
+function sourceInfoFromResolvedResource(resource) {
+  const metadata = resource?.metadata || {};
+  return {
+    path: resource?.path,
+    source: metadata.source,
+    scope: metadata.scope,
+    origin: metadata.origin,
+    baseDir: metadata.baseDir,
+  };
+}
+
+async function resolveSkillResources(tab) {
+  const { DefaultPackageManager } = await loadPackageManagerModule();
+  const settingsManager = SettingsManager.create(tab?.cwd || options.cwd, agentDir);
+  const packageManager = new DefaultPackageManager({ cwd: tab?.cwd || options.cwd, agentDir, settingsManager });
+  const resolved = await packageManager.resolve();
+  const skills = [];
+  for (const resource of resolved.skills || []) {
+    try {
+      const metadata = parseSkillFrontmatter(await readFile(resource.path, "utf8"), resource.path);
+      skills.push({
+        ...metadata,
+        filePath: resource.path,
+        enabled: resource.enabled === true,
+        configEnabled: resource.enabled === true,
+        configManaged: true,
+        sourceInfo: sourceInfoFromResolvedResource(resource),
+      });
+    } catch {
+      // Ignore unreadable skill candidates; Pi will also skip invalid resources.
+    }
+  }
+  return { skills, settingsManager };
+}
+
+function skillResourceKey(skill) {
+  return skill.filePath || skill.name;
+}
+
+function mergeRuntimeAndResolvedSkills(runtimeSkills, resolvedSkills) {
+  const byName = new Map();
+  for (const skill of resolvedSkills) byName.set(skill.name, { ...skill });
+  for (const skill of runtimeSkills || []) {
+    const existing = byName.get(skill.name);
+    byName.set(skill.name, existing ? { ...existing, ...skill, configManaged: existing.configManaged, configEnabled: existing.configEnabled, filePath: existing.filePath || skill.filePath, sourceInfo: existing.sourceInfo || skill.sourceInfo } : { ...skill, configManaged: false, configEnabled: true });
+  }
+  return [...byName.values()].sort((a, b) => a.name.localeCompare(b.name));
+}
+
+async function getMergedSkillConfigData(tab) {
+  const [runtime, resolved] = await Promise.all([
+    getSkillConfigDataFromRuntime(tab).catch(() => ({ skills: [] })),
+    resolveSkillResources(tab).catch((error) => {
+      console.warn(`failed to resolve configured skills: ${sanitizeError(error)}`);
+      return { skills: [] };
+    }),
+  ]);
+  return { skills: mergeRuntimeAndResolvedSkills(runtime.skills || [], resolved.skills || []) };
+}
+
+function getResourcePatternForSkill(tab, skill) {
+  const info = skill.sourceInfo || {};
+  const baseDir = info.baseDir || (info.scope === "project" ? path.join(tab?.cwd || options.cwd, ".pi") : agentDir);
+  return path.relative(baseDir, skill.filePath);
+}
+
+async function setToolConfigData(tab, body) {
+  return sendWebuiHelperCommand(tab, "tools-set", {
+    enabledTools: Array.isArray(body.enabledTools) ? body.enabledTools : undefined,
+    disabledTools: Array.isArray(body.disabledTools) ? body.disabledTools : undefined,
+  });
+}
+
+async function getSkillConfigDataFromRuntime(tab) {
+  return sendWebuiHelperCommand(tab, "skills-state");
+}
+
+function desiredSkillEnabledFromBody(skillName, body) {
+  if (Array.isArray(body.enabledSkills)) return body.enabledSkills.map(String).includes(skillName);
+  if (Array.isArray(body.disabledSkills)) return !body.disabledSkills.map(String).includes(skillName);
+  throw makeHttpError(400, "Skill update requires enabledSkills or disabledSkills");
+}
+
+function updatePatternListForResource(current, pattern, enabled) {
+  const updated = (current || []).filter((item) => {
+    const text = String(item || "");
+    const stripped = text.startsWith("!") || text.startsWith("+") || text.startsWith("-") ? text.slice(1) : text;
+    return stripped !== pattern;
+  });
+  updated.push(`${enabled ? "+" : "-"}${pattern}`);
+  return updated;
+}
+
+function setSkillPathsForScope(settingsManager, scope, updated) {
+  if (scope === "project") settingsManager.setProjectSkillPaths(updated);
+  else settingsManager.setSkillPaths(updated);
+}
+
+function toggleConfiguredSkill(tab, settingsManager, skill, enabled) {
+  const info = skill.sourceInfo || {};
+  const scope = info.scope === "project" ? "project" : "user";
+  if (info.origin === "package") {
+    const settings = scope === "project" ? settingsManager.getProjectSettings() : settingsManager.getGlobalSettings();
+    const packages = [...(settings.packages || [])];
+    const packageIndex = packages.findIndex((item) => (typeof item === "string" ? item : item?.source) === info.source);
+    if (packageIndex < 0) return false;
+    let packageEntry = packages[packageIndex];
+    if (typeof packageEntry === "string") {
+      packageEntry = { source: packageEntry };
+      packages[packageIndex] = packageEntry;
+    }
+    const pattern = path.relative(info.baseDir || path.dirname(skill.filePath), skill.filePath);
+    packageEntry.skills = updatePatternListForResource(packageEntry.skills || [], pattern, enabled);
+    if (scope === "project") settingsManager.setProjectPackages(packages);
+    else settingsManager.setPackages(packages);
+    return true;
+  }
+
+  const settings = scope === "project" ? settingsManager.getProjectSettings() : settingsManager.getGlobalSettings();
+  const pattern = getResourcePatternForSkill(tab, skill);
+  setSkillPathsForScope(settingsManager, scope, updatePatternListForResource(settings.skills || [], pattern, enabled));
+  return true;
+}
+
+async function setSkillConfigData(tab, body) {
+  const { skills, settingsManager } = await resolveSkillResources(tab);
+  let configChanged = false;
+  for (const skill of skills) {
+    const desiredEnabled = desiredSkillEnabledFromBody(skill.name, body);
+    if (skill.configEnabled !== desiredEnabled && toggleConfiguredSkill(tab, settingsManager, skill, desiredEnabled)) configChanged = true;
+  }
+
+  const runtimeOnly = skills.length === 0;
+  if (runtimeOnly) {
+    await sendWebuiHelperCommand(tab, "skills-set", {
+      enabledSkills: Array.isArray(body.enabledSkills) ? body.enabledSkills : undefined,
+      disabledSkills: Array.isArray(body.disabledSkills) ? body.disabledSkills : undefined,
+    });
+  }
+
+  const activeTab = configChanged ? await restartTabRpc(tab, "skills-config") : tab;
+  return getMergedSkillConfigData(activeTab);
+}
+
+async function annotateSkillCommandState(tab, commands) {
+  let disabledSkills = new Set();
+  try {
+    const state = await getMergedSkillConfigData(tab);
+    disabledSkills = new Set((state.skills || []).filter((skill) => skill.enabled === false).map((skill) => skill.name));
+  } catch {
+    // Commands should remain available even if an older tab has not loaded the helper yet.
+  }
+
+  return commands
+    .filter((command) => command?.name !== WEBUI_HELPER_COMMAND)
+    .map((command) => {
+      const skillName = command?.source === "skill" && String(command.name || "").startsWith("skill:") ? String(command.name).slice("skill:".length) : "";
+      return skillName ? { ...command, enabled: !disabledSkills.has(skillName) } : command;
+    });
+}
+
 async function getCommandData(tab) {
   try {
     const response = await tab.rpc.send({ type: "get_commands" });
     if (response.success === false) throw makeHttpError(400, response.error || "failed to load commands");
-    return { commands: [...NATIVE_SLASH_COMMANDS, ...(response.data?.commands || [])], rpcRunning: true };
+    const rpcCommands = await annotateSkillCommandState(tab, response.data?.commands || []);
+    return { commands: [...NATIVE_SLASH_COMMANDS, ...rpcCommands], rpcRunning: true };
   } catch (error) {
     const message = sanitizeError(error);
     if (!/Pi RPC process is not running/i.test(message)) throw error;
@@ -3461,6 +3779,8 @@ async function webuiStatus({ detailed = false, eventLimit = 40 } = {}) {
   const data = {
     online: true,
     webuiVersion: packageJson.version,
+    webuiDev: webuiDevServer,
+    webuiMode: webuiDevServer ? "dev" : "production",
     webuiPid: process.pid,
     startedAt: serverStartedAt,
     cwd: options.cwd,
@@ -3537,6 +3857,8 @@ const server = createServer(async (req, res) => {
       sendSse(res, {
         type: "webui_connected",
         version: packageJson.version,
+        webuiDev: webuiDevServer,
+        webuiMode: webuiDevServer ? "dev" : "production",
         tabId: tab.id,
         tabTitle: tab.title,
         pid: tab.rpc.child?.pid,
@@ -3559,6 +3881,8 @@ const server = createServer(async (req, res) => {
       sendJson(res, 200, {
         ok: true,
         webuiVersion: status.webuiVersion,
+        webuiDev: status.webuiDev,
+        webuiMode: status.webuiMode,
         webuiPid: status.webuiPid,
         piPid: status.piPid,
         piRunning: status.piRunning,
@@ -3629,6 +3953,15 @@ const server = createServer(async (req, res) => {
       return;
     }
 
+    if (url.pathname === "/api/restart" && req.method === "POST") {
+      if (!isLocalAddress(req.socket.remoteAddress)) throw makeHttpError(403, "Restart is only allowed from localhost");
+      const restorableTabs = await restorableTabsForRestart();
+      const child = spawnRestartServer(restorableTabs);
+      sendJson(res, 200, { ok: true, message: "Pi Web UI restarting", webuiPid: process.pid, nextWebuiPid: child.pid, restorableTabCount: restorableTabs.length });
+      setTimeout(() => shutdown("api restart"), 20).unref();
+      return;
+    }
+
     if (url.pathname === "/api/shutdown" && req.method === "POST") {
       if (!isLocalAddress(req.socket.remoteAddress)) throw makeHttpError(403, "Shutdown is only allowed from localhost");
       sendJson(res, 200, { ok: true, message: "Pi Web UI shutting down", webuiPid: process.pid });
@@ -3750,6 +4083,32 @@ const server = createServer(async (req, res) => {
       return;
     }
 
+    if (url.pathname === "/api/tools" && req.method === "GET") {
+      const tab = getRequestedTab(req, url);
+      sendJson(res, 200, { ok: true, data: await getToolConfigData(tab) });
+      return;
+    }
+
+    if (url.pathname === "/api/tools" && req.method === "POST") {
+      const body = await readJsonBody(req);
+      const tab = getRequestedTab(req, url, body);
+      sendJson(res, 200, { ok: true, data: await setToolConfigData(tab, body) });
+      return;
+    }
+
+    if (url.pathname === "/api/skills" && req.method === "GET") {
+      const tab = getRequestedTab(req, url);
+      sendJson(res, 200, { ok: true, data: await getMergedSkillConfigData(tab) });
+      return;
+    }
+
+    if (url.pathname === "/api/skills" && req.method === "POST") {
+      const body = await readJsonBody(req);
+      const tab = getRequestedTab(req, url, body);
+      sendJson(res, 200, { ok: true, data: await setSkillConfigData(tab, body) });
+      return;
+    }
+
     if (url.pathname === "/api/commands" && req.method === "GET") {
       const tab = getRequestedTab(req, url);
       sendJson(res, 200, { type: "response", command: "get_commands", success: true, data: await getCommandData(tab) });
@@ -3879,7 +4238,15 @@ server.listen(options.port, currentHost, () => {
 
 function shutdown(signal) {
   console.log(`\n${signal}: shutting down Pi Web UI...`);
-  server.close(() => process.exit(0));
+  const forceCloseTimer = setTimeout(() => {
+    server.closeAllConnections?.();
+  }, NETWORK_REBIND_FORCE_CLOSE_MS);
+  forceCloseTimer.unref?.();
+  server.close(() => {
+    clearTimeout(forceCloseTimer);
+    process.exit(0);
+  });
+  server.closeIdleConnections?.();
   for (const tab of tabs.values()) tab.rpc.stop();
   setTimeout(() => process.exit(0), 4000).unref();
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@firstpick/pi-package-webui",
-  "version": "0.2.1",
+  "version": "0.2.3",
   "description": "Pi Web UI companion package with a local browser UI CLI plus /webui-start and /webui-status commands.",
   "license": "MIT",
   "type": "module",
@@ -20,13 +20,17 @@
       "../pi-extension-git-footer-status/index.ts",
       "../pi-extension-release-aur/index.ts",
       "../pi-extension-release-npm/index.ts",
+      "../pi-extension-setup-skills/index.ts",
       "../pi-extension-stats/index.ts",
       "../pi-extension-todo-progress/index.ts",
+      "../pi-extension-tools/index.ts",
       "node_modules/@firstpick/pi-extension-git-footer-status/index.ts",
       "node_modules/@firstpick/pi-extension-release-aur/index.ts",
       "node_modules/@firstpick/pi-extension-release-npm/index.ts",
+      "node_modules/@firstpick/pi-extension-setup-skills/index.ts",
       "node_modules/@firstpick/pi-extension-stats/index.ts",
-      "node_modules/@firstpick/pi-extension-todo-progress/index.ts"
+      "node_modules/@firstpick/pi-extension-todo-progress/index.ts",
+      "node_modules/@firstpick/pi-extension-tools/index.ts"
     ],
     "skills": [
       "../pi-extension-release-aur/skills",
@@ -45,7 +49,7 @@
     "pi-webui": "./bin/pi-webui.mjs"
   },
   "scripts": {
-    "check": "node --check public/app.js && node --check bin/pi-webui.mjs && node tests/mobile-static.test.mjs && node tests/native-parity.test.mjs",
+    "check": "node --check public/app.js && node --check bin/pi-webui.mjs && node --check webui-rpc-helper.mjs && node tests/mobile-static.test.mjs && node tests/native-parity.test.mjs",
     "test": "node tests/mobile-static.test.mjs && node tests/native-parity.test.mjs"
   },
   "dependencies": {
@@ -55,13 +59,16 @@
     "@firstpick/pi-extension-git-footer-status": "^0.2.1",
     "@firstpick/pi-extension-release-aur": "^0.1.3",
     "@firstpick/pi-extension-release-npm": "^0.3.3",
+    "@firstpick/pi-extension-setup-skills": "^0.1.5",
     "@firstpick/pi-extension-stats": "^0.2.0",
     "@firstpick/pi-extension-todo-progress": "^0.1.7",
+    "@firstpick/pi-extension-tools": "^0.1.4",
     "@firstpick/pi-prompts-git-pr": "^0.1.0",
     "@firstpick/pi-themes-bundle": "^0.1.1"
   },
   "files": [
     "index.ts",
+    "webui-rpc-helper.mjs",
     "bin",
     "public",
     "images",