@oh-my-pi/omp-stats 18.14.1 → 18.15.0

package/dist/types/client/api.d.ts

@@ -10,6 +10,10 @@ export declare function getCostDashboardStats(range?: TimeRange, signal?: AbortS
 export declare function getRecentRequests(limit?: number, signal?: AbortSignal): Promise<MessageStats[]>;
 export declare function getRecentErrors(range?: TimeRange, limit?: number, signal?: AbortSignal): Promise<MessageStats[]>;
 export declare function getRequestDetails(id: number, signal?: AbortSignal): Promise<RequestDetails>;
+/** Whether the page may close the dashboard (`omp stats` shown in place of a Tern block). */
+export declare function getClosable(signal?: AbortSignal): Promise<boolean>;
+/** Close the dashboard: its host takes the page away and stops serving it. */
+export declare function closeDashboard(): Promise<void>;
 /** Ask the server to start a background sync; progress arrives on the `/api/events` stream. */
 export declare function requestSync(): Promise<LiveStatus>;
 export declare function getFrustrationDashboardStats(range?: TimeRange, signal?: AbortSignal): Promise<FrustrationDashboardStats>;

package/dist/types/client/app/CloseButton.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Close, while the host shows the dashboard in place of its terminal
+ * (`omp stats` in Tern), where the page is the only way out: the button, Esc,
+ * or Ctrl+C with nothing selected, as in the terminal it covers. Renders
+ * nothing anywhere else.
+ */
+export declare function CloseButton(): import("react").JSX.Element | null;

package/dist/types/client/app/keys.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Guards for the dashboard's page-wide keys (`Shell`'s shortcuts,
+ * `CloseButton`'s Esc and Ctrl+C): they stay out of fields being typed
+ * in and out of open dialogs, which own their keys.
+ */
+/** Whether `target` takes typing (a field, a select, editable content). */
+export declare function isTypingTarget(target: EventTarget | null): boolean;
+/** Whether a modal dialog or drawer is open. */
+export declare function isDialogOpen(): boolean;

package/dist/types/index.d.ts

@@ -4,7 +4,7 @@ export { closeDb } from "./db.js";
 export { refreshRollups } from "./rollup.js";
 export type { StatsJudge, StatsJudgeProvider } from "./frustration.js";
 export { getGainDashboardStats } from "./gain-aggregator.js";
-export { formatStatsDashboardUrl, type StartServerOptions, startServer } from "./server.js";
+export { formatStatsDashboardUrl, type StartServerOptions, setStatsCloseHandler, startServer } from "./server.js";
 export type { GainDashboardStats, GainSource, GainSourceTotals, GainTimeSeriesPoint } from "./shared-types.js";
 export type { AggregatedStats, DashboardStats, FolderStats, MessageStats, ModelPerformancePoint, ModelStats, ModelTimeSeriesPoint, TimeSeriesPoint, ToolDashboardStats, ToolModelStats, ToolTimeSeriesPoint, ToolUsageStats, } from "./types.js";
 /**

package/dist/types/server.d.ts

@@ -1,4 +1,11 @@
 import { type StatsJudgeProvider } from "./frustration.js";
+/**
+ * Let the page close the dashboard: while `close` is set, it shows a Close
+ * button (and takes Esc and Ctrl+C) that calls it. `omp stats` sets it while
+ * Tern shows the page in place of the block it runs in, where the page has no
+ * way out of its own; `undefined` takes Close away again.
+ */
+export declare function setStatsCloseHandler(close: (() => void) | undefined): void;
 /**
  * Handle API requests.
  */

package/package.json

@@ -1,7 +1,7 @@
 {
 	"type": "module",
 	"name": "@oh-my-pi/omp-stats",
-	"version": "18.14.1",
+	"version": "18.15.0",
 	"description": "Local observability dashboard for omp AI usage statistics",
 	"homepage": "https://omp.sh",
 	"author": {
@@ -42,9 +42,9 @@
 		"fmt": "oxfmt --no-error-on-unmatched-pattern 'src/**/*.{ts,tsx}' '{test,bench,examples,scripts}/**/*.ts' '*.ts'"
 	},
 	"dependencies": {
-		"@oh-my-pi/pi-ai": "18.14.1",
-		"@oh-my-pi/pi-catalog": "18.14.1",
-		"@oh-my-pi/pi-utils": "18.14.1",
+		"@oh-my-pi/pi-ai": "18.15.0",
+		"@oh-my-pi/pi-catalog": "18.15.0",
+		"@oh-my-pi/pi-utils": "18.15.0",
 		"lucide-react": "^1.24.0",
 		"react": "19.2.7",
 		"react-dom": "19.2.7"
@@ -89,10 +89,6 @@
 			"types": "./dist/types/client/*.d.ts",
 			"import": "./src/client/*.ts"
 		},
-		"./client/components/*": {
-			"types": "./dist/types/client/components/*.d.ts",
-			"import": "./src/client/components/*.ts"
-		},
 		"./*.js": "./src/*.ts"
 	}
 }

