@zaip-ai/cli 1.3.5 → 1.3.7

package/templates/.agents/dashboard/modules/operations/src/react/OperationsFilteredStatusDialog.tsx

@@ -0,0 +1,131 @@
+import type { DashboardTaskProjection, MacroProjection } from "../contracts.js";
+import type { OverviewStatusKind, OverviewStatusPage } from "./operations-page-contract.js";
+import { type OperationsLocale, riskLabel } from "./status-labels.js";
+
+export function OperationsFilteredStatusDialog({
+  eyebrow,
+  label,
+  locale,
+  onClose,
+  onOpenTask,
+  onOpenDocument,
+  items,
+  state,
+  kind = "task",
+  onLoadMore,
+  page,
+}: {
+  eyebrow: string;
+  label: string;
+  locale: OperationsLocale;
+  onClose: () => void;
+  onOpenTask: (taskId: string) => void;
+  onOpenDocument: (kind: "prd" | "spec", id: string) => void;
+  items: readonly (DashboardTaskProjection | MacroProjection)[];
+  state?: { loading: boolean; error: string | null } | undefined;
+  kind?: OverviewStatusKind;
+  onLoadMore?: ((offset: number) => void) | undefined;
+  page?: OverviewStatusPage | undefined;
+}) {
+  const total = page?.total ?? items.length;
+  const taskLabel = statusTypeLabel(kind, total, locale);
+  return (
+    <dialog
+      className="operations-status-dialog-backdrop"
+      onMouseDown={(event) => {
+        if (event.currentTarget === event.target) onClose();
+      }}
+      open
+    >
+      <section
+        aria-label={`${label} — ${total} ${taskLabel}`}
+        aria-modal="true"
+        className="operations-status-dialog"
+        role="dialog"
+      >
+        <header>
+          <div>
+            <span>{eyebrow}</span>
+            <h2>{label}</h2>
+            <p>
+              {total} {taskLabel}
+            </p>
+          </div>
+          <button
+            aria-label={locale === "pt-BR" ? "Fechar" : "Close"}
+            onClick={onClose}
+            type="button"
+          >
+            ×
+          </button>
+        </header>
+        <div className="operations-status-task-list">
+          {(page?.loading ?? state?.loading) && items.length === 0 ? (
+            <p aria-busy="true" aria-live="polite" className="operations-empty" role="status">
+              {locale === "pt-BR" ? "Carregando itens\u2026" : "Loading items\u2026"}
+            </p>
+          ) : null}
+          {(page?.error ?? state?.error) ? (
+            <p aria-live="assertive" className="operations-empty" role="alert">
+              {page?.error ?? state?.error}
+            </p>
+          ) : null}
+          {items.map((item) => (
+            <button
+              key={item.id}
+              onClick={() =>
+                "change_id" in item ? onOpenTask(item.id) : onOpenDocument(item.kind, item.id)
+              }
+              type="button"
+            >
+              <span className="operations-status-task-main">
+                <strong>{item.title}</strong>
+                <small>{item.id}</small>
+              </span>
+              <span
+                className={
+                  "change_id" in item
+                    ? `operations-risk is-${item.risk}`
+                    : "operations-work-kind is-macro"
+                }
+              >
+                {"change_id" in item ? riskLabel(item.risk, locale) : item.kind.toUpperCase()}
+              </span>
+              <span className="operations-status-task-action">
+                {locale === "pt-BR" ? "Ver detalhes" : "View details"} →
+              </span>
+            </button>
+          ))}
+          {items.length === 0 && !(page?.loading ?? state?.loading) ? (
+            <p className="operations-empty">
+              {locale === "pt-BR"
+                ? `Nenhum${kind === "task" ? "a" : ""} ${statusTypeLabel(kind, 1, locale)} neste status.`
+                : `No ${statusTypeLabel(kind, 2, locale)} in this status.`}
+            </p>
+          ) : null}
+          {onLoadMore && items.length < (page?.total ?? 0) ? (
+            <button disabled={page?.loading} onClick={() => onLoadMore(items.length)} type="button">
+              {page?.loading
+                ? locale === "pt-BR"
+                  ? "Carregando…"
+                  : "Loading…"
+                : locale === "pt-BR"
+                  ? "Carregar mais"
+                  : "Load more"}
+            </button>
+          ) : null}
+        </div>
+      </section>
+    </dialog>
+  );
+}
+
+function statusTypeLabel(
+  kind: OverviewStatusKind,
+  count: number,
+  locale: OperationsLocale,
+): string {
+  if (kind === "prd") return count === 1 ? "PRD" : "PRDs";
+  if (kind === "spec") return count === 1 ? "SPEC" : "SPECs";
+  return locale === "pt-BR" ? (count === 1 ? "tarefa" : "tarefas") : count === 1 ? "task" : "tasks";
+}

