agy-mcp-bridge 0.1.13 → 0.1.15

package/README.md

@@ -407,6 +407,14 @@ Lưu ý bảo mật: nội dung yêu cầu và phản hồi được hiển th
 - **Chưa biết:** nội dung chi tiết bên trong `step_update` (chỉ biết tên các khóa ngoài cùng: `event`, `step_update`), nên phần tóm tắt chọn các trường dễ hiểu (`title`, `type`, `status`, `tool`, `message`, `path`...) nếu có, nếu không thì hiện tên các trường. Cũng chưa kiểm chứng kết quả cuối ở chế độ này có cùng dạng với chế độ JSON (`status`, `response`, `num_turns`). Nếu không giống, task báo lỗi kèm tên các trường của `result` (chỉ tên, không có giá trị) và cách quay về chế độ JSON: tắt tùy chọn này.
 - Muốn bridge biết chính xác hình dạng bên trong các sự kiện, chạy lại `agy-mcp-bridge probe-stream` ở bản mới: nó in thêm tên và kiểu của các trường bên trong (không in giá trị).
 
+**Theo dõi mức sử dụng (tab "Sử dụng"):** kết quả JSON của `agy` có các trường `conversation_id`, `duration_seconds`, `num_turns`, `response`, `status` và `usage`. Bridge ghi lại, cho mỗi task đã chạy xong, thời gian chạy, thời gian `agy` báo, số lượt, số bước (khi bật tiến độ) và **mọi giá trị số trong `usage`** (giữ nguyên tên trường, trường lồng nhau nối bằng dấu chấm, ví dụ `cache.read_tokens`). Tab "Sử dụng" hiện tổng task (theo trạng thái), tổng thời gian, usage cộng dồn, biểu đồ 14 ngày (theo múi giờ của trình duyệt), bảng theo model và theo mức suy luận, và các task gần nhất; chi tiết mỗi task có dòng "Usage (agy báo)". Dữ liệu nằm ở `.bridge-state/usage.jsonl` (mỗi task một dòng, giữ qua các lần khởi động lại, tự cắt bớt khi file quá 1 MB, không ghi đường dẫn hay nội dung task) và `stats` trong bản ghi task.
+
+**Mức token (đèn cảnh báo):** Cài đặt → "Mức token" cho đặt hai mức, mặc định **không giới hạn**: mỗi task và mỗi ngày (theo giờ máy của bạn). Danh sách task hiện số token (`total_tokens` agy báo, hoặc input + output nếu không có) và đánh dấu "vượt mức" task nào quá mức; thẻ "Token hôm nay" ở trang Task đổi sang "Vượt mức" khi tổng ngày chạm mức. Đây **chỉ là đèn báo, không phải hạn mức thật và không dừng task**: `agy` không có lệnh nào cho bridge đọc hạn mức, và token của một task chỉ biết khi nó kết thúc. Mức lưu ở `.bridge-state/budget.json`, đổi không cần khởi động lại.
+
+- **Đây là mức dùng qua bridge, không phải hạn mức.** `agy` không có lệnh xem hạn mức còn lại và bridge không bịa ra con số đó; xem hạn mức trên tài khoản Antigravity của bạn.
+- Bridge **không biết trước** các trường bên trong `usage` (tên trường do `agy` quyết định): nó cộng mọi giá trị số; một vài tên phổ biến (`input_tokens`, `output_tokens`, `total_tokens`...) được dịch nhãn. Task nào kết quả không có `usage` thì ghi nhận là "không có", không phải 0.
+- Chỉ thống kê task bắt đầu từ bản có tính năng này trở đi. Số liệu usage không được gửi cho Codex/Claude (không tốn token).
+
 **Biết Antigravity còn hoạt động, và gia hạn thay vì dừng giữa chừng (time out mềm):** ở chế độ `--print --output-format json`, `agy` không in gì cho đến khi xong, nên bridge không thể biết chắc nó đang "suy luận". Bridge chỉ nhìn được những dấu hiệu còn sống: byte mới ở output, và (khi bạn bật tính năng này) việc file log của `agy` được ghi thêm. Cài đặt → "Gia hạn khi Antigravity còn hoạt động" (mặc định **tắt**, áp dụng cho task mới) làm như sau:
 
 - Bridge yêu cầu `agy` ghi log vào `.bridge-state/agy-logs/<task_id>.log` (cờ `--log-file`) và cho `agy` giới hạn tuyệt đối làm print timeout của chính nó, thay vì hạn của task.

package/dist/src/budget.js

