Action

Clear Session

Often, at the end of a flow, an API backend call will be configured to, for example, save a train ticket in the ticket ordering system. Afterwards users should be able to book a new ticket to a different location.

You can achieve this with the 'clear session' action. This action removes the values of set session variables. This is useful when a user asks to correct a value, or to start over and delete all variables.

Mail report and Send email

Mail report and Send email are very similar options but with a slight difference.

Mail report sends two things:

  • an email with a message

  • the bot conversation at the time where the message was send

Send email sends one thing:

  • an email with a message

All you need to do is to define the email title, recipients and body. Here you can also use variables between curly braces if you need to.

Send to offload provider

A user that reaches this action will be offloaded to a human customer support agent. For this to work, you need to enable offloading.

Depending on your selected offloading provider, additional configuration may be required.

API

This action can be used to integrate back-end services into your bot. These are the contents of the API widget:

  • HTTPS methods and API endpoint URL:

  • Query parameters

  • Authorization

  • Headers

  • Body

  • Configuration (link to API SSL/HMAC settings)

1. HTTPS method and API endpoint url

The plugin supports 5 HTTPS methods:

· GET

· POST

· DELETE

· PUT

· PATCH

2. Query payload parameters

Add query parameters by defining key value combinations. Each key can have three possible value types:

  • text: static text

  • variable: a user session variable. The value of the variable will be stored as value for the key. Dot and array notation are supported, for example: users[0].firstname

  • dialogstate: select a dialog state from the dropdown. The dialog state id will be stored as value for the key. This id can be used to redirect the user to a certain dialog state based on your business logic when sending back the API response.

Please note that the term dialog state refers to the same thing as a block, in the context of development.

3 . ­­­­Authorization

3.1 Basic Auth: will display the fields to fill username and password.

3.2 Bearer Token: will display the Token field to be filled in.

4. Headers

5. Body:

You can define a request body request in all HTTPS methods.

6. Configuration:

If you have an API configuration in Settings>API, you will see them here:

More details can be found in our tutorial.

Code

The code editor allows developers to quickly build custom logic on top of the bot by writing their own Javascript code blocks. Typically, the code editor is used to perform requests to external systems, or to do operations with variables.

You can find more information about the code editor here:

pageCode editor

There are also two tutorials in which we show you how the code editor can be used:

pageRetrieving data from Airtable (GET)pageSending data to Airtable (POST)

iframe

An iframe is a custom element that can be used to show a different web page in the chat conversation. It can also be used to communicate with the parent window using the postMessage API.

Have a look at this basic example:

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		</head>
		<body>
			<button onClick="window.parent.postMessage(JSON.stringify({target:'CL_API',type:'SEND_MESSAGE', payload:{text: 'You clicked the button'} }),'*')">
         SEND_MESSAGE
        </button>
		</body>
</html>

If this block of code is hosted and embedded within our iframe plugin, it will send the user a chat message when they click the button.

The postMessage API can also handle UPDATE_SESSION and GO_TO_DIALOGSTATE events.

Delay

Sometimes you want to create a slight delay between bot messages, either to create a natural pause between them or because you need a few seconds to make an API call and don't want the bot to just be silent. Either way, slight pauses can improve the user experience a lot.

You will find the Delay widget in Action dialog states. This feature allows you to create from 1-20 seconds of delay by dragging the green circle to the right or left:

JSON Builder

If your bot is published on the Webhook API channel, you can use the JSON Builder action to send messages to the conversation that don't need to result in an actual message to the user. Typically, it's used to send information about the user or bot conversation to the website the bot is published on.

Website window events

You can use the JSON builder action in combination with the webwidget channel to receive window events on your webpage. These events will contain the data as configured in your JSON builder action.

Here's an example: Configure your JSON builder action to send a language key, with a variable retrieved from the session, and the "Send config to parent window" toggled on.

Your widget will trigger an event for that configuration to its parent window as a MessageEvent. The MessageEvent will contain a `data` field which contains the stringified result of the JSON builder configuration. Here's an example on how to listen to these events:

// Chatlayer JSON Builder Event Handler
window.addEventListener('message', (event) => {
    const data = event && event.data && JSON.parse(event.data) || {}
    consttype, payload } = data
    if (type !== 'CL_DISPATCH_EVENT') return;
    console.log('Chatlayer language received: ' + payload.language)
})

Set variables

The Set variable step facilitates the creation, formatting, and assignment of values to variables.

Add a Set variable step

  1. Inside your block, navigate to the Action steps.

  2. Select Set variables.

  1. Click + Add variable.

  2. You can either:

    • Create a new variable by assigning it a name (e.g., 'current_time')

    • Or type the name of a variable that already exists

  3. ; select 'Expression' for this example.

We've recently introduced a brand new set of expressions syntax. To explore the full range of expressions and functions available, check out the comprehensive documentation provided here.

  1. Assign a value to your variable by typing it in the Value field. For this example, we'll use the 'NOW' function for the current time.

  1. Save to apply changes.

Set variable with operations

The Set variable step supports various operations inside the Value field.

Operations allow you to perform calculations like addition, subtraction, multiplication, division, or finding the remainder of two numbers.

For a comprehensive list of available operations such as addition (+), multiplication (*), division (/), and more, please refer to the detailed documentation provided here.

Example

More examples will be coming soon! 🚀

You can use the new syntax expressions within a Set variable step for calculations. For instance, create a variable named @end_price using Expressions to calculate its value as the sum of another variable and a number (@price + 10).

With the Set variable step in combination with the new Expressions syntax, you would thus be able to manipulate the data that has been stored in the session.

Last updated