create-safest-tools 0.5.3 → 0.6.1

package/template/console/command/types.ts

@@ -1,49 +1,54 @@
 import type { WorkspaceView } from "../shell/types";
 
-export type CommandStatusTone = "neutral" | "warning" | "danger";
+export type CommandStatusTone = "neutral" | "positive" | "warning" | "danger";
 
 export type CommandAction =
   | { type: "report"; reportId: string }
   | { type: "view"; view: WorkspaceView };
 
 export interface CommandMetricSnapshot {
-  openReports: number;
-  needsHuman: number;
-  activeRuns: number;
-  unresolvedIncidents: number;
+  awaitingReview: number;
+  urgent: number;
+  unassigned: number;
+  onlineReviewers: number;
+  oldestWaitMinutes: number;
 }
 
 export interface CommandAttentionItem {
   id: string;
-  icon: string;
   title: string;
-  detail: string;
-  meta: string;
-  urgent: boolean;
+  reference: string;
+  queueName: string;
+  age: string;
+  ownership: string;
+  priorityLabel: string;
+  slaLabel: string;
+  tone: CommandStatusTone;
   action: CommandAction;
 }
 
 export interface CommandQueueLoad {
   id: string;
   name: string;
-  targetMinutes: number;
+  targetMinutes: number | null;
   openCount: number;
+  unassignedCount: number;
+  oldestMinutes: number;
+  breachedCount: number;
   pressure: number;
+  tone: CommandStatusTone;
 }
 
