Articles on: React Flow

Components of the workflow

What are the elements of the workflow?



In this article:
Three components of the workflow
Triggers, conditions & actions in the workflows
Setting up Triggers
Setting up Conditions
Setting up Actions
Delay your workflow for a better time

In this help guide, you’ll find a detailed explanation of what each workflow component means and how it works.

✔️ Three components of the workflow



A workflow consists of three main components which you need to set up to give it the exact parameters by which it will run.

Trigger - an action performed in your store that launches an automatic workflow (for example, an order was canceled in your store).
Condition - a special factor that determines if the selected action is performed (when the trigger is selected you can verify if the customer whose order was canceled can be notified about it).
Action - the final result of the workflow, achieved after the triggers and conditions are met (an email with the notification about the canceled order was sent to the customer).

✔️ Triggers, conditions, and actions in the workflows



Setting up Triggers



Triggers are essential elements in the workflow. These are the mechanisms that launch the automatic workflow. Such mechanisms are the events performed in your store (e.g., creating a new order or canceling it, etc.). When the trigger event occurs, your workflow starts and performs the defined action.

Why add triggers?

When you set up a trigger you choose an event that has occurred in your store and the app automatically identifies which actions should follow next and what changes will be performed.

How it works?

Click on “Select trigger” to start your workflow. As soon as you’ve selected the trigger you’ll be able to manage other components as conditions and actions.

React Flow Triggers

Setting up Conditions



When the trigger is set, next are conditions - important elements that determine whether the final action will be performed if some conditions are met. Each condition has operators to check if certain parameters match.

What do they do?

The conditions make sure that further actions are performed only after the necessary conditions are met. If such conditions are not met, the actions will not be executed.

How it works?

To set up conditions you should click on the “Add condition” button and select the condition from the drop-down list in the field on the right.



There are two operators - “If” and “Then”- that determine further actions. The “If” operator sets up the condition itself and verifies if the selected condition is met.

It has two possible options - “Yes” or “No”. The first one allows you to set action and complete the workflow when the condition is satisfied. The second one allows adding another condition in case the first one isn’t met. The “Then” operator will lead to the final action of the workflow.

For example, the trigger action is “Customer created”. In the “Select condition” field choose a proper condition - “Accepts marketing” to verify if this customer has agreed to receive your marketing materials, and set a final action - “Add customer tags” to mark such customer with a tag.



If the condition is satisfied the workflow will end with this action. In case it is not, you can either leave this workflow like this or add another action in the “What’s next” field (after the “No” operator), or set another condition, after which add the final action.

You can add several conditions in the “If” operator to create one common condition that should be met. In this case, your final action will be performed if all these conditions are met. If even one of them is not satisfied the action won’t be performed. At this stage, you can either end the workflow or set action or another condition in the “No” operator field. You can add as many actions as you like to end this workflow by clicking on the "Add action" button.



You can add different conditions and actions in a row as well in one workflow.


In the “Then” field, click the “Add action” button below to add more actions to be performed to end the workflow. You can add as many actions as you like to one workflow.

Setting up Actions



Actions are the last step in every workflow. They do the final changes in your store. They can be Shopify and External. The internal actions are the actions that can make changes in your Shopify store, and the external ones regulate the sending of emails or HTTP requests to customers.

Shopify actions


These are the actions that can make changes inside your store. There are different actions that change depending on the selected trigger. They can relate to customers, products, collections, orders, payments, etc.

External actions


Sometimes you need to contact customers outside your shop, so you need to connect with them via email to inform them about some updates in your store. In this case, use the External actions.

React Flow Actions

Delay your workflow for a better time



Along with the "Add action" button, you can see the "Add delay" button. Thanks to it, you can plan a convenient time for your workflow with the React Flow Delay function. If you don’t want it to start right after the trigger has fired choose the proper time interval after which it will launch.

In the “What’s next” field click on “Add delay” and configure your delay time.



Select the necessary type of time (hours or days) in the field “Select time interval”, and set the value, i.e., the specific number of hours or days.



Suggested articles



React Flow Triggers & Actions
Most popular flows

Updated on: 13/02/2024

Was this article helpful?

Share your feedback

Cancel

Thank you!