NF-UI-10: operator creates new flow from canvas #370
Labels
No labels
area:agents
area:dashboard
area:database
area:design
area:design-review
area:flows
area:infra
area:meta
area:security
area:sessions
area:webhook
area:workdir
security
type:bug
type:chore
type:meta
type:user-story
No milestone
No project
No assignees
1 participant
Notifications
Due date
No due date set.
Dependencies
No dependencies set.
Reference
charles/claude-hooks#370
Loading…
Add table
Add a link
Reference in a new issue
No description provided.
Delete branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
As an operator, I want to create a new flow from a blank canvas — pick a trigger, drop nodes, save — without leaving the editor surface, so that authoring a custom routing policy mirrors the edit experience instead of being a separate wizard.
ComfyUI-style: land on
/app/flows/new, get a canvas seeded with one source node + an unset trigger; toolbar surfaces a trigger dropdown + id input + Save / Discard. First save POSTs to/flows(NF-7 endpoint), subsequent saves PATCH normally.Acceptance criteria
Route + initial state
/app/flows/newreplaces the stub. Renders the canvas + toolbar withmode: "create".{ id: "src", type: "source" }), no edges. Source node is undeletable in create mode (matches edit-mode rule).Toolbar (create mode)
TRIGGER_KINDS(from@claude-hooks/shared). Required.^[a-z0-9-]+$. Required.validateGraph./app/flows.Save flow
flowsApi.createFlow(graph)→POST /flows./app/flows/:newId. Subsequent saves on that route use the existing PATCH path.data-invalid(reuse the edit-modeFlowValidationErrorflow).beforeunloadwarning matches edit mode.Architecture
flowsApi.createFlow(graph): Promise<FlowSummary>— new client function (POSTs full body). Returns the server summary mapped throughtoClientSummary.FlowCanvasaccepts three new props:mode?: "edit" | "create"— default"edit".initialDetail?: FlowDetailResponse— used in create mode instead ofuseQuery.onCreate?: (graph: Graph) => Promise<{ id: string }>— used instead ofupdateFlowon first save.Tests (target ≥12)
TRIGGER_KINDS.Foo!, acceptsmy-flow).createFlowwith the expected shape./app/flows/:newId./app/flows/new.data-invalid(mirrors edit mode).Server side
POST /flowsshipped with NF-7 (#363) including 409 / 422 envelopes + audit log row withaction: "create".Out of scope
References
specs/node-flows-ui.md§ Stories — currently has no NF-UI-10; this issue is the first story past NF-UI-9 in the UI sequence.apps/web/src/features/flows/FlowCanvas.tsx— reference for the edit-mode toolbar + save handler the create mode mirrors.apps/server/src/http/flows-routes.ts::handleFlowCreate— the POST endpoint already shipped.apps/web/src/features/flows/flowsApi.ts::updateFlow— sibling shape to copy forcreateFlow.packages/shared/src/trigger-event.ts::TRIGGER_KINDS— runtime catalog the trigger picker reads.Dependencies
createFlowis the same pattern.