@narumitw/pi-inspect 0.0.0-stage → 0.2.0

package/src/server.ts

@@ -0,0 +1,202 @@
+import { randomBytes, timingSafeEqual } from "node:crypto";
+import { readFile } from "node:fs/promises";
+import { createServer, type ServerResponse } from "node:http";
+import type { Socket } from "node:net";
+
+export interface ViewerServer {
+  url: string;
+  token: string;
+  origin: string;
+  invalidate(revision: number): void;
+  close(): Promise<void>;
+}
+export interface ServerOptions {
+  generation: string;
+  signal: AbortSignal;
+  snapshot(): unknown;
+  branch(id: string, offset: number): unknown;
+  detail(id: string, leaf: string): unknown;
+  assets?: Map<string, { type: string; body: string | Buffer }>;
+}
+export function sendRevision(response: { write(frame: string): boolean; destroy(): void }, frame: string): void {
+  // No extension-owned queue: close a backpressured client; reconnect fetches a fresh snapshot.
+  if (!response.write(frame)) response.destroy();
+}
+export async function startServer(options: ServerOptions): Promise<ViewerServer> {
+  const assets =
+    options.assets ??
+    new Map([
+      [
+        "/",
+        {
+          type: "text/html; charset=utf-8",
+          body: await readFile(new URL("../dist/index.html", import.meta.url), { signal: options.signal }),
+        },
+      ],
+      [
+        "/app.js",
+        {
+          type: "text/javascript; charset=utf-8",
+          body: await readFile(new URL("../dist/app.js", import.meta.url), { signal: options.signal }),
+        },
+      ],
+      [
+        "/app.css",
+        {
+          type: "text/css; charset=utf-8",
+          body: await readFile(new URL("../dist/app.css", import.meta.url), { signal: options.signal }),
+        },
+      ],
+    ]);
+  options.signal.throwIfAborted();
+  const token = randomBytes(32).toString("base64url");
+  const clients = new Set<ServerResponse>();
+  const sockets = new Set<Socket>();
+  let closed = false;
+  let origin = "";
+  let revision = 0;
+  let closing: Promise<void> | undefined;
+  const frame = () =>
+    `id: ${revision}\ndata: ${JSON.stringify({ protocol: 1, generation: options.generation, revision })}\n\n`;
+  const server = createServer((req, res) => {
+    res.setHeader("Cache-Control", "no-store");
+    res.setHeader("Referrer-Policy", "no-referrer");
+    res.setHeader("X-Content-Type-Options", "nosniff");
+    res.setHeader("Cross-Origin-Resource-Policy", "same-origin");
+    res.setHeader(
+      "Content-Security-Policy",
+      "default-src 'none'; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self'; img-src 'self' data:; font-src 'self'; frame-ancestors 'none'; base-uri 'none'; form-action 'none'",
+    );
+    const fail = (status: number, message: string) => {
+      res.writeHead(status, { "Content-Type": "text/plain; charset=utf-8" });
+      res.end(message);
+    };
+    if (closed || options.signal.aborted) return fail(410, "Session closed");
+    if (
+      req.headers.host !== origin.slice("http://".length) ||
+      (req.headers.origin !== undefined && req.headers.origin !== origin) ||
+      req.headers["sec-fetch-site"] === "cross-site"
+    )
+      return fail(403, "Forbidden");
+    if (req.method !== "GET") return fail(405, "Read-only viewer");
+    let url: URL;
+    try {
+      url = new URL(req.url ?? "/", origin);
+    } catch {
+      return fail(400, "Invalid URL");
+    }
+    if (url.origin !== origin) return fail(403, "Forbidden");
+    const asset = assets.get(url.pathname);
+    if (asset && !url.search) {
+      res.writeHead(200, { "Content-Type": asset.type });
+      // Generation is a public epoch identifier, not a credential. Encoding keeps the HTML boundary inert.
+      const body =
+        url.pathname === "/"
+          ? asset.body
+              .toString()
+              .replace(
+                "<head>",
+                `<head><meta name="inspector-generation" content="${encodeURIComponent(options.generation)}">`,
+              )
+          : asset.body;
+      res.end(body);
+      return;
+    }
+    if (!url.pathname.startsWith("/api/")) return fail(404, "Not found");
+    const provided = req.headers["x-inspector-token"];
+    if (
+      typeof provided !== "string" ||
+      Buffer.byteLength(provided) !== Buffer.byteLength(token) ||
+      !timingSafeEqual(Buffer.from(provided), Buffer.from(token))
+    )
+      return fail(401, "Unauthorized");
+    if (url.searchParams.get("generation") !== options.generation) return fail(409, "Session generation changed");
+    if (url.pathname === "/api/events") {
+      if (clients.size >= 8) return fail(429, "Too many viewers");
+      res.writeHead(200, { "Content-Type": "text/event-stream", Connection: "keep-alive" });
+      clients.add(res);
+      res.on("close", () => clients.delete(res));
+      sendRevision(res, frame());
+      return;
+    }
+    try {
+      let result: unknown;
+      if (url.pathname === "/api/snapshot") result = options.snapshot();
+      else if (url.pathname === "/api/branch") {
+        const offset = url.searchParams.get("offset") ?? "0";
+        if (!/^\d{1,8}$/.test(offset)) return fail(400, "Invalid offset");
+        result = options.branch(url.searchParams.get("leaf") ?? "", Number(offset));
+      } else if (url.pathname === "/api/detail") {
+        result = options.detail(url.searchParams.get("id") ?? "", url.searchParams.get("leaf") ?? "");
+      } else return fail(404, "Not found");
+      res.writeHead(200, { "Content-Type": "application/json; charset=utf-8" });
+      res.end(JSON.stringify(result));
+    } catch {
+      fail(400, "Unavailable session data");
+    }
+  });
+  server.requestTimeout = 10000;
+  server.headersTimeout = 10000;
+  server.maxHeadersCount = 32;
+  server.on("connection", (socket) => {
+    if (sockets.size >= 32) {
+      socket.destroy();
+      return;
+    }
+    sockets.add(socket);
+    socket.on("close", () => sockets.delete(socket));
+  });
+  const close = (): Promise<void> => {
+    if (closing) return closing;
+    closed = true;
+    options.signal.removeEventListener("abort", abort);
+    for (const client of clients) client.destroy();
+    clients.clear();
+    for (const socket of sockets) socket.destroy();
+    closing = new Promise((resolve) => server.close(() => resolve()));
+    return closing;
+  };
+  const abort = () => {
+    void close();
+  };
+  // Register before listen, and recheck after readiness to cover abort during startup.
+  options.signal.addEventListener("abort", abort, { once: true });
+  try {
+    await new Promise<void>((resolve, reject) => {
+      const cancelled = () => reject(new Error("Server startup cancelled"));
+      options.signal.addEventListener("abort", cancelled, { once: true });
+      const failed = (error: Error) => {
+        options.signal.removeEventListener("abort", cancelled);
+        reject(error);
+      };
+      server.once("error", failed);
+      server.listen({ port: 0, host: "127.0.0.1", signal: options.signal }, () => {
+        options.signal.removeEventListener("abort", cancelled);
+        server.removeListener("error", failed);
+        resolve();
+      });
+    });
+    options.signal.throwIfAborted();
+  } catch (error) {
+    await close();
+    throw error;
+  }
+  const address = server.address();
+  if (!address || typeof address === "string") {
+    await close();
+    throw new Error("No loopback address");
+  }
+  origin = `http://127.0.0.1:${address.port}`;
+  return {
+    token,
+    origin,
+    url: `${origin}/#${token}`,
+    invalidate(next) {
+      if (!closed) {
+        revision = next;
+        for (const res of clients) sendRevision(res, frame());
+      }
+    },
+    close,
+  };
+}

