@stigmer/react 1.0.3 → 2.0.0

package/src/workflow/__tests__/workflow-summary-panel.test.tsx

@@ -0,0 +1,95 @@
+import { describe, it, expect, afterEach } from "vitest";
+import { render, screen, cleanup } from "@testing-library/react";
+import { WorkflowSummaryPanel } from "../inspector/WorkflowSummaryPanel";
+import type { WorkflowGraphModel } from "../workflow-graph-model";
+import { WorkflowTaskKind } from "@stigmer/protos/ai/stigmer/agentic/workflow/v1/enum_pb";
+
+afterEach(cleanup);
+
+function makeGraph(overrides?: Partial<WorkflowGraphModel>): WorkflowGraphModel {
+  return {
+    document: {
+      dsl: "1.0.0",
+      namespace: "test-ns",
+      name: "my-workflow",
+      version: "0.1.0",
+      description: "A test workflow",
+    },
+    nodes: [
+      { id: "__start__", taskName: "__start__", kind: WorkflowTaskKind.workflow_task_kind_unspecified, category: "start", config: {}, position: { x: 0, y: 0 } },
+      { id: "__end__", taskName: "__end__", kind: WorkflowTaskKind.workflow_task_kind_unspecified, category: "end", config: {}, position: { x: 0, y: 200 } },
+      { id: "fetch_data", taskName: "fetch_data", kind: WorkflowTaskKind.http_call, category: "invocation", config: {}, position: { x: 0, y: 100 } },
+      { id: "analyze", taskName: "analyze", kind: WorkflowTaskKind.agent_call, category: "ai", config: {}, position: { x: 0, y: 150 } },
+    ],
+    edges: [],
+    ...overrides,
+  };
+}
+
+describe("WorkflowSummaryPanel", () => {
+  it("renders workflow name, namespace, and version", () => {
+    render(<WorkflowSummaryPanel graph={makeGraph()} />);
+    expect(screen.getByText("my-workflow")).toBeTruthy();
+    expect(screen.getByText(/test-ns/)).toBeTruthy();
+    expect(screen.getByText(/v0\.1\.0/)).toBeTruthy();
+  });
+
+  it("renders workflow description", () => {
+    render(<WorkflowSummaryPanel graph={makeGraph()} />);
+    expect(screen.getByText("A test workflow")).toBeTruthy();
+  });
+
+  it("shows task count excluding sentinels", () => {
+    render(<WorkflowSummaryPanel graph={makeGraph()} />);
+    expect(screen.getByText("2 tasks")).toBeTruthy();
+  });
+
+  it("shows category distribution badges", () => {
+    render(<WorkflowSummaryPanel graph={makeGraph()} />);
+    expect(screen.getByText(/Invocation \(1\)/)).toBeTruthy();
+    expect(screen.getByText(/AI \(1\)/)).toBeTruthy();
+  });
+
+  it("shows environment variables when present", () => {
+    const graph = makeGraph({
+      env: {
+        API_KEY: { isSecret: true, description: "External API key" },
+        DEBUG: { optional: true },
+      },
+    });
+    render(<WorkflowSummaryPanel graph={graph} />);
+    expect(screen.getByText("API_KEY")).toBeTruthy();
+    expect(screen.getByText("secret")).toBeTruthy();
+    expect(screen.getByText("DEBUG")).toBeTruthy();
+    expect(screen.getByText("optional")).toBeTruthy();
+  });
+
+  it("does not show env section when no env vars", () => {
+    render(<WorkflowSummaryPanel graph={makeGraph()} />);
+    expect(screen.queryByText("Environment variables")).toBeNull();
+  });
+
+  it("shows budget when present", () => {
+    const graph = makeGraph({
+      budget: { maxCostMicros: 5_000_000, maxTotalTokens: 500_000, maxDurationSeconds: 3600 },
+    });
+    render(<WorkflowSummaryPanel graph={graph} />);
+    expect(screen.getByText("$5.00")).toBeTruthy();
+    expect(screen.getByText("500,000")).toBeTruthy();
+    expect(screen.getByText("60m 0s")).toBeTruthy();
+  });
+
+  it("shows validation error count when present", () => {
+    const errors = new Map<string, readonly string[]>([
+      ["fetch_data", ["Missing required field: endpoint"]],
+      ["analyze", ["Agent not found", "Message is empty"]],
+    ]);
+    render(<WorkflowSummaryPanel graph={makeGraph()} validationErrors={errors} />);
+    expect(screen.getByText("3 issues")).toBeTruthy();
+  });
+
+  it("does not show validation section when no errors", () => {
+    render(<WorkflowSummaryPanel graph={makeGraph()} />);
+    expect(screen.queryByText(/issue/)).toBeNull();
+  });
+});

