@zaip-ai/cli 2.2.0 → 3.0.0

package/templates/.agents/dashboard/apps/frontend/src/AppDashboardContent.tsx

@@ -0,0 +1,368 @@
+import { OperationsPage } from "@zaip-ai/dashboard-operations/react";
+import { AppLoadingBoundary } from "./AppLoadingBoundary.js";
+import { AppOverlays } from "./AppOverlays.js";
+import { PeriodTransitionOverlay, PeriodTransitionShell } from "./AppRequestGuards.js";
+import { costCalculationGuidePath, pricingSetupPath, projectSetupPath } from "./AppSetupRoutes.js";
+import { renderDashboardAlternateContent } from "./DashboardAlternateContent.js";
+import { DashboardGlobalSettings } from "./DashboardGlobalSettings.js";
+import { isSameOperationsRequestPeriod } from "./operations-period.js";
+import type { useDashboardAppModel } from "./use-dashboard-app-model.js";
+export interface AppDashboardContentProps {
+  model: ReturnType<typeof useDashboardAppModel>;
+}
+
+export function AppDashboardContent({ model }: AppDashboardContentProps) {
+  const {
+    operations,
+    error,
+    globalLoadingPending,
+    costLocale,
+    refresh,
+    snapshotNotice,
+    setupRoute,
+    failedArea,
+    retryLastLoad,
+    costs,
+    currency,
+    dashboardView,
+    lastUpdatedAt,
+    loadCostDetail,
+    loadCostReadModelPage,
+    loadCostRunPage,
+    loadCostGroupPage,
+    loadingArea,
+    setDisplayedCosts,
+    setCurrency,
+    setCostSurfaceLoading,
+    changeDashboardLocale,
+    loadMoreTraceTasks,
+    openTrace,
+    setRefreshDialog,
+    setSelectedTraceTaskId,
+    openTraceChange,
+    openTraceMacro,
+    renderedOperations,
+    selectedTraceTaskId,
+    trace,
+    traceLoadingTaskId,
+    traceTasksHasMore,
+    traceTasksLoading,
+    traceTasks,
+    capabilityNavigation,
+    boardTotals,
+    boardKindTotals,
+    boardExportSource,
+    detailExportSource,
+    boardStates,
+    operationsPeriod,
+    entityPage,
+    dashboardIdentity,
+    operationsLoading,
+    factualCostFact,
+    factualCostPeriods,
+    setOperationsSurfaceLoading,
+    currentCostByRun,
+    loadOperationsEntityPage,
+    loadOperationsLifecyclePage,
+    loadOperationsDetails,
+    entityPageKind,
+    loadFilteredOperationsPage,
+    loadFilteredBoard,
+    loadWorkListFilters,
+    loadWorkListPage,
+    workListFiltersRef,
+    boardFiltersRef,
+    workListPage,
+    overviewStatusPages,
+    loadOverviewStatusPage,
+    overviewClassificationPages,
+    loadOverviewClassificationPage,
+    openDocument,
+    api,
+    setError,
+    operationsPeriodRef,
+    setOperationsPeriod,
+    operationsDetailLoadedRef,
+    operationsDetailCancelRef,
+    operationsDetailAbortRef,
+    operationsPageAbortRef,
+    resetWorkListPage,
+    operationsPageRequestVersionRef,
+    resetBoard,
+    refreshVersion,
+    costSummaryAbortRef,
+    costSummaryRequestVersion,
+    setEntityPage,
+    costsLoadedRef,
+    setCosts,
+    setPeriodTransitionPending,
+    periodTransitionVersionRef,
+    setLoadingArea,
+    navigate,
+    setHelpOpen,
+    closeDocument,
+    documentDetail,
+    helpOpen,
+    reconciliationResult,
+    setReconciliationResult,
+    refreshDialog,
+    setTrace,
+    traceLink,
+    setTraceLoadingTaskId,
+    setTraceLink,
+    refreshFromDialog,
+  } = model;
+  const {
+    loadMoreBoard,
+    overviewStatusPageKey,
+    overviewClassificationPageKey,
+    boardRequestVersionRef,
+    boardAbortControllersRef,
+    boardInFlightRef,
+    boardInitialPageRef,
+    boardLoadedRef,
+    setBoardTotals,
+    setBoardKindTotals,
+    setBoardStates,
+    setOverviewStatusPages,
+    setOverviewClassificationPages,
+    setOperationsLoading,
+  } = model;
+
+  return (
+    <AppLoadingBoundary
+      error={error}
+      globalLoadingPending={globalLoadingPending}
+      locale={costLocale}
+      onRefresh={() => void refresh()}
+      operations={operations}
+      snapshotNotice={snapshotNotice}
+      setupRoute={setupRoute}
+    >
+      <PeriodTransitionShell pending={globalLoadingPending}>
+        {error ? (
+          <div aria-live="assertive" className="app-warning app-error" role="alert">
+            <span>{error}</span>
+            {failedArea ? (
+              <button onClick={retryLastLoad} type="button">
+                {costLocale === "pt-BR" ? "Tentar novamente" : "Try again"}
+              </button>
+            ) : null}
+            <button
+              aria-label={costLocale === "pt-BR" ? "Fechar erro" : "Dismiss error"}
+              onClick={() => setError(null)}
+              type="button"
+            >
+              ×
+            </button>
+          </div>
+        ) : null}
+        {/* Cost Monitor boundary retains loadRunPage={loadCostRunPage}, loadReadModelPage={loadCostReadModelPage}, and loadDetail={loadCostDetail}. */}
+        <OperationsPage
+          alternateContent={renderDashboardAlternateContent({
+            costs,
+            costLocale,
+            currency,
+            dashboardView,
+            failedArea,
+            lastUpdatedAt,
+            loadCostDetail,
+            loadCostReadModelPage,
+            loadCostRunPage,
+            loadCostGroupPage,
+            loadingArea,
+            onActiveDataChange: setDisplayedCosts,
+            onCurrencyChange: setCurrency,
+            onLoadingChange: setCostSurfaceLoading,
+            onLocaleChange: changeDashboardLocale,
+            onLoadMoreTraceTasks: loadMoreTraceTasks,
+            onOpenTrace: (taskId) => void openTrace(taskId),
+            onRefresh: () => setRefreshDialog("choose"),
+            onRetry: retryLastLoad,
+            onSelectTraceTask: (taskId) => {
+              setSelectedTraceTaskId(taskId);
+              void openTrace(taskId);
+            },
+            onOpenTraceChange: openTraceChange,
+            onOpenTraceMacro: openTraceMacro,
+            operations: renderedOperations,
+            selectedTraceTaskId,
+            trace,
+            traceLoadingTaskId,
+            traceTasksHasMore,
+            traceTasksLoading,
+            traceTasks,
+          })}
+          capabilityNavigation={capabilityNavigation}
+          boardTotals={boardTotals}
+          boardKindTotals={boardKindTotals}
+          boardExportSource={boardExportSource}
+          detailExportSource={detailExportSource}
+          boardStates={boardStates}
+          data={renderedOperations}
+          lastUpdatedAt={lastUpdatedAt}
+          datePreset={operationsPeriod.preset}
+          dateRange={operationsPeriod.range}
+          entityPage={entityPage}
+          dashboardTitle={dashboardIdentity.title}
+          repositoryName={dashboardIdentity.repositoryName}
+          loading={operationsLoading}
+          locale={costLocale}
+          currency={currency}
+          factualCostFact={factualCostFact}
+          factualCostPeriods={factualCostPeriods}
+          onLoadingChange={setOperationsSurfaceLoading}
+          resolveRunCost={
+            costs === null ? undefined : (runId) => currentCostByRun.get(runId) ?? null
+          }
+          onLocaleChange={changeDashboardLocale}
+          onDetailDataRequest={(view) => {
+            const kind =
+              view === "conversations"
+                ? "conversations"
+                : view === "executions"
+                  ? "executions"
+                  : view === "runs"
+                    ? "runs"
+                    : null;
+            if (kind !== null) void loadOperationsEntityPage(kind);
+            else if (view === "changes" || view === "decisions")
+              void loadOperationsLifecyclePage(view);
+            else void loadOperationsDetails();
+          }}
+          onLoadMacroMetrics={() => {
+            // The quick projection already carries complete macro aggregates.
+            // Do not request the unrelated daily history on every PRD/SPEC click.
+            if (operations?.summary.overview_metrics?.macro_metrics === undefined)
+              void loadOperationsDetails();
+          }}
+          onEntityPageChange={(offset) => {
+            if (entityPageKind === "changes" || entityPageKind === "decisions")
+              void loadOperationsLifecyclePage(entityPageKind, offset);
+            else void loadOperationsEntityPage(entityPageKind, offset);
+          }}
+          onEntityFiltersChange={loadFilteredOperationsPage}
+          onBoardFiltersChange={loadFilteredBoard}
+          onWorkListFiltersChange={loadWorkListFilters}
+          onWorkListPageChange={(offset) =>
+            void loadWorkListPage(workListFiltersRef.current, offset)
+          }
+          onBoardTypeChange={(kind) =>
+            loadFilteredBoard({
+              ...boardFiltersRef.current,
+              kind: kind === "all" ? "" : kind,
+            })
+          }
+          onWorkListTypeChange={(kind) =>
+            void loadWorkListPage({
+              ...workListFiltersRef.current,
+              kind: kind === "all" ? "" : kind,
+            })
+          }
+          onLoadMoreBoard={(stage) => void loadMoreBoard(stage)}
+          workListPage={workListPage}
+          statusPage={(stage, kind) => overviewStatusPages[overviewStatusPageKey(stage, kind)]}
+          onLoadStatusPage={(stage, kind, offset) =>
+            void loadOverviewStatusPage(stage, kind, offset)
+          }
+          classificationPage={(kind, classification) =>
+            overviewClassificationPages[overviewClassificationPageKey(kind, classification)]
+          }
+          onLoadClassificationPage={(kind, classification, offset) =>
+            void loadOverviewClassificationPage(kind, classification, offset)
+          }
+          onOpenDocument={(kind, id) => void openDocument(kind, id)}
+          onOpenTask={openTrace}
+          onPriorityChange={async (itemIds) => {
+            try {
+              await api.saveWorkPriority(itemIds);
+            } catch (cause) {
+              setError(cause instanceof Error ? cause.message : String(cause));
+              throw cause;
+            }
+          }}
+          onDateChange={(preset, range) => {
+            const nextPeriod = { preset, range };
+            if (isSameOperationsRequestPeriod(operationsPeriodRef.current, nextPeriod)) {
+              setOperationsPeriod(nextPeriod);
+              return;
+            }
+            operationsDetailLoadedRef.current = false;
+            operationsDetailCancelRef.current?.();
+            operationsDetailCancelRef.current = null;
+            operationsDetailAbortRef.current?.abort();
+            operationsDetailAbortRef.current = null;
+            operationsPageAbortRef.current?.abort();
+            operationsPageAbortRef.current = null;
+            resetWorkListPage();
+            ++operationsPageRequestVersionRef.current;
+            boardRequestVersionRef.current += 1;
+            for (const controller of boardAbortControllersRef.current.values()) controller.abort();
+            boardAbortControllersRef.current.clear();
+            boardInFlightRef.current.clear();
+            boardInitialPageRef.current.clear();
+            boardLoadedRef.current = {};
+            setBoardTotals({});
+            setBoardKindTotals({});
+            setBoardStates({});
+            setOverviewStatusPages({});
+            setOverviewClassificationPages({});
+            ++refreshVersion.current;
+            costSummaryAbortRef.current?.abort();
+            costSummaryAbortRef.current = null;
+            ++costSummaryRequestVersion.current;
+            setEntityPage({ offset: 0, total: null, loading: false, error: null });
+            costsLoadedRef.current = false;
+            setCosts(null);
+            setDisplayedCosts(null);
+            // Keep OperationsPage mounted so its controlled-looking local date
+            // select retains the user's choice; loading gates its old content.
+            setOperationsLoading(true);
+            periodTransitionVersionRef.current += 1;
+            setPeriodTransitionPending(true);
+            setLoadingArea("operations");
+            setOperationsPeriod(nextPeriod);
+          }}
+          onRefresh={() => setRefreshDialog("choose")}
+          settings={
+            <DashboardGlobalSettings
+              costCalculationGuidePath={costCalculationGuidePath}
+              currency={currency}
+              locale={costLocale}
+              onCurrencyChange={setCurrency}
+              onHelpOpen={() => setHelpOpen(true)}
+              onNavigate={navigate}
+              pricingSetupPath={pricingSetupPath}
+              projectSetupPath={projectSetupPath}
+            />
+          }
+        />
+        <AppOverlays
+          closeDocument={closeDocument}
+          costLocale={costLocale}
+          documentDetail={documentDetail}
+          helpOpen={helpOpen}
+          loadingArea={dashboardView === "cost-monitor" && costs === null ? null : loadingArea}
+          operations={renderedOperations}
+          reconciliationResult={reconciliationResult}
+          refreshDialog={refreshDialog}
+          showTrace={dashboardView === "traceability"}
+          trace={trace}
+          traceLink={traceLink}
+          traceLoadingTaskId={traceLoadingTaskId}
+          onCloseHelp={() => setHelpOpen(false)}
+          onCloseTrace={() => setTrace(null)}
+          onDismissReconciliation={() => setReconciliationResult(null)}
+          onOpenDocument={(kind, id) => void openDocument(kind, id)}
+          onOpenTrace={(taskId) => void openTrace(taskId)}
+          onOpenTraceChange={openTraceChange}
+          onOpenTraceMacro={openTraceMacro}
+          onRefreshCancel={() => setRefreshDialog(null)}
+          onRefreshFromDialog={(reconcileOpenWork) => void refreshFromDialog(reconcileOpenWork)}
+          setTraceLink={(value) => setTraceLink(value)}
+        />
+      </PeriodTransitionShell>
+      {globalLoadingPending ? <PeriodTransitionOverlay /> : null}
+    </AppLoadingBoundary>
+  );
+}

