pi-free 1.0.0

package/usage/tracking.ts

@@ -0,0 +1,329 @@
+/**
+ * Usage tracking - runtime session and model-level tracking
+ */
+
+import { createLogger } from "../lib/logger.ts";
+import { persistUsage } from "./cumulative.ts";
+import { incrementRequestCount } from "./metrics.ts";
+
+const logger = createLogger("usage:tracking");
+
+export interface ModelUsageEntry {
+	count: number;
+	tokensIn: number;
+	tokensOut: number;
+	cacheRead: number;
+	cacheWrite: number;
+	cost: number;
+	lastUsed: number;
+}
+
+interface SessionStats {
+	startTime: number;
+	providers: Map<
+		string,
+		{
+			requests: number;
+			tokensIn: number;
+			tokensOut: number;
+			models: Map<string, ModelUsageEntry>;
+		}
+	>;
+}
+
+// Runtime tracking state
+const modelUsageCounts = new Map<string, ModelUsageEntry>();
+const sessionStats: SessionStats = {
+	startTime: Date.now(),
+	providers: new Map(),
+};
+
+export function resetUsageStats(): void {
+	modelUsageCounts.clear();
+	sessionStats.startTime = Date.now();
+	sessionStats.providers.clear();
+}
+
+export function incrementModelRequestCount(
+	provider: string,
+	modelId: string,
+	tokensIn = 0,
+	tokensOut = 0,
+	cacheRead = 0,
+	cacheWrite = 0,
+	cost = 0,
+): void {
+	const key = `${provider}/${modelId}`;
+	const existing = modelUsageCounts.get(key);
+
+	if (existing) {
+		existing.count++;
+		existing.tokensIn += tokensIn;
+		existing.tokensOut += tokensOut;
+		existing.cacheRead += cacheRead;
+		existing.cacheWrite += cacheWrite;
+		existing.cost += cost;
+		existing.lastUsed = Date.now();
+	} else {
+		modelUsageCounts.set(key, {
+			count: 1,
+			tokensIn,
+			tokensOut,
+			cacheRead,
+			cacheWrite,
+			cost,
+			lastUsed: Date.now(),
+		});
+	}
+
+	incrementRequestCount(provider);
+
+	// Track in session stats
+	let providerStats = sessionStats.providers.get(provider);
+	if (!providerStats) {
+		providerStats = {
+			requests: 0,
+			tokensIn: 0,
+			tokensOut: 0,
+			models: new Map(),
+		};
+		sessionStats.providers.set(provider, providerStats);
+	}
+	providerStats.requests++;
+	providerStats.tokensIn += tokensIn;
+	providerStats.tokensOut += tokensOut;
+
+	const modelStats = providerStats.models.get(modelId);
+	if (modelStats) {
+		modelStats.count++;
+		modelStats.tokensIn += tokensIn;
+		modelStats.tokensOut += tokensOut;
+		modelStats.lastUsed = Date.now();
+	} else {
+		providerStats.models.set(modelId, {
+			count: 1,
+			tokensIn,
+			tokensOut,
+			cacheRead: 0,
+			cacheWrite: 0,
+			cost: 0,
+			lastUsed: Date.now(),
+		});
+	}
+
+	// Persist to disk
+	persistUsage(
+		provider,
+		modelId,
+		tokensIn,
+		tokensOut,
+		cacheRead,
+		cacheWrite,
+		cost,
+	);
+}
+
+export function getModelUsage(
+	provider: string,
+	modelId: string,
+): ModelUsageEntry | undefined {
+	return modelUsageCounts.get(`${provider}/${modelId}`);
+}
+
+export function getProviderModelUsage(provider: string): Array<{
+	modelId: string;
+	count: number;
+	tokensIn: number;
+	tokensOut: number;
+	lastUsed: number;
+}> {
+	const results: Array<{
+		modelId: string;
+		count: number;
+		tokensIn: number;
+		tokensOut: number;
+		lastUsed: number;
+	}> = [];
+	const prefix = `${provider}/`;
+
+	for (const [key, entry] of modelUsageCounts.entries()) {
+		if (key.startsWith(prefix)) {
+			results.push({
+				modelId: key.slice(prefix.length),
+				count: entry.count,
+				tokensIn: entry.tokensIn,
+				tokensOut: entry.tokensOut,
+				lastUsed: entry.lastUsed,
+			});
+		}
+	}
+
+	return results.sort((a, b) => b.count - a.count);
+}
+
+export function getTopModels(n = 10): Array<{
+	provider: string;
+	modelId: string;
+	count: number;
+	tokensIn: number;
+	tokensOut: number;
+}> {
+	const all: Array<{
+		provider: string;
+		modelId: string;
+		count: number;
+		tokensIn: number;
+		tokensOut: number;
+	}> = [];
+
+	for (const [key, entry] of modelUsageCounts.entries()) {
+		const slashIndex = key.indexOf("/");
+		const provider = key.slice(0, slashIndex);
+		const modelId = key.slice(slashIndex + 1);
+		all.push({
+			provider,
+			modelId,
+			count: entry.count,
+			tokensIn: entry.tokensIn,
+			tokensOut: entry.tokensOut,
+		});
+	}
+
+	return all.sort((a, b) => b.count - a.count).slice(0, n);
+}
+
+export function logModelUsageReport(provider?: string): void {
+	if (provider) {
+		const models = getProviderModelUsage(provider);
+		const total = models.reduce((sum, m) => sum + m.count, 0);
+		const totalTokensIn = models.reduce((sum, m) => sum + m.tokensIn, 0);
+		const totalTokensOut = models.reduce((sum, m) => sum + m.tokensOut, 0);
+
+		logger.info(`${provider} usage summary: ${total} total requests`, {
+			total,
+			tokensInK: Math.round(totalTokensIn / 1000),
+			tokensOutK: Math.round(totalTokensOut / 1000),
+		});
+		for (const m of models.slice(0, 5)) {
+			logger.debug(`${m.modelId} stats: ${m.count} requests`, {
+				modelId: m.modelId,
+				count: m.count,
+				tokensInK: Math.round(m.tokensIn / 1000),
+			});
+		}
+	} else {
+		logger.info("Top 10 models across all providers");
+		for (const m of getTopModels(10)) {
+			logger.debug(`${m.provider}/${m.modelId}: ${m.count} requests`, {
+				provider: m.provider,
+				modelId: m.modelId,
+				count: m.count,
+				tokensInK: Math.round(m.tokensIn / 1000),
+			});
+		}
+	}
+}
+
+export interface SessionUsageReport {
+	duration: number;
+	durationFormatted: string;
+	providers: Array<{
+		name: string;
+		requests: number;
+		tokensIn: number;
+		tokensOut: number;
+		cacheRead: number;
+		cacheWrite: number;
+		cost: number;
+		topModels: Array<{
+			modelId: string;
+			count: number;
+			tokensIn: number;
+			tokensOut: number;
+			cacheRead: number;
+			cacheWrite: number;
+			cost: number;
+		}>;
+	}>;
+	totalRequests: number;
+	totalTokensIn: number;
+	totalTokensOut: number;
+	totalCacheRead: number;
+	totalCacheWrite: number;
+	totalCost: number;
+}
+
+function formatDuration(ms: number): string {
+	const seconds = Math.floor(ms / 1000);
+	const minutes = Math.floor(seconds / 60);
+	const hours = Math.floor(minutes / 60);
+
+	if (hours > 0) return `${hours}h ${minutes % 60}m`;
+	if (minutes > 0) return `${minutes}m ${seconds % 60}s`;
+	return `${seconds}s`;
+}
+
+export function getSessionUsage(): SessionUsageReport {
+	const now = Date.now();
+	const duration = now - sessionStats.startTime;
+
+	const providers: SessionUsageReport["providers"] = [];
+	let totalRequests = 0;
+	let totalTokensIn = 0;
+	let totalTokensOut = 0;
+	let totalCacheRead = 0;
+	let totalCacheWrite = 0;
+	let totalCost = 0;
+
+	for (const [providerName, stats] of sessionStats.providers) {
+		totalRequests += stats.requests;
+		totalTokensIn += stats.tokensIn;
+		totalTokensOut += stats.tokensOut;
+
+		const topModels = Array.from(stats.models.entries())
+			.map(([modelId, m]) => ({
+				modelId,
+				count: m.count,
+				tokensIn: m.tokensIn,
+				tokensOut: m.tokensOut,
+				cacheRead: m.cacheRead,
+				cacheWrite: m.cacheWrite,
+				cost: m.cost,
+			}))
+			.sort((a, b) => b.count - a.count)
+			.slice(0, 5);
+
+		// Sum cache and cost from models
+		const providerCacheRead = topModels.reduce((s, m) => s + m.cacheRead, 0);
+		const providerCacheWrite = topModels.reduce((s, m) => s + m.cacheWrite, 0);
+		const providerCost = topModels.reduce((s, m) => s + m.cost, 0);
+		totalCacheRead += providerCacheRead;
+		totalCacheWrite += providerCacheWrite;
+		totalCost += providerCost;
+
+		providers.push({
+			name: providerName,
+			requests: stats.requests,
+			tokensIn: stats.tokensIn,
+			tokensOut: stats.tokensOut,
+			cacheRead: providerCacheRead,
+			cacheWrite: providerCacheWrite,
+			cost: providerCost,
+			topModels,
+		});
+	}
+
+	providers.sort((a, b) => b.requests - a.requests);
+
+	return {
+		duration,
+		durationFormatted: formatDuration(duration),
+		providers,
+		totalRequests,
+		totalTokensIn,
+		totalTokensOut,
+		totalCacheRead,
+		totalCacheWrite,
+		totalCost,
+	};
+}