package/src/workflow/__tests__/workflow-uses-trigger-input.test.ts

@@ -0,0 +1,164 @@
+import { describe, it, expect } from "vitest";
+import { workflowUsesTriggerInput } from "../workflow-uses-trigger-input";
+
+function makeWorkflow(tasks: Array<{ name: string; taskConfig: unknown }>) {
+  return {
+    spec: {
+      tasks: tasks.map((t) => ({
+        name: t.name,
+        kind: 1,
+        taskConfig: t.taskConfig,
+      })),
+    },
+  } as any;
+}
+
+describe("workflowUsesTriggerInput", () => {
+  it("returns false when workflow has no tasks", () => {
+    const workflow = { spec: { tasks: [] } } as any;
+    expect(workflowUsesTriggerInput(workflow)).toBe(false);
+  });
+
+  it("returns false when workflow spec is undefined", () => {
+    const workflow = {} as any;
+    expect(workflowUsesTriggerInput(workflow)).toBe(false);
+  });
+
+  it("returns false when no task references $input", () => {
+    const workflow = makeWorkflow([
+      {
+        name: "run_analyst",
+        taskConfig: {
+          agent: "notification-analyst",
+          message: "Analyze cohorts. Date: ${ $env.NOTIFICATION_DATE }",
+        },
+      },
+      {
+        name: "validate",
+        taskConfig: {
+          model: "claude-haiku-4.5",
+          prompt: "Check: ${ $context.run_analyst.cohorts }",
+        },
+      },
+    ]);
+
+    expect(workflowUsesTriggerInput(workflow)).toBe(false);
+  });
+
+  it("returns true when a task references $input directly", () => {
+    const workflow = makeWorkflow([
+      {
+        name: "capture",
+        taskConfig: {
+          set: { received: "${ $input }" },
+        },
+      },
+    ]);
+
+    expect(workflowUsesTriggerInput(workflow)).toBe(true);
+  });
+
+  it("returns true when a task references $input with field access", () => {
+    const workflow = makeWorkflow([
+      {
+        name: "setup",
+        taskConfig: {
+          set: { pr_number: "${ $input.pr_number }" },
+        },
+      },
+    ]);
+
+    expect(workflowUsesTriggerInput(workflow)).toBe(true);
+  });
+
+  it("returns true when a task references workflow.input.trigger_message", () => {
+    const workflow = makeWorkflow([
+      {
+        name: "call_agent",
+        taskConfig: {
+          agent: "my-agent",
+          message: "Handle: {{workflow.input.trigger_message}}",
+        },
+      },
+    ]);
+
+    expect(workflowUsesTriggerInput(workflow)).toBe(true);
+  });
+
+  it("detects $input in deeply nested task config", () => {
+    const workflow = makeWorkflow([
+      {
+        name: "deep_task",
+        taskConfig: {
+          cases: [
+            {
+              name: "high",
+              when: "${ $input.score > 80 }",
+              then: "success",
+            },
+          ],
+        },
+      },
+    ]);
+
+    expect(workflowUsesTriggerInput(workflow)).toBe(true);
+  });
+
+  it("detects $input in arrays within task config", () => {
+    const workflow = makeWorkflow([
+      {
+        name: "multi",
+        taskConfig: {
+          steps: ["first", "${ $input.value }", "third"],
+        },
+      },
+    ]);
+
+    expect(workflowUsesTriggerInput(workflow)).toBe(true);
+  });
+
+  it("returns true if only one of many tasks references $input", () => {
+    const workflow = makeWorkflow([
+      {
+        name: "no_input",
+        taskConfig: { agent: "analyst", message: "plain message" },
+      },
+      {
+        name: "uses_input",
+        taskConfig: {
+          agent: "router",
+          message: "Route based on: ${ $input.intent }",
+        },
+      },
+      {
+        name: "also_no_input",
+        taskConfig: { model: "gpt-4", prompt: "Summarize ${ $context.data }" },
+      },
+    ]);
+
+    expect(workflowUsesTriggerInput(workflow)).toBe(true);
+  });
+
+  it("does not false-positive on $context.input_data (no $input substring)", () => {
+    const workflow = makeWorkflow([
+      {
+        name: "misleading",
+        taskConfig: {
+          message: "Not using input: ${ $context.input_data }",
+        },
+      },
+    ]);
+
+    expect(workflowUsesTriggerInput(workflow)).toBe(false);
+  });
+
+  it("handles null taskConfig gracefully", () => {
+    const workflow = {
+      spec: {
+        tasks: [{ name: "empty", kind: 1, taskConfig: null }],
+      },
+    } as any;
+
+    expect(workflowUsesTriggerInput(workflow)).toBe(false);
+  });
+});