@@ -0,0 +1,66 @@
+import { readFileSync } from 'node:fs';
+import { mkdir, rename, rm, stat, writeFile } from 'node:fs/promises';
+import path from 'node:path';
+import { readUsage, totalTokens, USAGE_FILE } from './usage.js';
+/**
+ * Token budget: two limits the owner sets in the web UI, a warning light and nothing more. agy exposes no quota to read, and the token count of
+ * a task is only known when its result arrives, so the bridge cannot stop a task midway; it can show which finished tasks went over the per-task
+ * limit and whether today's total passed the daily limit. Read on every overview, so a change needs no restart.
+ */
+export const BUDGET_FILE = 'budget.json';
+export const MIN_BUDGET_TOKENS = 1000;
+export const MAX_BUDGET_TOKENS = 1_000_000_000;
+export const isBudgetTokens = (value) => typeof value === 'number' && Number.isInteger(value) && value >= MIN_BUDGET_TOKENS && value <= MAX_BUDGET_TOKENS;
+const valid = (value) => isBudgetTokens(value) ? value : null;
+/** Anything missing, unreadable or out of range means "no limit". */
+export function readBudget(stateDirectory) {
+    try {
+        const parsed = JSON.parse(readFileSync(path.join(stateDirectory, BUDGET_FILE), 'utf8'));
+        return { task_tokens: valid(parsed.task_tokens), day_tokens: valid(parsed.day_tokens) };
+    }
+    catch {
+        return { task_tokens: null, day_tokens: null };
+    }
+}
+export async function writeBudget(stateDirectory, value) {
+    const file = path.join(stateDirectory, BUDGET_FILE);
+    if (value.task_tokens === null && value.day_tokens === null) {
+        await rm(file, { force: true });
+        return;
+    }
+    for (const limit of [value.task_tokens, value.day_tokens])
+        if (limit !== null && !isBudgetTokens(limit))
+            throw new Error(`limits must be whole numbers from ${MIN_BUDGET_TOKENS} to ${MAX_BUDGET_TOKENS}, or null for no limit`);
+    await mkdir(stateDirectory, { recursive: true });
+    await writeFile(`${file}.tmp`, JSON.stringify(value) + '\n');
+    await rename(`${file}.tmp`, file);
+}
+/** Tokens used on the viewer's current local day (`tzOffsetMinutes` as `getTimezoneOffset()` returns it). */
+export function tokensToday(records, now, tzOffsetMinutes) {
+    const offsetMs = -tzOffsetMinutes * 60000;
+    const dayOf = (ms) => new Date(ms + offsetMs).toISOString().slice(0, 10);
+    const today = dayOf(now);
+    return records.reduce((total, record) => dayOf(Date.parse(record.at)) === today ? total + (totalTokens(record.usage) ?? 0) : total, 0);
+}
+// The overview is polled every few seconds; the ledger is re-read only when its size or time changed.
+let cache = null;
+async function cachedRecords(stateDirectory) {
+    const file = path.join(stateDirectory, USAGE_FILE);
+    let key;
+    try {
+        const info = await stat(file);
+        key = `${file}:${info.size}:${info.mtimeMs}`;
+    }
+    catch {
+        return [];
+    }
+    if (cache?.key !== key)
+        cache = { key, records: await readUsage(stateDirectory) };
+    return cache.records;
+}
+export async function budgetState(stateDirectory, tzOffsetMinutes, now = Date.now()) {
+    const budget = readBudget(stateDirectory);
+    const today = tokensToday(await cachedRecords(stateDirectory), now, tzOffsetMinutes);
+    return { ...budget, today_tokens: today, over_day: budget.day_tokens !== null && today >= budget.day_tokens };
+}
+//# sourceMappingURL=budget.js.map

package/dist/src/tasks/manager.js

@@ -9,6 +9,7 @@ import { redact } from '../security/redact.js';
 import { delegationState } from '../delegation.js';
 import { startProcess, terminateOwned } from '../antigravity/process.js';
 import { invocationFor, finalEnvelope } from '../antigravity/invocation.js';
+import { appendUsage, extractStats, totalTokens } from '../usage.js';
 import { MAX_RECENT_STEPS, rawStep, readProgress, summarizeStep } from '../progress.js';
 import { helperDirectory } from '../paths.js';
 import { readWait } from '../wait-setting.js';
