[OutSystems.AI Chatbot] OutSystems.ai Chatbot with QnAMaker links and follow-up prompts

Forge Component
(13)
Published on 31 Mar (10 days ago) by Rui Parente
13 votes
Published on 31 Mar (10 days ago) by Rui Parente

Hello,

I've got a problem with the Outsystems.ai Chatbot. First of all, I'm using OS ServiceCenter 11.6.16 and the tradional web-app is built on my personal cloud (version 11). The bot is a Azure bot built with QnAMaker. At first, the bot seems to work fine, but when I use links or follow-up prompts, the problem occurs. This is what the QnA-tester shows:

And this is the result from OutSystems.AI chatbot:

How can I fix this?

Thank you in advance.

Kind regards,

Tom

Hello,

We aren't currently supporting the follow up prompts.

Are you testing the feature or do you need to implement it in a project?

Thanks,

Bruno

Hello,

Thank you for you reply!

It is for a project. Do you know when follow-up prompts are supported? And what about links, is this also not supported? Do you know if there are workarounds to fix my problem?

Regards,

Tom




Bruno Martinho wrote:

Hello,

We aren't currently supporting the follow up prompts.

Are you testing the feature or do you need to implement it in a project?

Thanks,

Bruno



Hello Tom,

I'm talking to the development team management to answer you question about when it will be available.

Let me check if there is any workaround to be applied in the meanwhile.


Hallo Bruno,

Happy new year and thank you for the fast replies.

When I was trying to do something with the answers from my QnaBot, I noticed that I recieved an 'activity' (type = message) with an attachment (with contentType vnd.microsoft.card.hero). This attachment has text and buttons. Since there are already buttons in the Bot-block, I used these buttons. I also used the actions already present in the JS.

I replaced to following code:

SyntaxEditor Code Snippet

                // If the activity received has attachments, these are added to the UI.
                // Otherwise the attachments node is removed from the template clone.
                if (hasAttachments) {
                  var attachments = activity.attachments
                  attachments.forEach(function (element) {
                    var attachmentNode = newAttachmentNode(element)
                    cloneBotTemplate.lastChild.appendChild(attachmentNode)
                  })
                  chatBody.scrollTop = messageList.scrollHeight

with:

SyntaxEditor Code Snippet

                  // If the activity received has attachments, these are added to the UI.
                  // Otherwise the attachments node is removed from the template clone.
                  if (hasAttachments) {
                    var textNode = botMessageNode.firstChild
                    textNode.innerText = activity.attachments[0].content.text
                    
                    // Create a clickable actions based on the Follow-Up Promps.
                    var actions = activity.attachments[0].content.buttons
                      var actionNode = botMessageNode.lastChild
                      actions.forEach(function (element) {
                        var actionClone = actionNode.cloneNode(true)
                        actionClone.style.display = 'block'
                        actionClone.innerText = element.title
                        actionClone.setAttribute('action-data', element.value)
                        
                        // Creates link-attributes for given acionClone.innerText values.
                        if (actionClone.innerText == '<YourFollowUpButtonText>'){
                        actionClone.setAttribute('onclick', 'return !window.open("YourLink", "_blank");')}

                        
                        botMessageNode.appendChild(actionClone)
                        

                      })
                    
                  }

Since I am new to JS, this may not be the most beautiful implementation, but i tworks. The follow-up prompts are visible and, depending on the innerText values I set and how the JS handles these values, I can navigate to other webpages. If you have any suggestions or questions, please contact me.

Tom 

That was exactly what I was thinking about, to change that JS to deal with that and use the buttons!

Good job!

Bruno Martinho