package/src/workflow/__tests__/workflow-yaml-diff.test.ts

@@ -0,0 +1,129 @@
+import { describe, it, expect } from "vitest";
+import { computeUnifiedDiff } from "../workflow-yaml-diff";
+
+describe("computeUnifiedDiff", () => {
+  it("returns all equal lines for identical strings", () => {
+    const result = computeUnifiedDiff("a\nb\nc", "a\nb\nc");
+    expect(result).toEqual([
+      { type: "equal", content: "a" },
+      { type: "equal", content: "b" },
+      { type: "equal", content: "c" },
+    ]);
+  });
+
+  it("detects additions from empty to non-empty", () => {
+    const result = computeUnifiedDiff("", "a\nb");
+    const added = result.filter((l) => l.type === "added");
+    expect(added).toEqual([
+      { type: "added", content: "a" },
+      { type: "added", content: "b" },
+    ]);
+    expect(result.some((l) => l.type === "equal" || l.type === "removed")).toBe(
+      true,
+    );
+  });
+
+  it("detects removals from non-empty to empty", () => {
+    const result = computeUnifiedDiff("a\nb", "");
+    const removed = result.filter((l) => l.type === "removed");
+    expect(removed).toEqual([
+      { type: "removed", content: "a" },
+      { type: "removed", content: "b" },
+    ]);
+    expect(result.some((l) => l.type === "equal" || l.type === "added")).toBe(
+      true,
+    );
+  });
+
+  it("detects single line addition", () => {
+    const result = computeUnifiedDiff("a\nc", "a\nb\nc");
+    expect(result).toEqual([
+      { type: "equal", content: "a" },
+      { type: "added", content: "b" },
+      { type: "equal", content: "c" },
+    ]);
+  });
+
+  it("detects single line removal", () => {
+    const result = computeUnifiedDiff("a\nb\nc", "a\nc");
+    expect(result).toEqual([
+      { type: "equal", content: "a" },
+      { type: "removed", content: "b" },
+      { type: "equal", content: "c" },
+    ]);
+  });
+
+  it("detects single line change as remove + add", () => {
+    const result = computeUnifiedDiff("a\nb\nc", "a\nB\nc");
+    expect(result).toEqual([
+      { type: "equal", content: "a" },
+      { type: "removed", content: "b" },
+      { type: "added", content: "B" },
+      { type: "equal", content: "c" },
+    ]);
+  });
+
+  it("handles both empty strings", () => {
+    const result = computeUnifiedDiff("", "");
+    expect(result).toHaveLength(1);
+    expect(result[0]).toEqual({ type: "equal", content: "" });
+  });
+
+  it("handles large input without truncation", () => {
+    const lines = Array.from({ length: 300 }, (_, i) => `line-${i}`);
+    const before = lines.join("\n");
+    const modified = [...lines];
+    modified[150] = "CHANGED-150";
+    const after = modified.join("\n");
+
+    const result = computeUnifiedDiff(before, after);
+
+    const removed = result.filter((l) => l.type === "removed");
+    const added = result.filter((l) => l.type === "added");
+    const equal = result.filter((l) => l.type === "equal");
+
+    expect(removed).toHaveLength(1);
+    expect(removed[0].content).toBe("line-150");
+    expect(added).toHaveLength(1);
+    expect(added[0].content).toBe("CHANGED-150");
+    expect(equal).toHaveLength(299);
+    expect(result).toHaveLength(301);
+  });
+
+  it("preserves indentation in YAML diff", () => {
+    const before = [
+      "workflow:",
+      "  name: deploy",
+      "  tasks:",
+      "    - name: build",
+      "      image: node:18",
+      "    - name: test",
+      "      image: node:18",
+    ].join("\n");
+
+    const after = [
+      "workflow:",
+      "  name: deploy",
+      "  tasks:",
+      "    - name: build",
+      "      image: node:20",
+      "    - name: test",
+      "      image: node:18",
+    ].join("\n");
+
+    const result = computeUnifiedDiff(before, after);
+
+    expect(result).toContainEqual({ type: "removed", content: "      image: node:18" });
+    expect(result).toContainEqual({ type: "added", content: "      image: node:20" });
+
+    const equalLines = result.filter((l) => l.type === "equal");
+    expect(equalLines).toContainEqual({
+      type: "equal",
+      content: "    - name: build",
+    });
+    expect(equalLines).toContainEqual({
+      type: "equal",
+      content: "  tasks:",
+    });
+  });
+});

