orcheo-canvas 0.0.1

package/src/features/workflow/lib/workflow-diff.ts

@@ -0,0 +1,191 @@
+import type {
+  WorkflowNode,
+  WorkflowEdge,
+} from "@features/workflow/data/workflow-data";
+
+export type WorkflowDiffType = "added" | "removed" | "modified";
+export type WorkflowDiffEntity = "workflow" | "node" | "edge";
+
+export interface WorkflowSnapshot {
+  name: string;
+  description?: string;
+  nodes: WorkflowNode[];
+  edges: WorkflowEdge[];
+}
+
+export interface WorkflowDiffEntry {
+  id: string;
+  type: WorkflowDiffType;
+  entity: WorkflowDiffEntity;
+  name: string;
+  detail?: string;
+  before?: unknown;
+  after?: unknown;
+}
+
+export interface WorkflowDiffResult {
+  summary: {
+    added: number;
+    removed: number;
+    modified: number;
+  };
+  entries: WorkflowDiffEntry[];
+}
+
+const serializeNode = (node: WorkflowNode) => ({
+  id: node.id,
+  type: node.type,
+  position: node.position,
+  data: node.data,
+});
+
+const serializeEdge = (edge: WorkflowEdge) => ({
+  id: edge.id,
+  source: edge.source,
+  target: edge.target,
+  sourceHandle: edge.sourceHandle,
+  targetHandle: edge.targetHandle,
+  label: edge.label,
+  type: edge.type,
+});
+
+const nodesEqual = (a: WorkflowNode, b: WorkflowNode) => {
+  return JSON.stringify(serializeNode(a)) === JSON.stringify(serializeNode(b));
+};
+
+const edgesEqual = (a: WorkflowEdge, b: WorkflowEdge) => {
+  return JSON.stringify(serializeEdge(a)) === JSON.stringify(serializeEdge(b));
+};
+
+const buildNodeDetail = (node: WorkflowNode) => {
+  const { label, status, description } = node.data ?? {};
+  return [label, status, description].filter(Boolean).join(" · ");
+};
+
+export const computeWorkflowDiff = (
+  before: WorkflowSnapshot,
+  after: WorkflowSnapshot,
+): WorkflowDiffResult => {
+  const entries: WorkflowDiffEntry[] = [];
+
+  if (before.name !== after.name) {
+    entries.push({
+      id: `workflow-name-${after.name}`,
+      type: "modified",
+      entity: "workflow",
+      name: "Workflow name",
+      before: before.name,
+      after: after.name,
+    });
+  }
+
+  if ((before.description ?? "") !== (after.description ?? "")) {
+    entries.push({
+      id: `workflow-description-${after.name}`,
+      type: "modified",
+      entity: "workflow",
+      name: "Description",
+      before: before.description ?? "",
+      after: after.description ?? "",
+    });
+  }
+
+  const beforeNodes = new Map(before.nodes.map((node) => [node.id, node]));
+  const afterNodes = new Map(after.nodes.map((node) => [node.id, node]));
+
+  after.nodes.forEach((node) => {
+    const previous = beforeNodes.get(node.id);
+    if (!previous) {
+      entries.push({
+        id: `node-added-${node.id}`,
+        type: "added",
+        entity: "node",
+        name: node.data?.label ?? node.id,
+        detail: buildNodeDetail(node),
+        after: serializeNode(node),
+      });
+      return;
+    }
+
+    if (!nodesEqual(previous, node)) {
+      entries.push({
+        id: `node-modified-${node.id}`,
+        type: "modified",
+        entity: "node",
+        name: node.data?.label ?? node.id,
+        detail: buildNodeDetail(node),
+        before: serializeNode(previous),
+        after: serializeNode(node),
+      });
+    }
+  });
+
+  before.nodes.forEach((node) => {
+    if (!afterNodes.has(node.id)) {
+      entries.push({
+        id: `node-removed-${node.id}`,
+        type: "removed",
+        entity: "node",
+        name: node.data?.label ?? node.id,
+        detail: buildNodeDetail(node),
+        before: serializeNode(node),
+      });
+    }
+  });
+
+  const beforeEdges = new Map(before.edges.map((edge) => [edge.id, edge]));
+  const afterEdges = new Map(after.edges.map((edge) => [edge.id, edge]));
+
+  after.edges.forEach((edge) => {
+    const previous = beforeEdges.get(edge.id);
+    if (!previous) {
+      entries.push({
+        id: `edge-added-${edge.id}`,
+        type: "added",
+        entity: "edge",
+        name: `${edge.source} → ${edge.target}`,
+        after: serializeEdge(edge),
+      });
+      return;
+    }
+
+    if (!edgesEqual(previous, edge)) {
+      entries.push({
+        id: `edge-modified-${edge.id}`,
+        type: "modified",
+        entity: "edge",
+        name: `${edge.source} → ${edge.target}`,
+        before: serializeEdge(previous),
+        after: serializeEdge(edge),
+      });
+    }
+  });
+
+  before.edges.forEach((edge) => {
+    if (!afterEdges.has(edge.id)) {
+      entries.push({
+        id: `edge-removed-${edge.id}`,
+        type: "removed",
+        entity: "edge",
+        name: `${edge.source} → ${edge.target}`,
+        before: serializeEdge(edge),
+      });
+    }
+  });
+
+  const summary = entries.reduce(
+    (acc, entry) => {
+      if (entry.type === "added") {
+        acc.added += 1;
+      } else if (entry.type === "removed") {
+        acc.removed += 1;
+      } else if (entry.type === "modified") {
+        acc.modified += 1;
+      }
+      return acc;
+    },
+    { added: 0, removed: 0, modified: 0 },
+  );
+
+  return { summary, entries };
+};

