diff --git a/.changeset/flow-empty-start-and-edge-insert.md b/.changeset/flow-empty-start-and-edge-insert.md new file mode 100644 index 000000000..f973bada6 --- /dev/null +++ b/.changeset/flow-empty-start-and-edge-insert.md @@ -0,0 +1,20 @@ +--- +'@object-ui/app-shell': patch +--- + +Flow designer: start a new flow with a trigger, and stop the edge "+" overlapping branch labels + +Two more dogfooding fixes for the Studio flow designer: + +- **Empty flow → Start node.** An empty editable flow's "Add node" inserted a + generic `task` node; it now seeds a `start` (trigger) node — the canonical + entry point every flow needs — so the canvas opens on the trigger and the + author builds forward from there. +- **Edge insert handle no longer collides with the branch label.** The "insert + node" `+` button and the branch/condition label pill were both centered on the + edge midpoint, so on a labeled edge (`approve`, `if …`) the `+` sat on top of + the label. The `+` now slides to the right of the label when one is present + (unlabeled edges keep the centered `+`). + +Verified in-browser: labeled edges show the label and a clear, separate insert +handle; `tsc --noEmit` clean. diff --git a/packages/app-shell/src/views/metadata-admin/previews/FlowCanvas.tsx b/packages/app-shell/src/views/metadata-admin/previews/FlowCanvas.tsx index 78a67a8d6..56cb66211 100644 --- a/packages/app-shell/src/views/metadata-admin/previews/FlowCanvas.tsx +++ b/packages/app-shell/src/views/metadata-admin/previews/FlowCanvas.tsx @@ -515,7 +515,10 @@ export function FlowCanvas({ )} {editable && ( { if (!canEdit) return; const existingIds = nodes.map((n) => n.id).filter(Boolean); - const newNode: FlowNode = { id: uniqueId('node', existingIds), type: 'task', label: 'New node' }; + // A flow's first node is its trigger — seed a `start` node (not a generic + // `task`) so the canvas opens on the canonical entry point and the author + // adds subsequent steps from there. + const newNode: FlowNode = { id: uniqueId('node', existingIds), type: 'start', label: 'Start' }; const next = appendArray(nodes, newNode); onPatch!({ nodes: next }); onSelectionChange?.({ kind: 'node', id: newNode.id, label: newNode.label || newNode.id });