package/src/workflow/architect-response-schema.ts

@@ -0,0 +1,69 @@
+import type { JsonObject } from "@bufbuild/protobuf";
+
+/**
+ * JSON Schema definitions for workflow architect agent structured responses.
+ *
+ * These schemas must stay within the subset supported by the runner's
+ * jsonSchemaToZod: object, array, string, number, boolean, null,
+ * enum on strings, optional properties, nested objects. No $ref,
+ * oneOf/anyOf, or string patterns.
+ *
+ * With native harness (ToolStrategy), these schemas become an extract-N
+ * function tool. tool_choice is set to "any", meaning the agent MUST
+ * call a tool every turn. For turns where the agent has no YAML to
+ * return (clarification questions), it must call extract with
+ * action: "clarification".
+ */
+
+/**
+ * Structured response schema for workflow generation and refinement.
+ *
+ * Actions:
+ * - `generated_yaml`: Agent produced validated YAML (yaml field populated)
+ * - `clarification`: Agent needs more info (explanation has the question)
+ * - `no_changes`: Workflow is correct, no modifications needed
+ */
+export const WORKFLOW_ARCHITECT_RESPONSE_SCHEMA: JsonObject = {
+  type: "object",
+  properties: {
+    action: {
+      type: "string",
+      enum: ["generated_yaml", "clarification", "no_changes"],
+    },
+    yaml: {
+      type: "string",
+    },
+    explanation: {
+      type: "string",
+    },
+  },
+  required: ["action", "explanation"],
+};
+
+/**
+ * Structured response schema for workflow execution diagnosis.
+ *
+ * Actions:
+ * - `diagnosis`: Runtime error explanation (no YAML fix)
+ * - `fix_yaml`: Definition error with validated YAML fix
+ * - `clarification`: Agent needs more info from the user
+ */
+export const WORKFLOW_DIAGNOSIS_RESPONSE_SCHEMA: JsonObject = {
+  type: "object",
+  properties: {
+    action: {
+      type: "string",
+      enum: ["diagnosis", "fix_yaml", "clarification"],
+    },
+    diagnosis: {
+      type: "string",
+    },
+    yaml: {
+      type: "string",
+    },
+    explanation: {
+      type: "string",
+    },
+  },
+  required: ["action", "explanation"],
+};