package/usage/widget.ts

@@ -0,0 +1,90 @@
+/**
+ * Usage monitoring widget — floating glimpseui window showing per-provider
+ * free quota status, daily request counts, credit balances, and cumulative
+ * token usage across all sessions.
+ *
+ * Tracks ALL providers dynamically (including local/Ollama models).
+ * Launch with /usage command. Toggles on repeated invocation.
+ */
+
+import type { ExtensionAPI } from "@mariozechner/pi-coding-agent";
+import { collectRows, recordSessionRequest } from "../widget/data.ts";
+import { renderWidgetHTML } from "../widget/render.ts";
+import { recordTurn } from "./store.ts";
+
+const GLIMPSE_PATH =
+	"file:///C:/Users/R3LiC/AppData/Roaming/npm/node_modules/glimpseui/src/glimpse.mjs";
+
+let glimpseWin: unknown = null;
+
+export async function openUsageWidget(): Promise<void> {
+	const { open } = await import(GLIMPSE_PATH);
+	glimpseWin = open(renderWidgetHTML(collectRows()), {
+		width: 340,
+		height: 400,
+		title: "Pi Free Usage",
+		frameless: true,
+		transparent: true,
+		floating: true,
+		x: 20,
+		y: 20,
+	});
+	(glimpseWin as any).on("closed", () => {
+		glimpseWin = null;
+	});
+}
+
+export function updateWidget(): void {
+	if (!glimpseWin) return;
+	try {
+		(glimpseWin as any).setHTML(renderWidgetHTML(collectRows()));
+	} catch {
+		glimpseWin = null;
+	}
+}
+
+export function closeWidget(): void {
+	if (glimpseWin) {
+		(glimpseWin as any).close();
+		glimpseWin = null;
+	}
+}
+
+export function registerUsageWidget(pi: ExtensionAPI): void {
+	pi.registerCommand("usage", {
+		description: "Toggle free model usage dashboard",
+		handler: async (_args, ctx) => {
+			if (glimpseWin) {
+				closeWidget();
+				return;
+			}
+			try {
+				await openUsageWidget();
+			} catch {
+				ctx.ui.notify(
+					"Failed to open usage widget (glimpseui required)",
+					"warning",
+				);
+			}
+		},
+	});
+
+	// Track tokens for ANY provider (including local, custom, etc.)
+	// and refresh the widget
+	pi.on("turn_end", async (_event, ctx) => {
+		const msg = _event.message;
+		const provider = ctx.model?.provider;
+		if (msg.role === "assistant" && provider) {
+			// Record cumulative usage for this provider
+			recordTurn(
+				provider,
+				msg.usage.input,
+				msg.usage.output,
+				msg.usage.cost.total,
+			);
+			// Track session requests for providers not handled by provider-helper
+			recordSessionRequest(provider);
+		}
+		updateWidget();
+	});
+}

