@zaip-ai/cli 6.3.0 → 7.6.0

package/templates/.agents/dashboard/apps/frontend/src/sqlite-compact-cost-adapter.ts

@@ -0,0 +1,100 @@
+import type { CompactLifecycleCostPage } from "@zaip-ai/dashboard-cost-monitor/react";
+import type { SqliteViewPage } from "./dashboard-api.js";
+import { legacyKnownMetric, nullableSqlNumber } from "./sqlite-cost-adapters.js";
+
+function compactMetric(row: Record<string, unknown> | undefined, key: string) {
+  const known = row?.[`${key}_known_count`];
+  const unknown = row?.[`${key}_unknown_count`];
+  if (typeof known !== "number" || typeof unknown !== "number")
+    return legacyKnownMetric(row?.[key]);
+  return {
+    known_sum: typeof row?.[key] === "number" ? (row[key] as number) : 0,
+    unknown,
+    complete: unknown === 0 && known > 0,
+    coverage_ratio: known + unknown > 0 ? known / (known + unknown) : 0,
+  };
+}
+
+export function adaptSqliteCompactLifecyclePage(
+  kind: CompactLifecycleCostPage["kind"],
+  page: SqliteViewPage,
+): CompactLifecycleCostPage {
+  const totals = page.totals;
+  const subtotalMetric = (key: string) => compactMetric(totals, key);
+  return {
+    data_source: "lifecycle_daily_read_models",
+    snapshot_id: page.snapshot_id ?? null,
+    source_latest_at: page.snapshot_updated_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,
+      run_count: subtotalMetric("invocation_count"),
+      activity_count: subtotalMetric("activity_count"),
+      unattributed_cost_brl: nullableSqlNumber(totals?.unattributed_cost_brl),
+      unattributed_activity_count: nullableSqlNumber(totals?.unattributed_activity_count),
+      orphan_cost_brl: nullableSqlNumber(totals?.orphan_cost_brl),
+      orphan_activity_count: nullableSqlNumber(totals?.orphan_activity_count),
+      metrics: {
+        duration: subtotalMetric("total_duration"),
+        total_tokens: subtotalMetric("total_tokens"),
+        cost_brl: subtotalMetric("total_cost_brl"),
+        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),
+      activity_count: nullableSqlNumber(row.activity_count),
+      cost_currency: "BRL",
+      metrics: {
+        duration: compactMetric(row, "total_duration"),
+        total_tokens: compactMetric(row, "total_tokens"),
+        cost: compactMetric(row, "total_cost_brl"),
+      },
+    })),
+  };
+}

package/templates/.agents/dashboard/apps/frontend/src/sqlite-page-export.test.ts

@@ -29,4 +29,24 @@ describe("complete SQLite export", () => {
     expect(source).toContain('source === "operations_work_list" && filters.kind');
     expect(source).toContain("limit: 100");
   });
+
+  it("rejects a new snapshot before mixing its values into the workbook", async () => {
+    const first = {
+      offset: 0,
+      total_count: 2,
+      has_more: true,
+      snapshot_id: "generation-a",
+      rows: [{ id: "first", cost_brl: 10 }],
+    };
+    const next = vi.fn().mockResolvedValue({
+      offset: 1,
+      total_count: 2,
+      has_more: false,
+      snapshot_id: "generation-b",
+      rows: [{ id: "second", cost_brl: 25 }],
+    });
+    const iterator = allSqliteExportPages(first, next);
+    expect((await iterator.next()).value).toEqual(first.rows);
+    await expect(iterator.next()).rejects.toThrow("Os dados mudaram");
+  });
 });

package/templates/.agents/dashboard/apps/frontend/src/sqlite-page-export.ts

@@ -3,8 +3,22 @@ export type SqliteExportPage<Row extends Record<string, unknown>> = {
   total_count: number;
   has_more: boolean;
   rows: readonly Row[];
+  snapshot_id?: string | null;
+  snapshot_updated_at?: string | null;
 };
 