package/templates/.agents/dashboard/apps/frontend/src/AutonomySettings.tsx

@@ -0,0 +1,82 @@
+import { useId } from "react";
+import {
+  AUTONOMY_PRESETS,
+  type AutonomyConfig,
+  autonomyPresetSchema,
+  resolveAutonomy,
+} from "../../../../../packages/core/src/autonomy-policy.js";
+
+/** Local settings composition; limits come from the same pure policy as dispatch. */
+export function AutonomySettings({
+  value,
+  onChange,
+  disabled = false,
+  locale = "pt-BR",
+}: {
+  value?: AutonomyConfig | undefined;
+  onChange: (value: AutonomyConfig) => void;
+  disabled?: boolean;
+  locale?: "pt-BR" | "en-US";
+}) {
+  const id = useId();
+  const policy = resolveAutonomy(value);
+  const pt = locale === "pt-BR";
+  return (
+    <div>
+      {!value && (
+        <p>
+          {pt
+            ? "Projeto legado: selecione e salve um perfil para adotar os novos controles nas novas Tasks."
+            : "Legacy project: select and save a preset to adopt the new controls for new Tasks."}
+        </p>
+      )}
+      <label className="project-settings-field" htmlFor={id}>
+        <strong>{pt ? "Perfil de autonomia" : "Autonomy preset"}</strong>
+        <select
+          id={id}
+          aria-describedby={`${id}-detail`}
+          disabled={disabled}
+          value={policy.preset}
+          onChange={(event) =>
+            onChange({ version: 1, preset: autonomyPresetSchema.parse(event.target.value) })
+          }
+        >
+          {autonomyPresetSchema.options.map((preset) => (
+            <option key={preset} value={preset}>
+              {pt
+                ? AUTONOMY_PRESETS[preset].label
+                : {
+                    essential: "Essential",
+                    balanced: "Balanced",
+                    persistent: "Persistent — unlimited",
+                  }[preset]}
+            </option>
+          ))}
+        </select>
+      </label>
+      <p id={`${id}-detail`} role="status">
+        {policy.attempts === null
+          ? pt
+            ? "Sem limite de tentativas ou replanejamentos. Pode continuar indefinidamente e consumir créditos até você cancelar."
+            : "No attempt or replanning limit. May continue indefinitely and consume credits until you cancel."
+          : pt
+            ? `${policy.attempts} execuções por Task (1 inicial + ${policy.attempts - 1} reparações), até ${policy.replans} replanejamento(s). Sem abandono por tempo.`
+            : `${policy.attempts} executions per Task (1 initial + ${policy.attempts - 1} repairs), up to ${policy.replans} replan(s). No time-based abandonment.`}
+      </p>
+      <p>
+        {policy.automatic_astra
+          ? pt
+            ? "Replanejamento: Sol/high no primeiro, Astra/high a partir do segundo. Astra/high pode executar a partir do terceiro."
+            : "Replanning: Sol/high first, Astra/high from the second. Astra/high may execute from the third."
+          : pt
+            ? "Nunca usa Astra automaticamente. Exceção: agente principal de tarefa avulsa com Astra selecionado por você no Codex."
+            : "Never selects Astra automatically. Exception: a standalone principal with Astra manually selected in Codex."}
+      </p>
+      <p>
+        {pt
+          ? "A mudança vale para novas Tasks; as iniciadas conservam o perfil e o histórico. Tarefas avulsas priorizam execução direta. Ao delegar, a ZAIP informa que modelo e esforço dos subagentes podem mudar. Critérios de aceite e permissões não são reduzidos."
+          : "Changes apply to new Tasks; started Tasks retain their preset and history. Standalone work prefers direct execution. Delegation discloses that subagent model and effort may differ. Acceptance criteria and permissions are not reduced."}
+      </p>
+    </div>
+  );
+}