package/src/system-message.ts

@@ -0,0 +1,117 @@
+// Native historical replay is allowed only within this cumulative input budget.
+export const SYSTEM_REPLAY_CHARACTERS = 1_048_576;
+export const SYSTEM_REPLAY_TOOL_DELTAS = 2048;
+
+export function systemReplayIssue(messages: readonly unknown[]): string | undefined {
+  let remaining = SYSTEM_REPLAY_CHARACTERS;
+  let deltas = SYSTEM_REPLAY_TOOL_DELTAS;
+  let nodes = 16_384;
+  const seen = new WeakSet<object>();
+  // Count raw lengths without serializing, sanitizing, or materializing large metadata.
+  function declaration(value: unknown, depth = 0): boolean {
+    if (--nodes < 0 || depth > 32) return false;
+    if (typeof value === "string") {
+      remaining -= value.length;
+      return remaining >= 0;
+    }
+    if (!value || typeof value !== "object" || seen.has(value)) return true;
+    seen.add(value);
+    if (Array.isArray(value) && value.length > nodes) return false;
+    for (const key in value) {
+      if (!Object.hasOwn(value, key)) continue;
+      remaining -= key.length + 2;
+      if (remaining < 0) return false;
+      const property = Object.getOwnPropertyDescriptor(value, key);
+      if (property?.get || property?.set || !declaration(property?.value, depth + 1)) return false;
+    }
+    return true;
+  }
+  for (const value of messages) {
+    if (!value || typeof value !== "object" || Array.isArray(value)) continue;
+    const m = value as Record<string, unknown>;
+    if (m.role !== "system") continue;
+    for (const [kind, delta] of [
+      ["added", m.toolsAdded],
+      ["removed", m.toolsRemoved],
+    ] as const) {
+      if (!Array.isArray(delta)) continue;
+      deltas -= delta.length;
+      if (deltas < 0) return "system tool replay exceeds 2,048 cumulative delta budget";
+      for (const tool of delta) {
+        if (
+          !declaration(
+            kind === "added"
+              ? { name: tool.name, description: tool.description, parameters: tool.parameters }
+              : { name: tool.name },
+          )
+        )
+          return "system tool replay exceeds metadata character/node/depth budget";
+      }
+    }
+    remaining -= 2; // Bound join separators even for empty fragments.
+    if (typeof m.content === "string") remaining -= m.content.length;
+    else if (Array.isArray(m.content)) {
+      remaining -= m.content.length; // Also bound native filter/map work and block separators.
+      if (remaining < 0) return "system replay exceeds 1,048,576-character input budget";
+      for (const block of m.content) {
+        if (block?.type === "text" && typeof block.text === "string") remaining -= block.text.length;
+        if (remaining < 0) return "system replay exceeds 1,048,576-character input budget";
+      }
+    }
+    if (remaining < 0) return "system replay exceeds 1,048,576-character input budget";
+    if (m.sections && typeof m.sections === "object") {
+      for (const [key, part] of Object.entries(m.sections)) {
+        remaining -= key.length + 2 + (typeof part === "string" ? part.length : 0);
+        if (remaining < 0) return "system replay exceeds 1,048,576-character input budget";
+      }
+    }
+  }
+  return undefined;
+}
+
+// Validate the fields consumed by Pi AI's system-prompt/tool replay. Checkpoints
+// are injected directly; ordinary session messages are normalized by the caller.
+export function systemMessageIssue(value: unknown): string | undefined {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return "malformed system-message envelope";
+  const m = value as Record<string, unknown>;
+  if (m.role !== "system") return "malformed system-message role";
+  if (Array.isArray(m.content) && m.content.length > 2048) return "system content exceeds 2,048-block budget";
+  if (
+    typeof m.content !== "string" &&
+    (!Array.isArray(m.content) ||
+      m.content.some(
+        (block) =>
+          !block ||
+          typeof block !== "object" ||
+          Array.isArray(block) ||
+          (block.type === "text" && typeof block.text !== "string"),
+      ))
+  )
+    return "malformed system-message content";
+  if (
+    m.sections != null &&
+    (typeof m.sections !== "object" ||
+      Array.isArray(m.sections) ||
+      Object.values(m.sections).some((part) => part !== null && typeof part !== "string"))
+  )
+    return "malformed system-message sections";
+  for (const delta of [m.toolsAdded, m.toolsRemoved]) {
+    if (Array.isArray(delta) && delta.length > SYSTEM_REPLAY_TOOL_DELTAS)
+      return "system tool delta exceeds 2,048-entry budget";
+    if (
+      delta != null &&
+      (!Array.isArray(delta) ||
+        delta.some(
+          (tool) =>
+            !tool ||
+            typeof tool !== "object" ||
+            Array.isArray(tool) ||
+            typeof tool.name !== "string" ||
+            !tool.name.length ||
+            tool.name.length > 512,
+        ))
+    )
+      return "malformed system-message tool delta";
+  }
+  return undefined;
+}