+export function assertSameExportSnapshot(
+  first: { snapshot_id?: string | null; snapshot_updated_at?: string | null },
+  next: { snapshot_id?: string | null; snapshot_updated_at?: string | null },
+): void {
+  const firstIdentity = first.snapshot_id ?? first.snapshot_updated_at;
+  if (firstIdentity != null && firstIdentity !== (next.snapshot_id ?? next.snapshot_updated_at)) {
+    throw new Error(
+      "Os dados mudaram durante a exportação. Atualize a página e exporte novamente.",
+    );
+  }
+}
+
 /** Export transport deliberately follows every server page, unlike the UI. */
 export async function* allSqliteExportPages<Row extends Record<string, unknown>>(
   firstPage: SqliteExportPage<Row>,
@@ -17,5 +31,6 @@ export async function* allSqliteExportPages<Row extends Record<string, unknown>>
     const nextOffset = page.offset + page.rows.length;
     if (!page.has_more || nextOffset >= page.total_count) return;
     page = await loadPage(nextOffset);
+    assertSameExportSnapshot(firstPage, page);
   }
 }

package/templates/.agents/dashboard/apps/frontend/src/styles-pricing.css

@@ -0,0 +1,265 @@
+.pricing-dialog {
+  width: 100%;
+  max-width: 1840px;
+  min-height: calc(100vh - clamp(40px, 6vw, 96px));
+  margin: 0 auto;
+  display: flex;
+  flex-direction: column;
+  border: 1px solid #2b3a52;
+  border-radius: 24px;
+  background: linear-gradient(145deg, #0d1320 0%, #090e18 100%);
+  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42);
+}
+.pricing-dialog > header,
+.pricing-dialog > footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 24px;
+  flex: 0 0 auto;
+}
+.pricing-dialog > header {
+  padding: 28px 32px 24px;
+  border-bottom: 1px solid #202b3d;
+}
+.pricing-dialog > header > div {
+  max-width: 820px;
+}
+.pricing-dialog > header small {
+  color: #77bff2;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 0.12em;
+}
+.pricing-dialog > header h1 {
+  margin: 7px 0 8px;
+  font-size: clamp(26px, 2.2vw, 34px);
+  line-height: 1.15;
+}
+.pricing-dialog > header p {
+  margin: 0;
+  color: #94a3b8;
+  line-height: 1.55;
+}
+.pricing-dialog small {
+  color: #8391a7;
+}
+.pricing-dialog button {
+  border: 1px solid #34445e;
+  border-radius: 11px;
+  padding: 11px 16px;
+  color: #eaf3ff;
+  background: #111a29;
+  cursor: pointer;
+  transition:
+    border-color 0.16s ease,
+    background 0.16s ease,
+    transform 0.16s ease;
+}
+.pricing-dialog button:hover:not(:disabled) {
+  border-color: #5c7ca5;
+  background: #17243a;
+}
+.pricing-dialog button:active:not(:disabled) {
+  transform: translateY(1px);
+}
+.pricing-dialog button:focus-visible,
+.pricing-dialog input:focus-visible,
+.pricing-dialog select:focus-visible {
+  outline: 2px solid #65b8f3;
+  outline-offset: 2px;
+}
+.pricing-dialog > header > .pricing-back-button {
+  display: inline-flex;
+  align-items: center;
+  gap: 9px;
+  flex: 0 0 auto;
+  padding: 12px 16px;
+  color: #b9dafa;
+  font-size: 14px;
+}
+.pricing-back-button span {
+  font-size: 18px;
+  line-height: 1;
+}
+.pricing-fx-settings {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
+  align-items: end;
+  gap: 32px;
+  margin: 24px 32px 0;
+  padding: 20px 22px;
+  border: 1px solid #24334a;
+  border-radius: 16px;
+  background: rgba(17, 26, 41, 0.68);
+}
+.pricing-fx-copy strong,
+.pricing-table-heading strong {
+  color: #edf5ff;
+  font-size: 15px;
+}
+.pricing-fx-copy p,
+.pricing-table-heading p {
+  margin: 7px 0 0;
+  color: #8e9bb1;
+  font-size: 13px;
+  line-height: 1.5;
+}
+.pricing-fx-settings label {
+  display: grid;
+  gap: 8px;
+  color: #9fb0c8;
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+.pricing-fx-input {
+  display: grid;
+  grid-template-columns: 44px 1fr;
+  align-items: center;
+  overflow: hidden;
+  border: 1px solid #34465f;
+  border-radius: 11px;
+  background: #0c1422;
+}
+.pricing-fx-input > span {
+  display: grid;
+  align-self: stretch;
+  place-items: center;
+  border-right: 1px solid #2b3950;
+  color: #75bff4;
+  font-weight: 800;
+}
+.pricing-dialog .pricing-fx-input input {
+  min-width: 0;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+}
+.pricing-table-heading {
+  display: flex;
+  align-items: end;
+  justify-content: space-between;
+  gap: 20px;
+  padding: 24px 34px 12px;
+}
+.pricing-table-heading > span {
+  border: 1px solid #2c405c;
+  border-radius: 999px;
+  padding: 6px 10px;
+  color: #8fc8f2;
+  background: #101c2c;
+  font-size: 12px;
+  white-space: nowrap;
+}
+.pricing-table-wrap {
+  overflow-x: auto;
+  overflow-y: visible;
+  margin: 0 16px;
+  padding: 0 16px 24px;
+  scrollbar-gutter: stable both-edges;
+}
+.pricing-dialog table {
+  width: 100%;
+  min-width: 1760px;
+  border-collapse: separate;
+  border-spacing: 0;
+}
+.pricing-dialog th {
+  position: sticky;
+  top: 0;
+  z-index: 2;
+  padding: 14px 10px;
+  border-top: 1px solid #202c40;
+  border-bottom: 1px solid #28364c;
+  color: #8fb9eb;
+  background: #0d1421;
+  text-align: left;
+  font-size: 10px;
+  line-height: 1.35;
+  letter-spacing: 0.09em;
+  text-transform: uppercase;
+}
+.pricing-dialog th:first-child {
+  border-top-left-radius: 12px;
+  padding-left: 14px;
+}
+.pricing-dialog th:last-child {
+  border-top-right-radius: 12px;
+}
+.pricing-dialog td {
+  padding: 12px 10px;
+  border-bottom: 1px solid #1c2738;
+  vertical-align: top;
+}
+.pricing-dialog tbody tr {
+  transition: background 0.16s ease;
+}
+.pricing-dialog tbody tr:hover {
+  background: rgba(59, 130, 246, 0.045);
+}
+.pricing-dialog input,
+.pricing-dialog select {
+  width: 100%;
+  min-width: 116px;
+  box-sizing: border-box;
+  border: 1px solid #2e3e56;
+  border-radius: 10px;
+  padding: 11px 12px;
+  color: #eef5ff;
+  background: #101827;
+}
+.pricing-dialog input:hover,
+.pricing-dialog select:hover {
+  border-color: #415978;
+}
+.pricing-dialog td:first-child {
+  min-width: 240px;
+  padding-left: 14px;
+}
+.pricing-dialog td:first-child input {
+  min-width: 220px;
+}
+.pricing-dialog td:first-child small {
+  display: block;
+  margin: 7px 2px 0;
+}
+.pricing-dialog td:last-child {
+  padding-right: 14px;
+}
+.pricing-dialog td:last-child button {
+  width: 40px;
+  height: 40px;
+  padding: 0;
+  color: #fca5a5;
+}
+.pricing-dialog > footer {
+  position: sticky;
+  bottom: 0;
+  z-index: 4;
+  margin-top: auto;
+  padding: 20px 32px 24px;
+  border-top: 1px solid #202a3b;
+  border-radius: 0 0 24px 24px;
+  background: rgba(9, 14, 24, 0.96);
+  backdrop-filter: blur(12px);
+}
+.pricing-dialog > footer div {
+  display: flex;
+  gap: 12px;
+}
+.pricing-dialog > footer div button:last-child {
+  border-color: #3d7eb0;
+  background: #153550;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    scroll-behavior: auto;
+    transition: none;
+    animation: none;
+  }
+}