package/src/features/workflow/lib/workflow-execution-builders.ts

@@ -0,0 +1,101 @@
+import {
+  computeIssues,
+  describePayload,
+  determineLogLevel,
+  formatTimestamp,
+  toExecutionStatus,
+  toNodeStatus,
+} from "./workflow-execution-formatters";
+import type {
+  HistoryWorkflowNode,
+  HistoryWorkflowEdge,
+  RunHistoryResponse,
+  SnapshotEdge,
+  SnapshotNode,
+  WorkflowExecution,
+  WorkflowLookup,
+} from "./workflow-execution.types";
+
+const buildNodesFromSnapshot = (
+  nodes: SnapshotNode[],
+  status: WorkflowExecution["status"],
+): HistoryWorkflowNode[] => {
+  const resolvedStatus = toNodeStatus(status);
+  return nodes.map((node) => ({
+    id: node.id,
+    type: node.type,
+    name:
+      typeof node.data?.label === "string" && node.data.label.trim()
+        ? node.data.label
+        : node.id,
+    position: { ...node.position },
+    status: resolvedStatus,
+    iconKey:
+      typeof node.data?.iconKey === "string" ? node.data.iconKey : undefined,
+    details: node.data ? { ...node.data } : undefined,
+  }));
+};
+
+const buildEdgesFromSnapshot = (edges: SnapshotEdge[]): HistoryWorkflowEdge[] =>
+  edges.map((edge) => ({
+    id: edge.id ?? `${edge.source}-${edge.target}`,
+    source: edge.source,
+    target: edge.target,
+  }));
+
+const extractVersionRecord = (
+  history: RunHistoryResponse,
+  lookup: WorkflowLookup,
+) => {
+  const inputs = history.inputs ?? {};
+  const metadata = (inputs.metadata ?? inputs.canvas ?? {}) as Record<
+    string,
+    unknown
+  >;
+  const versionIdRaw = metadata?.workflow_version_id;
+  if (typeof versionIdRaw === "string" && versionIdRaw) {
+    return lookup.versions.get(versionIdRaw);
+  }
+  return undefined;
+};
+
+export const mapHistoryToExecution = (
+  history: RunHistoryResponse,
+  lookup: WorkflowLookup,
+): WorkflowExecution => {
+  const status = toExecutionStatus(history.status);
+  const version = extractVersionRecord(history, lookup);
+  const snapshotNodes = version?.snapshot.nodes ?? lookup.defaultNodes;
+  const snapshotEdges = version?.snapshot.edges ?? lookup.defaultEdges;
+  const graphMapping = version?.graphToCanvas ?? lookup.defaultMapping;
+
+  const nodes = buildNodesFromSnapshot(snapshotNodes, status);
+  const nodeMap = new Map(nodes.map((node) => [node.id, node]));
+  const edges = buildEdgesFromSnapshot(snapshotEdges);
+
+  const logs = history.steps.map((step) => ({
+    timestamp: formatTimestamp(step.at),
+    level: determineLogLevel(step.payload),
+    message: describePayload(step.payload, graphMapping, nodeMap),
+  }));
+
+  const startTime = history.started_at;
+  const completedAt = history.completed_at ?? undefined;
+  const start = new Date(startTime).getTime();
+  const end = completedAt ? new Date(completedAt).getTime() : Date.now();
+  const duration = Number.isFinite(start) ? Math.max(0, end - start) : 0;
+
+  return {
+    id: history.execution_id,
+    runId: history.execution_id,
+    status,
+    startTime,
+    endTime: completedAt,
+    duration,
+    issues: computeIssues(logs, history.error ?? undefined),
+    nodes,
+    edges,
+    logs,
+    metadata: { graphToCanvas: graphMapping },
+  };
+};

