Add a new email notification

In this example, we will add a new email notification that will be sent to the customer when their booking time is approaching. We will edit the biketribe-instant-booking transaction process, which was created in the earlier part of this tutorial.

Fetch transaction process

Before we modify our transaction process, it's better to ensure that we have most the up-to-date version of the process. You can fetch any process version with flex-cli:

flex-cli process pull --process=biketribe-instant-booking --alias=release-1 --path=./biketribe-instant-booking --marketplace=biketribe-dev

Create a new email template

When the latest version of the transaction process is pulled, we can navigate to the templates directory. We want to add a new directory for the new notification there.

└── biketribe-instant-booking
    └── templates
        └── booking-reminder-customer

Copy the notification files

Create two files in the new directory with the following file names, and add the linked contents:

• booking-reminder-customer-subject.txt – contains the email message subject line template
• booking-reminder-customer-html.html – contains the template for the HTML version of the email message

Remember to follow the naming convention where the file ends with *-html.html or *-subject.txt. Otherwise, the notification files will not work.

Templates use the Handlebars syntax which will be rendered as HTML when the email is sent. Handlebars enables adding variables like recipient name, marketplace name, and transaction details to the template. You can see all variables that are available in the transaction email context reference.

At the beginning of the notification file, we define helper functions for formatting money and date values. After that, the email template format follows a structure of a standard HTML document. You can add styles with CSS, edit the structure with HTML, and add transaction details by using variables within {{}}.

Preview your changes

Once we have created the email notification, we can preview them with flex-cli. To preview the changes we just made, we can run the command:

flex-cli notifications preview --template biketribe-instant-booking/templates/booking-reminder-customer --marketplace=biketribe-dev

You should see the HTML preview of the template in the address http://localhost:3535. If you make any changes to the template, you can refresh the browser to reload the template and render a new preview

You can also test sending the preview email:

flex-cli notifications send --template biketribe-instant-booking/templates/booking-reminder-customer --marketplace=biketribe-dev

Update process.edn

Once we have the new notification files in place, we need to add the notification to the process.edn file. In the process.edn file, all the notifications are added under the :notifications key. We can use the booking-confirmed-customer notification as an example.

The :name of the notification should be unique, so we use the name booking-reminder-customer. We want this notification to be sent to the customer as well, so the :to parameter stays the same. We also want to make sure that the value of :template is the same as the directory we created earlier.

We want this notification to be sent two days before the booking starts. One way to do this would be to add a new automatic transition two days before the booking start date, and send this notification on the . Instead, we will use the same confirm-payment transition as in booking-confirmed-customer, but add an :at parameter, where we can specify the sending time more specifically.

 :notifications
  [{:name :notification/booking-confirmed-customer,
   :on :transition/confirm-payment,
   :to :actor.role/customer,
   :template :booking-confirmed-customer}
+ {:name :notification/booking-reminder-customer
+  :on :transition/confirm-payment,
+  :to :actor.role/customer
+  :template :booking-reminder-customer
+  :at {:fn/minus
+       [{:fn/timepoint [:time/booking-start]}
+        {:fn/period ["P2D"]}]}}
...

Push process changes

Now that you have edited the email templates, you need to push a new version of your process. If you have done the earlier parts of the tutorial, this process should be already quite familiar to you. If you need more detailed information, take a look at the Edit transaction process with Flex CLI tutorial.

Push the updated process:

flex-cli process push --process=biketribe-instant-booking --path=./biketribe-instant-booking --marketplace=biketribe-dev

Check version number with process list command:

flex-cli process list --process=biketribe-instant-booking --marketplace=biketribe-dev

Update the alias to point to the latest version of the transaction process:

flex-cli process update-alias --alias=release-1 --process=biketribe-instant-booking --version=3 --marketplace=biketribe-dev

Summary

In this tutorial, you:

• Created a new email template folder
• Previewed your email template
• Added a new email notification to the transaction process
• Updated the transaction process