@tonyclaw/agent-inspector 4.0.1 → 4.0.2

package/src/services/result.ts

@@ -1,17 +0,0 @@
-export type ServiceErrorCode = "not-found" | "not-exported";
-
-export type ServiceResult<T> =
-  | { ok: true; value: T }
-  | { ok: false; code: ServiceErrorCode; status: number; message: string };
-
-export function serviceOk<T>(value: T): ServiceResult<T> {
-  return { ok: true, value };
-}
-
-export function serviceError(
-  code: ServiceErrorCode,
-  status: number,
-  message: string,
-): ServiceResult<never> {
-  return { ok: false, code, status, message };
-}

package/src/services/runs.ts

@@ -1,76 +0,0 @@
-import {
-  type CreateInspectorRunInput,
-  type EvidenceExportOptions,
-  type EvidenceExportResult,
-  type InspectorRun,
-  type InspectorRunEvidence,
-  type RecentFailuresResponse,
-  type UpdateInspectorRunInput,
-} from "../lib/runContract";
-import { exportRunEvidence, readEvidenceMarkdown } from "../proxy/evidenceExporter";
-import { RECENT_FAILURES_DEFAULT_LIMIT, listRecentFailures } from "../proxy/runFailures";
-import { createRun, getRun, listRuns, updateRun } from "../proxy/runStore";
-import { serviceError, serviceOk, type ServiceResult } from "./result";
-
-export type InspectorRunsList = {
-  runs: InspectorRun[];
-};
-
-export type RunEvidenceRead = {
-  run: InspectorRun;
-  evidence: InspectorRunEvidence;
-  markdown: string;
-};
-
-export function listInspectorRuns(): InspectorRunsList {
-  return { runs: listRuns() };
-}
-
-export function createInspectorRun(input: CreateInspectorRunInput): InspectorRun {
-  return createRun(input);
-}
-
-export function getInspectorRun(runId: string): ServiceResult<InspectorRun> {
-  const run = getRun(runId);
-  if (run === null) return serviceError("not-found", 404, "Run not found");
-  return serviceOk(run);
-}
-
-export function updateInspectorRun(
-  runId: string,
-  input: UpdateInspectorRunInput,
-): ServiceResult<InspectorRun> {
-  const run = updateRun(runId, input);
-  if (run === null) return serviceError("not-found", 404, "Run not found");
-  return serviceOk(run);
-}
-
-export function listInspectorRecentFailures(
-  limit: number = RECENT_FAILURES_DEFAULT_LIMIT,
-): RecentFailuresResponse {
-  return listRecentFailures(limit);
-}
-
-export { RECENT_FAILURES_DEFAULT_LIMIT };
-
-export async function exportInspectorRunEvidence(
-  runId: string,
-  options: EvidenceExportOptions,
-  baseUrl: string,
-): Promise<ServiceResult<EvidenceExportResult>> {
-  const run = getRun(runId);
-  if (run === null) return serviceError("not-found", 404, "Run not found");
-  return serviceOk(await exportRunEvidence(run, options, baseUrl));
-}
-
-export function readInspectorRunEvidence(runId: string): ServiceResult<RunEvidenceRead> {
-  const run = getRun(runId);
-  if (run === null) return serviceError("not-found", 404, "Run not found");
-
-  const markdown = readEvidenceMarkdown(run);
-  if (run.evidence === null || markdown === null) {
-    return serviceError("not-exported", 404, "Evidence has not been exported for this run");
-  }
-
-  return serviceOk({ run, evidence: run.evidence, markdown });
-}

package/src/ui/bootstrap.ts