@@ -321,6 +322,7 @@ export class TaskManager {
                 if (!entry.stop) {
                     try {
                         const result = finalEnvelope(rawStdout, transport);
+                        entry.stats = extractStats(result, entry.steps?.total ?? null);
                         task.cli_status = typeof result.status === 'string' ? result.status : null;
                         task.final_response = typeof result.response === 'string' ? redact(result.response) : null;
                         if (Array.isArray(result.denied_actions))
@@ -361,6 +363,11 @@ export class TaskManager {
                     }
                 }
                 await this.persist(task);
+                await appendUsage(this.runtime.stateDirectory, {
+                    at: task.ended_at ?? new Date().toISOString(), status: task.status, model: entry.request?.model ?? null, effort: entry.request?.effort ?? null,
+                    permission: entry.request?.permission ?? null, duration_ms: task.duration_ms, agy_duration_seconds: entry.stats?.agy_duration_seconds ?? null,
+                    num_turns: entry.stats?.num_turns ?? null, steps: entry.steps?.total ?? null, usage: entry.stats?.usage ?? null
+                });
                 this.busy = false;
                 entry.finish?.();
                 void this.startNext();
@@ -418,7 +425,7 @@ export class TaskManager {
     /** All retained tasks, newest first, without logs. */
     list() {
         return [...this.entries.entries()]
-            .map(([id, entry]) => ({ ...this.summary(id), title: entry.request?.task.split('\n').find(line => line.trim())?.trim().slice(0, 140) ?? null }))
+            .map(([id, entry]) => ({ ...this.summary(id), title: entry.request?.task.split('\n').find(line => line.trim())?.trim().slice(0, 140) ?? null, tokens: totalTokens(entry.stats?.usage) }))
             .sort((a, b) => Date.parse(b.queued_at ?? b.started_at) - Date.parse(a.queued_at ?? a.started_at));
     }
     /** Models offered by the installed Antigravity CLI (read on demand, never at startup). */
@@ -435,7 +442,7 @@ export class TaskManager {
             ...(request.context === null ? {} : { context: request.context }), timeout_seconds: request.timeout_seconds
         }, request.client) : null;
         const entry = this.entries.get(id);
-        return { task, request, prompt, activity: entry ? this.activityOf(entry) : null };
+        return { task, request, prompt, activity: entry ? this.activityOf(entry) : null, stats: entry?.stats ?? null };
     }
     /** The latest sign of life: output on stdout/stderr or a write to agy's log file (the file's modification time). 0 when there has been none. */
     lastActivity(entry) {
@@ -555,7 +562,7 @@ export class TaskManager {
         try {
             await mkdir(this.tasksDirectory, { recursive: true, mode: 0o700 });
             const file = path.join(this.tasksDirectory, `${task.task_id}.json`);
-            await writeFile(`${file}.tmp`, JSON.stringify({ task, request: this.entries.get(task.task_id)?.request ?? null }), { mode: 0o600 });
+            await writeFile(`${file}.tmp`, JSON.stringify({ task, request: this.entries.get(task.task_id)?.request ?? null, stats: this.entries.get(task.task_id)?.stats ?? null }), { mode: 0o600 });
             await rename(`${file}.tmp`, file);
         }
         catch { /* history is a convenience, not a correctness requirement */ }
@@ -575,6 +582,7 @@ export class TaskManager {
         }
         const loaded = [];
         const requests = new Map();
+        const statsById = new Map();
         for (const name of names) {
             try {
                 const parsed = JSON.parse(await readFile(path.join(this.tasksDirectory, name), 'utf8'));
@@ -585,6 +593,8 @@ export class TaskManager {
                     continue;
                 if (request)
                     requests.set(task.task_id, request);
+                if (parsed.task && parsed.stats)
+                    statsById.set(task.task_id, parsed.stats);
                 if (task.status === 'running' || task.status === 'queued') {
                     const wasQueued = task.status === 'queued';
                     task.status = 'failed';
@@ -605,7 +615,7 @@ export class TaskManager {
         for (const task of loaded.slice(this.config.max_retained_tasks))
             await this.forget(task.task_id);
         for (const task of keep)
-            this.entries.set(task.task_id, { task, request: requests.get(task.task_id), done: Promise.resolve() });
+            this.entries.set(task.task_id, { task, request: requests.get(task.task_id), stats: statsById.get(task.task_id), done: Promise.resolve() });
         return keep.length;
     }
     // Diagnose only; never remove a lock automatically, never kill anything. PIDs can be reused, so wording stays cautious.

package/dist/src/ui/routes.js

@@ -8,7 +8,9 @@ import { knownUpdate, readPackageInfo } from '../update.js';
 import { workspaceChanges } from '../changes.js';
 import { validModelId, writeModel } from '../models.js';
 import { readProgress, writeProgress } from '../progress.js';
+import { readUsage, summarizeUsage } from '../usage.js';
 import { EFFORT_LEVELS, isEffortLevel, readEffort, writeEffort } from '../effort.js';
+import { MAX_BUDGET_TOKENS, MIN_BUDGET_TOKENS, budgetState, isBudgetTokens, readBudget, writeBudget } from '../budget.js';
 import { MAX_ABSOLUTE_LIMIT_SECONDS, MIN_ABSOLUTE_LIMIT_SECONDS, isAbsoluteLimit, readSoftTimeout, writeSoftTimeout } from '../soft-timeout.js';
 import { MAX_SETTING_WAIT_SECONDS, MIN_WAIT_SECONDS, clientToolTimeoutSeconds, isWaitSeconds, writeWait } from '../wait-setting.js';
 import { PERMISSION_LEVELS, isPermissionLevel, needsAcknowledgement, permissionState, writePermission } from '../permissions.js';
@@ -43,7 +45,7 @@ async function readJson(req) {
         throw new Error('Expected a JSON object');
     return value;
 }
-async function overview(ctx) {
+async function overview(ctx, tzOffsetMinutes = 0) {
     const env = ctx.environment;
     const state = delegationState(ctx.manager.stateDirectory);
     return {
@@ -61,6 +63,7 @@ async function overview(ctx) {
         permission: permissionState(ctx.manager.stateDirectory),
         effort: readEffort(ctx.manager.stateDirectory),
         soft_timeout: readSoftTimeout(ctx.manager.stateDirectory),
+        budget: await budgetState(ctx.manager.stateDirectory, tzOffsetMinutes),
         progress: readProgress(ctx.manager.stateDirectory),
         wait: { seconds: ctx.manager.maxWaitSeconds, client_tool_timeout_seconds: clientToolTimeoutSeconds(ctx.manager.maxWaitSeconds) },
         queue: ctx.manager.overview().queue,
@@ -140,8 +143,29 @@ export async function handleUi(req, res, ctx) {
             json(res, 200, { ok: true });
             return true;
         }
+        const tzParam = Number(new URL(req.url ?? '', 'http://localhost').searchParams.get('tz') ?? '0');
+        const tzOffset = Number.isInteger(tzParam) && Math.abs(tzParam) <= 840 ? tzParam : 0;
         if (pathname === '/ui/api/overview' && method === 'GET') {
-            json(res, 200, await overview(ctx));
+            json(res, 200, await overview(ctx, tzOffset));
+            return true;
+        }
+        if (pathname === '/ui/api/usage' && method === 'GET') {
+            json(res, 200, summarizeUsage(await readUsage(ctx.manager.stateDirectory), { tzOffsetMinutes: tzOffset }));
+            return true;
+        }
+        if (pathname === '/ui/api/budget' && method === 'POST') {
+            const body = await readJson(req);
+            const current = readBudget(ctx.manager.stateDirectory);
+            const pick = (key) => body[key] === undefined ? current[key] : body[key];
+            const next = { task_tokens: pick('task_tokens'), day_tokens: pick('day_tokens') };
+            for (const limit of [next.task_tokens, next.day_tokens]) {
+                if (limit !== null && !isBudgetTokens(limit)) {
+                    json(res, 400, { error: `limits must be whole numbers from ${MIN_BUDGET_TOKENS} to ${MAX_BUDGET_TOKENS}, or null for no limit` });
+                    return true;
+                }
+            }
+            await writeBudget(ctx.manager.stateDirectory, next);
+            json(res, 200, await budgetState(ctx.manager.stateDirectory, tzOffset));
             return true;
         }
         const detail = pathname.match(new RegExp(`^/ui/api/tasks/(${UUID})$`));

package/dist/src/usage.js

@@ -0,0 +1,129 @@
+import { appendFile, readFile, stat, writeFile } from 'node:fs/promises';
+import path from 'node:path';
+/**
+ * Usage of Antigravity as the bridge sees it. agy's result carries `usage`, `duration_seconds` and `num_turns`; what is inside `usage` is not
+ * assumed: every numeric value in it is kept under its own name (nested names joined with a dot) and summed. Nothing here is a quota: the
+ * bridge has no source for "remaining" and does not invent one.
+ */
+export const USAGE_FILE = 'usage.jsonl';
+const MAX_FILE_BYTES = 1_000_000;
+const KEEP_RECORDS = 3000;
+const SAFE_KEY = /^[A-Za-z0-9_.-]{1,60}$/;
+/** Numeric leaves of an object, at most three levels deep and 40 of them, keyed by their dotted path. */
+export function flattenNumbers(value, prefix = '', depth = 0, out = {}) {
+    if (typeof value === 'number') {
+        if (Number.isFinite(value) && prefix && SAFE_KEY.test(prefix))
+            out[prefix] = value;
+        return out;
+    }
+    if (depth >= 3 || typeof value !== 'object' || value === null || Array.isArray(value))
+        return out;
+    for (const [key, inner] of Object.entries(value)) {
+        if (Object.keys(out).length >= 40)
+            break;
+        flattenNumbers(inner, prefix ? `${prefix}.${key}` : key, depth + 1, out);
+    }
+    return out;
+}
+const finiteOrNull = (value) => typeof value === 'number' && Number.isFinite(value) && value >= 0 ? value : null;
+/** What the result of one task says about its own cost. All parts are optional: agy may leave any of them out. */
+export function extractStats(result, steps) {
+    const usage = flattenNumbers(result.usage);
+    return { usage: Object.keys(usage).length ? usage : null, agy_duration_seconds: finiteOrNull(result.duration_seconds), num_turns: finiteOrNull(result.num_turns), steps };
+}
+/** One line per finished task, kept across restarts (the task history itself keeps only the latest tasks). Trimmed when the file grows large. */
+export async function appendUsage(stateDirectory, record) {
+    const file = path.join(stateDirectory, USAGE_FILE);
+    try {
+        await appendFile(file, JSON.stringify(record) + '\n', { mode: 0o600 });
+        if ((await stat(file)).size > MAX_FILE_BYTES) {
+            const lines = (await readFile(file, 'utf8')).split('\n').filter(Boolean);
+            await writeFile(file, lines.slice(-KEEP_RECORDS).join('\n') + '\n', { mode: 0o600 });
+        }
+    }
+    catch { /* statistics are a convenience, never a reason to fail a task */ }
+}
+export async function readUsage(stateDirectory) {
+    let text;
+    try {
+        text = await readFile(path.join(stateDirectory, USAGE_FILE), 'utf8');
+    }
+    catch {
+        return [];
+    }
+    const records = [];
+    for (const line of text.split('\n')) {
+        if (!line.trim())
+            continue;
+        try {
+            const value = JSON.parse(line);
+            if (typeof value.at === 'string' && Number.isFinite(Date.parse(value.at)) && typeof value.status === 'string' && typeof value.duration_ms === 'number')
+                records.push(value);
+        }
+        catch { /* skip a damaged line */ }
+    }
+    return records;
+}
+const add = (target, source) => {
+    for (const [key, value] of Object.entries(source ?? {}))
+        target[key] = (target[key] ?? 0) + value;
+};
+const sum = (values) => values.reduce((total, value) => total + (value ?? 0), 0);
+const newGroup = () => ({ tasks: 0, completed: 0, duration_ms: 0, turns: 0, usage: {} });
+function addTo(group, record) {
+    group.tasks += 1;
+    if (record.status === 'completed')
+        group.completed += 1;
+    group.duration_ms += record.duration_ms;
+    group.turns += record.num_turns ?? 0;
+    add(group.usage, record.usage);
+}
+/**
+ * Totals, a split by model and by effort, and the last `days` days. Days are the viewer's local days: `tzOffsetMinutes` is what
+ * `new Date().getTimezoneOffset()` returns in the browser (minutes behind UTC, so UTC+7 is -420).
+ */
+export function summarizeUsage(records, options = {}) {
+    const now = options.now ?? Date.now();
+    const offsetMs = -(options.tzOffsetMinutes ?? 0) * 60000;
+    const days = options.days ?? 14;
+    const dayOf = (ms) => new Date(ms + offsetMs).toISOString().slice(0, 10);
+    const totals = newGroup();
+    const byStatus = {};
+    const byModel = new Map();
+    const byEffort = new Map();
+    const byDay = new Map();
+    for (let i = days - 1; i >= 0; i--)
+        byDay.set(dayOf(now - i * 86400000), newGroup());
+    for (const record of records) {
+        addTo(totals, record);
+        byStatus[record.status] = (byStatus[record.status] ?? 0) + 1;
+        const model = record.model ?? 'default';
+        byModel.set(model, byModel.get(model) ?? newGroup());
+        addTo(byModel.get(model), record);
+        const effort = record.effort ?? 'default';
+        byEffort.set(effort, byEffort.get(effort) ?? newGroup());
+        addTo(byEffort.get(effort), record);
+        const day = byDay.get(dayOf(Date.parse(record.at)));
+        if (day)
+            addTo(day, record);
+    }
+    const list = (map) => [...map].map(([key, group]) => ({ key, ...group })).sort((a, b) => b.tasks - a.tasks).slice(0, 12);
+    return {
+        since: records.length ? records[0].at : null,
+        totals: { ...totals, by_status: byStatus, steps: sum(records.map(r => r.steps)), agy_duration_seconds: sum(records.map(r => r.agy_duration_seconds)),
+            with_usage: records.filter(r => r.usage).length },
+        by_model: list(byModel), by_effort: list(byEffort),
+        by_day: [...byDay].map(([day, group]) => ({ day, ...group })),
+        recent: records.slice(-15).reverse().map(r => ({ at: r.at, status: r.status, model: r.model, effort: r.effort, duration_ms: r.duration_ms, agy_duration_seconds: r.agy_duration_seconds, num_turns: r.num_turns, usage: r.usage }))
+    };
+}
+/** Tokens a task cost according to agy: its own total when it reports one, else input plus output; null when it reported neither. */
+export function totalTokens(usage) {
+    if (!usage)
+        return null;
+    if (typeof usage.total_tokens === 'number')
+        return usage.total_tokens;
+    const parts = [usage.input_tokens, usage.output_tokens].filter((value) => typeof value === 'number');
+    return parts.length ? parts.reduce((total, value) => total + value, 0) : null;
+}
+//# sourceMappingURL=usage.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agy-mcp-bridge",
-  "version": "0.1.13",
+  "version": "0.1.15",
   "description": "Local authenticated HTTP MCP bridge that lets Codex and Claude Code delegate bounded coding tasks to the Antigravity CLI (agy)",
   "license": "MIT",
   "keywords": [

package/ui/app.css

@@ -219,3 +219,12 @@ pre.log { margin: 0; padding: 12px; border-radius: 10px; background: #0b0e14; co
 .steps { margin: 8px 0 0; padding-left: 0; list-style: none; display: grid; gap: 6px; }
 .steps li { padding: 6px 0; border-bottom: 1px solid var(--border); overflow-wrap: anywhere; }
 .steps details { margin-top: 4px; }
+.bars { display: grid; gap: 6px; margin-top: 8px; }
+.bar-row { display: grid; grid-template-columns: 52px 1fr 130px; gap: 10px; align-items: center; }
+.bar-track { height: 10px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); overflow: hidden; }
+.bar-fill { height: 100%; background: var(--accent); }
+.usage-table { width: 100%; border-collapse: collapse; margin-top: 8px; }
+.usage-table th, .usage-table td { padding: 7px 8px; text-align: left; border-bottom: 1px solid var(--border); overflow-wrap: anywhere; }
+.usage-table th { font-weight: 600; color: var(--muted); }
+
+.over-budget { color: var(--bad); font-weight: 600; }

package/ui/app.js

@@ -5,6 +5,7 @@ const STATUS = {queued: 'Đang chờ', running: 'Đang chạy', completed: 'Hoà
 const NS = 'http://www.w3.org/2000/svg';
 const ICONS = {
   tasks: 'M4 6h16M4 12h16M4 18h10',
+  usage: 'M4 20V10M10 20V4M16 20v-8M22 20H2',
   settings: 'M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1.1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1a1.7 1.7 0 0 0 1.5-1.1 1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3H9a1.7 1.7 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8V9a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z',
   out: 'M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4M16 17l5-5-5-5M21 12H9'
 };
@@ -142,7 +143,7 @@ async function login(token) {
 
 async function refresh(force) {
   try {
-    state.overview = await api('overview'); state.connected = true;
+    state.overview = await api(`overview?tz=${new Date().getTimezoneOffset()}`); state.connected = true;
     const tasks = state.overview.tasks;
     if (!state.selected || !tasks.some(task => task.task_id === state.selected)) state.selected = tasks[0]?.task_id ?? null;
     state.detail = state.selected ? await api(`tasks/${state.selected}`).catch(() => null) : null;
@@ -240,10 +241,28 @@ async function setSoftTimeout(enabled, limit_seconds) {
     await refresh();
   } catch (error) { notify(error.message); await refresh(); }
 }
+const BUDGET_TASK_PRESETS = [null, 50000, 100000, 200000, 500000, 1000000];
+const BUDGET_DAY_PRESETS = [null, 200000, 500000, 1000000, 2000000, 5000000];
+async function setBudget(body) {
+  try { await api(`budget?tz=${new Date().getTimezoneOffset()}`, {method: 'POST', body}); notify('Đã lưu mức token'); await refresh(); }
+  catch (error) { notify(error.message); await refresh(); }
+}
 async function setProgress(enabled) {
   try { await api('progress', {method: 'POST', body: {enabled}}); notify(enabled ? 'Đã bật tiến độ từng bước (áp dụng cho task mới)' : 'Đã tắt tiến độ từng bước'); await refresh(); }
   catch (error) { notify(error.message); await refresh(); }
 }
+let usageAt = 0;
+/** Usage numbers change only when a task ends, so they are fetched when the page opens and then at most every 15 seconds. */
+async function loadUsage(force) {
+  if (!force && Date.now() - usageAt < 15000) return;
+  usageAt = Date.now();
+  try { state.usage = await api(`usage?tz=${new Date().getTimezoneOffset()}`); } catch { /* keep the numbers already shown */ }
+  patch();
+}
+const USAGE_LABELS = {input_tokens: 'Token vào', output_tokens: 'Token ra', total_tokens: 'Tổng token', cached_tokens: 'Token từ bộ nhớ đệm', cache_read_tokens: 'Token đọc từ bộ nhớ đệm', reasoning_tokens: 'Token suy luận', thinking_tokens: 'Token suy luận', prompt_tokens: 'Token vào', completion_tokens: 'Token ra'};
+const usageName = key => USAGE_LABELS[key] ? `${USAGE_LABELS[key]} (${key})` : key;
+const number = value => Number(value).toLocaleString('vi-VN', {maximumFractionDigits: 2});
+const usageLine = usage => usage && Object.keys(usage).length ? Object.entries(usage).map(([key, value]) => `${key} ${number(value)}`).join(' · ') : null;
 async function copy(text) {
   try { await navigator.clipboard.writeText(text); notify('Đã sao chép'); } catch { notify('Không thể sao chép tự động'); }
 }
@@ -281,6 +300,8 @@ function statsView(o) {
     stat('Antigravity CLI', o.cli.version && o.cli.version !== 'unavailable' ? `agy ${o.cli.version}` : 'Không tìm thấy', o.cli.execution_method || 'Chưa thể giao task'),
     stat('Giao việc', [switchControl(o.delegation.enabled, o.delegation.controllable, 'Cho phép giao việc cho Antigravity'),
       h('span', {class: `pill ${o.delegation.enabled ? 'ok' : 'warn'}`, text: o.delegation.enabled ? 'Đang bật' : 'Đã tắt'})], o.delegation.reason || 'Codex / Claude được phép giao task'),
+    stat('Token hôm nay', [number(o.budget?.today_tokens ?? 0), o.budget?.day_tokens ? h('span', {class: `pill ${o.budget.over_day ? 'bad' : 'ok'}`, text: o.budget.over_day ? 'Vượt mức' : 'Trong mức'}) : null],
+      o.budget?.day_tokens ? `mức ngày ${number(o.budget.day_tokens)}${o.budget.over_day ? ' — đã vượt' : ''}` : 'chưa đặt mức ngày (Cài đặt)'),
     stat('Task', `${count('running')} đang chạy`, `${queued ? `${queued} đang chờ · ` : ''}${o.tasks.length} task gần đây`)
   ];
 }
@@ -289,6 +310,7 @@ function filteredTasks(o) {
   const q = state.q.trim().toLowerCase();
   return o.tasks.filter(task => MATCH[state.filter](task) && (!q || [task.title, task.workspace, task.task_id].some(v => (v || '').toLowerCase().includes(q))));
 }
+const overTask = (o, task) => Boolean(o.budget?.task_tokens) && task.tokens !== null && task.tokens !== undefined && task.tokens > o.budget.task_tokens;
 function taskItems(o) {
   if (!o.tasks.length) return [h('div', {class: 'card empty'}, h('strong', {text: 'Chưa có task nào'}), 'Khi Codex hoặc Claude giao việc cho Antigravity, task sẽ hiện ở đây.')];
   const tasks = filteredTasks(o);
@@ -298,7 +320,8 @@ function taskItems(o) {
   }, h('div', {class: 'row'}, pill(task.status), agoEl(task.queued_at || task.started_at, 'meta')),
     h('div', {class: 'title', text: task.title || '(không có nội dung yêu cầu)'}),
     h('div', {class: 'meta mono', text: `${folder(task.workspace)} · ${task.task_id.slice(0, 8)}`}),
-    h('div', {class: 'meta'}, task.status === 'running' ? elapsedEl(task.started_at, 'Đang chạy ') : task.status === 'queued' ? 'Đang xếp hàng…' : `Mất ${duration(task.duration_ms)}`)));
+    h('div', {class: 'meta'}, task.status === 'running' ? elapsedEl(task.started_at, 'Đang chạy ') : task.status === 'queued' ? 'Đang xếp hàng…' : `Mất ${duration(task.duration_ms)}`,
+      task.tokens !== null && task.tokens !== undefined ? h('span', {class: overTask(o, task) ? 'over-budget' : '', text: ` · ${number(task.tokens)} token${overTask(o, task) ? ' (vượt mức)' : ''}`}) : null)));
 }
 function taskCount(o) { return `${filteredTasks(o).length}/${o.tasks.length} task`; }
 
@@ -362,7 +385,7 @@ function detailView() {
   const facts = h('dl', {class: 'kv'},
     ...[['Gửi lúc', clock(task.queued_at || task.started_at)], ['Bắt đầu chạy', queued ? 'Chưa chạy' : clock(task.started_at)], ['Kết thúc', clock(task.ended_at)],
       ['Thời gian chạy', running ? elapsedEl(task.started_at) : queued ? '—' : duration(task.duration_ms)],
-      ['Giới hạn', request ? `${request.timeout_seconds}s` : '—'], ['Model', request && 'model' in request ? request.model || 'mặc định' : '—'], ['Quyền', request && request.permission ? (PERMISSION_LEVELS.find(l => l.id === request.permission)?.title || request.permission) : '—'], ['Effort', request && request.effort ? request.effort : '—'], ['Exit code', task.exit_code ?? '—'], ['PID', task.pid ?? '—'],
+      ['Giới hạn', request ? `${request.timeout_seconds}s` : '—'], ['Model', request && 'model' in request ? request.model || 'mặc định' : '—'], ['Quyền', request && request.permission ? (PERMISSION_LEVELS.find(l => l.id === request.permission)?.title || request.permission) : '—'], ['Effort', request && request.effort ? request.effort : '—'], ['Tổng token', state.detail?.stats?.usage && 'total_tokens' in state.detail.stats.usage ? number(state.detail.stats.usage.total_tokens) : '—'], ['Usage (agy báo)', usageLine(state.detail?.stats?.usage) ?? '—'], ['Exit code', task.exit_code ?? '—'], ['PID', task.pid ?? '—'],
       ['CLI status', task.cli_status ?? '—']].map(([k, v]) => h('div', {}, h('dt', {text: k}), h('dd', {}, typeof v === 'string' || typeof v === 'number' ? String(v) : v))));
 
   const asker = request?.client ? `Tech Lead · ${request.client}` : 'Tech Lead (Codex / Claude)';
@@ -439,6 +462,20 @@ function progressCard(o) {
         h('span', {class: 'muted', text: 'Bridge chạy agy với --output-format stream-json: ngoài kết quả cuối, agy báo các sự kiện init và step_update khi đang làm việc (đã thấy bằng probe-stream trên agy 1.4.x). Các bước hiện trong chi tiết task, và là bằng chứng "còn sống" thật cho phần gia hạn. Áp dụng cho task mới, không cần khởi động lại.'}))),
     h('div', {class: 'callout warn', text: 'Chưa kiểm chứng: nội dung chi tiết bên trong step_update (nên hiển thị là tóm tắt tự động kèm dữ liệu gốc), và việc kết quả cuối ở chế độ này có cùng dạng với chế độ JSON. Nếu task báo lỗi "CLI output is not a valid stream-json final result" hoặc "stream result fields", hãy tắt tùy chọn này để quay về chế độ JSON đã kiểm chứng và gửi tôi thông báo lỗi.'}));
 }
+function budgetCard(o) {
+  const budget = o.budget || {task_tokens: null, day_tokens: null, today_tokens: 0};
+  const chooser = (key, presets, label) => {
+    const options = presets.includes(budget[key]) ? presets : [...presets, budget[key]];
+    const select = h('select', {class: 'select', 'aria-label': label, onchange: event => setBudget({[key]: event.target.value === '' ? null : Number(event.target.value)})},
+      ...options.map(value => h('option', {value: value === null ? '' : String(value), text: value === null ? 'Không giới hạn' : `${number(value)} token`})));
+    select.value = budget[key] === null ? '' : String(budget[key]);
+    return select;
+  };
+  return h('section', {class: 'card panel wide'}, h('h2', {text: 'Mức token (đèn cảnh báo)'}),
+    h('div', {class: 'switch-row'}, h('div', {}, h('strong', {text: 'Mỗi task'}), h('span', {class: 'muted', text: 'Task nào dùng nhiều hơn mức này sẽ được đánh dấu "vượt mức" trong danh sách.'})), chooser('task_tokens', BUDGET_TASK_PRESETS, 'Mức token mỗi task')),
+    h('div', {class: 'switch-row'}, h('div', {}, h('strong', {text: 'Mỗi ngày'}), h('span', {class: 'muted', text: `Hôm nay đã dùng ${number(budget.today_tokens)} token qua bridge${budget.over_day ? ' — đã vượt mức.' : '.'}`})), chooser('day_tokens', BUDGET_DAY_PRESETS, 'Mức token mỗi ngày')),
+    h('div', {class: 'callout warn', text: 'Đây chỉ là đèn báo, không phải hạn mức thật và không dừng task: agy không cho bridge đọc hạn mức, và số token của một task chỉ biết khi task kết thúc. Số liệu là tổng token (total_tokens) agy báo cho các task chạy qua bridge, tính theo ngày giờ máy của bạn.'}));
+}
 function softTimeoutCard(o) {
   const soft = o.soft_timeout || {enabled: false, limit_seconds: 7200};
   const known = SOFT_LIMITS.some(l => l.seconds === soft.limit_seconds);
@@ -488,6 +525,39 @@ function permissionCard(o) {
     p.controllable ? null : h('div', {class: 'callout warn', text: `Đang bị khóa bởi biến môi trường BRIDGE_AGY_PERMISSIONS${p.reason && p.reason !== 'BRIDGE_AGY_PERMISSIONS' ? ` (${p.reason})` : ''}. Đổi biến rồi khởi động lại server để mở.`}),
     h('div', {class: 'callout warn', text: 'Danh sách "Workspace được phép" chỉ kiểm tra đường dẫn của task, không phải sandbox. Với mức Tự động hoặc Toàn quyền, Antigravity có thể tác động ra ngoài thư mục đó.'}));
 }
+function usageView(u) {
+  const head = h('div', {class: 'page-head'}, h('div', {}, h('h1', {text: 'Sử dụng'}), h('p', {text: 'Số liệu bridge ghi lại từ các task đã chạy qua nó.'})),
+    h('button', {class: 'btn small', onclick: () => loadUsage(true), text: 'Làm mới'}));
+  if (!u) return [head, h('div', {class: 'card empty', text: 'Đang tải…'})];
+  const t = u.totals;
+  const status = Object.entries(t.by_status).map(([key, count]) => `${STATUS[key] || key} ${count}`).join(' · ');
+  const cards = h('section', {class: 'stats', 'aria-label': 'Tổng quan sử dụng'},
+    stat('Task đã chạy', number(t.tasks), t.tasks ? `${number(t.completed)} hoàn tất · ${status}` : 'chưa có task nào'),
+    stat('Thời gian chạy', duration(t.duration_ms), 'tổng, do bridge đo'),
+    stat('Thời gian agy báo', t.agy_duration_seconds ? duration(t.agy_duration_seconds * 1000) : '—', 'tổng duration_seconds của agy'),
+    stat('Số lượt / bước', `${number(t.turns)} / ${number(t.steps)}`, 'num_turns / bước báo cáo'));
+  const callout = h('div', {class: 'callout warn', text: `Đây là mức dùng qua bridge${u.since ? ` kể từ ${clock(u.since)}` : ''} (nhật ký lưu qua các lần khởi động lại), không phải hạn mức. Hạn mức còn lại không có nguồn từ agy nên bridge không hiển thị; xem trên tài khoản Antigravity của bạn.`});
+  const sums = Object.entries(t.usage);
+  const usageCard = h('section', {class: 'card panel wide'}, h('h2', {text: 'Usage do agy báo'}),
+    sums.length ? [h('dl', {class: 'rows'}, sums.map(([key, value]) => row(usageName(key), number(value)))),
+        h('p', {class: 'muted', text: `Cộng dồn từ ${number(t.with_usage)} task có trường usage trong kết quả của agy. Tên trường do agy quyết định; bridge cộng mọi giá trị số.`})]
+      : h('p', {class: 'muted', text: 'Chưa có task nào mà kết quả của agy kèm số liệu usage. Với task chạy ở chế độ JSON hoặc stream, nếu agy trả trường usage thì tổng sẽ hiện ở đây.'}));
+  const peak = Math.max(1, ...u.by_day.map(d => d.tasks));
+  const bars = h('div', {class: 'bars'}, u.by_day.map(d => {
+    const fill = h('div', {class: 'bar-fill'}); fill.style.width = `${(d.tasks / peak * 100).toFixed(1)}%`;
+    return h('div', {class: 'bar-row'}, h('span', {class: 'muted mono', text: `${d.day.slice(8)}/${d.day.slice(5, 7)}`}), h('div', {class: 'bar-track'}, fill),
+      h('span', {class: 'mono', text: d.tasks ? `${d.tasks} · ${duration(d.duration_ms)}` : '0'}));
+  }));
+  const dayCard = h('section', {class: 'card panel wide'}, h('h2', {text: '14 ngày gần nhất'}), bars);
+  const groupTable = (title, groups, firstColumn) => h('section', {class: 'card panel wide'}, h('h2', {text: title}),
+    groups.length ? h('table', {class: 'usage-table'}, h('thead', {}, h('tr', {}, ...[firstColumn, 'Task', 'Hoàn tất', 'Thời gian', 'Usage'].map(c => h('th', {text: c})))),
+      h('tbody', {}, groups.map(g => h('tr', {}, h('td', {class: 'mono', text: g.key}), h('td', {text: number(g.tasks)}), h('td', {text: number(g.completed)}), h('td', {text: duration(g.duration_ms)}), h('td', {class: 'muted', text: usageLine(g.usage) ?? '—'})))))
+      : h('p', {class: 'muted', text: 'Chưa có dữ liệu.'}));
+  const recent = h('section', {class: 'card panel wide'}, h('h2', {text: 'Task gần nhất'}),
+    u.recent.length ? h('ul', {class: 'path-list'}, u.recent.map(r => h('li', {}, `${clock(r.at)} · ${STATUS[r.status] || r.status} · ${r.model || 'model mặc định'} · effort ${r.effort || 'mặc định'} · ${duration(r.duration_ms)}`,
+      usageLine(r.usage) ? h('span', {class: 'tag', text: usageLine(r.usage)}) : null))) : h('p', {class: 'muted', text: 'Chưa có task nào.'}));
+  return [head, callout, cards, usageCard, dayCard, groupTable('Theo model', u.by_model, 'Model'), groupTable('Theo mức suy luận', u.by_effort, 'Effort'), recent];
+}
 function settingsView(o) {
   const delegation = o.delegation;
   return [h('div', {class: 'page-head'}, h('div', {}, h('h1', {text: 'Cài đặt'}), h('p', {text: 'Trạng thái và giới hạn của bridge. Phần lớn chỉ đọc; chỉnh bằng file cấu hình rồi khởi động lại.'}))),
@@ -502,6 +572,7 @@ function settingsView(o) {
       effortCard(o),
       waitCard(o),
       progressCard(o),
+      budgetCard(o),
       softTimeoutCard(o),
       permissionCard(o),
       h('section', {class: 'card panel'}, h('h2', {text: 'Kết nối'}),
@@ -527,10 +598,10 @@ function settingsView(o) {
 
 /* ---------- Shell: built once per view change, then patched region by region ---------- */
 function mount() {
-  const nav = (view, label) => h('button', {'aria-current': state.view === view ? 'page' : null, onclick: () => { state.view = view; render(); }}, icon(view === 'tasks' ? 'tasks' : 'settings'), label);
+  const nav = (view, label) => h('button', {'aria-current': state.view === view ? 'page' : null, onclick: () => { state.view = view; render(); }}, icon(view === 'tasks' ? 'tasks' : view === 'usage' ? 'usage' : 'settings'), label);
   const live = h('div', {class: 'live', role: 'status'});
   const side = h('aside', {class: 'side'}, h('div', {class: 'brand'}, h('img', {src: '/ui/favicon.svg', alt: ''}), h('span', {text: 'Antigravity Bridge'})),
-    h('nav', {class: 'nav', 'aria-label': 'Điều hướng'}, nav('tasks', 'Task'), nav('settings', 'Cài đặt')),
+    h('nav', {class: 'nav', 'aria-label': 'Điều hướng'}, nav('tasks', 'Task'), nav('usage', 'Sử dụng'), nav('settings', 'Cài đặt')),
     h('div', {class: 'side-foot'}, live));
   const banner = h('div', {'aria-live': 'polite'});
   const main = h('main', {class: 'main'}, banner);
@@ -546,6 +617,9 @@ function mount() {
       class: 'chip-btn', 'data-filter': key, 'aria-pressed': String(state.filter === key), onclick: () => { state.filter = key; for (const b of chips.children) b.setAttribute('aria-pressed', String(b.dataset.filter === key)); patch(); }, text: label})));
     main.append(h('div', {class: 'page-head'}, h('div', {}, h('h1', {text: 'Task'}), h('p', {text: 'Nội dung trao đổi giữa Tech Lead và Antigravity.'}))),
       regions.stats, h('div', {class: 'tasks'}, h('div', {class: 'list-col'}, h('div', {class: 'list-tools'}, search, chips, regions.count), regions.list), regions.detail));
+  } else if (state.view === 'usage') {
+    regions.usage = h('div', {});
+    main.append(regions.usage);
   } else {
     regions.settings = h('div', {});
     main.append(regions.settings);
@@ -573,8 +647,8 @@ function patch() {
     o.permission && (o.permission.level === 'full' || o.permission.level === 'auto') ? h('div', {class: 'banner warn', role: 'alert', text: o.permission.level === 'full' ? 'Antigravity đang ở mức TOÀN QUYỀN: mọi thao tác được tự duyệt, kể cả ngoài thư mục dự án. Đổi lại ở Cài đặt.' : 'Antigravity đang ở chế độ Tự động: nó tự quyết định hành động. Đổi lại ở Cài đặt.'}) : null,
     o.update ? h('div', {class: 'banner info', role: 'status'}, `Có bản mới ${o.update.package} ${o.update.latest} (đang chạy ${o.update.current}). Dừng server (Ctrl+C) rồi chạy `, h('code', {text: o.update.command})) : null].filter(Boolean));
   if (regions.view === 'tasks') {
-    setRegion('stats', JSON.stringify([o.tasks.map(t => [t.task_id, t.status]), o.cli, o.delegation, o.server.accepting_tasks]), () => statsView(o));
-    setRegion('list', JSON.stringify([state.q, state.filter, state.selected, o.tasks.map(t => stable(t))]), () => taskItems(o));
+    setRegion('stats', JSON.stringify([o.tasks.map(t => [t.task_id, t.status]), o.budget, o.cli, o.delegation, o.server.accepting_tasks]), () => statsView(o));
+    setRegion('list', JSON.stringify([state.q, state.filter, state.selected, o.budget?.task_tokens, o.tasks.map(t => stable(t))]), () => taskItems(o));
     regions.count.textContent = taskCount(o);
     const d = state.detail;
     const detailKey = JSON.stringify([state.selected, state.logTab, state.changes, d && {...d, activity: null, task: {...stable(d.task), stdout: '', stderr: '', stdout_bytes: 0, stderr_bytes: 0, stdout_truncated: false, stderr_truncated: false}}]);
@@ -583,9 +657,12 @@ function patch() {
     if (!rebuilt) patchLogs();
     patchActivity();
     patchSteps();
+  } else if (regions.view === 'usage') {
+    loadUsage();
+    setRegion('usage', JSON.stringify(state.usage), () => usageView(state.usage));
   } else {
     if (!state.models && !state.modelsLoading) loadModels();
-    setRegion('settings', JSON.stringify([state.models, o.model, o.permission, o.effort, o.wait, o.soft_timeout, o.progress, o.cli, o.delegation, o.limits, o.allowed_workspaces, o.session_workspaces, o.server.mcp_endpoint]), () => settingsView(o));
+    setRegion('settings', JSON.stringify([state.models, o.model, o.permission, o.effort, o.wait, o.budget && [o.budget.task_tokens, o.budget.day_tokens], o.soft_timeout, o.progress, o.cli, o.delegation, o.limits, o.allowed_workspaces, o.session_workspaces, o.server.mcp_endpoint]), () => settingsView(o));
   }
   tick();
 }