Dynamic data

Dynamically renders a list of options from an API response.

For use cases that require the list of options to be fetched from an API call (meaning the list is unique to each visitor), you would use the Dynamic data action block.

Using this block, you can dynamically display list items for,

• Button

• Carousel

• Option (WhatsApp and SMS)

• List (WhatsApp)

• Reply button (WhatsApp)

Step 1: Store the response in a variable

The API response containing the list items needs to be stored in a variable. You can do this using the HTTP request action block.

Make sure you store the entire payload response in a variable. Do not append anything after the result on the object path to do this.

Step 2: Setup the Dynamic data action block

Add the 'Dynamic data' action block after the HTTP request action block and configure the details.

Data variable

Contains the entire payload response received from the API. In our example, it is the response variable.

Action block to generate

Choose the action block that you would like to generate. Dynamic data supports the following action blocks,

• Button

• Carousel

• Option (WhatsApp and SMS)

• List (WhatsApp)

• Reply button (WhatsApp)

Question

Configure the block for the question i.e. what question is to be shown while displaying the list items.

Configuring list items

Depending on which action block you have chosen, you would then map the object paths of the data you want to shown for that action block.

For example, if the payload response stored is the following,

[
    {
        "product_id": "123",
        "status": "pending"
    },
    {
        "product_id": "456",
        "status": "delivered"
    },
    {
        "product_id": "798",
        "status": "pending"
    }
]

And if we want to render the product_id from this list as button, we would configure the object path as follows:

result[*].product_id

Where [*] denotes that we need to display all occurances of the field product_id.