@@ -1,167 +0,0 @@
-import { AGENT_INSPECTOR_BASE_PATH_META_NAME } from "../lib/basePath";
-import { THEME_MODE_STORAGE_KEY } from "../lib/themeMode";
-import {
-  UI_SCALE_AUTO_LARGE_WIDTH,
-  UI_SCALE_AUTO_MAX_DPR,
-  UI_SCALE_AUTO_MEDIUM_WIDTH,
-  UI_SCALE_MINIMUM_COMPACT_FONT_SIZE,
-  UI_SCALE_STORAGE_KEY,
-} from "../lib/uiScale";
-
-export const UI_BASE_PATH_BOOTSTRAP_PLACEHOLDER = "__AGENT_INSPECTOR_BASE_PATH_BOOTSTRAP__";
-export const UI_BASE_PATH_META_PLACEHOLDER = "__AGENT_INSPECTOR_BASE_PATH__";
-export const UI_RUNTIME_CSP_BOOTSTRAP_PLACEHOLDER = "__AGENT_INSPECTOR_RUNTIME_CSP_BOOTSTRAP__";
-export const UI_THEME_BOOTSTRAP_PLACEHOLDER = "__AGENT_INSPECTOR_THEME_BOOTSTRAP__";
-export const UI_SCALE_BOOTSTRAP_PLACEHOLDER = "__AGENT_INSPECTOR_UI_SCALE_BOOTSTRAP__";
-
-export const basePathBootstrapScript = `
-(function () {
-  var placeholder = "__AGENT_INSPECTOR_" + "BASE_PATH__";
-  var meta = document.querySelector('meta[name="${AGENT_INSPECTOR_BASE_PATH_META_NAME}"]');
-  var base = document.querySelector("base");
-
-  function normalize(value) {
-    var trimmed = typeof value === "string" ? value.trim() : "";
-    if (trimmed === "" || trimmed === "/") return "";
-    return "/" + trimmed.replace(/^\\/+|\\/+$/g, "");
-  }
-
-  function inferFromKnownUiRoute() {
-    var pathname = window.location.pathname;
-    var sessionMarker = "/session/";
-    var sessionIndex = pathname.indexOf(sessionMarker);
-    if (sessionIndex >= 0) return normalize(pathname.slice(0, sessionIndex));
-    return normalize(pathname.replace(/\\/index\\.html$/, ""));
-  }
-
-  function runtimeBasePath() {
-    var runtime = window.__AGENT_INSPECTOR_RUNTIME__;
-    if (
-      runtime !== null &&
-      typeof runtime === "object" &&
-      runtime.ui !== null &&
-      typeof runtime.ui === "object" &&
-      typeof runtime.ui.basePath === "string"
-    ) {
-      return runtime.ui.basePath;
-    }
-    return null;
-  }
-
-  var configured = meta === null ? placeholder : meta.getAttribute("content");
-  var runtimePath = runtimeBasePath();
-  var basePath = configured !== null && configured !== placeholder
-    ? normalize(configured)
-    : runtimePath === null
-      ? inferFromKnownUiRoute()
-      : normalize(runtimePath);
-  var baseHref = basePath === "" ? "/" : basePath + "/";
-
-  if (meta !== null) meta.setAttribute("content", basePath === "" ? "/" : basePath);
-  if (base !== null) base.setAttribute("href", baseHref);
-})();
-`;
-
-export const runtimeCspBootstrapScript = `
-(function () {
-  var runtime = window.__AGENT_INSPECTOR_RUNTIME__;
-  var controlBaseUrl = runtime !== null && typeof runtime === "object" &&
-    runtime.control !== null && typeof runtime.control === "object" &&
-    typeof runtime.control.baseUrl === "string"
-      ? runtime.control.baseUrl
-      : null;
-  var controlOrigin = null;
-  if (controlBaseUrl !== null) {
-    try {
-      var parsed = new URL(controlBaseUrl);
-      if (parsed.protocol === "http:" || parsed.protocol === "https:") {
-        controlOrigin = parsed.origin;
-      }
-    } catch (error) {}
-  }
-  var uiOrigin = new URL(document.baseURI).origin;
-  var connectSources = controlOrigin === null || controlOrigin === uiOrigin
-    ? "'self'"
-    : "'self' " + controlOrigin;
-  var policy = [
-    "default-src 'self'",
-    "base-uri 'self'",
-    "connect-src " + connectSources,
-    "font-src 'self' data:",
-    "form-action 'self'",
-    "img-src 'self' data: blob:",
-    "object-src 'none'",
-    "script-src 'self' 'unsafe-inline'",
-    "style-src 'self' 'unsafe-inline'",
-    "worker-src 'self' blob:"
-  ].join("; ");
-  var meta = document.querySelector('meta[http-equiv="Content-Security-Policy"]');
-  if (meta === null) {
-    meta = document.createElement("meta");
-    meta.setAttribute("http-equiv", "Content-Security-Policy");
-    document.head.appendChild(meta);
-  }
-  meta.setAttribute("content", policy);
-})();
-`;
-
-export const themeModeBootstrapScript = `
-(function () {
-  try {
-    var storedThemeMode = window.localStorage.getItem("${THEME_MODE_STORAGE_KEY}");
-    var themeMode = storedThemeMode === "light" || storedThemeMode === "eye-care"
-      ? storedThemeMode
-      : "dark";
-    document.documentElement.dataset.theme = themeMode;
-  } catch (error) {
-    document.documentElement.dataset.theme = "dark";
-  }
-})();
-`;
-
-export const uiScaleBootstrapScript = `
-(function () {
-  try {
-    var storedUiScale = window.localStorage.getItem("${UI_SCALE_STORAGE_KEY}");
-    var uiScalePreference = storedUiScale === "100" || storedUiScale === "125" || storedUiScale === "150"
-      ? storedUiScale
-      : "auto";
-    var resolvedUiScale = 1;
-    if (uiScalePreference === "125") resolvedUiScale = 1.25;
-    if (uiScalePreference === "150") resolvedUiScale = 1.5;
-    if (uiScalePreference === "auto") {
-      var viewportWidth = Number.isFinite(window.innerWidth) && window.innerWidth > 0
-        ? window.innerWidth
-        : 1280;
-      var rawScreenWidth = typeof window.screen === "undefined"
-        ? viewportWidth
-        : window.screen.availWidth;
-      var screenWidth = Number.isFinite(rawScreenWidth) && rawScreenWidth > 0
-        ? rawScreenWidth
-        : viewportWidth;
-      var rawDevicePixelRatio = window.devicePixelRatio;
-      var devicePixelRatio = Number.isFinite(rawDevicePixelRatio) && rawDevicePixelRatio > 0
-        ? rawDevicePixelRatio
-        : 1;
-      var availableWidth = Math.min(viewportWidth, screenWidth);
-      if (devicePixelRatio <= ${String(UI_SCALE_AUTO_MAX_DPR)} && availableWidth >= ${String(UI_SCALE_AUTO_LARGE_WIDTH)}) {
-        resolvedUiScale = 1.25;
-      } else if (devicePixelRatio <= ${String(UI_SCALE_AUTO_MAX_DPR)} && availableWidth >= ${String(UI_SCALE_AUTO_MEDIUM_WIDTH)}) {
-        resolvedUiScale = 1.125;
-      }
-    }
-    var root = document.documentElement;
-    root.dataset.uiScale = uiScalePreference;
-    root.dataset.uiScaleResolved = String(Math.round(resolvedUiScale * 100));
-    root.style.setProperty("--inspector-ui-scale", String(resolvedUiScale));
-    root.style.setProperty("--inspector-root-font-size", String(16 * resolvedUiScale) + "px");
-    root.style.setProperty("--inspector-font-9", String(Math.max(${String(UI_SCALE_MINIMUM_COMPACT_FONT_SIZE)}, 9 * resolvedUiScale)) + "px");
-    root.style.setProperty("--inspector-font-10", String(Math.max(${String(UI_SCALE_MINIMUM_COMPACT_FONT_SIZE)}, 10 * resolvedUiScale)) + "px");
-    root.style.setProperty("--inspector-font-11", String(Math.max(${String(UI_SCALE_MINIMUM_COMPACT_FONT_SIZE)}, 11 * resolvedUiScale)) + "px");
-    root.style.setProperty("--inspector-font-13", String(13 * resolvedUiScale) + "px");
-  } catch (error) {
-    document.documentElement.dataset.uiScale = "auto";
-    document.documentElement.dataset.uiScaleResolved = "100";
-  }
-})();
-`;

