@open-mercato/core 0.4.2-canary-968c919ed2 → 0.4.2-canary-f821f89ef6

package/dist/modules/workflows/backend/definitions/visual-editor/page.js

@@ -33,6 +33,7 @@ import { apiCall } from "@open-mercato/ui/backend/utils/apiCall";
 import { flash } from "@open-mercato/ui/backend/FlashMessages";
 import { CircleQuestionMark, Info, PanelTopClose, PanelTopOpen, Play, Save, Trash2 } from "lucide-react";
 import { NODE_TYPE_ICONS, NODE_TYPE_COLORS, NODE_TYPE_LABELS } from "../../../lib/node-type-icons.js";
+import { DefinitionTriggersEditor } from "../../../components/DefinitionTriggersEditor.js";
 function VisualEditorPage() {
   const t = useT();
   const router = useRouter();
@@ -58,6 +59,7 @@ function VisualEditorPage() {
   const [icon, setIcon] = useState("");
   const [effectiveFrom, setEffectiveFrom] = useState("");
   const [effectiveTo, setEffectiveTo] = useState("");
+  const [triggers, setTriggers] = useState([]);
   useEffect(() => {
     const loadDefinition = async () => {
       if (!definitionId) {
@@ -85,6 +87,7 @@ function VisualEditorPage() {
         const graph = definitionToGraph(definition.definition);
         setNodes(graph.nodes);
         setEdges(graph.edges);
+        setTriggers(definition.definition?.triggers || []);
         flash("Workflow loaded successfully", "success");
       } catch (error) {
         console.error("Error loading workflow definition:", error);
@@ -209,7 +212,11 @@ function VisualEditorPage() {
       flash(`Cannot save: ${criticalErrors.length} validation error(s) found. Please fix them first.`, "error");
       return;
     }
-    const definitionData = graphToDefinition(nodes, edges, { includePositions: true });
+    const graphDefinition = graphToDefinition(nodes, edges, { includePositions: true });
+    const definitionData = {
+      ...graphDefinition,
+      triggers: triggers.length > 0 ? triggers : void 0
+    };
     const schemaResult = workflowDefinitionDataSchema.safeParse(definitionData);
     if (!schemaResult.success) {
       const firstIssue = schemaResult.error.issues[0];
@@ -265,7 +272,7 @@ function VisualEditorPage() {
     } finally {
       setIsSaving(false);
     }
-  }, [nodes, edges, workflowId, workflowName, description, version, enabled, category, tags, definitionId, router]);
+  }, [nodes, edges, workflowId, workflowName, description, version, enabled, category, tags, triggers, definitionId, router]);
   const handleTest = useCallback(() => {
     const errors = validateWorkflowGraph(nodes, edges);
     const criticalErrors = errors.filter((e) => e.type === "error");
@@ -368,6 +375,7 @@ function VisualEditorPage() {
     setIcon("");
     setEffectiveFrom("");
     setEffectiveTo("");
+    setTriggers([]);
     setShowClearConfirm(false);
     flash("Canvas cleared", "success");
   }, []);
@@ -466,142 +474,152 @@ function VisualEditorPage() {
         )
       ] })
     ] }) }),
-    showMetadata && /* @__PURE__ */ jsx("div", { className: "bg-white border-b border-gray-200 px-6 py-4", children: /* @__PURE__ */ jsxs("div", { className: "rounded-lg border bg-card p-4", children: [
-      /* @__PURE__ */ jsx("h2", { className: "text-sm font-semibold uppercase text-muted-foreground mb-4", children: "Workflow Metadata" }),
-      /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-3 gap-4", children: [
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { htmlFor: "workflowId", className: "text-xs", children: "Workflow ID *" }),
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              id: "workflowId",
-              value: workflowId,
-              onChange: (e) => setWorkflowId(e.target.value),
-              placeholder: "checkout_workflow",
-              disabled: !!definitionId
-            }
-          ),
-          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: definitionId ? "Cannot be changed when editing" : "Lowercase, numbers, hyphens, underscores" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { htmlFor: "workflowName", className: "text-xs", children: "Workflow Name *" }),
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              id: "workflowName",
-              value: workflowName,
-              onChange: (e) => setWorkflowName(e.target.value),
-              placeholder: "Checkout Process"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { htmlFor: "category", className: "text-xs", children: "Category" }),
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              id: "category",
-              value: category,
-              onChange: (e) => setCategory(e.target.value),
-              placeholder: "E-Commerce"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "col-span-3 space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { htmlFor: "description", className: "text-xs", children: "Description" }),
-          /* @__PURE__ */ jsx(
-            Textarea,
-            {
-              id: "description",
-              value: description,
-              onChange: (e) => setDescription(e.target.value),
-              placeholder: "Describe the purpose of this workflow...",
-              rows: 2
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { htmlFor: "version", className: "text-xs", children: "Version *" }),
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              id: "version",
-              type: "number",
-              value: version,
-              onChange: (e) => setVersion(parseInt(e.target.value) || 1),
-              min: 1,
-              disabled: !!definitionId
-            }
-          ),
-          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Version number (increment for major changes)" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-xs", children: "Enabled" }),
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-2", children: [
+    showMetadata && /* @__PURE__ */ jsxs("div", { className: "bg-white border-b border-gray-200 px-6 py-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "rounded-lg border bg-card p-4", children: [
+        /* @__PURE__ */ jsx("h2", { className: "text-sm font-semibold uppercase text-muted-foreground mb-4", children: "Workflow Metadata" }),
+        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-3 gap-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "workflowId", className: "text-xs", children: "Workflow ID *" }),
             /* @__PURE__ */ jsx(
-              Switch,
+              Input,
               {
-                id: "enabled",
-                checked: enabled,
-                onCheckedChange: setEnabled
+                id: "workflowId",
+                value: workflowId,
+                onChange: (e) => setWorkflowId(e.target.value),
+                placeholder: "checkout_workflow",
+                disabled: !!definitionId
               }
             ),
-            /* @__PURE__ */ jsx(Label, { htmlFor: "enabled", className: "text-sm font-normal cursor-pointer", children: "Only enabled workflows can be started" })
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: definitionId ? "Cannot be changed when editing" : "Lowercase, numbers, hyphens, underscores" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "workflowName", className: "text-xs", children: "Workflow Name *" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "workflowName",
+                value: workflowName,
+                onChange: (e) => setWorkflowName(e.target.value),
+                placeholder: "Checkout Process"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "category", className: "text-xs", children: "Category" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "category",
+                value: category,
+                onChange: (e) => setCategory(e.target.value),
+                placeholder: "E-Commerce"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "col-span-3 space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "description", className: "text-xs", children: "Description" }),
+            /* @__PURE__ */ jsx(
+              Textarea,
+              {
+                id: "description",
+                value: description,
+                onChange: (e) => setDescription(e.target.value),
+                placeholder: "Describe the purpose of this workflow...",
+                rows: 2
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "version", className: "text-xs", children: "Version *" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "version",
+                type: "number",
+                value: version,
+                onChange: (e) => setVersion(parseInt(e.target.value) || 1),
+                min: 1,
+                disabled: !!definitionId
+              }
+            ),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Version number (increment for major changes)" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { className: "text-xs", children: "Enabled" }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-2", children: [
+              /* @__PURE__ */ jsx(
+                Switch,
+                {
+                  id: "enabled",
+                  checked: enabled,
+                  onCheckedChange: setEnabled
+                }
+              ),
+              /* @__PURE__ */ jsx(Label, { htmlFor: "enabled", className: "text-sm font-normal cursor-pointer", children: "Only enabled workflows can be started" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { className: "text-xs", children: "Tags" }),
+            /* @__PURE__ */ jsx(
+              TagsInput,
+              {
+                value: tags,
+                onChange: setTags,
+                placeholder: t("workflows.form.placeholders.tags")
+              }
+            ),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: t("workflows.form.descriptions.tags") })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "icon", className: "text-xs", children: "Icon" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "icon",
+                value: icon,
+                onChange: (e) => setIcon(e.target.value),
+                placeholder: "ShoppingCart"
+              }
+            ),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Icon name for visual identification" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "effectiveFrom", className: "text-xs", children: "Effective From" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "effectiveFrom",
+                type: "date",
+                value: effectiveFrom,
+                onChange: (e) => setEffectiveFrom(e.target.value)
+              }
+            ),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Workflow becomes active from this date" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: "effectiveTo", className: "text-xs", children: "Effective To" }),
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: "effectiveTo",
+                type: "date",
+                value: effectiveTo,
+                onChange: (e) => setEffectiveTo(e.target.value)
+              }
+            ),
+            /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Workflow deactivates after this date" })
           ] })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { className: "text-xs", children: "Tags" }),
-          /* @__PURE__ */ jsx(
-            TagsInput,
-            {
-              value: tags,
-              onChange: setTags,
-              placeholder: t("workflows.form.placeholders.tags")
-            }
-          ),
-          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: t("workflows.form.descriptions.tags") })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { htmlFor: "icon", className: "text-xs", children: "Icon" }),
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              id: "icon",
-              value: icon,
-              onChange: (e) => setIcon(e.target.value),
-              placeholder: "ShoppingCart"
-            }
-          ),
-          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Icon name for visual identification" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { htmlFor: "effectiveFrom", className: "text-xs", children: "Effective From" }),
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              id: "effectiveFrom",
-              type: "date",
-              value: effectiveFrom,
-              onChange: (e) => setEffectiveFrom(e.target.value)
-            }
-          ),
-          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Workflow becomes active from this date" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsx(Label, { htmlFor: "effectiveTo", className: "text-xs", children: "Effective To" }),
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              id: "effectiveTo",
-              type: "date",
-              value: effectiveTo,
-              onChange: (e) => setEffectiveTo(e.target.value)
-            }
-          ),
-          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "Workflow deactivates after this date" })
         ] })