package/src/features/workflow/lib/workflow-execution-formatters.ts

@@ -0,0 +1,145 @@
+import type {
+  HistoryWorkflowNode,
+  WorkflowExecution,
+} from "./workflow-execution.types";
+
+type LogLevel = "INFO" | "DEBUG" | "ERROR" | "WARNING";
+type NodeStatus = "idle" | "running" | "success" | "error" | "warning";
+
+export const toExecutionStatus = (
+  status: string,
+): WorkflowExecution["status"] => {
+  const normalised = status.toLowerCase();
+  switch (normalised) {
+    case "completed":
+    case "success":
+      return "success";
+    case "error":
+    case "failed":
+      return "failed";
+    case "cancelled":
+    case "partial":
+      return "partial";
+    case "running":
+    default:
+      return "running";
+  }
+};
+
+export const toNodeStatus = (
+  status: WorkflowExecution["status"],
+): NodeStatus => {
+  switch (status) {
+    case "running":
+      return "running";
+    case "failed":
+      return "error";
+    case "partial":
+      return "warning";
+    case "success":
+    default:
+      return "success";
+  }
+};
+
+export const determineLogLevel = (
+  payload: Record<string, unknown>,
+): LogLevel => {
+  const explicit = payload.level ?? payload.log_level;
+  if (typeof explicit === "string") {
+    const level = explicit.trim().toLowerCase();
+    if (level === "debug") {
+      return "DEBUG";
+    }
+    if (level === "error") {
+      return "ERROR";
+    }
+    if (level === "warning" || level === "warn") {
+      return "WARNING";
+    }
+  }
+
+  if (typeof payload.error === "string" && payload.error.trim()) {
+    return "ERROR";
+  }
+
+  const status =
+    typeof payload.status === "string" ? payload.status.toLowerCase() : null;
+  if (status === "error" || status === "failed") {
+    return "ERROR";
+  }
+  if (status === "warning" || status === "cancelled" || status === "partial") {
+    return "WARNING";
+  }
+  if (status === "debug") {
+    return "DEBUG";
+  }
+  return "INFO";
+};
+
+export const resolveNodeLabel = (
+  nodeId: string,
+  nodes: Map<string, HistoryWorkflowNode>,
+): string => nodes.get(nodeId)?.name ?? nodeId;
+
+export const describePayload = (
+  payload: Record<string, unknown>,
+  graphToCanvas: Record<string, string>,
+  nodes: Map<string, HistoryWorkflowNode>,
+): string => {
+  if (typeof payload.error === "string" && payload.error.trim()) {
+    return `Run error: ${payload.error.trim()}`;
+  }
+
+  if (typeof payload.message === "string" && payload.message.trim()) {
+    return payload.message.trim();
+  }
+
+  const nodeKey = ["node", "step", "name"].find(
+    (key) => typeof payload[key] === "string" && payload[key],
+  );
+
+  const status =
+    typeof payload.status === "string"
+      ? payload.status.toLowerCase()
+      : undefined;
+
+  if (nodeKey) {
+    const graphNode = String(payload[nodeKey]);
+    const canvasNodeId = graphToCanvas[graphNode] ?? graphNode;
+    const label = resolveNodeLabel(canvasNodeId, nodes);
+    if (status) {
+      return `Node ${label} ${status}`;
+    }
+    return `Node ${label} emitted an update`;
+  }
+
+  if (status) {
+    return `Run status changed to ${status}`;
+  }
+
+  try {
+    return JSON.stringify(payload);
+  } catch {
+    return String(payload);
+  }
+};
+
+export const formatTimestamp = (isoString: string): string => {
+  const date = new Date(isoString);
+  return date.toLocaleTimeString([], {
+    hour: "2-digit",
+    minute: "2-digit",
+    second: "2-digit",
+  });
+};
+
+export const computeIssues = (
+  logs: WorkflowExecution["logs"],
+  error: string | null | undefined,
+): number => {
+  const issueCount = logs.filter(
+    (log) => log.level !== "INFO" && log.level !== "DEBUG",
+  ).length;
+  return error ? issueCount + 1 : issueCount;
+};