-export interface CommandRunSummary {
-  id: string;
-  title: string;
-  detail: string;
-  status: string;
-  tone: CommandStatusTone;
-  age: string;
-  action: CommandAction;
+export interface CommandSystemHealth {
+  issueCount: number;
+  incidentCount: number;
+  workflowIssueCount: number;
+  deliveryFailureCount: number;
+  activeRunCount: number;
 }
 
 export interface CommandPermissions {
   useAssistant: boolean;
-  manageWorkflows: boolean;
   viewAudit: boolean;
   manageInstallation: boolean;
 }
@@ -51,11 +56,10 @@ export interface CommandPermissions {
 export interface CommandSnapshot {
   loading: boolean;
   generatedAt: string;
-  firstName: string;
   metrics: CommandMetricSnapshot;
   attention: CommandAttentionItem[];
   queueLoads: CommandQueueLoad[];
-  recentRuns: CommandRunSummary[];
+  systemHealth: CommandSystemHealth;
   incompleteSetupCount: number;
   permissions: CommandPermissions;
 }

package/template/console/registry/RegistryDetailsDialog.tsx

@@ -0,0 +1,249 @@
+import { useEffect, useMemo, useRef, useState } from "react";
+import { readable } from "../lib/format";
+import { ApiRequestError, errorMessage, mutationHeaders, requestJson } from "../lib/http";
+import type {
+  ComponentSummary,
+  ConnectionSummary,
+  RegistryDependenciesResponse,
+  RegistryDetailResponse,
+  RegistryKind,
+  RegistryValidation,
+  RegistryValidationIssue,
+  RegistryValidationResponse,
+} from "./types";
+
+type RegistryItem = ComponentSummary | ConnectionSummary;
+
+interface RegistryDetailsDialogProps {
+  item: RegistryItem | null;
+  kind: RegistryKind;
+  canManage: boolean;
+  onClose: () => void;
+  onChanged: (message: string) => void;
+}
+
+const validationLabels: Record<string, string> = {
+  active_version_missing: "Publish an active version.",
+  allowed_methods_empty: "Allow at least one HTTP method.",
+  allowed_paths_empty: "Allow at least one request path.",
+  connection_version_missing: "Choose a published connection for this tool.",
+  connection_version_unavailable: "Choose an active, published connection version.",
+  destination_invalid: "Configure exactly one HTTPS endpoint or Worker service binding.",
+  fixture_missing: "Add at least one contract example.",
+  input_schema_invalid: "Fix the input schema.",
+  output_schema_invalid: "Fix the output schema.",
+  passing_test_missing: "Run and pass at least one contract test.",
+  secret_reference_missing: "Configure a Worker secret binding for the selected authentication method.",
+};
+
+function issueCode(issue: RegistryValidationIssue | string): string {
+  return typeof issue === "string" ? issue : issue.code || issue.message;
+}
+
+function issueMessage(issue: RegistryValidationIssue | string): string {
+  if (typeof issue !== "string") return issue.message;
+  return validationLabels[issue] || readable(issue);
+}
+
+function text(value: unknown, fallback = "—"): string {
+  return typeof value === "string" && value ? value : fallback;
+}
+
+function number(value: unknown): number {
+  return Number.isFinite(Number(value)) ? Number(value) : 0;
+}
+
+function activeVersion(detail: RegistryDetailResponse | null, item: RegistryItem | null, kind: RegistryKind): Record<string, unknown> | null {
+  const versions = kind === "component" ? detail?.component?.versions : detail?.connection?.versions;
+  if (!versions?.length) return null;
+  return versions.find((version) => version.id === item?.activeVersionId) || versions[0];
+}
+
+function dependencyRows(dependencies: RegistryDependenciesResponse["dependencies"] | null): Array<{ type: string; name: string; version: string }> {
+  if (!dependencies) return [];
+  return [
+    ...(dependencies.workflows || []).map((entry) => ({ type: "Workflow", name: text(entry.name, "Unnamed workflow"), version: `v${number(entry.version) || 1}` })),
+    ...(dependencies.components || []).map((entry) => ({ type: "Tool", name: text(entry.name, "Unnamed tool"), version: `v${number(entry.version) || 1}` })),
+    ...(dependencies.modelAliases || []).map((entry) => ({ type: "AI model", name: text(entry.name, "Unnamed model"), version: `v${number(entry.version) || 1}` })),
+  ];
+}
+
+function VerificationPanel({ validation, kind }: { validation: RegistryValidation; kind: RegistryKind }) {
+  const errors = validation.errors || [];
+  const failed = new Set(errors.map(issueCode));
+  const componentChecks = [
+    ["active_version_missing", "Active version is published"],
+    ["input_schema_invalid", "Input contract is valid"],
+    ["output_schema_invalid", "Output contract is valid"],
+    ["connection_version_missing", "Required connection is selected"],
+    ["connection_version_unavailable", "Selected connection is available"],
+    ["fixture_missing", "Contract example is present"],
+    ["passing_test_missing", "A contract test has passed"],
+  ];
+  const connectionChecks = [
+    ["active_version_missing", "Active version is published"],
+    ["destination_invalid", "One destination is configured"],
+    ["allowed_methods_empty", "HTTP methods are allowlisted"],
+    ["allowed_paths_empty", "Request paths are allowlisted"],
+    ["secret_reference_missing", "Credential binding name is recorded"],
+  ];
+  const checks = kind === "component" ? componentChecks : connectionChecks;
+  return <section className={`registry-verification ${validation.valid ? "verified" : "attention"}`} aria-live="polite">
+    <div><strong>{validation.valid ? "Setup verified" : "Setup needs attention"}</strong><span>{validation.valid ? "The stored configuration and contracts passed." : `${errors.length} ${errors.length === 1 ? "item needs" : "items need"} attention.`}</span></div>
+    <ul>{checks.map(([code, label]) => <li className={failed.has(code) ? "failed" : "passed"} key={code}><span aria-hidden="true">{failed.has(code) ? "!" : "✓"}</span>{label}</li>)}</ul>
+    {errors.length ? <div className="registry-verification-errors">{errors.map((issue) => <p key={issueCode(issue)}>{issueMessage(issue)}</p>)}</div> : null}
+  </section>;
+}
+
+export function RegistryDetailsDialog({ item, kind, canManage, onClose, onChanged }: RegistryDetailsDialogProps) {
+  const dialogRef = useRef<HTMLDialogElement>(null);
+  const [detail, setDetail] = useState<RegistryDetailResponse | null>(null);
+  const [dependencies, setDependencies] = useState<RegistryDependenciesResponse["dependencies"] | null>(null);
+  const [validation, setValidation] = useState<RegistryValidation | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [pending, setPending] = useState("");
+  const [error, setError] = useState("");
+  const [confirmArchive, setConfirmArchive] = useState(false);
+  const [method, setMethod] = useState("POST");
+  const [path, setPath] = useState("/");
+  const [requestBody, setRequestBody] = useState("{}");
+
+  const route = kind === "component" ? "components" : "connections";
+  const version = useMemo(() => activeVersion(detail, item, kind), [detail, item, kind]);
+  const dependencyList = useMemo(() => dependencyRows(dependencies), [dependencies]);
+  const archived = item?.status === "archived";
+  const paused = item?.status === "paused";
+
+  useEffect(() => {
+    const dialog = dialogRef.current;
+    if (!dialog) return;
+    if (item && !dialog.open) dialog.showModal();
+    if (!item && dialog.open) dialog.close();
+  }, [item]);
+
+  useEffect(() => {
+    if (!item) return;
+    let active = true;
+    setLoading(true); setPending(""); setError(""); setDetail(null); setDependencies(null); setValidation(null); setConfirmArchive(false);
+    void Promise.all([
+      requestJson<RegistryDetailResponse>(`/v1/admin/${route}/${encodeURIComponent(item.id)}`),
+      requestJson<RegistryDependenciesResponse>(`/v1/admin/${route}/${encodeURIComponent(item.id)}/dependencies`),
+    ]).then(([nextDetail, nextDependencies]) => {
+      if (!active) return;
+      setDetail(nextDetail); setDependencies(nextDependencies.dependencies || {});
+      const nextVersion = activeVersion(nextDetail, item, kind);
+      if (kind === "connection" && nextVersion) {
+        const methods = Array.isArray(nextVersion.allowedMethods) ? nextVersion.allowedMethods : [];
+        const paths = Array.isArray(nextVersion.allowedPathPrefixes) ? nextVersion.allowedPathPrefixes : [];
+        setMethod(typeof methods[0] === "string" ? methods[0] : "POST");
+        setPath(typeof paths[0] === "string" ? paths[0] : "/");
+      }
+    }).catch((cause) => { if (active) setError(errorMessage(cause, `The ${route.slice(0, -1)} details could not be loaded.`)); })
+      .finally(() => { if (active) setLoading(false); });
+    return () => { active = false; };
+  }, [item?.id, kind, route]);
+
+  const verify = async (): Promise<void> => {
+    if (!item) return;
+    setPending("verify"); setError(""); setValidation(null);
+    try {
+      const response = await requestJson<RegistryValidationResponse>(`/v1/admin/${route}/${encodeURIComponent(item.id)}/validate`, { method: "POST" });
+      setValidation(response.validation);
+    } catch (cause) {
+      if (cause instanceof ApiRequestError && cause.status === 422 && cause.body && typeof cause.body === "object") {
+        const response = cause.body as RegistryValidationResponse;
+        if (response.validation) setValidation(response.validation);
+        else setError(errorMessage(cause, "Setup verification failed."));
+      } else setError(errorMessage(cause, "Setup verification failed."));
+    } finally { setPending(""); }
+  };
+
+  const runTest = async (resume = false): Promise<void> => {
+    if (!item) return;
+    const action = resume ? "resume" : "test";
+    let body: Record<string, unknown> = {};
+    try {
+      const parsed: unknown = JSON.parse(requestBody);
+      if (!parsed || typeof parsed !== "object" || Array.isArray(parsed)) throw new Error("invalid");
+      body = parsed as Record<string, unknown>;
+    } catch {
+      setError("Request body must be a JSON object.");
+      return;
+    }
+    if (kind === "connection" && !resume && !window.confirm(`Send a live ${method} request to ${path}? The destination may process this request.`)) return;
+    setPending(action); setError("");
+    try {
+      if (kind === "connection") {
+        await requestJson(`/v1/admin/connections/${encodeURIComponent(item.id)}/${action}`, {
+          method: "POST", headers: mutationHeaders(), body: JSON.stringify({ method, path, body }),
+        });
+        onChanged(resume ? `${item.name} was tested and resumed.` : `${item.name} accepted the live test request.`);
+      } else {
+        await requestJson(`/v1/admin/components/${encodeURIComponent(item.id)}/test`, { method: "POST" });
+        onChanged(`${item.name} passed its stored contract examples.`);
+      }
+      await verify();
+    } catch (cause) { setError(errorMessage(cause, `${item.name} could not be ${resume ? "resumed" : "tested"}.`)); setPending(""); }
+  };
+
+  const setLifecycle = async (action: "pause" | "resume" | "archive"): Promise<void> => {
+    if (!item) return;
+    if (action === "resume" && kind === "connection") { await runTest(true); return; }
+    setPending(action); setError("");
+    try {
+      const endpoint = action === "archive" ? `/v1/admin/${route}/${encodeURIComponent(item.id)}` : `/v1/admin/${route}/${encodeURIComponent(item.id)}/${action}`;
+      await requestJson(endpoint, action === "archive"
+        ? { method: "PATCH", headers: mutationHeaders(), body: JSON.stringify({ status: "archived" }) }
+        : { method: "POST", headers: mutationHeaders(false) });
+      onChanged(action === "archive" ? `${item.name} was archived. Its versions remain in audit history.` : `${item.name} was ${action === "pause" ? "paused" : "resumed"}.`);
+      onClose();
+    } catch (cause) { setError(errorMessage(cause, `${item.name} could not be ${action}d.`)); setPending(""); }
+  };
+
+  const destination = kind === "connection" ? text(version?.baseUrl || version?.serviceBindingName, "No destination") : null;
+  const implementation = kind === "component" ? readable(version?.implementationKind || (item as ComponentSummary | null)?.implementationKind || "Not configured") : null;
+  const authority = kind === "component" && (item as ComponentSummary | null)?.effectClass === "side_effecting" ? "Can change customer data" : "Read-only";
+
+  return <dialog ref={dialogRef} className="detail-dialog registry-detail-dialog" aria-labelledby="registry-detail-title" onCancel={(event) => { event.preventDefault(); if (!pending) onClose(); }}>
+    {item ? <>
+      <div className="detail-head registry-detail-head"><div><span className="eyebrow">{kind === "component" ? "Tool" : "Connection"}</span><h2 id="registry-detail-title">{item.name}</h2><p>{item.description || "No description yet."}</p></div><button className="icon-button" type="button" aria-label="Close" disabled={Boolean(pending)} onClick={onClose}>×</button></div>
+      <div className="registry-detail-body">
+        {loading ? <div className="skeleton-block" /> : <>
+          <section className="registry-detail-summary" aria-label="Summary">
+            <div><span>Status</span><strong>{archived ? "Archived" : paused ? "Paused" : "Available"}</strong></div>
+            <div><span>Version</span><strong>{item.version ? `v${item.version}` : "Not published"}</strong></div>
+            <div><span>{kind === "component" ? "Authority" : "Authentication"}</span><strong>{kind === "component" ? authority : readable(version?.credentialStrategy || "none")}</strong></div>
+            <div><span>{kind === "component" ? "Implementation" : "Destination"}</span><strong title={destination || undefined}>{implementation || destination}</strong></div>
+          </section>
+
+          <section className="registry-detail-section">
+            <div className="registry-section-heading"><div><h3>Setup verification</h3><p>Checks stored configuration, schemas, credential binding names, and contract evidence. It does not call the tool or an external service.</p></div><button className="secondary" type="button" disabled={Boolean(pending)} onClick={() => void verify()}>{pending === "verify" ? "Verifying…" : "Verify setup"}</button></div>
+            {validation ? <VerificationPanel validation={validation} kind={kind} /> : <p className="registry-placeholder">Not verified in this session. Verification never sends customer data.</p>}
+          </section>
+
+          <section className="registry-detail-section">
+            <div className="registry-section-heading"><div><h3>{kind === "component" ? "Contract test" : "Live connection test"}</h3><p>{kind === "component" ? "Validates stored example inputs and outputs against this version’s schemas. It does not execute the implementation." : "Sends a real allowlisted request to the configured destination. The destination may process it."}</p></div></div>
+            {kind === "connection" ? <div className="registry-probe-form"><label>Method<select value={method} disabled={Boolean(pending) || archived} onChange={(event) => setMethod(event.currentTarget.value)}>{(Array.isArray(version?.allowedMethods) && version.allowedMethods.length ? version.allowedMethods : ["POST"]).map((value) => <option value={String(value)} key={String(value)}>{String(value)}</option>)}</select></label><label>Path<input value={path} disabled={Boolean(pending) || archived} onChange={(event) => setPath(event.currentTarget.value)} /></label><label className="wide-field">JSON request body<textarea className="code-input registry-probe-body" spellCheck={false} value={requestBody} disabled={Boolean(pending) || archived} onChange={(event) => setRequestBody(event.currentTarget.value)} /></label></div> : null}
+            <button className="secondary" type="button" disabled={Boolean(pending) || archived || (kind === "connection" && !path.startsWith("/"))} onClick={() => void runTest()}>{pending === "test" ? "Testing…" : kind === "component" ? "Run contract test" : "Send test request"}</button>
+          </section>
+
+          <section className="registry-detail-section">
+            <div className="registry-section-heading"><div><h3>Used by</h3><p>Active dependencies must be removed before this {kind === "component" ? "tool" : "connection"} can be archived.</p></div><span className="registry-count">{dependencyList.length}</span></div>
+            {dependencyList.length ? <ul className="registry-dependency-list">{dependencyList.map((entry, index) => <li key={`${entry.type}:${entry.name}:${entry.version}:${index}`}><span>{entry.type}</span><strong>{entry.name}</strong><small>{entry.version}</small></li>)}</ul> : <p className="registry-placeholder">Nothing currently depends on this {kind === "component" ? "tool" : "connection"}.</p>}
+          </section>
+
+          {canManage && !archived ? <section className="registry-detail-section registry-lifecycle-section">
+            <div className="registry-section-heading"><div><h3>Lifecycle</h3><p>Pause temporarily blocks new use. Archive permanently removes the item from selection while retaining its audit history.</p></div></div>
+            <div className="registry-lifecycle-actions">
+              <button className="secondary" type="button" disabled={Boolean(pending)} onClick={() => void setLifecycle(paused ? "resume" : "pause")}>{pending === "pause" ? "Pausing…" : pending === "resume" ? kind === "connection" ? "Testing…" : "Resuming…" : paused ? kind === "connection" ? "Test and resume" : "Resume tool" : `Pause ${kind === "component" ? "tool" : "connection"}`}</button>
+              <button className="danger-link" type="button" disabled={Boolean(pending) || dependencyList.length > 0} onClick={() => setConfirmArchive(true)}>Archive {kind === "component" ? "tool" : "connection"}</button>
+            </div>
+            {dependencyList.length ? <p className="registry-blocked-copy">Archive is unavailable until the dependencies above are retired or moved to another version.</p> : null}
+            {confirmArchive ? <div className="registry-archive-confirm" role="alert"><div><strong>Archive {item.name}?</strong><p>It will disappear from normal lists and cannot be restored. Version and audit records will remain.</p></div><div><button className="secondary" type="button" disabled={Boolean(pending)} onClick={() => setConfirmArchive(false)}>Cancel</button><button className="danger" type="button" disabled={Boolean(pending)} onClick={() => void setLifecycle("archive")}>{pending === "archive" ? "Archiving…" : "Archive permanently"}</button></div></div> : null}
+          </section> : null}
+        </>}
+        <p className="error" role="alert">{error}</p>
+      </div>
+    </> : null}
+  </dialog>;
+}