package/src/web/api.ts

@@ -0,0 +1,137 @@
+import { useEffect, useRef, useState } from "react";
+import type { DetailView } from "../model.js";
+
+// Storage is optional reload persistence; a valid fragment must work in restricted profiles.
+function stored(key: string): string | null {
+  try {
+    return sessionStorage.getItem(key);
+  } catch {
+    return null;
+  }
+}
+function remember(key: string, value: string): void {
+  if (!value) return;
+  try {
+    sessionStorage.setItem(key, value);
+  } catch {
+    // Keep credentials in memory for this page; fragment-free reloads must reopen from Pi.
+  }
+}
+const fragment = location.hash.slice(1);
+const params = new URLSearchParams(fragment);
+// Continue accepting legacy #token=...&generation=... URLs and fragment-free browser reloads.
+const token = /^[\w-]{43}$/.test(fragment) ? fragment : (params.get("token") ?? stored("inspector-token") ?? "");
+const shellGeneration = document.querySelector<HTMLMetaElement>('meta[name="inspector-generation"]')?.content;
+export const generation =
+  params.get("generation") ??
+  (shellGeneration ? decodeURIComponent(shellGeneration) : (stored("inspector-generation") ?? ""));
+remember("inspector-token", token);
+remember("inspector-generation", generation);
+history.replaceState(null, "", location.pathname);
+export function headers(): HeadersInit {
+  return { "X-Inspector-Token": token };
+}
+export class RequestFailure extends Error {
+  constructor(
+    message: string,
+    readonly terminal: boolean,
+  ) {
+    super(message);
+  }
+}
+export async function request<T>(route: string, signal: AbortSignal): Promise<T> {
+  const response = await fetch(
+    `/api/${route}${route.includes("?") ? "&" : "?"}generation=${encodeURIComponent(generation)}`,
+    { headers: headers(), signal, cache: "no-store" },
+  );
+  if (!response.ok)
+    throw new RequestFailure(
+      [401, 403, 409, 410].includes(response.status)
+        ? "Session expired; open a new viewer from Pi."
+        : "Viewer unavailable; reconnecting requires a running Pi session.",
+      [401, 403, 409, 410].includes(response.status),
+    );
+  return response.json() as Promise<T>;
+}
+interface Job {
+  signal: AbortSignal;
+  run(): Promise<void>;
+  cancel(): void;
+}
+const queue: Job[] = [];
+const cache = new Map<string, DetailView>();
+let active = 0;
+function pump(): void {
+  while (active < 4 && queue.length) {
+    const job = queue.shift();
+    if (!job || job.signal.aborted) continue;
+    active++;
+    void job.run().finally(() => {
+      active--;
+      pump();
+    });
+  }
+}
+function loadDetail(id: string, signal: AbortSignal): Promise<DetailView> {
+  signal.throwIfAborted();
+  const cached = cache.get(id);
+  if (cached) return Promise.resolve(cached);
+  return new Promise((resolve, reject) => {
+    const job: Job = {
+      signal,
+      cancel: () => {
+        const index = queue.indexOf(job);
+        if (index !== -1) queue.splice(index, 1);
+        reject(new DOMException("Cancelled", "AbortError"));
+      },
+      run: async () => {
+        try {
+          const value = await request<DetailView>(
+            `detail?id=${encodeURIComponent(id)}&leaf=${encodeURIComponent(id)}`,
+            signal,
+          );
+          if (signal.aborted) return;
+          // Raw entries and their own historical projection are immutable; live calls use the latest snapshot.
+          const result = cache.get(id) ?? { ...value, calls: [] };
+          cache.set(id, result);
+          while (cache.size > 64) {
+            const first = cache.keys().next().value;
+            if (first === undefined) break;
+            cache.delete(first);
+          }
+          resolve(result);
+        } catch (error) {
+          reject(error);
+        } finally {
+          signal.removeEventListener("abort", job.cancel);
+        }
+      },
+    };
+    signal.addEventListener("abort", job.cancel, { once: true });
+    queue.push(job);
+    pump();
+  });
+}
+export function useDetail(id: string | undefined): { detail?: DetailView; error: string; retry(): void } {
+  const [attempt, setAttempt] = useState(0);
+  const owner = useRef<{ id: string; attempt: number } | undefined>(undefined);
+  const retry = () => setAttempt((value) => value + 1);
+  const [state, setState] = useState<{ id?: string; detail?: DetailView; error: string }>({ error: "" });
+  useEffect(() => {
+    if (!id) return;
+    const requestOwner = { id, attempt };
+    owner.current = requestOwner;
+    const controller = new AbortController();
+    setState({ id, error: "" });
+    void loadDetail(id, controller.signal)
+      .then((detail) => {
+        if (!controller.signal.aborted && owner.current === requestOwner) setState({ id, detail, error: "" });
+      })
+      .catch(() => {
+        if (!controller.signal.aborted && owner.current === requestOwner)
+          setState({ id, error: "Could not load entry details." });
+      });
+    return () => controller.abort();
+  }, [id, attempt]);
+  return { ...(state.id === id ? state : { error: "" }), retry };
+}