package/vitest.config.ts

@@ -0,0 +1,20 @@
+import { defineConfig } from "vitest/config";
+
+export default defineConfig({
+	test: {
+		globals: true,
+		environment: "node",
+		include: ["**/*.test.ts"],
+		exclude: ["node_modules", ".pi-lens"],
+		coverage: {
+			provider: "v8",
+			reporter: ["text", "json", "html"],
+			exclude: ["node_modules/", ".pi-lens/", "**/*.d.ts", "**/*.test.ts"],
+		},
+	},
+	resolve: {
+		alias: {
+			"@": ".",
+		},
+	},
+});

package/widget/data.ts

@@ -0,0 +1,113 @@
+/**
+ * Widget data collection - aggregates metrics from all sources
+ */
+
+import {
+	PROVIDER_CLINE,
+	PROVIDER_KILO,
+	PROVIDER_NVIDIA,
+	PROVIDER_OPENROUTER,
+	PROVIDER_ZEN,
+} from "../constants.ts";
+import {
+	getCachedMetrics,
+	getDailyRequestCount,
+	getRequestCount,
+} from "../usage/metrics.ts";
+import { getAllCumulativeUsage } from "../usage/store.ts";
+
+export interface ProviderRow {
+	provider: string;
+	key: string;
+	icon: string;
+	sessionReqs: number;
+	dailyReqs: number;
+	dailyLimit?: number;
+	hourlyLimit?: number;
+	remainingToday?: number;
+	totalTokensIn: number;
+	totalTokensOut: number;
+	totalRequests: number;
+	costEquivalent: number;
+	firstUsed?: string;
+	credits?: number;
+	creditsLabel?: string;
+}
+
+const KNOWN_PROVIDERS: Record<string, { icon: string; label: string }> = {
+	[PROVIDER_KILO]: { icon: "🔥", label: "Kilo" },
+	[PROVIDER_OPENROUTER]: { icon: "🔀", label: "OpenRouter" },
+	[PROVIDER_ZEN]: { icon: "✦", label: "Zen" },
+	[PROVIDER_NVIDIA]: { icon: "⚡", label: "NVIDIA" },
+	[PROVIDER_CLINE]: { icon: "🤖", label: "Cline" },
+	local: { icon: "💻", label: "Local" },
+};
+
+// Session-level request tracking for non-extension providers
+const sessionRequestCounts = new Map<string, number>();
+
+export function recordSessionRequest(provider: string): void {
+	const current = sessionRequestCounts.get(provider) ?? 0;
+	sessionRequestCounts.set(provider, current + 1);
+}
+
+export function collectRows(): ProviderRow[] {
+	const cumulative = getAllCumulativeUsage();
+	const orMetrics = getCachedMetrics(PROVIDER_OPENROUTER);
+	const kiloMetrics = getCachedMetrics(PROVIDER_KILO);
+
+	// Discover all providers: known ones + any from cumulative store
+	const allKeys = new Set<string>(Object.keys(KNOWN_PROVIDERS));
+	for (const key of Object.keys(cumulative)) {
+		allKeys.add(key);
+	}
+
+	const rows: ProviderRow[] = [];
+
+	for (const key of allKeys) {
+		const meta = KNOWN_PROVIDERS[key];
+		const c = cumulative[key];
+		const sessionReqs =
+			getRequestCount(key) || sessionRequestCounts.get(key) || 0;
+
+		const row: ProviderRow = {
+			provider: meta?.label ?? key,
+			key,
+			icon: meta?.icon ?? "📦",
+			sessionReqs,
+			dailyReqs: getDailyRequestCount(key) || 0,
+			totalTokensIn: c?.tokensIn ?? 0,
+			totalTokensOut: c?.tokensOut ?? 0,
+			totalRequests: c?.requests ?? 0,
+			costEquivalent: c?.costEquivalent ?? 0,
+			firstUsed: c?.firstUsed,
+		};
+
+		// Provider-specific known limits
+		if (key === PROVIDER_OPENROUTER) {
+			row.dailyLimit = orMetrics?.rateLimit?.requestsPerDay;
+			row.remainingToday = orMetrics?.rateLimit?.remainingToday;
+			row.credits = orMetrics?.credits;
+			row.creditsLabel = "credits";
+		} else if (key === PROVIDER_KILO) {
+			row.hourlyLimit = 200;
+			row.credits = kiloMetrics?.balance;
+			row.creditsLabel = "balance";
+		}
+
+		rows.push(row);
+	}
+
+	// Sort: known providers first (in order), then unknown, then inactive
+	const order = Object.keys(KNOWN_PROVIDERS);
+	rows.sort((a, b) => {
+		const ai = order.indexOf(a.key);
+		const bi = order.indexOf(b.key);
+		const aOrder = ai >= 0 ? ai : 100;
+		const bOrder = bi >= 0 ? bi : 100;
+		if (aOrder !== bOrder) return aOrder - bOrder;
+		return b.sessionReqs + b.totalRequests - (a.sessionReqs + a.totalRequests);
+	});
+
+	return rows;
+}