package/src/features/workflow/lib/workflow-execution-storage.ts

@@ -0,0 +1,60 @@
+import { buildBackendHttpUrl } from "@/lib/config";
+
+import { mapHistoryToExecution } from "./workflow-execution-builders";
+import type {
+  RunHistoryResponse,
+  WorkflowExecution,
+  WorkflowLookup,
+} from "./workflow-execution.types";
+import type { StoredWorkflow } from "@features/workflow/lib/workflow-storage";
+
+export interface LoadWorkflowExecutionsOptions {
+  workflow?: StoredWorkflow;
+  limit?: number;
+  backendBaseUrl?: string;
+}
+
+export const loadWorkflowExecutions = async (
+  workflowId: string,
+  options: LoadWorkflowExecutionsOptions = {},
+): Promise<WorkflowExecution[]> => {
+  if (!workflowId) {
+    return [];
+  }
+  if (typeof fetch === "undefined") {
+    throw new Error("Fetch API is not available in this environment.");
+  }
+
+  const limit = options.limit ?? 50;
+  const url = buildBackendHttpUrl(
+    `/api/workflows/${workflowId}/executions?limit=${encodeURIComponent(String(limit))}`,
+    options.backendBaseUrl,
+  );
+
+  const response = await fetch(url);
+  if (!response.ok) {
+    const detail = await response.text();
+    throw new Error(
+      detail || `Failed to load execution history (${response.status})`,
+    );
+  }
+
+  const histories = (await response.json()) as RunHistoryResponse[];
+  const workflow = options.workflow;
+  const lookup: WorkflowLookup = {
+    defaultNodes: workflow?.nodes ?? [],
+    defaultEdges: workflow?.edges ?? [],
+    defaultMapping: workflow?.versions?.at(-1)?.graphToCanvas ?? {},
+    versions: new Map(
+      (workflow?.versions ?? []).map((version) => [version.id, version]),
+    ),
+  };
+
+  const executions = histories.map((history) =>
+    mapHistoryToExecution(history, lookup),
+  );
+
+  return executions.sort(
+    (a, b) => new Date(b.startTime).getTime() - new Date(a.startTime).getTime(),
+  );
+};

package/src/features/workflow/lib/workflow-execution.types.ts

