Directus 9 Episode 3

Create a Newsletter List With Directus Flows

In this video, we are going to create a Flow that will add a user to a newsletter list if they opt in for it.

Let us now create another Directus flow. This time just a bit more complex.

If you don’t know what Directus Flows are please check out the previous video for a quick intro.

Create a newsletter list

First, let’s create a new collection and call it newsletter_list

Now let’s add three simple input fields to it and call them: first_name, last_name, and email

In this collection we are going to save users that sign up to our app AND opt-in to receive the newsletter, users that don’t opt-in will not be added to the collection.

Save the collection, and we are done with our Newsletter list collection

Add opt-in field to users

In Settings -> Data models click on “System Collections” and then click on directus_users

Create a new toggle field here and give it a name of newsletter.

Set the default value to be enabled and Save it.

Now that we have our opt-in field setup, we can start creating our flow.

The Flow - Trigger

Go to Flows and Create a new flow, we will call it “Newsletter Flow”.

The description can be something like “Add user to newsletter list”.

Click the arrow so we can set up our trigger.

The trigger will be an Event hook with non-blocking Action.

The scope is of course items.create since we wanna trigger this flow once the user has been created.

Click on “Show 15 more” and then select “Directus Users”.

Now click the checkmark to save our trigger.

The Flow - Operation One

This Flow is going to have two operations, the first operation will check if the user chooses to opt into our newsletter, and then if they did we are going to create another operation that will add that user to the “Newsletter list” collection. Easy peasy.

Click the plus symbol to create the first operation, and name it “Check Newsletter Opt-in”.

For the operation type, we are going to choose “Condition”.

And then in the “Condition Rules” box, we are going to check if the user has opted in using the following code.

{
    "$trigger": {
        "payload": {
            "newsletter": {
                "_eq": true
            }
        }
    }
}

Here we are checking if the newsletter field that is coming from our trigger is equal to true.

Now click the checkmark to confirm this operation.

The Flow - Operation Two

You will notice that this operation has a checkmark symbol and an X symbol on the bottom right side. When you click on the checkmark you can chain another operation that will run if the condition that we created is true, and by clicking on the X symbol you can chain the operation that will run if the condition is false.

For this Flow, we will only chain the operation if the condition is true, because if it’s false, then we don’t wanna do anything.

So now click on the checkmark symbol on the bottom right of the operation box, and we will create an operation that will add the user to our “Newsletter list” collection.

We will call this operation “Add user to Newsletter list”.

For the operation type choose “Create data”.

For the collection, we are of course going to select “Newsletter List”.

In the Permissions field select the “From Trigger” option.

Now, all we have to do is set our payload, meaning we have to send values for the three fields that we created for our “Newsletter list” collection: first_name, last_name and email.

We are going to get our data from the trigger again, so just add this simple bit of code in the “Payload” input box.

{
    "email": "{{$trigger.payload.email}}",
    "first_name": "{{$trigger.payload.first_name}}",
    "last_name": "{{$trigger.payload.last_name}}"
}

Click on the Checkmark to save the operation, and then once again to save the Flow.

All that is left to do now is to test this Flow out.

Testing it out

Go to users, and create a new user. I will name the user John Doe.

Note that at the bottom of the page you will have the newsletter field, which should be enabled by default.

If it’s not, enable it.

Save the user.

Now go to Collections and select “Newsletter List” collection to see if this worked.

And as you can see user John Doe has been added to our list.

Great!

Now create another user.

We will call this one Jane Doe. But for this one disable the newsletter field.

Save it, and go to collections one more time.

And as you can see we still only have John Doe in our Newsletter list. This means our Flow works since Jane didn’t wanna sign up for our newsletter.

Activity Log

Before we conclude this video I just wanna show you one more thing that can help you when debugging Flows.

You can always go to Settings -> Flows, and then select the Flow you wanna debug.

Here on the right side of the screen, you will notice the “Logs” tab, if you click on it you will get some useful information about the Flow.

Like Options and what is especially useful Payload of your trigger. So if something is not working you can always check the Logs to see what might have gone wrong.

Just note that this will only show up if you choose to track Activity & Logs when creating a flow.

Also note that Logs are going to be stored in the database so it would be good, to clean them from time to time.

Maybe you can even create a Flow that will do that automatically for you, wink, wink, nudge, nudge.

Wanna ask a question about video?

Like This Video?

Support it by sharing it ;)

© Watch And Learn,2024