package/src/workflow/canvas-constants.ts

@@ -26,6 +26,24 @@ export const DAGRE_CONFIG = {
   nodesep: 30,
 } as const;
 
+/**
+ * More generous dagre spacing for execution graphs. Execution nodes carry
+ * status badges, duration chips, and fork-progress bars that need more
+ * vertical and horizontal clearance than bare editor/overview nodes.
+ */
+export const EXECUTION_DAGRE_CONFIG = {
+  rankdir: "TB" as const,
+  ranksep: 80,
+  nodesep: 50,
+} as const;
+
+/** Shape accepted by {@link applyDagreLayout} for custom spacing overrides. */
+export interface DagreLayoutConfig {
+  readonly rankdir: "TB" | "LR";
+  readonly ranksep: number;
+  readonly nodesep: number;
+}
+
 /** Default padding around the SVG viewBox in the read-only graph. */
 export const GRAPH_PADDING = 40;
 

package/src/workflow/clipboard.ts

@@ -0,0 +1,189 @@
+/**
+ * Internal clipboard for workflow canvas copy/paste operations.
+ *
+ * Pure TypeScript — no React dependency. The clipboard buffer itself
+ * lives as a `useRef` in the hook layer; this module provides the
+ * serialization and paste logic that operates on {@link WorkflowGraphModel}.
+ *
+ * Cross-workflow clipboard is intentionally not supported. Pasted nodes
+ * receive new unique names and remapped edge references, keeping the
+ * graph model self-consistent.
+ *
+ * @since T11 (Context Menus and Keyboard Shortcuts)
+ */
+
+import type {
+  WorkflowGraphModel,
+  WorkflowGraphNode,
+  WorkflowGraphEdge,
+} from "./workflow-graph-model";
+import { START_NODE_ID, END_NODE_ID } from "./workflow-graph-model";
+import type { GraphCommand } from "./graph-commands";
+import {
+  AddNodeCommand,
+  AddEdgeCommand,
+  CompoundCommand,
+  generateEdgeId,
+  generateTaskName,
+} from "./graph-commands";
+
+// ---------------------------------------------------------------------------
+// Types
+// ---------------------------------------------------------------------------
+
+/** Snapshot of selected nodes and their internal edges. */
+export interface ClipboardEntry {
+  readonly nodes: readonly WorkflowGraphNode[];
+  readonly edges: readonly WorkflowGraphEdge[];
+}
+
+/** Result of a paste operation, ready to dispatch. */
+export interface PasteResult {
+  readonly command: GraphCommand;
+  readonly newNodeIds: readonly string[];
+}
+
+// ---------------------------------------------------------------------------
+// Serialize
+// ---------------------------------------------------------------------------
+
+const PASTE_OFFSET = { x: 40, y: 40 };
+
+/**
+ * Deep-clone selected nodes and their internal edges into a clipboard entry.
+ *
+ * - Sentinel nodes (`__start__`, `__end__`) are excluded.
+ * - Only edges where **both** endpoints are in the selection are included.
+ * - Nodes are deep-cloned so subsequent model mutations don't affect the buffer.
+ */
+export function serializeSelection(
+  model: WorkflowGraphModel,
+  selectedNodeIds: ReadonlySet<string>,
+): ClipboardEntry | null {
+  const filteredIds = new Set<string>();
+  for (const id of selectedNodeIds) {
+    if (id !== START_NODE_ID && id !== END_NODE_ID) {
+      filteredIds.add(id);
+    }
+  }
+
+  if (filteredIds.size === 0) return null;
+
+  const nodes = model.nodes
+    .filter((n) => filteredIds.has(n.id))
+    .map((n) => structuredClone(n) as WorkflowGraphNode);
+
+  const edges = model.edges
+    .filter((e) => filteredIds.has(e.source) && filteredIds.has(e.target))
+    .map((e) => structuredClone(e) as WorkflowGraphEdge);
+
+  return { nodes, edges };
+}
+
+// ---------------------------------------------------------------------------
+// Paste
+// ---------------------------------------------------------------------------
+
+/**
+ * Produce graph commands that paste a clipboard entry into the model.
+ *
+ * - Each pasted node gets a new unique name via {@link generateTaskName}.
+ * - Positions are offset from the original by {@link PASTE_OFFSET}.
+ * - Edge source/target references are remapped to the new node IDs.
+ * - Returns a single {@link CompoundCommand} for atomic undo.
+ */
+export function pasteClipboard(
+  entry: ClipboardEntry,
+  model: WorkflowGraphModel,
+  positionOffset?: { x: number; y: number },
+): PasteResult | null {
+  if (entry.nodes.length === 0) return null;
+
+  const offset = positionOffset ?? PASTE_OFFSET;
+  const existingNames = new Set(model.nodes.map((n) => n.taskName));
+  const idMap = new Map<string, string>();
+  const commands: GraphCommand[] = [];
+  const newNodeIds: string[] = [];
+
+  for (const node of entry.nodes) {
+    const kindStr = kindToString(node.kind);
+    const newName = generateTaskName(kindStr, existingNames);
+    existingNames.add(newName);
+    idMap.set(node.id, newName);
+    newNodeIds.push(newName);
+
+    commands.push(
+      new AddNodeCommand({
+        ...node,
+        id: newName,
+        taskName: newName,
+        config: structuredClone(node.config),
+        position: {
+          x: node.position.x + offset.x,
+          y: node.position.y + offset.y,
+        },
+        export: undefined,
+        flow: undefined,
+      }),
+    );
+  }
+
+  for (const edge of entry.edges) {
+    const newSource = idMap.get(edge.source);
+    const newTarget = idMap.get(edge.target);
+    if (!newSource || !newTarget) continue;
+
+    commands.push(
+      new AddEdgeCommand({
+        ...edge,
+        id: generateEdgeId(),
+        source: newSource,
+        target: newTarget,
+      }),
+    );
+  }
+
+  return {
+    command: new CompoundCommand(
+      `Paste ${entry.nodes.length} task${entry.nodes.length > 1 ? "s" : ""}`,
+      commands,
+    ),
+    newNodeIds,
+  };
+}
+
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+
+/**
+ * Reverse-map a WorkflowTaskKind enum value to its string representation.
+ *
+ * Falls back to `"task"` for unrecognized values. Intentionally does not
+ * import the full kind-metadata module to keep this file dependency-light.
+ */
+function kindToString(kind: number): string {
+  const KIND_MAP: Record<number, string> = {
+    0: "task",
+    1: "agent_call",
+    2: "llm_call",
+    3: "http_call",
+    4: "grpc_call",
+    5: "activity_call",
+    6: "set_variables",
+    7: "switch_case",
+    8: "for_each",
+    9: "raise_error",
+    10: "listen",
+    11: "wait",
+    12: "human_input",
+    13: "run_workflow",
+    14: "try_catch",
+    15: "fork",
+    16: "transform",
+    17: "validate",
+    18: "notification",
+    19: "eval",
+  };
+  return KIND_MAP[kind] ?? "task";
+}