package/src/client/api.ts

@@ -121,6 +121,19 @@ export async function getRequestDetails(id: number, signal?: AbortSignal): Promi
 	return fetchJson<RequestDetails>(`${API_BASE}/request/${id}`, { signal });
 }
 
+/** Whether the page may close the dashboard (`omp stats` shown in place of a Tern block). */
+export async function getClosable(signal?: AbortSignal): Promise<boolean> {
+	const { closable } = await fetchJson<{ closable: boolean }>(`${API_BASE}/close`, { signal });
+	return closable;
+}
+
+/** Close the dashboard: its host takes the page away and stops serving it. */
+export async function closeDashboard(): Promise<void> {
+	const endpoint = `${API_BASE}/close`;
+	const res = await fetch(endpoint, { method: "POST", headers: ACTION_HEADERS });
+	if (!res.ok) throw new ApiError(res.status, endpoint, await readErrorMessage(res, endpoint));
+}
+
 /** Ask the server to start a background sync; progress arrives on the `/api/events` stream. */
 export async function requestSync(): Promise<LiveStatus> {
 	return fetchJson<LiveStatus>(`${API_BASE}/sync`, { method: "POST" });

package/src/client/app/CloseButton.tsx

@@ -0,0 +1,56 @@
+import { X } from "lucide-react";
+import { useEffect, useState } from "react";
+import { closeDashboard, getClosable } from "../api";
+import { isDialogOpen, isTypingTarget } from "./keys";
+
+/**
+ * Close, while the host shows the dashboard in place of its terminal
+ * (`omp stats` in Tern), where the page is the only way out: the button, Esc,
+ * or Ctrl+C with nothing selected, as in the terminal it covers. Renders
+ * nothing anywhere else.
+ */
+export function CloseButton() {
+	const closable = useClosable();
+
+	useEffect(() => {
+		if (!closable) return;
+		const onKey = (e: KeyboardEvent) => {
+			if (!isCloseKey(e)) return;
+			e.preventDefault();
+			close();
+		};
+		window.addEventListener("keydown", onKey);
+		return () => window.removeEventListener("keydown", onKey);
+	}, [closable]);
+
+	if (!closable) return null;
+	return (
+		<button type="button" className="btn" data-variant="ghost" onClick={close} title="Close the dashboard (Esc)">
+			<X size={15} />
+			Close
+			<span className="kbd">Esc</span>
+		</button>
+	);
+}
+
+function close(): void {
+	closeDashboard().catch(error => console.error("Closing the dashboard failed", error));
+}
+
+function useClosable(): boolean {
+	const [closable, setClosable] = useState(false);
+	useEffect(() => {
+		const abort = new AbortController();
+		getClosable(abort.signal).then(setClosable, () => {});
+		return () => abort.abort();
+	}, []);
+	return closable;
+}
+
+/** Esc, or Ctrl+C with no text selected (with a selection it copies), outside fields and dialogs. */
+function isCloseKey(e: KeyboardEvent): boolean {
+	if (e.defaultPrevented || e.altKey || e.metaKey || e.shiftKey) return false;
+	if (isTypingTarget(e.target) || isDialogOpen()) return false;
+	if (e.key === "Escape") return !e.ctrlKey;
+	return e.ctrlKey && e.key.toLowerCase() === "c" && !window.getSelection()?.toString();
+}

package/src/client/app/Shell.tsx

@@ -4,6 +4,8 @@ import { rangeMeta, TIME_RANGES } from "../data/range";
 import { useLiveStatus } from "../data/live";
 import type { TimeRange } from "../types";
 import { Segmented } from "../ui";
+import { CloseButton } from "./CloseButton";
+import { isDialogOpen, isTypingTarget } from "./keys";
 import { LiveChip } from "./LiveChip";
 import { type DashboardSection, NAV } from "./nav";
 import { ThemeToggle } from "./ThemeToggle";
@@ -77,6 +79,7 @@ export function Shell({ section, onSectionChange, range, onRangeChange, children
 					</span>
 					<Segmented options={RANGE_OPTIONS} value={range} onChange={onRangeChange} aria-label="Time range" />
 					<ThemeToggle />
+					<CloseButton />
 				</div>
 				{progress !== undefined && (
 					<div className="topbar-progress">
@@ -143,17 +146,7 @@ function useShortcuts(onSection: (section: DashboardSection) => void, onRange: (
 		let pendingG = 0;
 		const onKey = (e: KeyboardEvent) => {
 			if (e.metaKey || e.ctrlKey || e.altKey || e.defaultPrevented) return;
-			const target = e.target;
-			if (
-				target instanceof HTMLElement &&
-				(target.isContentEditable ||
-					target.tagName === "INPUT" ||
-					target.tagName === "TEXTAREA" ||
-					target.tagName === "SELECT")
-			) {
-				return;
-			}
-			if (document.querySelector('[aria-modal="true"]')) return;
+			if (isTypingTarget(e.target) || isDialogOpen()) return;
 			const key = e.key.toLowerCase();
 			if (pendingG && Date.now() - pendingG < 1200) {
 				pendingG = 0;

package/src/client/app/keys.ts

@@ -0,0 +1,21 @@
+/**
+ * Guards for the dashboard's page-wide keys (`Shell`'s shortcuts,
+ * `CloseButton`'s Esc and Ctrl+C): they stay out of fields being typed
+ * in and out of open dialogs, which own their keys.
+ */
+
+/** Whether `target` takes typing (a field, a select, editable content). */
+export function isTypingTarget(target: EventTarget | null): boolean {
+	return (
+		target instanceof HTMLElement &&
+		(target.isContentEditable ||
+			target.tagName === "INPUT" ||
+			target.tagName === "TEXTAREA" ||
+			target.tagName === "SELECT")
+	);
+}
+
+/** Whether a modal dialog or drawer is open. */
+export function isDialogOpen(): boolean {
+	return document.querySelector('[aria-modal="true"]') !== null;
+}

package/src/client/react-css.d.ts

@@ -0,0 +1,8 @@
+import "react";
+
+declare module "react" {
+	/** Custom properties (`--arm`, `--i` …) in `style` objects, which React passes through to the element. */
+	interface CSSProperties {
+		[property: `--${string}`]: string | number | undefined;
+	}
+}

package/src/client/traces/TranscriptList.tsx

@@ -103,7 +103,7 @@ export const TranscriptList = memo(function TranscriptList({
 						const chipText = row.span?.kind ?? row.marker?.kind ?? "";
 						const rowContent = (
 							<>
-								<span className="traces-kind" style={{ "--traces-kind-color": color } as React.CSSProperties}>
+								<span className="traces-kind" style={{ "--traces-kind-color": color }}>
 									{chipText}
 								</span>
 								{row.depth > 0 && (

package/src/client/ui/Card.tsx

@@ -1,4 +1,4 @@
-import type { CSSProperties, ReactNode } from "react";
+import type { ReactNode } from "react";
 
 export interface CardProps {
 	title?: ReactNode;
@@ -22,7 +22,7 @@ export function Card({ title, description, actions, flush, footer, className, in
 	return (
 		<section
 			className={className ? `card rise ${className}` : "card rise"}
-			style={index !== undefined ? ({ "--i": index } as CSSProperties) : undefined}
+			style={index !== undefined ? { "--i": index } : undefined}
 		>
 			{hasHeader && (
 				<header className="card-header">

package/src/client/ui/Drawer.tsx

@@ -1,5 +1,5 @@
 import { X } from "lucide-react";
-import { type CSSProperties, type ReactNode, useEffect, useRef } from "react";
+import { type ReactNode, useEffect, useRef } from "react";
 import { createPortal } from "react-dom";
 
 export interface DrawerProps {
@@ -50,7 +50,7 @@ export function Drawer({ open, onClose, title, subtitle, actions, width, childre
 				role="dialog"
 				aria-modal="true"
 				tabIndex={-1}
-				style={width !== undefined ? ({ "--drawer-w": `${width}px` } as CSSProperties) : undefined}
+				style={width !== undefined ? { "--drawer-w": `${width}px` } : undefined}
 			>
 				<header className="drawer-header">
 					<div className="drawer-titles">

package/src/client/ui/Stat.tsx

@@ -1,4 +1,4 @@
-import { type CSSProperties, type ReactNode, useEffect, useRef, useState } from "react";
+import { type ReactNode, useEffect, useRef, useState } from "react";
 import { Sparkline } from "../charts/Sparkline";
 
 export interface StatDelta {
@@ -58,10 +58,7 @@ export interface StatGridProps {
 /** Tiles sharing one card, separated by hairlines. */
 export function StatGrid({ min, children }: StatGridProps) {
 	return (
-		<div
-			className="stat-grid rise"
-			style={min !== undefined ? ({ "--stat-min": `${min}px` } as CSSProperties) : undefined}
-		>
+		<div className="stat-grid rise" style={min !== undefined ? { "--stat-min": `${min}px` } : undefined}>
 			{children}
 		</div>
 	);

package/src/db.ts

@@ -100,7 +100,8 @@ const FORK_DEDUPE_KEY = "fork_dedupe_v1";
 // v2: tool-name sanitization at ingest (see `sanitizeToolName` in parser.ts)
 // collapses provider-side garbage names; a full re-parse replaces the polluted
 // rows already stored in existing databases.
-const TOOL_CALLS_BACKFILL_KEY = "tool_calls_v2";
+// v3: reclassify synthetic non-executions so historical tool error rates are corrected.
+const TOOL_CALLS_BACKFILL_KEY = "tool_calls_v3";
 // Older ingests dropped `Usage.orchestration` (never a stored column) when
 // pricing, so subscription models billed on orchestration tokens — multi-agent
 // Grok most notably — were priced from conversation buckets alone and could not

package/src/index.ts

@@ -22,7 +22,7 @@ export { closeDb } from "./db";
 export { refreshRollups } from "./rollup";
 export type { StatsJudge, StatsJudgeProvider } from "./frustration";
 export { getGainDashboardStats } from "./gain-aggregator";
-export { formatStatsDashboardUrl, type StartServerOptions, startServer } from "./server";
+export { formatStatsDashboardUrl, type StartServerOptions, setStatsCloseHandler, startServer } from "./server";
 export type { GainDashboardStats, GainSource, GainSourceTotals, GainTimeSeriesPoint } from "./shared-types";
 export type {
 	AggregatedStats,

package/src/parser.ts

@@ -416,6 +416,13 @@ function sanitizeToolName(name: string): string | null {
 	return candidate.length > 0 ? candidate : null;
 }
 
+/** A call the agent loop skipped carries a synthetic `executed: false` result: it never ran, so it is no tool error. */
+function isToolExecutionError(message: { isError?: unknown; details?: unknown }): boolean {
+	if (message.isError !== true) return false;
+	const details = message.details as { __synthetic?: unknown; executed?: unknown } | null | undefined;
+	return !(details?.__synthetic === true && details.executed === false);
+}
+
 /**
  * Build the result linkage for a `toolResult` entry: text characters fed back
  * into context plus the error flag, keyed to the originating call.
@@ -435,7 +442,7 @@ function extractToolResultLink(sessionFile: string, entry: SessionMessageEntry):
 		sessionFile,
 		toolCallId: msg.toolCallId,
 		resultChars,
-		isError: msg.isError === true,
+		isError: isToolExecutionError(msg),
 	};
 }
 

package/src/server.ts

@@ -163,6 +163,19 @@ const ensureClientBuild = async () => {
  */
 const STATS_ACTION_HEADER = "X-Omp-Stats-Action";
 
+/** What the page's Close calls; unset, the page offers none. */
+let closeHandler: (() => void) | undefined;
+
+/**
+ * Let the page close the dashboard: while `close` is set, it shows a Close
+ * button (and takes Esc and Ctrl+C) that calls it. `omp stats` sets it while
+ * Tern shows the page in place of the block it runs in, where the page has no
+ * way out of its own; `undefined` takes Close away again.
+ */
+export function setStatsCloseHandler(close: (() => void) | undefined): void {
+	closeHandler = close;
+}
+
 /**
  * Handle API requests.
  */
@@ -268,6 +281,17 @@ export async function handleApi(req: Request): Promise<Response> {
 		return Response.json(details);
 	}
 
+	if (path === "/api/close") {
+		if (req.method === "GET") return Response.json({ closable: closeHandler !== undefined });
+		if (req.method !== "POST") return Response.json({ error: "GET or POST required" }, { status: 405 });
+		if (req.headers.get(STATS_ACTION_HEADER) !== "1") {
+			return Response.json({ error: `${STATS_ACTION_HEADER}: 1 header required` }, { status: 403 });
+		}
+		if (!closeHandler) return Response.json({ error: "this dashboard is not closed from its page" }, { status: 404 });
+		closeHandler();
+		return new Response(null, { status: 202 });
+	}
+
 	if (path === "/api/sync") {
 		if (req.method !== "POST") return Response.json({ error: "POST required" }, { status: 405 });
 		statsLive().requestSync();