-      ] })
-    ] }) }),
+      ] }),
+      /* @__PURE__ */ jsx(
+        DefinitionTriggersEditor,
+        {
+          value: triggers,
+          onChange: setTriggers,
+          className: "mt-4"
+        }
+      )
+    ] }),
     /* @__PURE__ */ jsxs(PageBody, { className: "flex-1 flex overflow-hidden", children: [
       /* @__PURE__ */ jsx("div", { className: "w-88 bg-white border-r border-gray-200 p-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "rounded-lg border bg-card p-4", children: [
         /* @__PURE__ */ jsx("h2", { className: "text-sm font-semibold uppercase text-muted-foreground mb-2", children: "Step Palette" }),

package/dist/modules/workflows/backend/definitions/visual-editor/page.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/modules/workflows/backend/definitions/visual-editor/page.tsx"],
-  "sourcesContent": ["'use client'\n\nimport { WorkflowGraph } from '../../../components/WorkflowGraph'\n// Conditional imports based on feature flag\nimport { NodeEditDialog } from '../../../components/NodeEditDialog'\nimport { EdgeEditDialog } from '../../../components/EdgeEditDialog'\nimport { NodeEditDialogCrudForm } from '../../../components/NodeEditDialogCrudForm'\nimport { EdgeEditDialogCrudForm } from '../../../components/EdgeEditDialogCrudForm'\nimport { Node, Edge, addEdge, Connection, applyNodeChanges, applyEdgeChanges, NodeChange, EdgeChange } from '@xyflow/react'\nimport { useState, useCallback, useEffect } from 'react'\nimport Link from 'next/link'\nimport { useRouter, useSearchParams } from 'next/navigation'\nimport { graphToDefinition, definitionToGraph, validateWorkflowGraph, generateStepId, generateTransitionId, ValidationError } from '../../../lib/graph-utils'\nimport { workflowDefinitionDataSchema } from '../../../data/validators'\nimport { Page, PageBody } from '@open-mercato/ui/backend/Page'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport { Textarea } from '@open-mercato/ui/primitives/textarea'\nimport { Label } from '@open-mercato/ui/primitives/label'\nimport { Switch } from '@open-mercato/ui/primitives/switch'\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from '@open-mercato/ui/primitives/dialog'\nimport { TagsInput } from '@open-mercato/ui/backend/inputs/TagsInput'\nimport { LoadingMessage } from '@open-mercato/ui/backend/detail'\nimport { Alert, AlertTitle } from '@open-mercato/ui/primitives/alert'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { flash } from '@open-mercato/ui/backend/FlashMessages'\nimport {CircleQuestionMark, Info, PanelTopClose, PanelTopOpen, Play, Save, Trash2} from 'lucide-react'\nimport { NODE_TYPE_ICONS, NODE_TYPE_COLORS, NODE_TYPE_LABELS } from '../../../lib/node-type-icons'\nimport * as React from \"react\";\n\n/**\n * VisualEditorPage - Visual workflow definition editor\n *\n * Layout:\n * - Page Header: Title, description, and action buttons (Save, Validate, Test)\n * - Workflow Metadata: Collapsible form for workflow details\n * - Page Body:\n *   - Left sidebar: Step palette (click to add)\n *   - Main canvas: ReactFlow graph editor\n * - Flash Messages: Top-right positioned validation messages\n * - Edit Dialogs: Modal dialogs for editing steps and transitions\n */\nexport default function VisualEditorPage() {\n  const t = useT()\n  const router = useRouter()\n  const searchParams = useSearchParams()\n  const definitionId = searchParams.get('id')\n\n  const [isLoading, setIsLoading] = useState(!!definitionId)\n  const [isSaving, setIsSaving] = useState(false)\n  const [nodes, setNodes] = useState<Node[]>([])\n  const [edges, setEdges] = useState<Edge[]>([])\n  const [selectedNode, setSelectedNode] = useState<Node | null>(null)\n  const [selectedEdge, setSelectedEdge] = useState<Edge | null>(null)\n  const [showMetadata, setShowMetadata] = useState(true)\n  const [showNodeDialog, setShowNodeDialog] = useState(false)\n  const [showEdgeDialog, setShowEdgeDialog] = useState(false)\n  const [showClearConfirm, setShowClearConfirm] = useState(false)\n\n  // Workflow metadata state\n  const [workflowId, setWorkflowId] = useState('')\n  const [workflowName, setWorkflowName] = useState('')\n  const [description, setDescription] = useState('')\n  const [version, setVersion] = useState(1)\n  const [enabled, setEnabled] = useState(true)\n  const [category, setCategory] = useState('')\n  const [tags, setTags] = useState<string[]>([])\n  const [icon, setIcon] = useState('')\n  const [effectiveFrom, setEffectiveFrom] = useState('')\n  const [effectiveTo, setEffectiveTo] = useState('')\n\n  // Load existing definition if ID is provided\n  useEffect(() => {\n    const loadDefinition = async () => {\n      if (!definitionId) {\n        setIsLoading(false)\n        return\n      }\n\n      try {\n        const result = await apiCall<{ data: any; error?: string }>(`/api/workflows/definitions/${definitionId}`)\n\n        if (!result.ok) {\n          flash(`Failed to load workflow: ${result.result?.error || 'Unknown error'}`, 'error')\n          setIsLoading(false)\n          return\n        }\n\n        const definition = result.result?.data\n\n        // Populate metadata\n        setWorkflowId(definition.workflowId)\n        setWorkflowName(definition.workflowName || definition.definition.workflowName || '')\n        setDescription(definition.description || definition.definition.description || '')\n        setVersion(definition.version)\n        setEnabled(definition.enabled)\n        setCategory(definition.metadata?.category || '')\n        setTags(definition.metadata?.tags || [])\n        setIcon(definition.metadata?.icon || '')\n        setEffectiveFrom(definition.effectiveFrom || '')\n        setEffectiveTo(definition.effectiveTo || '')\n\n        // Convert definition to graph\n        const graph = definitionToGraph(definition.definition)\n        setNodes(graph.nodes)\n        setEdges(graph.edges)\n\n        flash('Workflow loaded successfully', 'success')\n      } catch (error) {\n        console.error('Error loading workflow definition:', error)\n        flash('Failed to load workflow definition', 'error')\n      } finally {\n        setIsLoading(false)\n      }\n    }\n\n    loadDefinition()\n  }, [definitionId])\n\n  // Handle node changes from ReactFlow\n  const handleNodesChange = useCallback((changes: NodeChange[]) => {\n    setNodes((nds) => applyNodeChanges(changes, nds))\n  }, [])\n\n  // Handle edge changes from ReactFlow\n  const handleEdgesChange = useCallback((changes: EdgeChange[]) => {\n    setEdges((eds) => applyEdgeChanges(changes, eds))\n  }, [])\n\n  // Handle adding new node from palette\n  const handleAddNode = useCallback((nodeType: string) => {\n    const newNode: Node = {\n      id: generateStepId(nodeType),\n      type: nodeType,\n      position: {\n        x: 250 + nodes.length * 50,\n        y: 100 + nodes.length * 150,\n      },\n      data: {\n        label: getDefaultLabel(nodeType),\n        description: '',\n        badge: getDefaultBadge(nodeType),\n        status: 'pending',\n      },\n    }\n\n    setNodes((nds) => [...nds, newNode])\n  }, [nodes.length])\n\n  // Handle node selection - open edit dialog\n  const handleNodeClick = useCallback((_event: React.MouseEvent, node: Node) => {\n    setSelectedNode(node)\n    setSelectedEdge(null)\n    setShowNodeDialog(true)\n  }, [])\n\n  // Handle edge selection - open edit dialog\n  const handleEdgeClick = useCallback((_event: React.MouseEvent, edge: Edge) => {\n    setSelectedEdge(edge)\n    setSelectedNode(null)\n    setShowEdgeDialog(true)\n  }, [])\n\n  // Save node updates\n  const handleSaveNode = useCallback((nodeId: string, updates: Partial<Node['data']>) => {\n    setNodes((nds) =>\n      nds.map((node) =>\n        node.id === nodeId\n          ? { ...node, data: { ...node.data, ...updates } }\n          : node\n      )\n    )\n    flash('Node updated successfully', 'success')\n  }, [])\n\n  // Save edge updates\n  const handleSaveEdge = useCallback((edgeId: string, updates: Partial<Edge['data']>) => {\n    setEdges((eds) =>\n      eds.map((edge) =>\n        edge.id === edgeId\n          ? { ...edge, data: { ...edge.data, ...updates } }\n          : edge\n      )\n    )\n    flash('Transition updated successfully', 'success')\n  }, [])\n\n  // Delete edge\n  const handleDeleteEdge = useCallback((edgeId: string) => {\n    setEdges((eds) => eds.filter((edge) => edge.id !== edgeId))\n    flash('Transition deleted successfully', 'success')\n  }, [])\n\n  // Delete node\n  const handleDeleteNode = useCallback((nodeId: string) => {\n    // Remove the node\n    setNodes((nds) => nds.filter((node) => node.id !== nodeId))\n\n    // Remove all edges connected to this node\n    setEdges((eds) => eds.filter((edge) => edge.source !== nodeId && edge.target !== nodeId))\n\n    flash('Step deleted successfully', 'success')\n  }, [])\n\n  // Handle new connections\n  const handleConnect = useCallback((connection: Connection) => {\n    const newEdge: Edge = {\n      id: generateTransitionId(connection.source!, connection.target!),\n      source: connection.source!,\n      target: connection.target!,\n      type: 'smoothstep',\n      data: {\n        trigger: 'auto',\n        preConditions: [],\n        postConditions: [],\n        activities: [],\n        label: '',\n      },\n    }\n\n    setEdges((eds) => addEdge(newEdge, eds))\n  }, [])\n\n  // Validate workflow\n  const handleValidate = useCallback(() => {\n    const graphErrors = validateWorkflowGraph(nodes, edges)\n    const allErrors: ValidationError[] = [...graphErrors]\n\n    // Run Zod schema validation\n    try {\n      const definitionData = graphToDefinition(nodes, edges, { includePositions: true })\n      const result = workflowDefinitionDataSchema.safeParse(definitionData)\n\n      if (!result.success) {\n        // Convert Zod errors to validation errors\n        result.error.issues.forEach((issue) => {\n          allErrors.push({\n            type: 'error',\n            message: `Schema validation: ${issue.path.join('.')} - ${issue.message}`,\n          })\n        })\n      }\n    } catch (error) {\n      allErrors.push({\n        type: 'error',\n        message: `Schema validation failed: ${error instanceof Error ? error.message : 'Unknown error'}`,\n      })\n    }\n\n    if (allErrors.length === 0) {\n      flash('Validation passed! Your workflow is valid and ready to save.', 'success')\n    } else {\n      // Show first error/warning message\n      const firstError = allErrors[0]\n      const errorCount = allErrors.length\n      const message = errorCount > 1\n        ? `${firstError.message} (and ${errorCount - 1} more ${errorCount === 2 ? 'issue' : 'issues'})`\n        : firstError.message\n      flash(message, firstError.type === 'error' ? 'error' : 'warning')\n    }\n  }, [nodes, edges])\n\n  // Save workflow definition\n  const handleSave = useCallback(async () => {\n    // Validate required fields\n    if (!workflowId || !workflowName) {\n      flash('Workflow ID and Name are required fields', 'error')\n      return\n    }\n\n    // Validate workflow structure\n    const errors = validateWorkflowGraph(nodes, edges)\n    const criticalErrors = errors.filter(e => e.type === 'error')\n    if (criticalErrors.length > 0) {\n      flash(`Cannot save: ${criticalErrors.length} validation error(s) found. Please fix them first.`, 'error')\n      return\n    }\n\n    // Generate definition data\n    const definitionData = graphToDefinition(nodes, edges, { includePositions: true })\n\n    // Run Zod schema validation before saving\n    const schemaResult = workflowDefinitionDataSchema.safeParse(definitionData)\n    if (!schemaResult.success) {\n      const firstIssue = schemaResult.error.issues[0]\n      flash(`Schema error: ${firstIssue.path.join('.')} - ${firstIssue.message}`, 'error')\n      return\n    }\n\n    setIsSaving(true)\n\n    try {\n\n      const metadata: any = {}\n      if (category) metadata.category = category\n      if (tags.length > 0) metadata.tags = tags\n      if (icon) metadata.icon = icon\n\n      // Determine if creating new or updating existing\n      const isUpdate = !!definitionId\n\n      let result\n      if (isUpdate) {\n        // Update existing definition\n        result = await apiCall<{ data: any; error?: string }>(`/api/workflows/definitions/${definitionId}`, {\n          method: 'PUT',\n          headers: { 'Content-Type': 'application/json' },\n          body: JSON.stringify({\n            definition: definitionData,\n            enabled,\n          }),\n        })\n      } else {\n        // Create new definition\n        result = await apiCall<{ data: any; error?: string }>('/api/workflows/definitions', {\n          method: 'POST',\n          headers: { 'Content-Type': 'application/json' },\n          body: JSON.stringify({\n            workflowId,\n            workflowName,\n            description: description || null,\n            version,\n            definition: definitionData,\n            metadata: Object.keys(metadata).length > 0 ? metadata : null,\n            enabled,\n            effectiveFrom: effectiveFrom || null,\n            effectiveTo: effectiveTo || null,\n          }),\n        })\n      }\n\n      if (!result.ok) {\n        flash(`Failed to save: ${result.result?.error || 'Unknown error'}`, 'error')\n        return\n      }\n\n      const savedDefinition = result.result?.data\n\n      flash(`Workflow ${isUpdate ? 'updated' : 'created'} successfully!`, 'success')\n\n      // Redirect to definition detail page after short delay\n      setTimeout(() => {\n        router.push(`/backend/definitions/${savedDefinition.id}`)\n      }, 1500)\n\n    } catch (error) {\n      console.error('Error saving workflow definition:', error)\n      flash('Failed to save workflow definition. Please try again.', 'error')\n    } finally {\n      setIsSaving(false)\n    }\n  }, [nodes, edges, workflowId, workflowName, description, version, enabled, category, tags, definitionId, router])\n\n  // Test workflow\n  const handleTest = useCallback(() => {\n    // First validate\n    const errors = validateWorkflowGraph(nodes, edges)\n    const criticalErrors = errors.filter((e) => e.type === 'error')\n    if (criticalErrors.length > 0) {\n      flash(`Cannot test: ${criticalErrors.length} validation error(s) found. Please fix them first.`, 'error')\n      return\n    }\n\n    // TODO: Implement test logic (create instance, run first step)\n    flash('Test functionality will be implemented next', 'info')\n  }, [nodes, edges])\n\n  // Load example workflow\n  const handleLoadExample = useCallback(() => {\n    // Set example metadata\n    setWorkflowId('approval_workflow')\n    setWorkflowName('Simple Approval Workflow')\n    setDescription('A basic approval workflow for reviewing and approving requests')\n    setVersion(1)\n    setEnabled(true)\n    setCategory('Approvals')\n    setTags(['approval', 'review'])\n\n    const exampleNodes: Node[] = [\n      {\n        id: 'start',\n        type: 'start',\n        position: { x: 250, y: 50 },\n        data: {\n          label: 'Start',\n          description: 'Workflow begins',\n          status: 'pending',\n          badge: 'Start',\n        },\n      },\n      {\n        id: 'step1',\n        type: 'userTask',\n        position: { x: 250, y: 250 },\n        data: {\n          label: 'Review Request',\n          description: 'User reviews the incoming request',\n          status: 'pending',\n          stepNumber: 1,\n          badge: 'User Task',\n          assignedToRoles: ['Reviewer'],\n        },\n      },\n      {\n        id: 'end',\n        type: 'end',\n        position: { x: 250, y: 450 },\n        data: {\n          label: 'Complete',\n          description: 'Workflow ends',\n          status: 'pending',\n          badge: 'End',\n        },\n      },\n    ]\n\n    const exampleEdges: Edge[] = [\n      {\n        id: 'e-start-step1',\n        source: 'start',\n        target: 'step1',\n        type: 'smoothstep',\n        data: {\n          trigger: 'auto',\n          preConditions: [],\n          postConditions: [],\n          activities: [],\n        },\n      },\n      {\n        id: 'e-step1-end',\n        source: 'step1',\n        target: 'end',\n        type: 'smoothstep',\n        data: {\n          trigger: 'auto',\n          preConditions: [],\n          postConditions: [],\n          activities: [],\n        },\n      },\n    ]\n\n    setNodes(exampleNodes)\n    setEdges(exampleEdges)\n    flash('Example workflow loaded', 'success')\n  }, [])\n\n  // Clear canvas\n  const handleClear = useCallback(() => {\n    if (nodes.length > 0 || edges.length > 0 || workflowId || workflowName) {\n      setShowClearConfirm(true)\n    }\n  }, [nodes.length, edges.length, workflowId, workflowName])\n\n  // Confirm clear action\n  const confirmClear = useCallback(() => {\n    setNodes([])\n    setEdges([])\n    setWorkflowId('')\n    setWorkflowName('')\n    setDescription('')\n    setVersion(1)\n    setEnabled(true)\n    setCategory('')\n    setTags([])\n    setIcon('')\n    setEffectiveFrom('')\n    setEffectiveTo('')\n    setShowClearConfirm(false)\n    flash('Canvas cleared', 'success')\n  }, [])\n\n  // Show loading spinner while loading definition\n  if (isLoading) {\n    return (\n      <Page className=\"h-screen flex items-center justify-center\">\n        <LoadingMessage label=\"Loading workflow definition...\" />\n      </Page>\n    )\n  }\n\n  return (\n    <Page className=\"h-screen flex flex-col\">\n      {/* Page Header */}\n      <div className=\"border-b border-gray-200 bg-white px-6 py-4\">\n        <div className=\"flex flex-col gap-3 md:flex-row md:items-center md:justify-between\">\n          <div className=\"flex flex-wrap items-center gap-3\">\n            <Link\n              href=\"/backend/definitions\"\n              className=\"inline-flex items-center text-sm text-muted-foreground hover:text-foreground\"\n            >\n              <span aria-hidden className=\"mr-1 text-base\">\u2190</span>\n              <span className=\"sr-only\">{t('workflows.definitions.backToList', 'Back to definitions')}</span>\n            </Link>\n            <div className=\"space-y-2\">\n              <div className=\"flex flex-wrap items-center gap-2\">\n                <h1 className=\"text-2xl font-semibold text-foreground\">\n                  {definitionId ? (workflowName || 'Workflow') : t('workflows.backend.definitions.visual_editor.title')}\n                </h1>\n              </div>\n              <p className=\"text-sm text-muted-foreground\">\n                {definitionId\n                  ? t('workflows.definitions.detail.summary', 'Editing workflow definition')\n                  : t('workflows.definitions.create.summary', 'Create and edit workflow definitions visually with a drag-and-drop interface')\n                }\n              </p>\n            </div>\n          </div>\n          <div className=\"flex flex-wrap items-center gap-2\">\n            <Button\n              variant=\"outline\"\n              onClick={() => setShowMetadata(!showMetadata)}\n              disabled={isSaving}\n            >\n              {showMetadata ? <PanelTopClose className=\"mr-2 h-4 w-4\"/> : <PanelTopOpen className=\"mr-2 h-4 w-4\"/>}\n              {showMetadata ? 'Hide' : 'Show'} Metadata\n            </Button>\n            <Button\n              variant=\"outline\"\n              onClick={handleLoadExample}\n              disabled={isSaving}\n            >\n              Load Example\n            </Button>\n            <Button\n              variant=\"destructive\"\n              onClick={handleClear}\n              disabled={isSaving}\n            >\n              <Trash2 className=\"mr-2 h-4 w-4\" />\n                      Clear\n            </Button>\n            <div className=\"w-px h-6 bg-gray-300\"></div>\n            <Button\n              variant=\"outline\"\n              onClick={handleValidate}\n              disabled={isSaving}\n            >\n              <CircleQuestionMark className=\"mr-2 h-4 w-4\" />\n              Validate\n            </Button>\n            <Button\n              variant=\"outline\"\n              onClick={handleTest}\n              disabled={isSaving}\n            >\n              <Play className=\"mr-2 h-4 w-4\" />\n              Run Test\n            </Button>\n            <Button\n              onClick={handleSave}\n              disabled={isSaving}\n            >\n              <Save className=\"mr-2 h-4 w-4\" />\n              {isSaving ? 'Saving...' : (definitionId ? 'Update' : 'Save')}\n            </Button>\n          </div>\n        </div>\n      </div>\n\n      {/* Workflow Metadata Form */}\n      {showMetadata && (\n        <div className=\"bg-white border-b border-gray-200 px-6 py-4\">\n          <div className=\"rounded-lg border bg-card p-4\">\n            <h2 className=\"text-sm font-semibold uppercase text-muted-foreground mb-4\">Workflow Metadata</h2>\n            <div className=\"grid grid-cols-3 gap-4\">\n            {/* Workflow ID */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"workflowId\" className=\"text-xs\">Workflow ID *</Label>\n              <Input\n                id=\"workflowId\"\n                value={workflowId}\n                onChange={(e) => setWorkflowId(e.target.value)}\n                placeholder=\"checkout_workflow\"\n                disabled={!!definitionId}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                {definitionId ? 'Cannot be changed when editing' : 'Lowercase, numbers, hyphens, underscores'}\n              </p>\n            </div>\n\n            {/* Workflow Name */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"workflowName\" className=\"text-xs\">Workflow Name *</Label>\n              <Input\n                id=\"workflowName\"\n                value={workflowName}\n                onChange={(e) => setWorkflowName(e.target.value)}\n                placeholder=\"Checkout Process\"\n              />\n            </div>\n\n            {/* Category */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"category\" className=\"text-xs\">Category</Label>\n              <Input\n                id=\"category\"\n                value={category}\n                onChange={(e) => setCategory(e.target.value)}\n                placeholder=\"E-Commerce\"\n              />\n            </div>\n\n            {/* Description */}\n            <div className=\"col-span-3 space-y-1\">\n              <Label htmlFor=\"description\" className=\"text-xs\">Description</Label>\n              <Textarea\n                id=\"description\"\n                value={description}\n                onChange={(e) => setDescription(e.target.value)}\n                placeholder=\"Describe the purpose of this workflow...\"\n                rows={2}\n              />\n            </div>\n\n            {/* Version */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"version\" className=\"text-xs\">Version *</Label>\n              <Input\n                id=\"version\"\n                type=\"number\"\n                value={version}\n                onChange={(e) => setVersion(parseInt(e.target.value) || 1)}\n                min={1}\n                disabled={!!definitionId}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                Version number (increment for major changes)\n              </p>\n            </div>\n\n            {/* Enabled */}\n            <div className=\"space-y-1\">\n              <Label className=\"text-xs\">Enabled</Label>\n              <div className=\"flex items-center gap-2 mt-2\">\n                <Switch\n                  id=\"enabled\"\n                  checked={enabled}\n                  onCheckedChange={setEnabled}\n                />\n                <Label htmlFor=\"enabled\" className=\"text-sm font-normal cursor-pointer\">\n                  Only enabled workflows can be started\n                </Label>\n              </div>\n            </div>\n\n            {/* Tags */}\n            <div className=\"space-y-1\">\n              <Label className=\"text-xs\">Tags</Label>\n              <TagsInput\n                value={tags}\n                onChange={setTags}\n                placeholder={t('workflows.form.placeholders.tags')}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                {t('workflows.form.descriptions.tags')}\n              </p>\n            </div>\n\n            {/* Icon */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"icon\" className=\"text-xs\">Icon</Label>\n              <Input\n                id=\"icon\"\n                value={icon}\n                onChange={(e) => setIcon(e.target.value)}\n                placeholder=\"ShoppingCart\"\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                Icon name for visual identification\n              </p>\n            </div>\n\n            {/* Effective From */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"effectiveFrom\" className=\"text-xs\">Effective From</Label>\n              <Input\n                id=\"effectiveFrom\"\n                type=\"date\"\n                value={effectiveFrom}\n                onChange={(e) => setEffectiveFrom(e.target.value)}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                Workflow becomes active from this date\n              </p>\n            </div>\n\n            {/* Effective To */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"effectiveTo\" className=\"text-xs\">Effective To</Label>\n              <Input\n                id=\"effectiveTo\"\n                type=\"date\"\n                value={effectiveTo}\n                onChange={(e) => setEffectiveTo(e.target.value)}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                Workflow deactivates after this date\n              </p>\n            </div>\n            </div>\n          </div>\n        </div>\n      )}\n\n      {/* Main Content: Sidebar + Canvas */}\n      <PageBody className=\"flex-1 flex overflow-hidden\">\n        {/* Left Sidebar - Step Palette */}\n        <div className=\"w-88 bg-white border-r border-gray-200 p-6 overflow-y-auto\">\n          <div className=\"rounded-lg border bg-card p-4\">\n            <h2 className=\"text-sm font-semibold uppercase text-muted-foreground mb-2\">Step Palette</h2>\n            <p className=\"text-xs text-muted-foreground mb-4\">\n              Click a step type to add it to the canvas\n            </p>\n\n            <div className=\"space-y-3\">\n            {/* START Step */}\n            <button\n              onClick={() => handleAddNode('start')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.start} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.start\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.start.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.start.description}</div>\n            </button>\n\n            {/* USER_TASK Step */}\n            <button\n              onClick={() => handleAddNode('userTask')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.userTask} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.userTask\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.userTask.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.userTask.description}</div>\n            </button>\n\n            {/* AUTOMATED Step */}\n            <button\n              onClick={() => handleAddNode('automated')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.automated} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.automated\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.automated.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.automated.description}</div>\n            </button>\n\n            {/* WAIT_FOR_SIGNAL Step */}\n            <button\n              onClick={() => handleAddNode('waitForSignal')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.waitForSignal} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.waitForSignal\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.waitForSignal.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.waitForSignal.description}</div>\n            </button>\n\n            {/* SUB_WORKFLOW Step */}\n            <button\n              onClick={() => handleAddNode('subWorkflow')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.subWorkflow} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.subWorkflow\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.subWorkflow.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.subWorkflow.description}</div>\n            </button>\n\n            {/* END Step */}\n            <button\n              onClick={() => handleAddNode('end')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.end} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.end\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.end.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.end.description}</div>\n            </button>\n          </div>\n\n            {/* Instructions */}\n            <Alert variant=\"info\" className=\"mt-6\">\n              <Info className=\"size-4\" />\n              <AlertTitle className=\"text-xs\">How to use:</AlertTitle>\n              <div className=\"mt-2\">\n                <ul className=\"text-xs space-y-1\">\n                  <li>\u2022 Click step types to add them</li>\n                  <li>\u2022 Drag steps to position them</li>\n                  <li>\u2022 Connect steps by dragging from handles</li>\n                  <li>\u2022 Click steps/transitions to edit them</li>\n                  <li>\u2022 Validate before saving</li>\n                </ul>\n              </div>\n            </Alert>\n          </div>\n        </div>\n\n        {/* Main Canvas */}\n        <div className=\"flex-1 relative p-6 overflow-auto\">\n          <div className=\"h-full rounded-lg border bg-card\">\n            <WorkflowGraph\n              initialNodes={nodes}\n              initialEdges={edges}\n              onNodesChange={handleNodesChange}\n              onEdgesChange={handleEdgesChange}\n              onNodeClick={handleNodeClick}\n              onEdgeClick={handleEdgeClick}\n              onConnect={handleConnect}\n              editable={true}\n              height=\"100%\"\n            />\n          </div>\n\n          {/* Empty State */}\n          {nodes.length === 0 && (\n            <div className=\"absolute inset-0 flex items-center justify-center pointer-events-none\">\n              <div className=\"text-center\">\n                <h2 className=\"text-xl font-semibold text-gray-900 mb-2\">\n                  Start Building Your Workflow\n                </h2>\n                <p className=\"text-gray-600 mb-4\">\n                  Click a step type from the palette to add it to the canvas\n                </p>\n                <div className=\"text-sm text-gray-500\">\n                  or{' '}\n                  <button\n                    onClick={handleLoadExample}\n                    className=\"text-blue-600 hover:underline pointer-events-auto\"\n                  >\n                    load an example workflow\n                  </button>\n                </div>\n              </div>\n            </div>\n          )}\n        </div>\n      </PageBody>\n\n      {/* Node Edit Dialog - Conditional rendering based on feature flag */}\n      {process.env.NEXT_PUBLIC_WORKFLOW_CRUDFORM_ENABLED === 'true' ? (\n        <NodeEditDialogCrudForm\n          node={selectedNode}\n          isOpen={showNodeDialog}\n          onClose={() => setShowNodeDialog(false)}\n          onSave={handleSaveNode}\n          onDelete={handleDeleteNode}\n        />\n      ) : (\n        <NodeEditDialog\n          node={selectedNode}\n          isOpen={showNodeDialog}\n          onClose={() => setShowNodeDialog(false)}\n          onSave={handleSaveNode}\n          onDelete={handleDeleteNode}\n        />\n      )}\n\n      {/* Edge Edit Dialog - Conditional rendering based on feature flag */}\n      {process.env.NEXT_PUBLIC_WORKFLOW_CRUDFORM_ENABLED === 'true' ? (\n        <EdgeEditDialogCrudForm\n          edge={selectedEdge}\n          isOpen={showEdgeDialog}\n          onClose={() => setShowEdgeDialog(false)}\n          onSave={handleSaveEdge}\n          onDelete={handleDeleteEdge}\n        />\n      ) : (\n        <EdgeEditDialog\n          edge={selectedEdge}\n          isOpen={showEdgeDialog}\n          onClose={() => setShowEdgeDialog(false)}\n          onSave={handleSaveEdge}\n          onDelete={handleDeleteEdge}\n        />\n      )}\n\n      {/* Clear Confirmation Dialog */}\n      <Dialog open={showClearConfirm} onOpenChange={setShowClearConfirm}>\n        <DialogContent className=\"sm:max-w-md\">\n          <DialogHeader>\n            <DialogTitle>Clear Everything?</DialogTitle>\n            <DialogDescription>\n              This will clear all metadata and the workflow canvas. This action cannot be undone.\n            </DialogDescription>\n          </DialogHeader>\n          <DialogFooter>\n            <Button variant=\"outline\" onClick={() => setShowClearConfirm(false)}>\n              {t('common.cancel', 'Cancel')}\n            </Button>\n            <Button variant=\"destructive\" onClick={confirmClear}>\n              {t('common.clear', 'Clear')}\n            </Button>\n          </DialogFooter>\n        </DialogContent>\n      </Dialog>\n    </Page>\n  )\n}\n\n// Helper functions\nfunction getDefaultLabel(nodeType: string): string {\n  const labels: Record<string, string> = {\n    start: 'Start',\n    end: 'End',\n    userTask: 'New User Task',\n    automated: 'New Automated Task',\n    decision: 'Decision Point',\n    waitForSignal: 'Wait for Signal',\n  }\n  return labels[nodeType] || 'New Step'\n}\n\nfunction getDefaultBadge(nodeType: string): string {\n  const badges: Record<string, string> = {\n    start: 'Start',\n    end: 'End',\n    userTask: 'User Task',\n    automated: 'Automated',\n    decision: 'Decision',\n    waitForSignal: 'Wait for Signal',\n  }\n  return badges[nodeType] || 'Task'\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\n\nimport { WorkflowGraph } from '../../../components/WorkflowGraph'\n// Conditional imports based on feature flag\nimport { NodeEditDialog } from '../../../components/NodeEditDialog'\nimport { EdgeEditDialog } from '../../../components/EdgeEditDialog'\nimport { NodeEditDialogCrudForm } from '../../../components/NodeEditDialogCrudForm'\nimport { EdgeEditDialogCrudForm } from '../../../components/EdgeEditDialogCrudForm'\nimport { Node, Edge, addEdge, Connection, applyNodeChanges, applyEdgeChanges, NodeChange, EdgeChange } from '@xyflow/react'\nimport { useState, useCallback, useEffect } from 'react'\nimport Link from 'next/link'\nimport { useRouter, useSearchParams } from 'next/navigation'\nimport { graphToDefinition, definitionToGraph, validateWorkflowGraph, generateStepId, generateTransitionId, ValidationError } from '../../../lib/graph-utils'\nimport { workflowDefinitionDataSchema } from '../../../data/validators'\nimport { Page, PageBody } from '@open-mercato/ui/backend/Page'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport { Textarea } from '@open-mercato/ui/primitives/textarea'\nimport { Label } from '@open-mercato/ui/primitives/label'\nimport { Switch } from '@open-mercato/ui/primitives/switch'\nimport {\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n} from '@open-mercato/ui/primitives/dialog'\nimport { TagsInput } from '@open-mercato/ui/backend/inputs/TagsInput'\nimport { LoadingMessage } from '@open-mercato/ui/backend/detail'\nimport { Alert, AlertTitle } from '@open-mercato/ui/primitives/alert'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { apiCall } from '@open-mercato/ui/backend/utils/apiCall'\nimport { flash } from '@open-mercato/ui/backend/FlashMessages'\nimport {CircleQuestionMark, Info, PanelTopClose, PanelTopOpen, Play, Save, Trash2} from 'lucide-react'\nimport { NODE_TYPE_ICONS, NODE_TYPE_COLORS, NODE_TYPE_LABELS } from '../../../lib/node-type-icons'\nimport { DefinitionTriggersEditor } from '../../../components/DefinitionTriggersEditor'\nimport type { WorkflowDefinitionTrigger } from '../../../data/entities'\nimport * as React from \"react\";\n\n/**\n * VisualEditorPage - Visual workflow definition editor\n *\n * Layout:\n * - Page Header: Title, description, and action buttons (Save, Validate, Test)\n * - Workflow Metadata: Collapsible form for workflow details\n * - Page Body:\n *   - Left sidebar: Step palette (click to add)\n *   - Main canvas: ReactFlow graph editor\n * - Flash Messages: Top-right positioned validation messages\n * - Edit Dialogs: Modal dialogs for editing steps and transitions\n */\nexport default function VisualEditorPage() {\n  const t = useT()\n  const router = useRouter()\n  const searchParams = useSearchParams()\n  const definitionId = searchParams.get('id')\n\n  const [isLoading, setIsLoading] = useState(!!definitionId)\n  const [isSaving, setIsSaving] = useState(false)\n  const [nodes, setNodes] = useState<Node[]>([])\n  const [edges, setEdges] = useState<Edge[]>([])\n  const [selectedNode, setSelectedNode] = useState<Node | null>(null)\n  const [selectedEdge, setSelectedEdge] = useState<Edge | null>(null)\n  const [showMetadata, setShowMetadata] = useState(true)\n  const [showNodeDialog, setShowNodeDialog] = useState(false)\n  const [showEdgeDialog, setShowEdgeDialog] = useState(false)\n  const [showClearConfirm, setShowClearConfirm] = useState(false)\n\n  // Workflow metadata state\n  const [workflowId, setWorkflowId] = useState('')\n  const [workflowName, setWorkflowName] = useState('')\n  const [description, setDescription] = useState('')\n  const [version, setVersion] = useState(1)\n  const [enabled, setEnabled] = useState(true)\n  const [category, setCategory] = useState('')\n  const [tags, setTags] = useState<string[]>([])\n  const [icon, setIcon] = useState('')\n  const [effectiveFrom, setEffectiveFrom] = useState('')\n  const [effectiveTo, setEffectiveTo] = useState('')\n  const [triggers, setTriggers] = useState<WorkflowDefinitionTrigger[]>([])\n\n  // Load existing definition if ID is provided\n  useEffect(() => {\n    const loadDefinition = async () => {\n      if (!definitionId) {\n        setIsLoading(false)\n        return\n      }\n\n      try {\n        const result = await apiCall<{ data: any; error?: string }>(`/api/workflows/definitions/${definitionId}`)\n\n        if (!result.ok) {\n          flash(`Failed to load workflow: ${result.result?.error || 'Unknown error'}`, 'error')\n          setIsLoading(false)\n          return\n        }\n\n        const definition = result.result?.data\n\n        // Populate metadata\n        setWorkflowId(definition.workflowId)\n        setWorkflowName(definition.workflowName || definition.definition.workflowName || '')\n        setDescription(definition.description || definition.definition.description || '')\n        setVersion(definition.version)\n        setEnabled(definition.enabled)\n        setCategory(definition.metadata?.category || '')\n        setTags(definition.metadata?.tags || [])\n        setIcon(definition.metadata?.icon || '')\n        setEffectiveFrom(definition.effectiveFrom || '')\n        setEffectiveTo(definition.effectiveTo || '')\n\n        // Convert definition to graph\n        const graph = definitionToGraph(definition.definition)\n        setNodes(graph.nodes)\n        setEdges(graph.edges)\n\n        // Load embedded triggers from definition\n        setTriggers(definition.definition?.triggers || [])\n\n        flash('Workflow loaded successfully', 'success')\n      } catch (error) {\n        console.error('Error loading workflow definition:', error)\n        flash('Failed to load workflow definition', 'error')\n      } finally {\n        setIsLoading(false)\n      }\n    }\n\n    loadDefinition()\n  }, [definitionId])\n\n  // Handle node changes from ReactFlow\n  const handleNodesChange = useCallback((changes: NodeChange[]) => {\n    setNodes((nds) => applyNodeChanges(changes, nds))\n  }, [])\n\n  // Handle edge changes from ReactFlow\n  const handleEdgesChange = useCallback((changes: EdgeChange[]) => {\n    setEdges((eds) => applyEdgeChanges(changes, eds))\n  }, [])\n\n  // Handle adding new node from palette\n  const handleAddNode = useCallback((nodeType: string) => {\n    const newNode: Node = {\n      id: generateStepId(nodeType),\n      type: nodeType,\n      position: {\n        x: 250 + nodes.length * 50,\n        y: 100 + nodes.length * 150,\n      },\n      data: {\n        label: getDefaultLabel(nodeType),\n        description: '',\n        badge: getDefaultBadge(nodeType),\n        status: 'pending',\n      },\n    }\n\n    setNodes((nds) => [...nds, newNode])\n  }, [nodes.length])\n\n  // Handle node selection - open edit dialog\n  const handleNodeClick = useCallback((_event: React.MouseEvent, node: Node) => {\n    setSelectedNode(node)\n    setSelectedEdge(null)\n    setShowNodeDialog(true)\n  }, [])\n\n  // Handle edge selection - open edit dialog\n  const handleEdgeClick = useCallback((_event: React.MouseEvent, edge: Edge) => {\n    setSelectedEdge(edge)\n    setSelectedNode(null)\n    setShowEdgeDialog(true)\n  }, [])\n\n  // Save node updates\n  const handleSaveNode = useCallback((nodeId: string, updates: Partial<Node['data']>) => {\n    setNodes((nds) =>\n      nds.map((node) =>\n        node.id === nodeId\n          ? { ...node, data: { ...node.data, ...updates } }\n          : node\n      )\n    )\n    flash('Node updated successfully', 'success')\n  }, [])\n\n  // Save edge updates\n  const handleSaveEdge = useCallback((edgeId: string, updates: Partial<Edge['data']>) => {\n    setEdges((eds) =>\n      eds.map((edge) =>\n        edge.id === edgeId\n          ? { ...edge, data: { ...edge.data, ...updates } }\n          : edge\n      )\n    )\n    flash('Transition updated successfully', 'success')\n  }, [])\n\n  // Delete edge\n  const handleDeleteEdge = useCallback((edgeId: string) => {\n    setEdges((eds) => eds.filter((edge) => edge.id !== edgeId))\n    flash('Transition deleted successfully', 'success')\n  }, [])\n\n  // Delete node\n  const handleDeleteNode = useCallback((nodeId: string) => {\n    // Remove the node\n    setNodes((nds) => nds.filter((node) => node.id !== nodeId))\n\n    // Remove all edges connected to this node\n    setEdges((eds) => eds.filter((edge) => edge.source !== nodeId && edge.target !== nodeId))\n\n    flash('Step deleted successfully', 'success')\n  }, [])\n\n  // Handle new connections\n  const handleConnect = useCallback((connection: Connection) => {\n    const newEdge: Edge = {\n      id: generateTransitionId(connection.source!, connection.target!),\n      source: connection.source!,\n      target: connection.target!,\n      type: 'smoothstep',\n      data: {\n        trigger: 'auto',\n        preConditions: [],\n        postConditions: [],\n        activities: [],\n        label: '',\n      },\n    }\n\n    setEdges((eds) => addEdge(newEdge, eds))\n  }, [])\n\n  // Validate workflow\n  const handleValidate = useCallback(() => {\n    const graphErrors = validateWorkflowGraph(nodes, edges)\n    const allErrors: ValidationError[] = [...graphErrors]\n\n    // Run Zod schema validation\n    try {\n      const definitionData = graphToDefinition(nodes, edges, { includePositions: true })\n      const result = workflowDefinitionDataSchema.safeParse(definitionData)\n\n      if (!result.success) {\n        // Convert Zod errors to validation errors\n        result.error.issues.forEach((issue) => {\n          allErrors.push({\n            type: 'error',\n            message: `Schema validation: ${issue.path.join('.')} - ${issue.message}`,\n          })\n        })\n      }\n    } catch (error) {\n      allErrors.push({\n        type: 'error',\n        message: `Schema validation failed: ${error instanceof Error ? error.message : 'Unknown error'}`,\n      })\n    }\n\n    if (allErrors.length === 0) {\n      flash('Validation passed! Your workflow is valid and ready to save.', 'success')\n    } else {\n      // Show first error/warning message\n      const firstError = allErrors[0]\n      const errorCount = allErrors.length\n      const message = errorCount > 1\n        ? `${firstError.message} (and ${errorCount - 1} more ${errorCount === 2 ? 'issue' : 'issues'})`\n        : firstError.message\n      flash(message, firstError.type === 'error' ? 'error' : 'warning')\n    }\n  }, [nodes, edges])\n\n  // Save workflow definition\n  const handleSave = useCallback(async () => {\n    // Validate required fields\n    if (!workflowId || !workflowName) {\n      flash('Workflow ID and Name are required fields', 'error')\n      return\n    }\n\n    // Validate workflow structure\n    const errors = validateWorkflowGraph(nodes, edges)\n    const criticalErrors = errors.filter(e => e.type === 'error')\n    if (criticalErrors.length > 0) {\n      flash(`Cannot save: ${criticalErrors.length} validation error(s) found. Please fix them first.`, 'error')\n      return\n    }\n\n    // Generate definition data and include triggers\n    const graphDefinition = graphToDefinition(nodes, edges, { includePositions: true })\n    const definitionData = {\n      ...graphDefinition,\n      triggers: triggers.length > 0 ? triggers : undefined,\n    }\n\n    // Run Zod schema validation before saving\n    const schemaResult = workflowDefinitionDataSchema.safeParse(definitionData)\n    if (!schemaResult.success) {\n      const firstIssue = schemaResult.error.issues[0]\n      flash(`Schema error: ${firstIssue.path.join('.')} - ${firstIssue.message}`, 'error')\n      return\n    }\n\n    setIsSaving(true)\n\n    try {\n\n      const metadata: any = {}\n      if (category) metadata.category = category\n      if (tags.length > 0) metadata.tags = tags\n      if (icon) metadata.icon = icon\n\n      // Determine if creating new or updating existing\n      const isUpdate = !!definitionId\n\n      let result\n      if (isUpdate) {\n        // Update existing definition\n        result = await apiCall<{ data: any; error?: string }>(`/api/workflows/definitions/${definitionId}`, {\n          method: 'PUT',\n          headers: { 'Content-Type': 'application/json' },\n          body: JSON.stringify({\n            definition: definitionData,\n            enabled,\n          }),\n        })\n      } else {\n        // Create new definition\n        result = await apiCall<{ data: any; error?: string }>('/api/workflows/definitions', {\n          method: 'POST',\n          headers: { 'Content-Type': 'application/json' },\n          body: JSON.stringify({\n            workflowId,\n            workflowName,\n            description: description || null,\n            version,\n            definition: definitionData,\n            metadata: Object.keys(metadata).length > 0 ? metadata : null,\n            enabled,\n            effectiveFrom: effectiveFrom || null,\n            effectiveTo: effectiveTo || null,\n          }),\n        })\n      }\n\n      if (!result.ok) {\n        flash(`Failed to save: ${result.result?.error || 'Unknown error'}`, 'error')\n        return\n      }\n\n      const savedDefinition = result.result?.data\n\n      flash(`Workflow ${isUpdate ? 'updated' : 'created'} successfully!`, 'success')\n\n      // Redirect to definition detail page after short delay\n      setTimeout(() => {\n        router.push(`/backend/definitions/${savedDefinition.id}`)\n      }, 1500)\n\n    } catch (error) {\n      console.error('Error saving workflow definition:', error)\n      flash('Failed to save workflow definition. Please try again.', 'error')\n    } finally {\n      setIsSaving(false)\n    }\n  }, [nodes, edges, workflowId, workflowName, description, version, enabled, category, tags, triggers, definitionId, router])\n\n  // Test workflow\n  const handleTest = useCallback(() => {\n    // First validate\n    const errors = validateWorkflowGraph(nodes, edges)\n    const criticalErrors = errors.filter((e) => e.type === 'error')\n    if (criticalErrors.length > 0) {\n      flash(`Cannot test: ${criticalErrors.length} validation error(s) found. Please fix them first.`, 'error')\n      return\n    }\n\n    // TODO: Implement test logic (create instance, run first step)\n    flash('Test functionality will be implemented next', 'info')\n  }, [nodes, edges])\n\n  // Load example workflow\n  const handleLoadExample = useCallback(() => {\n    // Set example metadata\n    setWorkflowId('approval_workflow')\n    setWorkflowName('Simple Approval Workflow')\n    setDescription('A basic approval workflow for reviewing and approving requests')\n    setVersion(1)\n    setEnabled(true)\n    setCategory('Approvals')\n    setTags(['approval', 'review'])\n\n    const exampleNodes: Node[] = [\n      {\n        id: 'start',\n        type: 'start',\n        position: { x: 250, y: 50 },\n        data: {\n          label: 'Start',\n          description: 'Workflow begins',\n          status: 'pending',\n          badge: 'Start',\n        },\n      },\n      {\n        id: 'step1',\n        type: 'userTask',\n        position: { x: 250, y: 250 },\n        data: {\n          label: 'Review Request',\n          description: 'User reviews the incoming request',\n          status: 'pending',\n          stepNumber: 1,\n          badge: 'User Task',\n          assignedToRoles: ['Reviewer'],\n        },\n      },\n      {\n        id: 'end',\n        type: 'end',\n        position: { x: 250, y: 450 },\n        data: {\n          label: 'Complete',\n          description: 'Workflow ends',\n          status: 'pending',\n          badge: 'End',\n        },\n      },\n    ]\n\n    const exampleEdges: Edge[] = [\n      {\n        id: 'e-start-step1',\n        source: 'start',\n        target: 'step1',\n        type: 'smoothstep',\n        data: {\n          trigger: 'auto',\n          preConditions: [],\n          postConditions: [],\n          activities: [],\n        },\n      },\n      {\n        id: 'e-step1-end',\n        source: 'step1',\n        target: 'end',\n        type: 'smoothstep',\n        data: {\n          trigger: 'auto',\n          preConditions: [],\n          postConditions: [],\n          activities: [],\n        },\n      },\n    ]\n\n    setNodes(exampleNodes)\n    setEdges(exampleEdges)\n    flash('Example workflow loaded', 'success')\n  }, [])\n\n  // Clear canvas\n  const handleClear = useCallback(() => {\n    if (nodes.length > 0 || edges.length > 0 || workflowId || workflowName) {\n      setShowClearConfirm(true)\n    }\n  }, [nodes.length, edges.length, workflowId, workflowName])\n\n  // Confirm clear action\n  const confirmClear = useCallback(() => {\n    setNodes([])\n    setEdges([])\n    setWorkflowId('')\n    setWorkflowName('')\n    setDescription('')\n    setVersion(1)\n    setEnabled(true)\n    setCategory('')\n    setTags([])\n    setIcon('')\n    setEffectiveFrom('')\n    setEffectiveTo('')\n    setTriggers([])\n    setShowClearConfirm(false)\n    flash('Canvas cleared', 'success')\n  }, [])\n\n  // Show loading spinner while loading definition\n  if (isLoading) {\n    return (\n      <Page className=\"h-screen flex items-center justify-center\">\n        <LoadingMessage label=\"Loading workflow definition...\" />\n      </Page>\n    )\n  }\n\n  return (\n    <Page className=\"h-screen flex flex-col\">\n      {/* Page Header */}\n      <div className=\"border-b border-gray-200 bg-white px-6 py-4\">\n        <div className=\"flex flex-col gap-3 md:flex-row md:items-center md:justify-between\">\n          <div className=\"flex flex-wrap items-center gap-3\">\n            <Link\n              href=\"/backend/definitions\"\n              className=\"inline-flex items-center text-sm text-muted-foreground hover:text-foreground\"\n            >\n              <span aria-hidden className=\"mr-1 text-base\">\u2190</span>\n              <span className=\"sr-only\">{t('workflows.definitions.backToList', 'Back to definitions')}</span>\n            </Link>\n            <div className=\"space-y-2\">\n              <div className=\"flex flex-wrap items-center gap-2\">\n                <h1 className=\"text-2xl font-semibold text-foreground\">\n                  {definitionId ? (workflowName || 'Workflow') : t('workflows.backend.definitions.visual_editor.title')}\n                </h1>\n              </div>\n              <p className=\"text-sm text-muted-foreground\">\n                {definitionId\n                  ? t('workflows.definitions.detail.summary', 'Editing workflow definition')\n                  : t('workflows.definitions.create.summary', 'Create and edit workflow definitions visually with a drag-and-drop interface')\n                }\n              </p>\n            </div>\n          </div>\n          <div className=\"flex flex-wrap items-center gap-2\">\n            <Button\n              variant=\"outline\"\n              onClick={() => setShowMetadata(!showMetadata)}\n              disabled={isSaving}\n            >\n              {showMetadata ? <PanelTopClose className=\"mr-2 h-4 w-4\"/> : <PanelTopOpen className=\"mr-2 h-4 w-4\"/>}\n              {showMetadata ? 'Hide' : 'Show'} Metadata\n            </Button>\n            <Button\n              variant=\"outline\"\n              onClick={handleLoadExample}\n              disabled={isSaving}\n            >\n              Load Example\n            </Button>\n            <Button\n              variant=\"destructive\"\n              onClick={handleClear}\n              disabled={isSaving}\n            >\n              <Trash2 className=\"mr-2 h-4 w-4\" />\n                      Clear\n            </Button>\n            <div className=\"w-px h-6 bg-gray-300\"></div>\n            <Button\n              variant=\"outline\"\n              onClick={handleValidate}\n              disabled={isSaving}\n            >\n              <CircleQuestionMark className=\"mr-2 h-4 w-4\" />\n              Validate\n            </Button>\n            <Button\n              variant=\"outline\"\n              onClick={handleTest}\n              disabled={isSaving}\n            >\n              <Play className=\"mr-2 h-4 w-4\" />\n              Run Test\n            </Button>\n            <Button\n              onClick={handleSave}\n              disabled={isSaving}\n            >\n              <Save className=\"mr-2 h-4 w-4\" />\n              {isSaving ? 'Saving...' : (definitionId ? 'Update' : 'Save')}\n            </Button>\n          </div>\n        </div>\n      </div>\n\n      {/* Workflow Metadata Form */}\n      {showMetadata && (\n        <div className=\"bg-white border-b border-gray-200 px-6 py-4\">\n          <div className=\"rounded-lg border bg-card p-4\">\n            <h2 className=\"text-sm font-semibold uppercase text-muted-foreground mb-4\">Workflow Metadata</h2>\n            <div className=\"grid grid-cols-3 gap-4\">\n            {/* Workflow ID */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"workflowId\" className=\"text-xs\">Workflow ID *</Label>\n              <Input\n                id=\"workflowId\"\n                value={workflowId}\n                onChange={(e) => setWorkflowId(e.target.value)}\n                placeholder=\"checkout_workflow\"\n                disabled={!!definitionId}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                {definitionId ? 'Cannot be changed when editing' : 'Lowercase, numbers, hyphens, underscores'}\n              </p>\n            </div>\n\n            {/* Workflow Name */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"workflowName\" className=\"text-xs\">Workflow Name *</Label>\n              <Input\n                id=\"workflowName\"\n                value={workflowName}\n                onChange={(e) => setWorkflowName(e.target.value)}\n                placeholder=\"Checkout Process\"\n              />\n            </div>\n\n            {/* Category */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"category\" className=\"text-xs\">Category</Label>\n              <Input\n                id=\"category\"\n                value={category}\n                onChange={(e) => setCategory(e.target.value)}\n                placeholder=\"E-Commerce\"\n              />\n            </div>\n\n            {/* Description */}\n            <div className=\"col-span-3 space-y-1\">\n              <Label htmlFor=\"description\" className=\"text-xs\">Description</Label>\n              <Textarea\n                id=\"description\"\n                value={description}\n                onChange={(e) => setDescription(e.target.value)}\n                placeholder=\"Describe the purpose of this workflow...\"\n                rows={2}\n              />\n            </div>\n\n            {/* Version */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"version\" className=\"text-xs\">Version *</Label>\n              <Input\n                id=\"version\"\n                type=\"number\"\n                value={version}\n                onChange={(e) => setVersion(parseInt(e.target.value) || 1)}\n                min={1}\n                disabled={!!definitionId}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                Version number (increment for major changes)\n              </p>\n            </div>\n\n            {/* Enabled */}\n            <div className=\"space-y-1\">\n              <Label className=\"text-xs\">Enabled</Label>\n              <div className=\"flex items-center gap-2 mt-2\">\n                <Switch\n                  id=\"enabled\"\n                  checked={enabled}\n                  onCheckedChange={setEnabled}\n                />\n                <Label htmlFor=\"enabled\" className=\"text-sm font-normal cursor-pointer\">\n                  Only enabled workflows can be started\n                </Label>\n              </div>\n            </div>\n\n            {/* Tags */}\n            <div className=\"space-y-1\">\n              <Label className=\"text-xs\">Tags</Label>\n              <TagsInput\n                value={tags}\n                onChange={setTags}\n                placeholder={t('workflows.form.placeholders.tags')}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                {t('workflows.form.descriptions.tags')}\n              </p>\n            </div>\n\n            {/* Icon */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"icon\" className=\"text-xs\">Icon</Label>\n              <Input\n                id=\"icon\"\n                value={icon}\n                onChange={(e) => setIcon(e.target.value)}\n                placeholder=\"ShoppingCart\"\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                Icon name for visual identification\n              </p>\n            </div>\n\n            {/* Effective From */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"effectiveFrom\" className=\"text-xs\">Effective From</Label>\n              <Input\n                id=\"effectiveFrom\"\n                type=\"date\"\n                value={effectiveFrom}\n                onChange={(e) => setEffectiveFrom(e.target.value)}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                Workflow becomes active from this date\n              </p>\n            </div>\n\n            {/* Effective To */}\n            <div className=\"space-y-1\">\n              <Label htmlFor=\"effectiveTo\" className=\"text-xs\">Effective To</Label>\n              <Input\n                id=\"effectiveTo\"\n                type=\"date\"\n                value={effectiveTo}\n                onChange={(e) => setEffectiveTo(e.target.value)}\n              />\n              <p className=\"text-xs text-muted-foreground\">\n                Workflow deactivates after this date\n              </p>\n            </div>\n            </div>\n          </div>\n\n          {/* Event Triggers - Always visible, managed as part of definition */}\n          <DefinitionTriggersEditor\n            value={triggers}\n            onChange={setTriggers}\n            className=\"mt-4\"\n          />\n        </div>\n      )}\n\n      {/* Main Content: Sidebar + Canvas */}\n      <PageBody className=\"flex-1 flex overflow-hidden\">\n        {/* Left Sidebar - Step Palette */}\n        <div className=\"w-88 bg-white border-r border-gray-200 p-6 overflow-y-auto\">\n          <div className=\"rounded-lg border bg-card p-4\">\n            <h2 className=\"text-sm font-semibold uppercase text-muted-foreground mb-2\">Step Palette</h2>\n            <p className=\"text-xs text-muted-foreground mb-4\">\n              Click a step type to add it to the canvas\n            </p>\n\n            <div className=\"space-y-3\">\n            {/* START Step */}\n            <button\n              onClick={() => handleAddNode('start')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.start} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.start\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.start.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.start.description}</div>\n            </button>\n\n            {/* USER_TASK Step */}\n            <button\n              onClick={() => handleAddNode('userTask')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.userTask} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.userTask\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.userTask.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.userTask.description}</div>\n            </button>\n\n            {/* AUTOMATED Step */}\n            <button\n              onClick={() => handleAddNode('automated')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.automated} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.automated\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.automated.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.automated.description}</div>\n            </button>\n\n            {/* WAIT_FOR_SIGNAL Step */}\n            <button\n              onClick={() => handleAddNode('waitForSignal')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.waitForSignal} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.waitForSignal\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.waitForSignal.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.waitForSignal.description}</div>\n            </button>\n\n            {/* SUB_WORKFLOW Step */}\n            <button\n              onClick={() => handleAddNode('subWorkflow')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.subWorkflow} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.subWorkflow\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.subWorkflow.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.subWorkflow.description}</div>\n            </button>\n\n            {/* END Step */}\n            <button\n              onClick={() => handleAddNode('end')}\n              className=\"w-full text-left px-4 py-3 bg-white border-2 border-gray-200 rounded-xl hover:shadow-md hover:border-gray-300 transition-all cursor-pointer group relative\"\n            >\n              <div className={`absolute top-2 right-2 ${NODE_TYPE_COLORS.end} opacity-60 group-hover:opacity-100 transition-opacity`}>\n                {(() => {\n                  const Icon = NODE_TYPE_ICONS.end\n                  return <Icon className=\"w-4 h-4\" />\n                })()}\n              </div>\n              <div className=\"text-sm font-semibold text-gray-900\">{NODE_TYPE_LABELS.end.title}</div>\n              <div className=\"text-xs text-gray-500 mt-0.5\">{NODE_TYPE_LABELS.end.description}</div>\n            </button>\n          </div>\n\n            {/* Instructions */}\n            <Alert variant=\"info\" className=\"mt-6\">\n              <Info className=\"size-4\" />\n              <AlertTitle className=\"text-xs\">How to use:</AlertTitle>\n              <div className=\"mt-2\">\n                <ul className=\"text-xs space-y-1\">\n                  <li>\u2022 Click step types to add them</li>\n                  <li>\u2022 Drag steps to position them</li>\n                  <li>\u2022 Connect steps by dragging from handles</li>\n                  <li>\u2022 Click steps/transitions to edit them</li>\n                  <li>\u2022 Validate before saving</li>\n                </ul>\n              </div>\n            </Alert>\n          </div>\n        </div>\n\n        {/* Main Canvas */}\n        <div className=\"flex-1 relative p-6 overflow-auto\">\n          <div className=\"h-full rounded-lg border bg-card\">\n            <WorkflowGraph\n              initialNodes={nodes}\n              initialEdges={edges}\n              onNodesChange={handleNodesChange}\n              onEdgesChange={handleEdgesChange}\n              onNodeClick={handleNodeClick}\n              onEdgeClick={handleEdgeClick}\n              onConnect={handleConnect}\n              editable={true}\n              height=\"100%\"\n            />\n          </div>\n\n          {/* Empty State */}\n          {nodes.length === 0 && (\n            <div className=\"absolute inset-0 flex items-center justify-center pointer-events-none\">\n              <div className=\"text-center\">\n                <h2 className=\"text-xl font-semibold text-gray-900 mb-2\">\n                  Start Building Your Workflow\n                </h2>\n                <p className=\"text-gray-600 mb-4\">\n                  Click a step type from the palette to add it to the canvas\n                </p>\n                <div className=\"text-sm text-gray-500\">\n                  or{' '}\n                  <button\n                    onClick={handleLoadExample}\n                    className=\"text-blue-600 hover:underline pointer-events-auto\"\n                  >\n                    load an example workflow\n                  </button>\n                </div>\n              </div>\n            </div>\n          )}\n        </div>\n      </PageBody>\n\n      {/* Node Edit Dialog - Conditional rendering based on feature flag */}\n      {process.env.NEXT_PUBLIC_WORKFLOW_CRUDFORM_ENABLED === 'true' ? (\n        <NodeEditDialogCrudForm\n          node={selectedNode}\n          isOpen={showNodeDialog}\n          onClose={() => setShowNodeDialog(false)}\n          onSave={handleSaveNode}\n          onDelete={handleDeleteNode}\n        />\n      ) : (\n        <NodeEditDialog\n          node={selectedNode}\n          isOpen={showNodeDialog}\n          onClose={() => setShowNodeDialog(false)}\n          onSave={handleSaveNode}\n          onDelete={handleDeleteNode}\n        />\n      )}\n\n      {/* Edge Edit Dialog - Conditional rendering based on feature flag */}\n      {process.env.NEXT_PUBLIC_WORKFLOW_CRUDFORM_ENABLED === 'true' ? (\n        <EdgeEditDialogCrudForm\n          edge={selectedEdge}\n          isOpen={showEdgeDialog}\n          onClose={() => setShowEdgeDialog(false)}\n          onSave={handleSaveEdge}\n          onDelete={handleDeleteEdge}\n        />\n      ) : (\n        <EdgeEditDialog\n          edge={selectedEdge}\n          isOpen={showEdgeDialog}\n          onClose={() => setShowEdgeDialog(false)}\n          onSave={handleSaveEdge}\n          onDelete={handleDeleteEdge}\n        />\n      )}\n\n      {/* Clear Confirmation Dialog */}\n      <Dialog open={showClearConfirm} onOpenChange={setShowClearConfirm}>\n        <DialogContent className=\"sm:max-w-md\">\n          <DialogHeader>\n            <DialogTitle>Clear Everything?</DialogTitle>\n            <DialogDescription>\n              This will clear all metadata and the workflow canvas. This action cannot be undone.\n            </DialogDescription>\n          </DialogHeader>\n          <DialogFooter>\n            <Button variant=\"outline\" onClick={() => setShowClearConfirm(false)}>\n              {t('common.cancel', 'Cancel')}\n            </Button>\n            <Button variant=\"destructive\" onClick={confirmClear}>\n              {t('common.clear', 'Clear')}\n            </Button>\n          </DialogFooter>\n        </DialogContent>\n      </Dialog>\n    </Page>\n  )\n}\n\n// Helper functions\nfunction getDefaultLabel(nodeType: string): string {\n  const labels: Record<string, string> = {\n    start: 'Start',\n    end: 'End',\n    userTask: 'New User Task',\n    automated: 'New Automated Task',\n    decision: 'Decision Point',\n    waitForSignal: 'Wait for Signal',\n  }\n  return labels[nodeType] || 'New Step'\n}\n\nfunction getDefaultBadge(nodeType: string): string {\n  const badges: Record<string, string> = {\n    start: 'Start',\n    end: 'End',\n    userTask: 'User Task',\n    automated: 'Automated',\n    decision: 'Decision',\n    waitForSignal: 'Wait for Signal',\n  }\n  return badges[nodeType] || 'Task'\n}\n"],
+  "mappings": "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",
   "names": []
 }