package/src/ui/index.html

@@ -1,38 +0,0 @@
-<!doctype html>
-<html lang="en" data-theme="dark">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta name="agent-inspector-base-path" content="__AGENT_INSPECTOR_BASE_PATH__" />
-    <base href="/" />
-    <script>
-      __AGENT_INSPECTOR_BASE_PATH_BOOTSTRAP__
-    </script>
-    <script vite-ignore src="./runtime-config.js"></script>
-    <script>
-      try {
-        window.__AGENT_INSPECTOR_RUNTIME__ = __AGENT_INSPECTOR_RUNTIME_JSON__;
-      } catch (error) {
-        window.__AGENT_INSPECTOR_RUNTIME__ = window.__AGENT_INSPECTOR_RUNTIME_CONFIG__ || {};
-      }
-    </script>
-    <script>
-      __AGENT_INSPECTOR_RUNTIME_CSP_BOOTSTRAP__
-    </script>
-    <script>
-      __AGENT_INSPECTOR_BASE_PATH_BOOTSTRAP__
-    </script>
-    <script>
-      __AGENT_INSPECTOR_THEME_BOOTSTRAP__
-    </script>
-    <script>
-      __AGENT_INSPECTOR_UI_SCALE_BOOTSTRAP__
-    </script>
-    <link rel="icon" type="image/svg+xml" href="../assets/favicon.svg" />
-    <title>Agent Inspector</title>
-  </head>
-  <body>
-    <div id="root"><p role="status">Connecting to Agent Inspector…</p></div>
-    <script type="module" src="./main.tsx"></script>
-  </body>
-</html>