package/widget/format.ts

@@ -0,0 +1,26 @@
+/**
+ * Widget formatting utilities
+ */
+
+export function formatTokens(n: number): string {
+	if (n < 1000) return n.toString();
+	if (n < 1_000_000) return `${(n / 1000).toFixed(1)}k`;
+	if (n < 1_000_000_000) return `${(n / 1_000_000).toFixed(1)}M`;
+	return `${(n / 1_000_000_000).toFixed(1)}B`;
+}
+
+export function formatCost(n: number): string {
+	if (n < 0.01) return `$${n.toFixed(4)}`;
+	if (n < 1) return `$${n.toFixed(3)}`;
+	return `$${n.toFixed(2)}`;
+}
+
+export function relativeTime(isoDate: string): string {
+	const diff = Date.now() - new Date(isoDate).getTime();
+	const days = Math.floor(diff / 86_400_000);
+	if (days === 0) return "today";
+	if (days === 1) return "yesterday";
+	if (days < 30) return `${days}d ago`;
+	const months = Math.floor(days / 30);
+	return `${months}mo ago`;
+}

package/widget/render.ts

@@ -0,0 +1,117 @@
+/**
+ * Widget HTML rendering
+ */
+
+import type { ProviderRow } from "./data.ts";
+import { formatCost, formatTokens, relativeTime } from "./format.ts";
+
+export function renderWidgetHTML(rows: ProviderRow[]): string {
+	let totalTokens = 0,
+		totalReqs = 0,
+		totalCost = 0;
+	for (const r of rows) {
+		totalTokens += r.totalTokensIn + r.totalTokensOut;
+		totalReqs += r.totalRequests;
+		totalCost += r.costEquivalent;
+	}
+
+	const summaryHTML =
+		totalReqs > 0
+			? `
+  <div style="background: rgba(255,255,255,0.04); border-radius: 8px; padding: 10px 12px; margin-bottom: 12px;">
+    <div style="display: flex; justify-content: space-between; font-size: 13px; font-weight: 500;">
+      <span>Total free value</span>
+      <span style="color: #48bb78;">${formatCost(totalCost)} saved</span>
+    </div>
+    <div style="font-size: 11px; color: #888; margin-top: 3px;">
+      ${formatTokens(totalTokens)} tokens · ${totalReqs} requests
+    </div>
+  </div>`
+			: "";
+
+	const providerRows = rows.map((r) => renderProviderRow(r)).join("\n");
+
+	return `<!DOCTYPE html>
+<html><head><meta charset="UTF-8">
+<style>
+  * { margin: 0; padding: 0; box-sizing: border-box; }
+  body {
+    font-family: system-ui, -apple-system, sans-serif;
+    background: rgba(24, 24, 30, 0.95);
+    color: #e0e0e0; padding: 14px 16px;
+    min-height: 100vh; backdrop-filter: blur(20px);
+  }
+  .header { font-size: 12px; color: #666; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 10px; }
+</style></head>
+<body>
+  <div class="header">Free Usage</div>
+  ${summaryHTML}
+  ${providerRows}
+  <div style="font-size: 10px; color: #555; margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(255,255,255,0.05);">
+    Each gateway has independent quotas — using multiple providers multiplies capacity.
+  </div>
+</body></html>`;
+}
+
+function renderProviderRow(r: ProviderRow): string {
+	const hasActivity = r.sessionReqs > 0 || r.totalRequests > 0;
+	const quotaBar = renderQuotaBar(r);
+	const infoHTML = renderInfoLine(r);
+
+	return `
+      <div style="padding: 7px 0; ${hasActivity ? "" : "opacity: 0.3;"}">
+        <div style="display: flex; justify-content: space-between; align-items: center;">
+          <span style="font-weight: 500; font-size: 13px;">${r.icon} ${r.provider}</span>
+          <span style="font-size: 10px; color: #888;">${r.sessionReqs} this session</span>
+        </div>
+        ${infoHTML}
+        ${quotaBar}
+      </div>`;
+}
+
+function renderQuotaBar(r: ProviderRow): string {
+	if (!r.dailyLimit || r.dailyLimit <= 0) return "";
+
+	const pct = Math.min(100, Math.round((r.dailyReqs / r.dailyLimit) * 100));
+	const color = pct > 80 ? "#e53e3e" : pct > 50 ? "#ecc94b" : "#48bb78";
+
+	return `
+        <div style="display: flex; align-items: center; gap: 8px; margin-top: 3px;">
+          <div style="flex: 1; height: 4px; background: rgba(255,255,255,0.08); border-radius: 2px; overflow: hidden;">
+            <div style="width: ${pct}%; height: 100%; background: ${color}; border-radius: 2px;"></div>
+          </div>
+          <span style="font-size: 10px; color: #666;">${r.dailyReqs}/${r.dailyLimit}</span>
+        </div>`;
+}
+
+function renderInfoLine(r: ProviderRow): string {
+	const infoParts: string[] = [];
+
+	if (r.totalRequests > 0) {
+		infoParts.push(
+			`${formatTokens(r.totalTokensIn + r.totalTokensOut)} tok · ${r.totalRequests} reqs`,
+		);
+		if (r.costEquivalent > 0) {
+			infoParts.push(`≈${formatCost(r.costEquivalent)}`);
+		}
+		if (r.firstUsed) {
+			infoParts.push(`since ${relativeTime(r.firstUsed)}`);
+		}
+	}
+	if (r.remainingToday !== undefined) {
+		infoParts.push(`${r.remainingToday} left today`);
+	}
+	if (r.hourlyLimit) {
+		infoParts.push(`${r.hourlyLimit}/hr limit`);
+	}
+	if (r.credits !== undefined) {
+		infoParts.push(`💰 ${formatCost(r.credits)}`);
+	}
+	if (r.key === "local" && r.totalRequests > 0) {
+		infoParts.push("always free");
+	}
+
+	if (infoParts.length === 0) return "";
+
+	return `<div style="font-size: 10px; color: #777; margin-top: 2px;">${infoParts.join(" · ")}</div>`;
+}