The Visual Editor

Karl Falconer · Updated

The visual editor is the default way to build rules in DropStream. It’s a drag-and-drop canvas of blocks — no code required. This article walks through the parts of the editor and the most common interactions.

An empty rule editor canvas with the AI Generate panel

What’s on the screen

A few elements show up on every rule:

  • Header — rule name (click the pencil to edit), description, status badge, hook badge, store badge, the Visual / Code / Test tab switcher, More actions kebab, and Save.
  • Canvas — where the rule lives.
  • Configuration panel — appears on the right when you click a node, and shows the form fields for that node.
  • Toolbar — undo, redo, zoom controls, and Fit to view at the bottom of the canvas.

Empty canvases also include a Describe your rule panel for generating a rule with AI, and a Build manually button to start from scratch.

How a rule is structured

A rule is a list of statements that run top-to-bottom. Each statement is a node on the canvas.

The most common statement is WHEN / THENif this condition is true, do these actions. But statements like set or for can also sit at the top level, where they run unconditionally on every record. A rule that just sets a field on every record needs no WHEN at all.

Adding statements

Click Add statement at the top level to add a new node. From there, pick the kind of statement you want — a WHEN block, a set, a for loop, or any other action. Inside a THEN, you can add nested statements with another Add statement button. There’s no required minimum: a rule with one set is just as valid as one with several nested WHEN blocks.

Selecting a node

Click any node on the canvas to open its configuration panel on the right.

A selected node showing its configuration panel and inline auto-explanation

The panel shows form fields specific to that node type. Change a field and the canvas updates immediately. The Will set preview shows what the node does, and the Preview at the bottom shows the equivalent BGL code.

The breadcrumb at the top of the canvas (Root > When #1) tells you where you are in the rule. Click any breadcrumb segment to go back up.

Inline explanations

If your account has AI explanations enabled, each node card shows a one-line plain-English summary of what it does — like “Sets shipping to: UPS: Ground” in the screenshot above. See Rule Auto-Explanations for details.

More actions

The menu next to Save offers:

The More actions kebab menu

  • Edit Details — change the rule’s name and description.
  • Activate / Deactivate — toggle the rule’s active status.
  • Delete Rule — permanently remove the rule.

Visual ↔ Code

Switch between the Visual and Code tabs at any time without losing work — they’re two views of the same rule. If you write something in the code editor that the visual editor can’t render (a feature it doesn’t yet support), it’ll automatically show you the code view instead.

For details on the code editor, see The Code Editor.

What it can’t do

The visual editor handles most rules cleanly, but a few advanced BGL features (deep regex captures, complex nested accumulate, some custom expressions) only show up in the code view. If you hit one, switch to Code — your rule is fine, the visual editor just doesn’t have a block for it yet.

Was this article helpful?
0 out of 0 found this helpful

Comments

0 comments

Please sign in to leave a comment.