package/src/ui/logsStreamClient.ts

@@ -1,20 +0,0 @@
-import {
-  buildControlRuntimeUrl,
-  resolveBrowserRuntimeForDocument,
-} from "../lib/browserRuntimeResolver";
-
-export function buildLogsStreamUrl(sessionId: string | undefined): string | null {
-  const params = new URLSearchParams({ compact: "1" });
-  if (sessionId !== undefined) {
-    params.set("sessionId", sessionId);
-  }
-  const runtime = resolveBrowserRuntimeForDocument();
-  if (!runtime.ok) return null;
-  return buildControlRuntimeUrl(runtime.runtime, `/api/logs/stream?${params.toString()}`);
-}
-
-export function openLogsEventSource(sessionId: string | undefined): EventSource | null {
-  const url = buildLogsStreamUrl(sessionId);
-  if (url === null) return null;
-  return new EventSource(url);
-}

package/src/ui/main.tsx

@@ -1,13 +0,0 @@
-import { RouterProvider } from "@tanstack/react-router";
-import { createRoot } from "react-dom/client";
-import "../index.css";
-import { router } from "./router";
-import { validateBrowserRuntimeForStartup } from "./runtimeDiscovery";
-
-const rootElement = document.getElementById("root");
-
-if (rootElement !== null) {
-  createRoot(rootElement).render(<RouterProvider router={router} />);
-}
-
-void validateBrowserRuntimeForStartup();

package/src/ui/public/runtime-config.js

@@ -1,2 +0,0 @@
-/* global window */
-window.__AGENT_INSPECTOR_RUNTIME_CONFIG__ = window.__AGENT_INSPECTOR_RUNTIME_CONFIG__ || {};

package/src/ui/router.tsx

@@ -1,13 +0,0 @@
-import { createRouter } from "@tanstack/react-router";
-import { getConfiguredBasePath } from "../lib/basePath";
-import { routeTree } from "./routeTree.gen";
-
-export function createUiRouter(basepath = getConfiguredBasePath()) {
-  return createRouter({
-    routeTree,
-    basepath,
-    scrollRestoration: false,
-  });
-}
-
-export const router = createUiRouter();

package/src/ui/routes/__root.tsx

