Basestack Docs
User Guide

The Flow Page

The Flow page is a live visualisation of everything that happens to a submission, from the moment it hits your form's endpoint to the response sent back to the user. Use it to understand the pipeline at a glance, jump to any related setting in one click.

Opening Flow

Navigate to any form and click Flow in the form's navigation menu (right after Files, before Setup). The page renders a node graph → the URL is /a/form/<formId>/flow.

The Flow link is gated by the same permission as Setup, so Viewers see it but can't edit Rules.

Reading the diagram

The diagram is laid out top-to-bottom on a main column, with a side branch on the right for asynchronous background jobs.

Main column (synchronous path)

NodeWhen it runsActive when
SubmissionForm data arrives at your endpointAlways
VerifyReferer, IP rules, honeypot are checkedAlways
RulesCustom field validations runOpens the Rules drawer → active when at least one rule is defined
Save submissionSubmission row is written to the databaseRetention setting is enabled
CustomizationResponse URLs (redirect / success / error) are appliedAt least one custom URL is configured
DoneResponse is returned to the submitterForm is enabled

Edges in the main column are solid, animated arrows. Their colour and animation dim when the source or target node is inactive, so you can see at a glance which path a submission will actually take.

Side branch (async fan-out)

After Save submission, three nodes branch off to the right with dashed async edges:

  • Spam AI: submissions are scored asynchronously. Requires both Retention and Spam protection to be on.
  • Webhook: forwards the payload to your configured webhook URL. When active, a small link icon next to the title tooltips the URL.
  • Email notification: sends an email to your configured recipients. When active, the node shows avatar bubbles for each recipient (up to 5, with a +N overflow badge whose tooltip lists the rest).

These are background jobs, the response goes back to the submitter as soon as they're queued, regardless of whether they ultimately succeed.

Node states & cascading

Every node carries one of three visual states:

  • Active: solid icon, dark text, animated edges leaving the node.
  • Inactive: dimmed icon and text; the corresponding step is configured off.
  • Skipped form is disabled: when the form's master switch is off, every downstream node falls into a "skipped" state with a red Form is disabled badge in the header.

A few cascades worth knowing:

  • Form disabled → Verify rejects with HTTP 409 and nothing else runs.
  • Retention off → Save, Spam AI, and any persistence-dependent stage dim.
  • No webhook URL → Webhook dims. Description switches to "No webhook configured".
  • No email recipients → Email notification dims.

Interacting with nodes

  • Verify, Save, Spam, Webhook, Email, Customization → clicking the node opens the matching settings sub-page in a new view (Security, General, Notifications, Customization).
  • Rules → opens the Rules drawer over the canvas.

The drawer slides in from the right and overlays the canvas without scrolling the underlying graph. On screens narrower than 640 px the drawer goes full-width.

Recenter, zoom and resize

  • The Recenter button (top-right of the canvas) refits the diagram with padding: 0.2 and capped at zoom 0.85, so all nodes fit on screen.
  • The graph auto-refits whenever the browser window resizes (debounced ~120 ms), so resizing your window or opening / closing the drawer never strands the diagram off-screen.
  • Touch gestures: pinch-to-zoom and two-finger pan are enabled on touch devices.

Nodes aren't draggable on purpose the layout is computed from your form's configuration and re-derives on every render so it always reflects reality.

Permissions

RoleView FlowEdit Rules
Admin
Developer
Tester
Viewer

Editing falls back to the same permission used for form settings; readers see the drawers in read-only mode.

Next steps

On this page