package/templates/.agents/dashboard/apps/frontend/src/styles.css

@@ -397,6 +397,27 @@ select:focus-visible {
   width: 28px;
 }
 
+.dashboard-toast-stack {
+  position: fixed;
+  z-index: 80;
+  right: 18px;
+  bottom: 18px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  width: min(440px, calc(100vw - 36px));
+  max-height: calc(100dvh - 36px);
+  overflow-y: auto;
+  pointer-events: none;
+}
+.dashboard-toast-stack > .app-refresh-status,
+.dashboard-toast-stack > .app-reconciliation-result {
+  position: static;
+  width: 100%;
+  flex: 0 0 auto;
+  pointer-events: auto;
+}
+
 .app-refresh-status {
   position: fixed;
   z-index: 80;
@@ -493,268 +514,3 @@ select:focus-visible {
   padding: clamp(20px, 3vw, 48px);
   background: radial-gradient(circle at 50% 0, rgba(48, 139, 207, 0.09), transparent 36%), #070b13;
 }
-.pricing-dialog {
-  width: 100%;
-  max-width: 1840px;
-  min-height: calc(100vh - clamp(40px, 6vw, 96px));
-  margin: 0 auto;
-  display: flex;
-  flex-direction: column;
-  border: 1px solid #2b3a52;
-  border-radius: 24px;
-  background: linear-gradient(145deg, #0d1320 0%, #090e18 100%);
-  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42);
-}
-.pricing-dialog > header,
-.pricing-dialog > footer {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 24px;
-  flex: 0 0 auto;
-}
-.pricing-dialog > header {
-  padding: 28px 32px 24px;
-  border-bottom: 1px solid #202b3d;
-}
-.pricing-dialog > header > div {
-  max-width: 820px;
-}
-.pricing-dialog > header small {
-  color: #77bff2;
-  font-size: 11px;
-  font-weight: 700;
-  letter-spacing: 0.12em;
-}
-.pricing-dialog > header h1 {
-  margin: 7px 0 8px;
-  font-size: clamp(26px, 2.2vw, 34px);
-  line-height: 1.15;
-}
-.pricing-dialog > header p {
-  margin: 0;
-  color: #94a3b8;
-  line-height: 1.55;
-}
-.pricing-dialog small {
-  color: #8391a7;
-}
-.pricing-dialog button {
-  border: 1px solid #34445e;
-  border-radius: 11px;
-  padding: 11px 16px;
-  color: #eaf3ff;
-  background: #111a29;
-  cursor: pointer;
-  transition:
-    border-color 0.16s ease,
-    background 0.16s ease,
-    transform 0.16s ease;
-}
-.pricing-dialog button:hover:not(:disabled) {
-  border-color: #5c7ca5;
-  background: #17243a;
-}
-.pricing-dialog button:active:not(:disabled) {
-  transform: translateY(1px);
-}
-.pricing-dialog button:focus-visible,
-.pricing-dialog input:focus-visible,
-.pricing-dialog select:focus-visible {
-  outline: 2px solid #65b8f3;
-  outline-offset: 2px;
-}
-.pricing-dialog > header > .pricing-back-button {
-  display: inline-flex;
-  align-items: center;
-  gap: 9px;
-  flex: 0 0 auto;
-  padding: 12px 16px;
-  color: #b9dafa;
-  font-size: 14px;
-}
-.pricing-back-button span {
-  font-size: 18px;
-  line-height: 1;
-}
-.pricing-fx-settings {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
-  align-items: end;
-  gap: 32px;
-  margin: 24px 32px 0;
-  padding: 20px 22px;
-  border: 1px solid #24334a;
-  border-radius: 16px;
-  background: rgba(17, 26, 41, 0.68);
-}
-.pricing-fx-copy strong,
-.pricing-table-heading strong {
-  color: #edf5ff;
-  font-size: 15px;
-}
-.pricing-fx-copy p,
-.pricing-table-heading p {
-  margin: 7px 0 0;
-  color: #8e9bb1;
-  font-size: 13px;
-  line-height: 1.5;
-}
-.pricing-fx-settings label {
-  display: grid;
-  gap: 8px;
-  color: #9fb0c8;
-  font-size: 12px;
-  font-weight: 700;
-  letter-spacing: 0.04em;
-  text-transform: uppercase;
-}
-.pricing-fx-input {
-  display: grid;
-  grid-template-columns: 44px 1fr;
-  align-items: center;
-  overflow: hidden;
-  border: 1px solid #34465f;
-  border-radius: 11px;
-  background: #0c1422;
-}
-.pricing-fx-input > span {
-  display: grid;
-  align-self: stretch;
-  place-items: center;
-  border-right: 1px solid #2b3950;
-  color: #75bff4;
-  font-weight: 800;
-}
-.pricing-dialog .pricing-fx-input input {
-  min-width: 0;
-  border: 0;
-  border-radius: 0;
-  background: transparent;
-}
-.pricing-table-heading {
-  display: flex;
-  align-items: end;
-  justify-content: space-between;
-  gap: 20px;
-  padding: 24px 34px 12px;
-}
-.pricing-table-heading > span {
-  border: 1px solid #2c405c;
-  border-radius: 999px;
-  padding: 6px 10px;
-  color: #8fc8f2;
-  background: #101c2c;
-  font-size: 12px;
-  white-space: nowrap;
-}
-.pricing-table-wrap {
-  overflow-x: auto;
-  overflow-y: visible;
-  margin: 0 16px;
-  padding: 0 16px 24px;
-  scrollbar-gutter: stable both-edges;
-}
-.pricing-dialog table {
-  width: 100%;
-  min-width: 1760px;
-  border-collapse: separate;
-  border-spacing: 0;
-}
-.pricing-dialog th {
-  position: sticky;
-  top: 0;
-  z-index: 2;
-  padding: 14px 10px;
-  border-top: 1px solid #202c40;
-  border-bottom: 1px solid #28364c;
-  color: #8fb9eb;
-  background: #0d1421;
-  text-align: left;
-  font-size: 10px;
-  line-height: 1.35;
-  letter-spacing: 0.09em;
-  text-transform: uppercase;
-}
-.pricing-dialog th:first-child {
-  border-top-left-radius: 12px;
-  padding-left: 14px;
-}
-.pricing-dialog th:last-child {
-  border-top-right-radius: 12px;
-}
-.pricing-dialog td {
-  padding: 12px 10px;
-  border-bottom: 1px solid #1c2738;
-  vertical-align: top;
-}
-.pricing-dialog tbody tr {
-  transition: background 0.16s ease;
-}
-.pricing-dialog tbody tr:hover {
-  background: rgba(59, 130, 246, 0.045);
-}
-.pricing-dialog input,
-.pricing-dialog select {
-  width: 100%;
-  min-width: 116px;
-  box-sizing: border-box;
-  border: 1px solid #2e3e56;
-  border-radius: 10px;
-  padding: 11px 12px;
-  color: #eef5ff;
-  background: #101827;
-}
-.pricing-dialog input:hover,
-.pricing-dialog select:hover {
-  border-color: #415978;
-}
-.pricing-dialog td:first-child {
-  min-width: 240px;
-  padding-left: 14px;
-}
-.pricing-dialog td:first-child input {
-  min-width: 220px;
-}
-.pricing-dialog td:first-child small {
-  display: block;
-  margin: 7px 2px 0;
-}
-.pricing-dialog td:last-child {
-  padding-right: 14px;
-}
-.pricing-dialog td:last-child button {
-  width: 40px;
-  height: 40px;
-  padding: 0;
-  color: #fca5a5;
-}
-.pricing-dialog > footer {
-  position: sticky;
-  bottom: 0;
-  z-index: 4;
-  margin-top: auto;
-  padding: 20px 32px 24px;
-  border-top: 1px solid #202a3b;
-  border-radius: 0 0 24px 24px;
-  background: rgba(9, 14, 24, 0.96);
-  backdrop-filter: blur(12px);
-}
-.pricing-dialog > footer div {
-  display: flex;
-  gap: 12px;
-}
-.pricing-dialog > footer div button:last-child {
-  border-color: #3d7eb0;
-  background: #153550;
-}
-
-@media (prefers-reduced-motion: reduce) {
-  *,
-  *::before,
-  *::after {
-    scroll-behavior: auto;
-    transition: none;
-    animation: none;
-  }
-}