package/templates/.agents/dashboard/apps/frontend/src/ProjectSettingsPage.dom.test.ts

@@ -0,0 +1,130 @@
+import { createRequire } from "node:module";
+import { fileURLToPath } from "node:url";
+import { describe, expect, it } from "vitest";
+
+declare global {
+  interface Window {
+    __projectInstallationToastProbe: { setIncomplete: () => void };
+  }
+}
+
+describe("ProjectSettingsPage installation toast", () => {
+  it("shows only for incomplete overviews, dismisses, and returns after a new incomplete overview", async () => {
+    const browserRequire = createRequire(
+      fileURLToPath(new URL("../../../tests/e2e/package.json", import.meta.url)),
+    );
+    const esbuild = browserRequire("esbuild");
+    const { chromium, expect: expectPlaywright } = browserRequire("@playwright/test");
+    const harness = await esbuild.build({
+      bundle: true,
+      define: { "import.meta.url": '"http://localhost/"' },
+      format: "iife",
+      loader: { ".css": "text" },
+      platform: "browser",
+      stdin: {
+        contents: `
+          import { createRoot } from "react-dom/client";
+          import React from "react";
+          import { ProjectSettingsPage } from "./ProjectSettingsPage.js";
+
+          const config = {
+            schema_version: 1,
+            zaip: { enabled: true },
+            project: { id: "toast-test", name: "Toast test", timezone: "America/Sao_Paulo" },
+            stack: { id: "zaip-aios-stack", overrides: {} },
+            clients: { codex: true, claude: true },
+            tracking: { enabled: true, currency: "BRL", storage_mode: "tracked_sanitized" },
+            execution: { runtime: "managed", autonomous: { provider: "claude", model: "gpt-5.6-terra", max_parallelism: 1, lease_ms: 60000 } },
+            autonomy: { version: 1, preset: "balanced" },
+          };
+          const areas = ["brandbook", "design_system", "software_architecture", "growth_strategy", "marketing_strategy", "sales_playbook"].map((id) => ({ id, label: id, artifact: ".agents/" + id + ".md", available: true }));
+          const metrics = ["agents", "squads", "skills", "rules", "hooks"].map((id, index) => ({ id, label: id, value: index + 1 }));
+          let incomplete = false;
+          let failInitialLoad = true;
+          const overview = () => ({
+            framework_version: "2.5.0",
+            installation_profile: "full",
+            health: { state: "healthy", scope: "settings_runtime" },
+            dependencies: { installed: incomplete ? 9 : 10, applicable: 10, missing: incomplete ? 1 : 0, unknown: 0, not_applicable: 0, percent: incomplete ? 90 : 100, state: incomplete ? "incomplete" : "complete" },
+            documentation: { available: 0, applicable: 6, missing: 6, unknown: 0, not_applicable: 0, percent: 0, state: "incomplete" },
+            metrics,
+            areas,
+            stack_components: [],
+          });
+          Object.assign(window, {
+            __projectInstallationToastProbe: { setIncomplete: () => { incomplete = true; } },
+          });
+          const api = {
+            projectSettings: async () => {
+              if (failInitialLoad) {
+                failInitialLoad = false;
+                throw new Error("offline");
+              }
+              return config;
+            },
+            projectOverview: async () => overview(),
+            saveProjectSettings: async (next) => Object.assign(config, next),
+          };
+          createRoot(document.getElementById("root")).render(
+            <ProjectSettingsPage api={api} locale="pt-BR" onClose={() => {}} />,
+          );
+        `,
+        loader: "tsx",
+        resolveDir: fileURLToPath(new URL(".", import.meta.url)),
+        sourcefile: "ProjectSettingsPage.toast-harness.tsx",
+      },
+      write: false,
+    });
+    const browser = await chromium.launch({ headless: true });
+    try {
+      const page = await browser.newPage();
+      const pageErrors: string[] = [];
+      page.on("pageerror", (error: Error) => pageErrors.push(error.message));
+      await page.setContent('<div id="root"></div>');
+      await page.addScriptTag({ content: harness.outputFiles[0].text });
+
+      await expectPlaywright(page.getByRole("alert")).toContainText("offline");
+      await page.getByRole("button", { name: "Tentar novamente" }).click();
+
+      await expectPlaywright(
+        page.getByRole("heading", { name: "Configuração do projeto" }),
+      ).toBeVisible();
+      await expectPlaywright(page.getByRole("alert")).toHaveCount(0);
+      await expectPlaywright(page.getByText("100%").first()).toBeVisible();
+      await expectPlaywright(page.getByText("0%").first()).toBeVisible();
+      const provider = page.getByRole("combobox", { name: /^Provider/ });
+      await expectPlaywright(provider.locator('option[value="claude"]')).toBeDisabled();
+      // Previously saved invalid config is shown honestly, not silently rewritten.
+      await expectPlaywright(provider).toHaveValue("claude");
+      await page.getByRole("button", { name: "Salvar configurações" }).click();
+      await expectPlaywright(page.getByRole("alert")).toContainText("Autonomy-v1 exige Codex");
+      await provider.selectOption("codex");
+      const autonomy = page.getByRole("combobox", { name: "Perfil de autonomia" });
+      await expectPlaywright(autonomy).toHaveValue("balanced");
+      await autonomy.selectOption("persistent");
+      await expectPlaywright(
+        page.getByRole("status").filter({ hasText: "Sem limite de tentativas" }),
+      ).toBeVisible();
+      await autonomy.selectOption("essential");
+      await expectPlaywright(
+        page.getByText("Nunca usa Astra automaticamente.", { exact: false }),
+      ).toBeVisible();
+
+      await page.evaluate(() => window.__projectInstallationToastProbe.setIncomplete());
+      await page.getByRole("button", { name: "Salvar configurações" }).click();
+      await expectPlaywright(page.getByRole("alert")).toContainText(
+        "Há dependências técnicas locais ausentes",
+      );
+      await expectPlaywright(page.getByText("90%").first()).toBeVisible();
+
+      await page.getByRole("button", { name: "Fechar aviso" }).click();
+      await expectPlaywright(page.getByRole("alert")).toHaveCount(0);
+
+      await page.getByRole("button", { name: "Salvar configurações" }).click();
+      await expectPlaywright(page.getByRole("alert")).toBeVisible();
+      expect(pageErrors).toEqual([]);
+    } finally {
+      await browser.close();
+    }
+  }, 30_000);
+});