logo

Snippet Components — A New Module for Botpress

Introducing the Snippet Components — a new module created by Botpress. This module will help you create flows faster and gives some basic examples with other skills.

By

9 May, 2022

Updated 10 May, 2022

Share


The Snippet Components is a new feature that will help you create multiple nodes in the Botpress studio. We created this feature to showcase various examples in Botpress. For example, with the Snippets Components feature, you can do the following:

  • Create an API call in Botpress
  • Ask questions and get responses to those questions
  • Create a yes/no question
  • Create a multiple option question

Keep in mind, that this feature is a little bit complex to implement as the snippet needs to create a content type, links, and skills all in one go. I decided to create a big JSON object that contains the entire structure.

Components

To understand this feature I will describe some snippets that you can play with. The snippets feature is part of an external module and is not enabled by default. Follow these steps to enable the snippets feature:

  1. Go to the module tabs
  2. Search for basic components
  3. Click on the knobs to enable the feature
  4. In the Botpress Studio, right-click with your mouse
  5. Select component to add

In the following section, I will describe each component, what they do, and how to use them.

API-Call

The first component is the Call API (which uses the skills Call API). This skill is useful to make APIs call to external services (such as Shopify and a backend server). By default, the Call API will ask you for your favorite ice cream (you can change the question to make it something more useful to you) and it will repeat your choice if the API is successful. Otherwise, if the API failed, it will ask you for two ice cream choices. The last node is the retry function for your API call (the failure case). If you want, you can either retry the flow or cancel the flow and get back to your normal flow.

If you want to test this snippet you can create a web server to respond to the API. Or you can change the API call to point to your external services.

var http = require('http');
http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('Hello World\n');
}).listen(8080, "127.0.0.1");

This server doesn’t really do anything useful. It listens to the port 8080 and replies with a 200 status code with a Hello World.

Once the server replies with a valid status code, the next node will repeat the choice from the earlier question. I used a mechanism called ‘memory’ to store the data. You can learn more about the memory mechanism here.

Greeting

The greeting snippet is a useful starting node. It’s used to say Hi, only one time. You can use this snippet to provide useful information to the user and store some information about the user. Here’s how the greeting snippet works.

In the ‘setVariable’ function, a value is registered in the session memory. The node called ‘check-greeting’ will check if a value exists for ‘greeting’. If the value doesn’t exist, it will go in the information node (the information node displays useful infomration to the user and shows what the bot is doing).

Otherwise, if the value greeting exists in the memory, the flow will proceed normally.

Multiple choice

A multiple choice is mandatory for the first wave of snippet components. This snippet is useful if you have a multiple choice and free text input that can use the NLU to catch the corresponding intent from the user.

The ‘choice’ node is where you will put your button choice. The free text is enabled on the multiple choice skills. Here, you can add an intent that you would like to catch. For example, the cancel intent could be a good choice to place here.

The ‘did_not_understand’ node is a node when a button was not clicked and the intent was not understood. You can retry the flow or cancel the current flow.

Yes/No Choice

Another useful snippet is the yes/no question. You can have more than one yes/no question in your flow — simply add the yes/no question you want to ask and add a ‘choice’ node.

Conclusion

While the Snippets Components feature is not yet perfect, it can certainly help you build your flows faster. Do keep in mind that since there is no auto-arrangement for the snippet generator, the flow will appear in an unorganized way.

I hope you learned something new today. Thanks for your interest in Botpress and happy coding!

Related Articles

20 May, 2022

What's Happening at Botpress: May 2022

Botpress launched its new Learning Center this month! Plus, two new OpenBook webinars.

9 May, 2022

Snippet Components — A New Module for Botpress

Introducing the Snippet Components — a new module created by Botpress. This module will help you create flows faster and gives some basic examples with other skills.

2 May, 2022

Introducing the Botpress Learning Center

A new place to master Botpress, chatbots, and conversational AI.