@@ -1,69 +0,0 @@
-import { Outlet, createRootRoute } from "@tanstack/react-router";
-import { useEffect, type ReactNode } from "react";
-import { SWRConfig } from "swr";
-import { SafeErrorBoundary, SafeRouteError } from "../../components/errors/SafeErrorBoundary";
-import { withBasePath } from "../../lib/basePath";
-import { installChunkLoadRecovery } from "../../lib/chunkLoadRecovery";
-
-export const Route = createRootRoute({
-  component: RootComponent,
-  errorComponent: RootRouteErrorComponent,
-  notFoundComponent: RootNotFoundComponent,
-});
-
-function UiProviders({ children }: Readonly<{ children: ReactNode }>) {
-  return (
-    <SWRConfig value={{ revalidateOnFocus: false, revalidateIfStale: false }}>{children}</SWRConfig>
-  );
-}
-
-function RootComponent() {
-  useEffect(() => installChunkLoadRecovery(), []);
-
-  return (
-    <UiProviders>
-      <SafeErrorBoundary
-        scope="root-render"
-        title="Agent Inspector could not continue"
-        description="The application stopped this render safely. Retry or reload Inspector."
-        variant="page"
-      >
-        <Outlet />
-      </SafeErrorBoundary>
-    </UiProviders>
-  );
-}
-
-function RootRouteErrorComponent({ error, reset }: { error: Error; reset: () => void }) {
-  return (
-    <UiProviders>
-      <SafeRouteError error={error} reset={reset} scope="root-route" />
-    </UiProviders>
-  );
-}
-
-function RootNotFoundComponent() {
-  return (
-    <UiProviders>
-      <main className="min-h-screen bg-background text-foreground">
-        <div className="mx-auto flex min-h-screen w-full max-w-3xl flex-col justify-center px-6 py-16">
-          <div className="rounded-lg border border-border/70 bg-card/60 p-8 shadow-sm">
-            <div className="font-mono text-xs uppercase tracking-wider text-muted-foreground">
-              404
-            </div>
-            <h1 className="mt-3 text-2xl font-semibold">Page not found</h1>
-            <p className="mt-3 max-w-xl text-sm leading-6 text-muted-foreground">
-              This route is not part of the Agent Inspector UI.
-            </p>
-            <a
-              href={withBasePath("/")}
-              className="mt-6 inline-flex h-9 items-center justify-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground transition-colors hover:bg-primary/90"
-            >
-              Open Agent Inspector
-            </a>
-          </div>
-        </div>
-      </main>
-    </UiProviders>
-  );
-}

package/src/ui/routes/index.tsx

@@ -1,35 +0,0 @@
-import { createFileRoute } from "@tanstack/react-router";
-import { useEffect, useState, type JSX } from "react";
-import { SafeRouteError } from "../../components/errors/SafeErrorBoundary";
-import { ProxyViewerContainer } from "../../components/ProxyViewerContainer";
-
-export const Route = createFileRoute("/")({
-  component: ClientOnlyProxyViewerRoute,
-  errorComponent: HomeRouteError,
-});
-
-function HomeRouteError({ error, reset }: { error: Error; reset: () => void }): JSX.Element {
-  return <SafeRouteError error={error} reset={reset} scope="home-route" />;
-}
-
-function ClientOnlyProxyViewerRoute(): JSX.Element {
-  const [mounted, setMounted] = useState(false);
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
-
-  if (!mounted) {
-    return (
-      <main className="min-h-screen bg-background text-foreground">
-        <div className="mx-auto flex min-h-screen w-full max-w-2xl flex-col justify-center px-6 py-16 text-center">
-          <div className="rounded-[8px] border border-border bg-card px-4 py-8 shadow-sm">
-            <p className="text-sm font-medium text-muted-foreground">Loading Inspector...</p>
-          </div>
-        </div>
-      </main>
-    );
-  }
-
-  return <ProxyViewerContainer />;
-}

package/src/ui/routes/session/$sessionId.tsx