@@ -0,0 +1,38 @@
+import type {
+  WorkflowExecution,
+  WorkflowEdge as HistoryWorkflowEdge,
+  WorkflowNode as HistoryWorkflowNode,
+} from "@features/workflow/components/panels/workflow-execution-history";
+import type {
+  StoredWorkflow,
+  WorkflowVersionRecord,
+} from "@features/workflow/lib/workflow-storage";
+
+export interface RunHistoryStepResponse {
+  index: number;
+  at: string;
+  payload: Record<string, unknown>;
+}
+
+export interface RunHistoryResponse {
+  execution_id: string;
+  workflow_id: string;
+  status: string;
+  started_at: string;
+  completed_at?: string | null;
+  error?: string | null;
+  inputs?: Record<string, unknown>;
+  steps: RunHistoryStepResponse[];
+}
+
+export type SnapshotNode = StoredWorkflow["nodes"][number];
+export type SnapshotEdge = StoredWorkflow["edges"][number];
+
+export type WorkflowLookup = {
+  defaultNodes: SnapshotNode[];
+  defaultEdges: SnapshotEdge[];
+  defaultMapping: Record<string, string>;
+  versions: Map<string, WorkflowVersionRecord>;
+};
+
+export type { WorkflowExecution, HistoryWorkflowEdge, HistoryWorkflowNode };

package/src/features/workflow/lib/workflow-storage-api.ts

@@ -0,0 +1,122 @@
+import { buildBackendHttpUrl } from "@/lib/config";
+import type {
+  ApiWorkflow,
+  ApiWorkflowVersion,
+  RequestOptions,
+} from "./workflow-storage.types";
+
+export const API_BASE = "/api/workflows";
+
+const JSON_HEADERS = {
+  Accept: "application/json",
+  "Content-Type": "application/json",
+};
+
+export class ApiRequestError extends Error {
+  status: number;
+
+  constructor(message: string, status: number) {
+    super(message);
+    this.name = "ApiRequestError";
+    this.status = status;
+  }
+}
+
+const readText = async (response: Response): Promise<string> => {
+  try {
+    return await response.text();
+  } catch {
+    return "";
+  }
+};
+
+export const request = async <T>(
+  path: string,
+  options: RequestOptions = {},
+): Promise<T> => {
+  const expectJson = options.expectJson ?? true;
+  const url = buildBackendHttpUrl(path);
+
+  const response = await fetch(url, {
+    ...options,
+    headers: options.body ? JSON_HEADERS : options.headers,
+  });
+
+  if (!response.ok) {
+    const detail = (await readText(response)) || response.statusText;
+    throw new ApiRequestError(detail, response.status);
+  }
+
+  if (!expectJson || response.status === 204) {
+    return undefined as T;
+  }
+
+  const payload = await readText(response);
+  if (!payload) {
+    return undefined as T;
+  }
+  return JSON.parse(payload) as T;
+};
+
+export const fetchWorkflow = async (
+  workflowId: string,
+): Promise<ApiWorkflow | undefined> => {
+  try {
+    return await request<ApiWorkflow>(`${API_BASE}/${workflowId}`);
+  } catch (error) {
+    if (
+      error instanceof ApiRequestError &&
+      (error.status === 404 || error.status === 410)
+    ) {
+      return undefined;
+    }
+    throw error;
+  }
+};
+
+export const fetchWorkflowVersions = async (
+  workflowId: string,
+): Promise<ApiWorkflowVersion[]> => {
+  try {
+    return await request<ApiWorkflowVersion[]>(
+      `${API_BASE}/${workflowId}/versions`,
+    );
+  } catch (error) {
+    if (
+      error instanceof ApiRequestError &&
+      (error.status === 404 || error.status === 410)
+    ) {
+      return [];
+    }
+    throw error;
+  }
+};
+
+export const upsertWorkflow = async (
+  input: Pick<ApiWorkflow, "id" | "name" | "description" | "tags">,
+  actor: string,
+): Promise<string> => {
+  if (!input.id) {
+    const created = await request<ApiWorkflow>(API_BASE, {
+      method: "POST",
+      body: JSON.stringify({
+        name: input.name,
+        description: input.description,
+        tags: input.tags ?? [],
+        actor,
+      }),
+    });
+    return created.id;
+  }
+
+  await request<ApiWorkflow>(`${API_BASE}/${input.id}`, {
+    method: "PUT",
+    body: JSON.stringify({
+      name: input.name,
+      description: input.description,
+      tags: input.tags ?? [],
+      actor,
+    }),
+  });
+  return input.id;
+};