@zaip-ai/cli 1.0.8 → 1.3.1

package/templates/.agents/dashboard/apps/frontend/src/use-app-cost-loaders.test.ts

@@ -1,9 +1,10 @@
-import { describe, expect, it } from "vitest";
 import { CostRunsTable, matchesCostRunFilter } from "@zaip-ai/dashboard-cost-monitor/react";
+import { describe, expect, it } from "vitest";
 import {
   adaptSqliteCompactLifecyclePage,
   adaptSqliteCostRun,
   loadSqliteCostGroupPage,
+  loadSqliteCostRunPage,
 } from "./use-app-cost-loaders.js";
 
 describe("daily Cost Monitor continuous pagination", () => {
@@ -19,7 +20,16 @@ describe("daily Cost Monitor continuous pagination", () => {
             total_count: 35,
             has_more: true,
             rows: [{ period_key: "2026-08-17" }, { period_key: "2026-07-19" }],
-            totals: { task_count: 916, prd_count: 13, spec_count: 59, total_run_count: 238, total_duration: 619_920_000, total_tokens: 7_300_000_000, total_cost_usd: 8_731.92, total_cost_brl: 47_589 },
+            totals: {
+              task_count: 916,
+              prd_count: 13,
+              spec_count: 59,
+              total_run_count: 238,
+              total_duration: 619_920_000,
+              total_tokens: 7_300_000_000,
+              total_cost_usd: 8_731.92,
+              total_cost_brl: 47_589,
+            },
           };
         }
         return {
@@ -27,12 +37,35 @@ describe("daily Cost Monitor continuous pagination", () => {
           limit: 30,
           total_count: 35,
           has_more: false,
-          rows: [{ period_key: "2026-07-18", task_count: 2, total_tokens: 10 }, { period_key: "2026-07-14", task_count: 2, total_tokens: 10 }],
-          totals: { task_count: 916, prd_count: 13, spec_count: 59, total_run_count: 238, total_duration: 619_920_000, total_tokens: 7_300_000_000, total_cost_usd: 8_731.92, total_cost_brl: 47_589 },
+          rows: [
+            { period_key: "2026-07-18", task_count: 2, total_tokens: 10 },
+            { period_key: "2026-07-14", task_count: 2, total_tokens: 10 },
+          ],
+          totals: {
+            task_count: 916,
+            prd_count: 13,
+            spec_count: 59,
+            total_run_count: 238,
+            total_duration: 619_920_000,
+            total_tokens: 7_300_000_000,
+            total_cost_usd: 8_731.92,
+            total_cost_brl: 47_589,
+          },
         };
       },
     };
-    const filters = { query: "", provider: "", model: "", agent: "", phase: "", status: "", origin: "", workType: "", priority: "", risk: "" } as never;
+    const filters = {
+      query: "",
+      provider: "",
+      model: "",
+      agent: "",
+      phase: "",
+      status: "",
+      origin: "",
+      workType: "",
+      priority: "",
+      risk: "",
+    } as never;
     const firstPage = await loadSqliteCostGroupPage(api as never, {
       view: "daily",
       from: "2026-07-14",
@@ -51,8 +84,16 @@ describe("daily Cost Monitor continuous pagination", () => {
     });
 
     expect(calls).toEqual([
-      { view: "cost_monitor_daily", range: { from: "2026-07-14", to: "2026-08-17" }, page: { offset: 0, limit: 30 } },
-      { view: "cost_monitor_daily", range: { from: "2026-07-14", to: "2026-08-17" }, page: { offset: 30, limit: 30 } },
+      {
+        view: "cost_monitor_daily",
+        range: { from: "2026-07-14", to: "2026-08-17" },
+        page: { offset: 0, limit: 30 },
+      },
+      {
+        view: "cost_monitor_daily",
+        range: { from: "2026-07-14", to: "2026-08-17" },
+        page: { offset: 30, limit: 30 },
+      },
     ]);
     expect(firstPage).toMatchObject({
       offset: 0,
@@ -60,7 +101,13 @@ describe("daily Cost Monitor continuous pagination", () => {
       total_count: 35,
       has_more: true,
       rows: [{ key: "2026-08-17" }, { key: "2026-07-19" }],
-      totals: { task_count: 916, prd_count: 13, spec_count: 59, total_tokens: 7_300_000_000, estimated_brl: 47_589 },
+      totals: {
+        task_count: 916,
+        prd_count: 13,
+        spec_count: 59,
+        total_tokens: 7_300_000_000,
+        estimated_brl: 47_589,
+      },
     });
     expect(secondPage).toMatchObject({
       offset: 30,
@@ -102,10 +149,12 @@ describe("adaptSqliteCostRun", () => {
       currency: "BRL",
       locale: "pt-BR",
     });
-    const multiplier = (table.props.columns as Array<{
-      key: string;
-      render: (row: typeof run) => unknown;
-    }>).find((column) => column.key === "contextMultiplier");
+    const multiplier = (
+      table.props.columns as Array<{
+        key: string;
+        render: (row: typeof run) => unknown;
+      }>
+    ).find((column) => column.key === "contextMultiplier");
     expect(multiplier?.render(run)).toBe("Indisponível");
     expect(
       matchesCostRunFilter(run, {
@@ -157,6 +206,53 @@ describe("adaptSqliteCostRun", () => {
   });
 });
 
+describe("agent invocation remote pagination", () => {
+  it("forwards the requested ten-row page instead of expanding it to one hundred", async () => {
+    const calls: Array<{ view: string; range: unknown; page: Record<string, unknown> }> = [];
+    const api = {
+      sqliteViewPage: async (view: string, range: unknown, page: Record<string, unknown>) => {
+        calls.push({ view, range, page });
+        return {
+          offset: 10,
+          limit: 10,
+          total_count: 24,
+          has_more: true,
+          rows: [],
+        };
+      },
+    };
+
+    const loaded = await loadSqliteCostRunPage(api as never, {
+      currency: "BRL",
+      from: "2026-08-01",
+      to: "2026-08-25",
+      offset: 10,
+      limit: 10,
+      filters: {
+        query: "agent-builder",
+        provider: "openai",
+        model: "",
+        agent: "",
+        phase: "",
+        status: "",
+        origin: "",
+        workType: "",
+        priority: "",
+        risk: "",
+      },
+    });
+
+    expect(calls).toEqual([
+      {
+        view: "cost_monitor_agent_invocations",
+        range: { from: "2026-08-01", to: "2026-08-25" },
+        page: { offset: 10, limit: 10, query: "agent-builder", provider: "openai" },
+      },
+    ]);
+    expect(loaded.run_page).toEqual({ offset: 10, limit: 10, total: 24, has_more: true });
+  });
+});
+
 describe("adaptSqliteCompactLifecyclePage", () => {
   it("keeps identical server subtotals on page two for all compact lifecycle views", () => {
     const sqlitePage = {
@@ -165,22 +261,40 @@ describe("adaptSqliteCompactLifecyclePage", () => {
       limit: 50,
       total_count: 270,
       has_more: true,
-      totals: { entity_count: 270, invocation_count: 270, total_duration: 270_000, total_tokens: 540, total_cost_usd: 270, total_cost_brl: 1_350 },
-      rows: Array.from({ length: 50 }, (_, index) => ({ task_id: `TASK-${index}`, invocation_count: 1, total_duration: 1_000, total_tokens: 2, total_cost_brl: 5 })),
+      totals: {
+        entity_count: 270,
+        invocation_count: 270,
+        total_duration: 270_000,
+        total_tokens: 540,
+        total_cost_usd: 270,
+        total_cost_brl: 1_350,
+      },
+      rows: Array.from({ length: 50 }, (_, index) => ({
+        task_id: `TASK-${index}`,
+        invocation_count: 1,
+        total_duration: 1_000,
+        total_tokens: 2,
+        total_cost_brl: 5,
+      })),
     } as const;
-    for (const [kind, view] of [["tasks", "cost_monitor_tasks"], ["specs", "cost_monitor_specs"], ["prds", "cost_monitor_prds"], ["conversations", "cost_monitor_conversations"]] as const) {
+    for (const [kind, view] of [
+      ["tasks", "cost_monitor_tasks"],
+      ["specs", "cost_monitor_specs"],
+      ["prds", "cost_monitor_prds"],
+      ["conversations", "cost_monitor_conversations"],
+    ] as const) {
       const page = adaptSqliteCompactLifecyclePage(kind, { ...sqlitePage, view });
       expect(page.rows).toHaveLength(50);
       expect(page.offset).toBe(50);
       expect(page.subtotal).toEqual({
-      entity_count: 270,
-      run_count: { known_sum: 270, unknown: 0, complete: true, coverage_ratio: 1 },
-      metrics: {
-        duration: { known_sum: 270_000, unknown: 0, complete: true, coverage_ratio: 1 },
-        total_tokens: { known_sum: 540, unknown: 0, complete: true, coverage_ratio: 1 },
-        cost_brl: { known_sum: 1_350, unknown: 0, complete: true, coverage_ratio: 1 },
-        cost_usd: { known_sum: 270, unknown: 0, complete: true, coverage_ratio: 1 },
-      },
+        entity_count: 270,
+        run_count: { known_sum: 270, unknown: 0, complete: true, coverage_ratio: 1 },
+        metrics: {
+          duration: { known_sum: 270_000, unknown: 0, complete: true, coverage_ratio: 1 },
+          total_tokens: { known_sum: 540, unknown: 0, complete: true, coverage_ratio: 1 },
+          cost_brl: { known_sum: 1_350, unknown: 0, complete: true, coverage_ratio: 1 },
+          cost_usd: { known_sum: 270, unknown: 0, complete: true, coverage_ratio: 1 },
+        },
       });
     }
   });

package/templates/.agents/dashboard/apps/frontend/src/use-app-cost-loaders.ts

@@ -1,43 +1,153 @@
+import type { CostMonitorProjection } from "@zaip-ai/dashboard-cost-monitor/contracts";
 import type {
-  LoadCompactCostPage,
   CompactLifecycleCostPage,
+  LoadCompactCostPage,
   LoadCostMonitorDetail,
   LoadCostRunPage,
 } from "@zaip-ai/dashboard-cost-monitor/react";
 import { useCallback } from "react";
-import type { CostMonitorProjection } from "@zaip-ai/dashboard-cost-monitor/contracts";
 export type LoadCostGroupPage = import("@zaip-ai/dashboard-cost-monitor/react").LoadCostGroupPage;
+
 import type { DashboardApiClient, SqliteViewPage } from "./dashboard-api.js";
-import { costGroupDuration, legacyKnownMetric, nullableSqlNumber, requiredSqlNumber } from "./sqlite-cost-adapters.js";
+import {
+  costGroupDuration,
+  legacyKnownMetric,
+  nullableSqlNumber,
+  requiredSqlNumber,
+} from "./sqlite-cost-adapters.js";
 
 type CostGroupLoadRequest = Parameters<LoadCostGroupPage>[0];
+type CostRunLoadRequest = Parameters<LoadCostRunPage>[0];
 
 function costGroupQueryOptions(request: CostGroupLoadRequest, offset: number, limit: number) {
   const { filters, query } = request;
-  return { offset, limit, ...(query === undefined || query === "" ? {} : { query }), ...(filters.provider ? { provider: filters.provider } : {}), ...(filters.model ? { model: filters.model } : {}), ...(filters.agent ? { agent: filters.agent } : {}), ...(filters.phase ? { phase: filters.phase } : {}), ...(filters.status ? { status: filters.status } : {}), ...(filters.origin ? { origin: filters.origin } : {}), ...(filters.workType ? { workType: filters.workType } : {}), ...(filters.priority ? { priority: filters.priority } : {}), ...(filters.risk ? { risk: filters.risk } : {}) };
+  return {
+    offset,
+    limit,
+    ...(query === undefined || query === "" ? {} : { query }),
+    ...(filters.provider ? { provider: filters.provider } : {}),
+    ...(filters.model ? { model: filters.model } : {}),
+    ...(filters.agent ? { agent: filters.agent } : {}),
+    ...(filters.phase ? { phase: filters.phase } : {}),
+    ...(filters.status ? { status: filters.status } : {}),
+    ...(filters.origin ? { origin: filters.origin } : {}),
+    ...(filters.workType ? { workType: filters.workType } : {}),
+    ...(filters.priority ? { priority: filters.priority } : {}),
+    ...(filters.risk ? { risk: filters.risk } : {}),
+  };
 }
 
 function adaptSqliteCostGroup(row: Record<string, unknown>) {
   const duration = costGroupDuration(row);
   const durationUnknown = Number(row.duration_unknown ?? (duration === null ? 1 : 0));
   const durationKnown = nullableSqlNumber(row.duration_known) ?? duration ?? 0;
-  return { key: String(row.key ?? row.period_key ?? "total"), label: String(row.label ?? row.key ?? row.period_key ?? ""), latest_started_at: typeof row.latest_started_at === "string" ? row.latest_started_at : "", persona: typeof row.persona === "string" ? row.persona : null, job: typeof row.job === "string" ? row.job : null, run_count: Number(row.total_run_count ?? row.invocation_count ?? 0), task_count: nullableSqlNumber(row.task_count), prd_count: Number(row.prd_count ?? 0), spec_count: Number(row.spec_count ?? 0), evidence_count: Number(row.evidence_count ?? 0), test_count: Number(row.validation_count ?? 0), event_count: Number(row.source_event_count ?? 0), total_tokens: nullableSqlNumber(row.total_tokens), estimated_usd: nullableSqlNumber(row.total_cost_usd), estimated_brl: nullableSqlNumber(row.total_cost_brl), duration_ms: duration, duration: { known_sum: durationKnown, unknown: durationUnknown, complete: durationUnknown === 0, coverage_ratio: durationUnknown === 0 ? 1 : 0 }, coverage: { events: 0, tokens: 0, usd: 0, brl: 0 } };
+  return {
+    key: String(row.key ?? row.period_key ?? "total"),
+    label: String(row.label ?? row.key ?? row.period_key ?? ""),
+    latest_started_at: typeof row.latest_started_at === "string" ? row.latest_started_at : "",
+    persona: typeof row.persona === "string" ? row.persona : null,
+    job: typeof row.job === "string" ? row.job : null,
+    run_count: Number(row.total_run_count ?? row.invocation_count ?? 0),
+    task_count: nullableSqlNumber(row.task_count),
+    prd_count: Number(row.prd_count ?? 0),
+    spec_count: Number(row.spec_count ?? 0),
+    evidence_count: Number(row.evidence_count ?? 0),
+    test_count: Number(row.validation_count ?? 0),
+    event_count: Number(row.source_event_count ?? 0),
+    total_tokens: nullableSqlNumber(row.total_tokens),
+    estimated_usd: nullableSqlNumber(row.total_cost_usd),
+    estimated_brl: nullableSqlNumber(row.total_cost_brl),
+    duration_ms: duration,
+    duration: {
+      known_sum: durationKnown,
+      unknown: durationUnknown,
+      complete: durationUnknown === 0,
+      coverage_ratio: durationUnknown === 0 ? 1 : 0,
+    },
+    coverage: { events: 0, tokens: 0, usd: 0, brl: 0 },
+  };
 }
 
-export async function loadSqliteCostGroupPage(api: DashboardApiClient, request: CostGroupLoadRequest) {
+export async function loadSqliteCostGroupPage(
+  api: DashboardApiClient,
+  request: CostGroupLoadRequest,
+) {
   const { from, limit, offset, signal, to, view } = request;
   const selectedRange = from === undefined || to === undefined ? undefined : { from, to };
   if (view === "daily") {
-    const page = await api.sqliteViewPage("cost_monitor_daily", selectedRange, costGroupQueryOptions(request, offset, limit), signal);
-    return { offset: page.offset, limit: page.limit, total_count: page.total_count, has_more: page.has_more, rows: page.rows.map(adaptSqliteCostGroup), ...(page.totals === undefined ? {} : { totals: adaptSqliteCostGroup(page.totals) }) };
+    const page = await api.sqliteViewPage(
+      "cost_monitor_daily",
+      selectedRange,
+      costGroupQueryOptions(request, offset, limit),
+      signal,
+    );
+    return {
+      offset: page.offset,
+      limit: page.limit,
+      total_count: page.total_count,
+      has_more: page.has_more,
+      rows: page.rows.map(adaptSqliteCostGroup),
+      ...(page.totals === undefined ? {} : { totals: adaptSqliteCostGroup(page.totals) }),
+    };
   }
-  const sqlView = ({ monthly: "cost_monitor_monthly", annual: "cost_monitor_annual", agents: "cost_monitor_zaip_agents", models: "cost_monitor_models", providers: "cost_monitor_providers" } as const)[view];
-  const page = await api.sqliteViewPage(sqlView, selectedRange, costGroupQueryOptions(request, offset, limit), signal);
-  return { offset: page.offset, limit: page.limit, total_count: page.total_count, has_more: page.has_more, rows: page.rows.map(adaptSqliteCostGroup), ...(page.totals === undefined ? {} : { totals: adaptSqliteCostGroup(page.totals) }) };
+  const sqlView = (
+    {
+      monthly: "cost_monitor_monthly",
+      annual: "cost_monitor_annual",
+      agents: "cost_monitor_zaip_agents",
+      models: "cost_monitor_models",
+      providers: "cost_monitor_providers",
+    } as const
+  )[view];
+  const page = await api.sqliteViewPage(
+    sqlView,
+    selectedRange,
+    costGroupQueryOptions(request, offset, limit),
+    signal,
+  );
+  return {
+    offset: page.offset,
+    limit: page.limit,
+    total_count: page.total_count,
+    has_more: page.has_more,
+    rows: page.rows.map(adaptSqliteCostGroup),
+    ...(page.totals === undefined ? {} : { totals: adaptSqliteCostGroup(page.totals) }),
+  };
+}
+
+export async function loadSqliteCostRunPage(api: DashboardApiClient, request: CostRunLoadRequest) {
+  const { filters, from, limit = 10, offset, signal, to } = request;
+  const page = await api.sqliteViewPage(
+    "cost_monitor_agent_invocations",
+    from === undefined || to === undefined ? undefined : { from, to },
+    {
+      offset,
+      limit,
+      ...(filters?.query ? { query: filters.query } : {}),
+      ...(filters?.provider ? { provider: filters.provider } : {}),
+      ...(filters?.model ? { model: filters.model } : {}),
+      ...(filters?.agent ? { agent: filters.agent } : {}),
+      ...(filters?.phase ? { phase: filters.phase } : {}),
+      ...(filters?.status ? { status: filters.status } : {}),
+    },
+    signal,
+  );
+  return {
+    page_only: true as const,
+    runs: page.rows.map(adaptSqliteCostRun),
+    run_page: {
+      offset: page.offset,
+      limit: page.limit,
+      total: page.total_count,
+      has_more: page.has_more,
+    },
+  };
 }
 
 /** Adapts a sparse SQLite invocation row to the complete CostRunRow contract. */
-export function adaptSqliteCostRun(row: Record<string, unknown>): CostMonitorProjection["runs"][number] {
+export function adaptSqliteCostRun(
+  row: Record<string, unknown>,
+): CostMonitorProjection["runs"][number] {
   const text = (value: unknown, fallback: string) => (typeof value === "string" ? value : fallback);
   const nullableNumber = (value: unknown) => (typeof value === "number" ? value : null);
   const invocationId = text(row.agent_invocation_id, "unavailable");
@@ -46,8 +156,10 @@ export function adaptSqliteCostRun(row: Record<string, unknown>): CostMonitorPro
   const prdId = typeof row.prd_id === "string" ? row.prd_id : null;
   const phase = text(row.phase, "execution");
   const durationProvenance =
-    row.duration_provenance === "observed" || row.duration_provenance === "reconciled" ||
-    row.duration_provenance === "estimated" || row.duration_provenance === "legacy_inferred"
+    row.duration_provenance === "observed" ||
+    row.duration_provenance === "reconciled" ||
+    row.duration_provenance === "estimated" ||
+    row.duration_provenance === "legacy_inferred"
       ? row.duration_provenance
       : "unavailable";
   const calculatedUsd = Object.hasOwn(row, "calculated_cost_usd")
@@ -80,7 +192,8 @@ export function adaptSqliteCostRun(row: Record<string, unknown>): CostMonitorPro
     spec_id: specId,
     prd_id: prdId,
     change_id: typeof row.change_id === "string" ? row.change_id : null,
-    parent_run_id: typeof row.parent_agent_invocation_id === "string" ? row.parent_agent_invocation_id : null,
+    parent_run_id:
+      typeof row.parent_agent_invocation_id === "string" ? row.parent_agent_invocation_id : null,
     run_role: row.invocation_kind === "subagent" ? "subagent" : "orchestrator",
     run_kind: row.run_kind === "subrun" ? "subrun" : "run",
     run_purpose: "execution",
@@ -92,12 +205,14 @@ export function adaptSqliteCostRun(row: Record<string, unknown>): CostMonitorPro
     model: text(row.model, "unavailable"),
     requested_model: text(row.requested_model, "unavailable"),
     reasoning_effort: typeof row.reasoning_effort === "string" ? row.reasoning_effort : null,
-    effective_reasoning_effort: typeof row.effective_reasoning_effort === "string" ? row.effective_reasoning_effort : null,
+    effective_reasoning_effort:
+      typeof row.effective_reasoning_effort === "string" ? row.effective_reasoning_effort : null,
     service_tier: typeof row.service_tier === "string" ? row.service_tier : null,
     call_count: nullableNumber(row.llm_call_count),
     status: text(row.status, "completed"),
     phase,
-    origin: prdId !== null ? "prd" : specId !== null ? "spec" : taskId !== null ? "task" : "conversation",
+    origin:
+      prdId !== null ? "prd" : specId !== null ? "spec" : taskId !== null ? "task" : "conversation",
     work_type: row.work_type === "rework" ? "rework" : "new",
     started_at: text(row.occurred_at, ""),
     finished_at: typeof row.finished_at === "string" ? row.finished_at : null,
@@ -146,9 +261,18 @@ export function adaptSqliteCompactLifecyclePage(
   const totals = page.totals;
   const subtotalMetric = (key: string) => legacyKnownMetric(totals?.[key]);
   return {
-    data_source: "lifecycle_daily_read_models", snapshot_id: null, source_latest_at: null, kind, offset: page.offset, limit: page.limit, total: page.total_count, has_more: page.has_more, next_cursor: null,
+    data_source: "lifecycle_daily_read_models",
+    snapshot_id: null,
+    source_latest_at: null,
+    kind,
+    offset: page.offset,
+    limit: page.limit,
+    total: page.total_count,
+    has_more: page.has_more,
+    next_cursor: null,
     subtotal: {
-      entity_count: typeof totals?.entity_count === "number" ? totals.entity_count : page.total_count,
+      entity_count:
+        typeof totals?.entity_count === "number" ? totals.entity_count : page.total_count,
       run_count: subtotalMetric("invocation_count"),
       metrics: {
         duration: subtotalMetric("total_duration"),
@@ -157,34 +281,104 @@ export function adaptSqliteCompactLifecyclePage(
         cost_usd: subtotalMetric("total_cost_usd"),
       },
     },
-    rows: page.rows.map((row) => ({ id: String(row.task_id ?? row.spec_id ?? row.prd_id ?? row.execution_id ?? row.conversation_id ?? row.id ?? "unavailable"), title: String(row.title ?? row.task_id ?? row.spec_id ?? row.prd_id ?? row.execution_id ?? row.conversation_id ?? "Unavailable"), kind: kind === "tasks" ? "task" : kind === "specs" ? "spec" : kind === "prds" ? "prd" : kind === "executions" ? "execution" : "conversation", status: typeof row.status === "string" ? row.status : null, risk: typeof row.risk === "string" ? row.risk : null, occurred_at: typeof row.occurred_at === "string" ? row.occurred_at : typeof row.started_at === "string" ? row.started_at : typeof row.last_day === "string" ? `${row.last_day}T12:00:00.000Z` : "", parent_id: null, run_count: Number(row.invocation_count ?? 0), cost_currency: "BRL", metrics: { duration: legacyKnownMetric(row.total_duration), total_tokens: legacyKnownMetric(row.total_tokens), cost: legacyKnownMetric(row.total_cost_brl) } })),
+    rows: page.rows.map((row) => ({
+      id: String(
+        row.task_id ??
+          row.spec_id ??
+          row.prd_id ??
+          row.execution_id ??
+          row.conversation_id ??
+          row.id ??
+          "unavailable",
+      ),
+      title: String(
+        row.title ??
+          row.task_id ??
+          row.spec_id ??
+          row.prd_id ??
+          row.execution_id ??
+          row.conversation_id ??
+          "Unavailable",
+      ),
+      kind:
+        kind === "tasks"
+          ? "task"
+          : kind === "specs"
+            ? "spec"
+            : kind === "prds"
+              ? "prd"
+              : kind === "executions"
+                ? "execution"
+                : "conversation",
+      status: typeof row.status === "string" ? row.status : null,
+      risk: typeof row.risk === "string" ? row.risk : null,
+      occurred_at:
+        typeof row.occurred_at === "string"
+          ? row.occurred_at
+          : typeof row.started_at === "string"
+            ? row.started_at
+            : typeof row.last_day === "string"
+              ? `${row.last_day}T12:00:00.000Z`
+              : "",
+      parent_id: null,
+      run_count: Number(row.invocation_count ?? 0),
+      cost_currency: "BRL",
+      metrics: {
+        duration: legacyKnownMetric(row.total_duration),
+        total_tokens: legacyKnownMetric(row.total_tokens),
+        cost: legacyKnownMetric(row.total_cost_brl),
+      },
+    })),
   };
 }
 
 export function useAppCostLoaders(api: DashboardApiClient) {
-  const loadCostDetail = useCallback<LoadCostMonitorDetail>(
-    async () => { throw new Error("SQLite Cost Monitor loads the selected paginated view; full detail is disabled."); },
-    [api],
-  );
+  const loadCostDetail = useCallback<LoadCostMonitorDetail>(async () => {
+    throw new Error(
+      "SQLite Cost Monitor loads the selected paginated view; full detail is disabled.",
+    );
+  }, []);
   const loadCostReadModelPage = useCallback<LoadCompactCostPage>(
     async ({ filters, from, kind, limit, offset, query, signal, to }) => {
-      const view = ({ tasks: "cost_monitor_tasks", specs: "cost_monitor_specs", prds: "cost_monitor_prds", executions: "cost_monitor_executions", conversations: "cost_monitor_conversations" } as const)[kind];
-      const page = await api.sqliteViewPage(view, from === undefined || to === undefined ? undefined : { from, to }, { offset, limit, ...(query === undefined || query === "" ? {} : { query }), ...(filters.provider ? { provider: filters.provider } : {}), ...(filters.model ? { model: filters.model } : {}), ...(filters.agent ? { agent: filters.agent } : {}), ...(filters.phase ? { phase: filters.phase } : {}), ...(filters.status ? { status: filters.status } : {}), ...(filters.origin ? { origin: filters.origin } : {}), ...(filters.workType ? { workType: filters.workType } : {}), ...(filters.priority ? { priority: filters.priority } : {}), ...(filters.risk ? { risk: filters.risk } : {}) }, signal);
+      const view = (
+        {
+          tasks: "cost_monitor_tasks",
+          specs: "cost_monitor_specs",
+          prds: "cost_monitor_prds",
+          executions: "cost_monitor_executions",
+          conversations: "cost_monitor_conversations",
+        } as const
+      )[kind];
+      const page = await api.sqliteViewPage(
+        view,
+        from === undefined || to === undefined ? undefined : { from, to },
+        {
+          offset,
+          limit,
+          ...(query === undefined || query === "" ? {} : { query }),
+          ...(filters.provider ? { provider: filters.provider } : {}),
+          ...(filters.model ? { model: filters.model } : {}),
+          ...(filters.agent ? { agent: filters.agent } : {}),
+          ...(filters.phase ? { phase: filters.phase } : {}),
+          ...(filters.status ? { status: filters.status } : {}),
+          ...(filters.origin ? { origin: filters.origin } : {}),
+          ...(filters.workType ? { workType: filters.workType } : {}),
+          ...(filters.priority ? { priority: filters.priority } : {}),
+          ...(filters.risk ? { risk: filters.risk } : {}),
+        },
+        signal,
+      );
       return adaptSqliteCompactLifecyclePage(kind, page);
     },
     [api],
   );
   const loadCostRunPage = useCallback<LoadCostRunPage>(
-    async ({ filters, from, offset, signal, to }) => {
-      const page = await api.sqliteViewPage("cost_monitor_agent_invocations", from === undefined || to === undefined ? undefined : { from, to }, { offset, limit: 100, ...(filters?.query ? { query: filters.query } : {}), ...(filters?.provider ? { provider: filters.provider } : {}), ...(filters?.model ? { model: filters.model } : {}), ...(filters?.agent ? { agent: filters.agent } : {}), ...(filters?.phase ? { phase: filters.phase } : {}), ...(filters?.status ? { status: filters.status } : {}) }, signal);
-      return {
-        page_only: true,
-        runs: page.rows.map(adaptSqliteCostRun),
-        run_page: { offset: page.offset, limit: page.limit, total: page.total_count, has_more: page.has_more },
-      };
-    },
+    (request) => loadSqliteCostRunPage(api, request),
+    [api],
+  );
+  const loadCostGroupPage = useCallback<LoadCostGroupPage>(
+    (request) => loadSqliteCostGroupPage(api, request),
     [api],
   );
-  const loadCostGroupPage = useCallback<LoadCostGroupPage>((request) => loadSqliteCostGroupPage(api, request), [api]);
   return { loadCostDetail, loadCostReadModelPage, loadCostRunPage, loadCostGroupPage };
 }

package/templates/.agents/dashboard/apps/frontend/src/use-app-effects.ts

@@ -1,6 +1,12 @@
 import type { CostCurrency, CostLocale } from "@zaip-ai/dashboard-cost-monitor/react";
 import type { OperationsProjection } from "@zaip-ai/dashboard-operations/contracts";
-import { type Dispatch, type MutableRefObject, type SetStateAction, useEffect } from "react";
+import {
+  type Dispatch,
+  type MutableRefObject,
+  type SetStateAction,
+  useEffect,
+  useRef,
+} from "react";
 import { pricingSetupPath, projectSetupPath } from "./AppSetupRoutes.js";
 import { currencyKey, localeKey } from "./app-preferences.js";
 import type { DashboardView } from "./DashboardCapabilityNav.js";
@@ -10,6 +16,24 @@ import {
   shouldHydrateOperationsDetails,
 } from "./operations-detail-hydration.js";
 
+export const projectionRefreshDebounceMs = 5_000;
+
+export function shouldRefreshVisibleProjection({
+  inFlight,
+  lastRefreshAt,
+  now,
+  visibilityState,
+}: {
+  inFlight: boolean;
+  lastRefreshAt: number;
+  now: number;
+  visibilityState: DocumentVisibilityState;
+}): boolean {
+  return (
+    visibilityState === "visible" && !inFlight && now - lastRefreshAt >= projectionRefreshDebounceMs
+  );
+}
+
 export function useAppEffects({
   api,
   costLocale,
@@ -40,13 +64,19 @@ export function useAppEffects({
   operationsPageAbortRef: MutableRefObject<AbortController | null>;
   pathname: string;
   pricing: PricingCatalog | null;
-  refresh: (visible?: boolean, reconcileOpenWork?: boolean) => Promise<void>;
+  refresh: (
+    visible?: boolean,
+    reconcileOpenWork?: boolean,
+    refreshProjection?: boolean,
+  ) => Promise<void>;
   refreshVersion: MutableRefObject<number>;
   setError: Dispatch<SetStateAction<string | null>>;
   setFxRate: Dispatch<SetStateAction<Awaited<ReturnType<DashboardApiClient["fxRate"]>> | null>>;
   setPathname: Dispatch<SetStateAction<string>>;
   setPricing: Dispatch<SetStateAction<PricingCatalog | null>>;
 }) {
+  const projectionRefreshInFlight = useRef(false);
+  const lastProjectionRefreshAt = useRef(0);
   useEffect(() => {
     void refresh();
     return () => {
@@ -66,6 +96,34 @@ export function useAppEffects({
     refreshVersion,
   ]);
 
+  useEffect(() => {
+    const refreshVisibleProjection = () => {
+      const now = Date.now();
+      // Focus and visibilitychange commonly arrive together. Coalesce them
+      // rather than polling or rebuilding during ordinary navigation.
+      if (
+        !shouldRefreshVisibleProjection({
+          inFlight: projectionRefreshInFlight.current,
+          lastRefreshAt: lastProjectionRefreshAt.current,
+          now,
+          visibilityState: document.visibilityState,
+        })
+      )
+        return;
+      lastProjectionRefreshAt.current = now;
+      projectionRefreshInFlight.current = true;
+      void refresh(false, false, true).finally(() => {
+        projectionRefreshInFlight.current = false;
+      });
+    };
+    window.addEventListener("focus", refreshVisibleProjection);
+    document.addEventListener("visibilitychange", refreshVisibleProjection);
+    return () => {
+      window.removeEventListener("focus", refreshVisibleProjection);
+      document.removeEventListener("visibilitychange", refreshVisibleProjection);
+    };
+  }, [refresh]);
+
   useEffect(() => {
     if (
       !shouldHydrateOperationsDetails(
@@ -93,11 +151,7 @@ export function useAppEffects({
   useEffect(() => window.localStorage.setItem(currencyKey, currency), [currency]);
 
   useEffect(() => {
-    if (
-      !["/", pricingSetupPath, projectSetupPath].includes(
-        window.location.pathname,
-      )
-    ) {
+    if (!["/", pricingSetupPath, projectSetupPath].includes(window.location.pathname)) {
       window.history.replaceState(null, "", `/${window.location.search}${window.location.hash}`);
       setPathname("/");
     }