package/templates/.agents/dashboard/modules/operations/src/react/OperationsOverview.tsx

@@ -6,12 +6,9 @@ import {
   formatPercent,
 } from "@zaip-ai/dashboard-ui";
 import { type ReactNode, useState } from "react";
-import type {
-  DashboardTaskProjection,
-  MacroProjection,
-  OperationsProjection,
-} from "../contracts.js";
+import type { MacroProjection, OperationsProjection } from "../contracts.js";
 import { allPhaseMetricTotals, executionMetricTotals } from "./execution-metrics.js";
+import { OperationsFilteredStatusDialog as FilteredStatusDialog } from "./OperationsFilteredStatusDialog.js";
 import type { EntityMetric } from "./OperationsOverview.helpers.js";
 import {
   aggregateMacroMetrics,
@@ -915,134 +912,6 @@ export function OperationsOverview({
   );
 }
 
-function FilteredStatusDialog({
-  eyebrow,
-  label,
-  locale,
-  onClose,
-  onOpenTask,
-  onOpenDocument,
-  items,
-  state,
-  kind = "task",
-  onLoadMore,
-  page,
-}: {
-  eyebrow: string;
-  label: string;
-  locale: OperationsLocale;
-  onClose: () => void;
-  onOpenTask: (taskId: string) => void;
-  onOpenDocument: (kind: "prd" | "spec", id: string) => void;
-  items: readonly (DashboardTaskProjection | MacroProjection)[];
-  state?: { loading: boolean; error: string | null } | undefined;
-  kind?: OverviewStatusKind;
-  onLoadMore?: ((offset: number) => void) | undefined;
-  page?: OverviewStatusPage | undefined;
-}) {
-  const total = page?.total ?? items.length;
-  const taskLabel = statusTypeLabel(kind, total, locale);
-  return (
-    <dialog
-      className="operations-status-dialog-backdrop"
-      onMouseDown={(event) => {
-        if (event.currentTarget === event.target) onClose();
-      }}
-      open
-    >
-      <section
-        aria-label={`${label} — ${total} ${taskLabel}`}
-        aria-modal="true"
-        className="operations-status-dialog"
-        role="dialog"
-      >
-        <header>
-          <div>
-            <span>{eyebrow}</span>
-            <h2>{label}</h2>
-            <p>
-              {total} {taskLabel}
-            </p>
-          </div>
-          <button
-            aria-label={locale === "pt-BR" ? "Fechar" : "Close"}
-            onClick={onClose}
-            type="button"
-          >
-            ×
-          </button>
-        </header>
-        <div className="operations-status-task-list">
-          {(page?.loading ?? state?.loading) && items.length === 0 ? (
-            <p aria-busy="true" aria-live="polite" className="operations-empty" role="status">
-              {locale === "pt-BR" ? "Carregando itens\u2026" : "Loading items\u2026"}
-            </p>
-          ) : null}
-          {(page?.error ?? state?.error) ? (
-            <p aria-live="assertive" className="operations-empty" role="alert">
-              {page?.error ?? state?.error}
-            </p>
-          ) : null}
-          {items.map((item) => (
-            <button
-              key={item.id}
-              onClick={() =>
-                "change_id" in item ? onOpenTask(item.id) : onOpenDocument(item.kind, item.id)
-              }
-              type="button"
-            >
-              <span className="operations-status-task-main">
-                <strong>{item.title}</strong>
-                <small>{item.id}</small>
-              </span>
-              <span
-                className={
-                  "change_id" in item
-                    ? `operations-risk is-${item.risk}`
-                    : "operations-work-kind is-macro"
-                }
-              >
-                {"change_id" in item ? riskLabel(item.risk, locale) : item.kind.toUpperCase()}
-              </span>
-              <span className="operations-status-task-action">
-                {locale === "pt-BR" ? "Ver detalhes" : "View details"} →
-              </span>
-            </button>
-          ))}
-          {items.length === 0 && !(page?.loading ?? state?.loading) ? (
-            <p className="operations-empty">
-              {locale === "pt-BR"
-                ? `Nenhum${kind === "task" ? "a" : ""} ${statusTypeLabel(kind, 1, locale)} neste status.`
-                : `No ${statusTypeLabel(kind, 2, locale)} in this status.`}
-            </p>
-          ) : null}
-          {onLoadMore && items.length < (page?.total ?? 0) ? (
-            <button disabled={page?.loading} onClick={() => onLoadMore(items.length)} type="button">
-              {page?.loading
-                ? locale === "pt-BR"
-                  ? "Carregando…"
-                  : "Loading…"
-                : locale === "pt-BR"
-                  ? "Carregar mais"
-                  : "Load more"}
-            </button>
-          ) : null}
-        </div>
-      </section>
-    </dialog>
-  );
-}
-
-function statusTypeLabel(
-  kind: OverviewStatusKind,
-  count: number,
-  locale: OperationsLocale,
-): string {
-  if (kind === "prd") return count === 1 ? "PRD" : "PRDs";
-  if (kind === "spec") return count === 1 ? "SPEC" : "SPECs";
-  return locale === "pt-BR" ? (count === 1 ? "tarefa" : "tarefas") : count === 1 ? "task" : "tasks";
-}
-
 function PanelHeader({ title, hint, action }: { title: string; hint: string; action?: ReactNode }) {
   return (
     <header className="operations-panel-header">

package/templates/.agents/dashboard/modules/operations/src/react/operations-overview.status-cards.test.ts

@@ -2,6 +2,10 @@ import { readFileSync } from "node:fs";
 import { describe, expect, it } from "vitest";
 
 const source = readFileSync(new URL("./OperationsOverview.tsx", import.meta.url), "utf8");
+const dialogSource = readFileSync(
+  new URL("./OperationsFilteredStatusDialog.tsx", import.meta.url),
+  "utf8",
+);
 
 describe("OperationsOverview status cards", () => {
   it("opens a filtered dialog for Tasks, SPECs, and PRDs", () => {
@@ -12,16 +16,18 @@ describe("OperationsOverview status cards", () => {
   });
 
   it("uses selected-type labels, closes before document navigation, and paginates", () => {
-    expect(source).toContain("onOpenDocument(item.kind, item.id)");
+    expect(dialogSource).toContain("onOpenDocument(item.kind, item.id)");
     expect(source).toContain("setSelectedStatus(null);");
     expect(source).toContain('"Status das tarefas"');
     expect(source).toContain('"Status das SPECs"');
     expect(source).toContain('"Status dos PRDs"');
-    expect(source).toContain("const total = page?.total ?? items.length;");
-    expect(source).toContain("aria-label={`${label} — ${total} ${taskLabel}`}");
-    expect(source).toContain("onLoadMore(items.length)");
-    expect(source).toContain('aria-busy="true"');
-    expect(source).toContain('role="alert"');
-    expect(source).toContain('Nenhum${kind === "task" ? "a" : ""}');
+    expect(dialogSource).toContain("const total = page?.total ?? items.length;");
+    expect(dialogSource).toContain(
+      "aria-label={`" + "$" + "{label} — $" + "{total} $" + "{taskLabel}`}",
+    );
+    expect(dialogSource).toContain("onLoadMore(items.length)");
+    expect(dialogSource).toContain('aria-busy="true"');
+    expect(dialogSource).toContain('role="alert"');
+    expect(dialogSource).toContain("Nenhum$" + '{kind === "task" ? "a" : ""}');
   });
 });

package/templates/.agents/dashboard/packages/local-runtime/src/server.test.ts

@@ -582,7 +582,7 @@ describe("dashboard backend", () => {
       tasks: expect.any(Array),
       runs: expect.any(Array),
     });
-  });
+  }, 60_000);
   it("serves only allowlisted canonical agent portraits", async () => {
     const app = createDashboardApp(workspaceRoot, "test-session");
     const agentIds = [

package/templates/.agents/dashboard/packages/local-runtime/start-dashboard-prerequisites.mjs

@@ -0,0 +1,40 @@
+import { access, mkdir } from "node:fs/promises";
+import { relative, resolve } from "node:path";
+import process from "node:process";
+
+async function exists(path) {
+  return access(path).then(
+    () => true,
+    () => false,
+  );
+}
+
+/**
+ * A fresh npm installation has no lifecycle history yet. The SQLite read
+ * model supports that empty state, so its canonical source root is created
+ * instead of requiring the development workspace to be installed again.
+ */
+export async function ensureDashboardRecordsDirectory(root) {
+  await mkdir(resolve(root, ".agents/records"), { recursive: true });
+}
+
+export async function assertDashboardPrerequisites(workspaceRoot) {
+  const [major, minor] = process.versions.node.split(".").map(Number);
+  if (!Number.isInteger(major) || major < 22 || (major === 22 && minor < 16))
+    throw new Error(
+      `O Dashboard SQLite requer Node.js 22.16.0 ou superior; a versão encontrada foi ${process.versions.node}. Atualize o Node.js e tente novamente.`,
+    );
+  try {
+    await import("node:sqlite");
+  } catch {
+    throw new Error(
+      "O Node.js instalado não disponibiliza node:sqlite. Reinstale o Node.js 22.16.0 ou superior com suporte a SQLite.",
+    );
+  }
+  await ensureDashboardRecordsDirectory(workspaceRoot);
+  const required = resolve(workspaceRoot, ".agents/config");
+  if (!(await exists(required)))
+    throw new Error(
+      `Pré-requisito do Dashboard SQLite ausente: ${relative(workspaceRoot, required) || required}. Execute npx @zaip-ai/cli@latest init na raiz do projeto e tente novamente.`,
+    );
+}

package/templates/.agents/dashboard/packages/local-runtime/start-dashboard-prerequisites.test.mjs

@@ -0,0 +1,46 @@
+import { access, mkdir, mkdtemp, rm } from "node:fs/promises";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+import { afterEach, describe, expect, it } from "vitest";
+import {
+  assertDashboardPrerequisites,
+  ensureDashboardRecordsDirectory,
+} from "./start-dashboard-prerequisites.mjs";
+
+const temporaryDirectories = [];
+
+afterEach(async () => {
+  await Promise.all(
+    temporaryDirectories.splice(0).map((path) => rm(path, { recursive: true, force: true })),
+  );
+});
+
+describe("dashboard SQLite prerequisites", () => {
+  it("creates the empty records root required by a fresh npm installation", async () => {
+    const root = await mkdtemp(join(tmpdir(), "zaip-dashboard-empty-records-"));
+    temporaryDirectories.push(root);
+
+    await expect(access(join(root, ".agents", "records"))).rejects.toMatchObject({
+      code: "ENOENT",
+    });
+    await ensureDashboardRecordsDirectory(root);
+    await expect(access(join(root, ".agents", "records"))).resolves.toBeUndefined();
+  });
+
+  it("accepts a zeroed workspace after creating its records root", async () => {
+    const root = await mkdtemp(join(tmpdir(), "zaip-dashboard-prerequisites-"));
+    temporaryDirectories.push(root);
+    await mkdir(join(root, ".agents", "config"), { recursive: true });
+
+    await expect(assertDashboardPrerequisites(root)).resolves.toBeUndefined();
+    await expect(access(join(root, ".agents", "records"))).resolves.toBeUndefined();
+  });
+
+  it("directs incomplete consumers to init instead of a development install", async () => {
+    const root = await mkdtemp(join(tmpdir(), "zaip-dashboard-missing-config-"));
+    temporaryDirectories.push(root);
+    await expect(assertDashboardPrerequisites(root)).rejects.toThrow(
+      "npx @zaip-ai/cli@latest init",
+    );
+  });
+});

package/templates/.agents/dashboard/packages/local-runtime/start-dashboard.mjs

@@ -25,6 +25,7 @@ import {
   presentLaunchFailure,
   writeLauncherStatus,
 } from "./start-dashboard-lifecycle.mjs";
+import { assertDashboardPrerequisites } from "./start-dashboard-prerequisites.mjs";
 import {
   isProcessAlive,
   stopOwnedDashboardProcess,
@@ -171,30 +172,7 @@ export function formatLauncherError(value, maximumLength = 3_600) {
   const lastHalf = maximumLength - firstHalf;
   return `${message.slice(0, firstHalf)}\n\n… detalhes reduzidos; consulte o log temporário …\n\n${message.slice(-lastHalf)}`;
 }
-export async function assertDashboardPrerequisites() {
-  const major = Number.parseInt(process.versions.node.split(".")[0] ?? "", 10);
-  if (!Number.isInteger(major) || major < 22)
-    throw new Error(
-      `O Dashboard SQLite requer Node.js 22 ou superior; a versão encontrada foi ${process.versions.node}. Instale o Node.js 22 e tente novamente.`,
-    );
-  try {
-    await import("node:sqlite");
-  } catch {
-    throw new Error(
-      "O Node.js instalado não disponibiliza node:sqlite. Reinstale uma versão suportada do Node.js 22 ou superior.",
-    );
-  }
-  for (const required of [
-    resolve(workspaceRoot, ".agents/records"),
-    resolve(workspaceRoot, ".agents/config"),
-    resolve(workspaceRoot, "node_modules/esbuild"),
-  ]) {
-    if (!(await exists(required)))
-      throw new Error(
-        `Pré-requisito do Dashboard SQLite ausente: ${relative(workspaceRoot, required) || required}. Execute corepack pnpm install na raiz do ZAIP-AIOS e tente novamente.`,
-      );
-  }
-}
+
 export async function readDashboardSession(path = sessionPath) {
   try {
     return JSON.parse(await readFile(path, "utf8"));
@@ -457,6 +435,32 @@ export async function refreshDashboardBuildTargets({
   return { artifacts: Object.values(targets).flatMap((target) => target.artifacts), builtTargets };
 }
 async function ensureFreshDashboardBuild(onProgress = () => {}) {
+  // npm consumers receive a ready-to-run server and frontend bundle. They do
+  // not receive development-only esbuild, so never turn the first dashboard
+  // click into a pnpm-install requirement when that packaged runtime exists.
+  const buildTool = resolve(workspaceRoot, "node_modules/esbuild");
+  if (!(await exists(buildTool))) {
+    const packagedArtifacts = [installedServer, resolve(frontendRoot, "index.html")];
+    if (
+      await Promise.all(packagedArtifacts.map((path) => exists(path))).then((entries) =>
+        entries.every(Boolean),
+      )
+    ) {
+      buildProgress(
+        onProgress,
+        39,
+        "Usando runtime empacotado",
+        "O pacote npm já inclui o dashboard pronto; nenhuma instalação de desenvolvimento é necessária.",
+      );
+      const signature = await Promise.all(
+        [...packagedArtifacts, resolve(packageRoot, "start-dashboard.mjs")].map(async (path) => {
+          const details = await stat(path);
+          return `${path}:${details.size}:${details.mtimeMs}`;
+        }),
+      );
+      return createHash("sha256").update(signature.join("|")).digest("hex");
+    }
+  }
   const { artifacts } = await refreshDashboardBuildTargets({ onProgress });
   const artifactFingerprint = await Promise.all(
     [...artifacts, resolve(packageRoot, "start-dashboard.mjs")].map(async (path) => {
@@ -626,7 +630,10 @@ async function redirectLaunchPage(launchPage, target) {
   launchPage.closeAfterHandoffGrace();
 }
 async function assertRuntimeReady() {
-  const serverPath = (await exists(sourceServer)) ? sourceServer : installedServer;
+  const serverPath =
+    (await exists(resolve(workspaceRoot, "node_modules/esbuild"))) && (await exists(sourceServer))
+      ? sourceServer
+      : installedServer;
   if (!(await exists(serverPath))) {
     throw new Error(
       "Dashboard server bundle is missing; run the ZAIP release build or reinstall ZAIP-AIOS",
@@ -854,7 +861,7 @@ async function main() {
       detail:
         "Verificando Node.js 22 e o suporte a node:sqlite; isto não instala um banco de dados.",
     });
-    await assertDashboardPrerequisites();
+    await assertDashboardPrerequisites(workspaceRoot);
     launchPage.setProgress({
       percent: 18,
       phase: "Preparando a sessão do dashboard",

package/templates/.agents/dashboard/packages/local-runtime/start-dashboard.test.mjs

@@ -5,7 +5,6 @@ import { tmpdir } from "node:os";
 import { join } from "node:path";
 import { afterEach, describe, expect, it } from "vitest";
 import {
-  assertDashboardPrerequisites,
   browserLaunchCommands,
   findAvailablePort,
   findAvailablePortWithFallback,
@@ -56,17 +55,15 @@ describe("dashboard executable session", () => {
     expect(stripTerminalControlCodes(colored)).toBe("Missing export");
   });
 
-  it("shows preparation before validating a Node runtime that can import node:sqlite", async () => {
+  it("shows preparation before validating dashboard prerequisites", async () => {
     const source = await readFile(new URL("./start-dashboard.mjs", import.meta.url), "utf8");
 
-    expect(source).toContain("export async function assertDashboardPrerequisites()");
-    expect(source).toContain('await import("node:sqlite")');
-    expect(source).not.toContain('builtinModules.includes("node:sqlite")');
-    expect(source).toContain("Node.js 22 ou superior");
+    expect(source).toContain('from "./start-dashboard-prerequisites.mjs";');
+    expect(source).toContain("await assertDashboardPrerequisites(workspaceRoot);");
+    expect(source).toContain("Usando runtime empacotado");
     expect(source.indexOf("await openBrowser(dashboardUrl(launchPort, token))")).toBeLessThan(
-      source.indexOf("await assertDashboardPrerequisites();"),
+      source.indexOf("await assertDashboardPrerequisites(workspaceRoot);"),
     );
-    await expect(assertDashboardPrerequisites()).resolves.toBeUndefined();
   });
 
   it("keeps the beginning and end of an oversized launcher error", () => {

package/templates/.agents/dashboard/tests/e2e/specs/cost-monitor-loading.spec.ts

@@ -50,7 +50,7 @@ test("releases an aborted Cost group load and keeps Operation reachable", async
   });
 
   await openDashboard(page);
-  await expectGlobalMonthPreset(page);
+  await expectGlobalAllTimePreset(page);
   const capabilityNav = page.getByRole("navigation", { name: "Áreas do dashboard" });
   await capabilityNav.getByRole("button", { name: /Monitor de Custos/ }).click();
   const costTabs = page.locator(".cost-tabs");
@@ -87,7 +87,7 @@ test("loads every Cost Monitor tab before returning to Operation", async ({ page
   });
 
   await openDashboard(page);
-  await expectGlobalMonthPreset(page);
+  await expectGlobalAllTimePreset(page);
   const capabilityNav = page.getByRole("navigation", { name: "Áreas do dashboard" });
   await capabilityNav.getByRole("button", { name: /Monitor de Custos/ }).click();
   const costTabs = page.locator(".cost-tabs");
@@ -124,10 +124,8 @@ test("loads every Cost Monitor tab before returning to Operation", async ({ page
   expect(failedApiResponses).toEqual([]);
 });
 
-async function expectGlobalMonthPreset(page: import("@playwright/test").Page) {
-  await expect(
-    page.locator(".dashboard-global-controls").getByLabel("Período"),
-  ).toHaveValue("this-month");
+async function expectGlobalAllTimePreset(page: import("@playwright/test").Page) {
+  await expect(page.locator(".dashboard-global-controls").getByLabel("Período")).toHaveValue("all");
 }
 
 async function openDashboard(page: import("@playwright/test").Page) {