@@ -1,50 +0,0 @@
-import { createFileRoute } from "@tanstack/react-router";
-import { useEffect, useState, type JSX } from "react";
-import { SafeRouteError } from "../../../components/errors/SafeErrorBoundary";
-import { ProxyViewerContainer } from "../../../components/ProxyViewerContainer";
-import { decodeSessionIdFromPath, encodeSessionIdForPath } from "../../../lib/sessionUrl";
-
-export const Route = createFileRoute("/session/$sessionId")({
-  component: SessionViewerRoute,
-  errorComponent: SessionRouteError,
-  parseParams: (params) => ({
-    sessionId: decodeSessionIdFromPath(params.sessionId),
-  }),
-  stringifyParams: (params) => ({
-    sessionId: encodeSessionIdForPath(params.sessionId),
-  }),
-});
-
-function SessionRouteError({ error, reset }: { error: Error; reset: () => void }): JSX.Element {
-  return <SafeRouteError error={error} reset={reset} scope="session-route" />;
-}
-
-function SessionViewerRoute(): JSX.Element {
-  const { sessionId } = Route.useParams();
-  return <ClientOnlySessionViewer sessionId={sessionId} />;
-}
-
-function ClientOnlySessionViewer({ sessionId }: { sessionId: string }): JSX.Element {
-  const [mounted, setMounted] = useState(false);
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
-
-  if (!mounted) {
-    return (
-      <main className="min-h-screen bg-background text-foreground">
-        <div className="mx-auto flex min-h-screen w-full max-w-2xl flex-col justify-center px-6 py-16 text-center">
-          <div className="rounded-[8px] border border-border bg-card px-4 py-8 shadow-sm">
-            <p className="text-sm font-medium text-muted-foreground">Loading session data...</p>
-            <p className="mt-3 inline-block max-w-full break-all rounded bg-muted px-3 py-1 font-mono text-xs text-muted-foreground">
-              {sessionId}
-            </p>
-          </div>
-        </div>
-      </main>
-    );
-  }
-
-  return <ProxyViewerContainer key={sessionId} initialSessionId={sessionId} />;
-}

package/src/ui/runtimeDiscovery.ts

@@ -1,50 +0,0 @@
-import { fetchWithTimeout } from "../lib/apiClient";
-import {
-  acceptBrowserRuntimeDiscovery,
-  resolveBrowserRuntimeForDocument,
-  type BrowserRuntimeResolution,
-} from "../lib/browserRuntimeResolver";
-
-const RUNTIME_DISCOVERY_TIMEOUT_MS = 2_000;
-type RuntimeDiscoveryRequest = () => Promise<Response>;
-
-function requestRuntimeDiscovery(): Promise<Response> {
-  return fetchWithTimeout("/api/runtime", RUNTIME_DISCOVERY_TIMEOUT_MS, {
-    cache: "no-store",
-  });
-}
-
-function discoveryFailure(issue: string): BrowserRuntimeResolution {
-  return {
-    ok: false,
-    source: "discovered",
-    code: "invalid",
-    issues: [issue],
-  };
-}
-
-/**
- * Validate the backend discovery document before same-origin fallback values
- * are exposed as verified Coding Agent endpoints. Injected/operator contracts
- * are already schema-validated and need no discovery round trip.
- */
-export async function validateBrowserRuntimeForStartup(
-  request: RuntimeDiscoveryRequest = requestRuntimeDiscovery,
-): Promise<BrowserRuntimeResolution> {
-  const fallback = resolveBrowserRuntimeForDocument();
-  if (!fallback.ok || fallback.source !== "composed-fallback") return fallback;
-
-  try {
-    const response = await request();
-    if (!response.ok) {
-      return discoveryFailure(
-        `Backend runtime discovery returned HTTP ${String(response.status)}.`,
-      );
-    }
-    const value: unknown = await response.json();
-    return acceptBrowserRuntimeDiscovery(fallback.runtime, value);
-  } catch (error) {
-    const message = error instanceof Error ? error.message : "unknown discovery failure";
-    return discoveryFailure(`Backend runtime discovery failed: ${message}`);
-  }
-}