Insert a card that can be directly responded to - node.js

update !important: The API has changed a lot, this question shouldn't be taken into consideration anymore
I am trying to use the REST api (via Node.js API) to create cards that the user can respond to and create an interaction in this way.
Reading the docs the creator attribute is not really specified anywhere, so I have no idea how to insert that.
Also this video doesn't help. Nor this guide =)
I believe there is an URL I should set as callback somehow? I'd like to know how to get these responses, please.
update
This is the card I am sending.
{
bundleId: 'veryuniqueBundle',
id: 'veryuniqueBundle:reply',
text: "want to hear moar?",
menuItems: [
{action: "REPLY"}
]
}
that's the response I get:
{
"collection": "timeline",
"itemId": "119c4dc8-c0ce-4a83-aa76-41aab4e8dbe1",
"operation": "INSERT",
"verifyToken": "42",
"userToken": "id:520ef63cde31145deb000001",
"userActions": [
{
"type": "REPLY"
}
]
}
The problem is, I can't see what the user responded (an text) and the reference to the original card id (or bundle) that was responded to. How can I get those

Cards do not provide a direct callback. Instead, when a user selects a menu item it causes the card to be updated with their menu selection. This change subsequently triggers a notification ping to your timeline subscription.
Follow these steps to detect a menu item selection:
Subscribe to notifications for changes in the timeline collection
{
"collection": "timeline",
"userToken": "awesome_kitty",
"verifyToken": "random_hash_to_verify_referer",
}
Insert a timeline card with a custom menu item
{
"text": "Hello world",
"menuItems": [
{
"action": "CUSTOM",
"id": "complete"
"values": [{
"displayName": "Complete",
"iconUrl": "http://example.com/icons/complete.png"
}]
}
]
}
Select the item on Glass
Receive the notification on your subscription URL
{
"collection": "timeline",
"itemId": "3hidvm0xez6r8_dacdb3103b8b604_h8rpllg",
"operation": "UPDATE",
"userToken": "harold_penguin",
"userActions": [
{
"type": "CUSTOM",
"payload": "PING"
}
]
}
Do cool stuff in your code
???
Profit

Related

How to trigger action from Chip Suggestions in Dialog Flow?

I want to create a ChatBot where the user (mostly) selects from Chip Suggestions.
I can't understand how to construct the Chip Suggestions in Flask.
The following yields null:
#app.route('/webhook', methods=['POST'])
def webhook():
two_chips = jsonify(fulfillment_text="This message is from Dialogflow's testing!",
fulfillment_messages=[
{
"payload": {
"richContent": [
[
{
"type": "chips",
"options": [
{
"text": "HIV Testing Schedule",
"link": "https://example.com" #Links work, but I don't want links
},
{
"link": "https://example.com",
"text": "PreP"
}
]
}
]
]
}
}])
return two_chips
Ideally, the button clicking would trigger a new action/intent and the bot would respond with more specific text. I.e. what should I replace the link field with?
This link suggests that there is a replyMetadata field, but that seems to be specific to kommunicate, not Google?
I looked flask-dialogflow, but the documentation is too sparse and conflicting for me.
Those chips which require a link, should be replaced by a list 1. List items are clickable and trigger an intent via events 2 (to make the bot respond with more specific text).
To get started, update your code to use lists and then add the event name you'd like to trigger in your code. Then add that same event name to the Events section of the intent you want to trigger.
Here is an example of what that can look like. I tested a list and clicked on a list item to triggered a test event that ran my test intent:
Are you looking for suggestion chips like the one below?
The sample payload that you have shared is from Kommunicate [Disclaimer: I am founder #kommunicate] and it is specific to Kommunicate platform for link buttons. Seems like what you are looking for is direct buttons/suggestion chips, here is the right doc from Kommunicate for this: https://docs.kommunicate.io/docs/message-types#suggested-replies
As Kommunicate supports omnichannel and multiple platforms web, android, iOS, whatsapp, LINE, facebook, etc so Kommunicate supports its own rich message payload along with Dialogflow specific payload.
For Dialogflow specific suggestion chips, use:
{
"payload": {
"google": {
"expectUserResponse": true,
"richResponse": {
"items": [
{
"simpleResponse": {
"textToSpeech": "These are suggestion chips."
}
},
{
"simpleResponse": {
"textToSpeech": "Which type of response would you like to see next?"
}
}
],
"suggestions": [
{
"title": "Suggestion 1"
},
{
"title": "Suggestion 2"
},
{
"title": "Suggestion 3"
}
],
"linkOutSuggestion": {
"destinationName": "Suggestion Link",
"url": "https://assistant.google.com/"
}
}
}
}
}
Source: https://developers.google.com/assistant/conversational/df-asdk/rich-responses#df-json-suggestion-chips

MS teams adaptive card not sending input text value on submit

I am 500% sure it used to work and all of a sudden this is broken. The card for getting input is no longer passing the value back to nodejs.
The card looks like below:
{
"type": "AdaptiveCard",
"body": [
{
"type": "TextBlock",
"text": "Note text"
},
{
"type": "Input.Text",
"placeholder": "Type a note",
"isMultiline": true,
"id": "noteIdVal"
}
],
"actions": [
{
"type": "Action.Submit",
"title": "Save",
"data": { "action" : "add_note", "objNumber": objId, "objType": objectType }
},
{
"type": "Action.Submit",
"title": "Cancel",
"data" : {"action": "cancel"}
}
],
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
}
On the submit action, in my nodejs i am getting the data in the values node which are passed in the data field. However, it is no longer attaching noteIdVal. Did something changed from MS side?
MS Teams Adaptive card required special property with the name msteams to the object in an object submit action’s data property in order to access this functionality.
{
"type": "Action.Submit",
"title": "Click me for messageBack",
"data": {
"msteams": {
"type": "messageBack",
"displayText": "I clicked this button",
"text": "text to bots",
"value": "{\"bfKey\": \"bfVal\", \"conflictKey\": \"from value\"}"
},
"extraData": {}
}
}
The type property is "messageBack" the submit action will behave like a messageBack card action, which is like a combination of imBack and postBack.
Reference :
Microsoft Docs for MS Teams Adaptive Card
So, may be useful to other folks here. I have two showCards and the content of both the show cards has a common text field with same id name "noteIdVal". As ultimately it is a single json and hence was the culprit.
Lesson, have all fields unique id values which is easy to miss when you have multiple show cards

List Template for FB using Bot framework node.js V4

Can anyone please help me to include list view in Facebook Channel using Bot framework? I saw examples as shown here List template. I don't know whether this is the exact way in which we need to give the attachments. Also I didn't know the equivalent for sourceEvent method in Bot framework v4. Another useful link is as follows FB Messenger Message Template. See the image given below. I need to put the link for the image and once we click the link it should open another page also the image should be clickable image as in the example for C# Clickable HeroCard images using tap property. Both functionality should work. I tried using HeroCard (but the url that needs to open-up had CORS origin issue. I tried using Adaptive card but it is not supported in Facebook as of now. So, I thought to use List Template for Facebook. Is there anyway to achieve this?
You can send Facebook List Templates through the Microsoft BotFramework by adding the Facebook attachment to the activity's channel data. The list template type doesn't seem to be supported, but you can set the type to generic and add multiple elements to the attachment to get the same result. See the example below.
await turnContext.sendActivity({
channelData: {
"attachment": {
"type": "template",
"payload": {
"template_type": "generic",
"elements": [
{
"title": "Three Strategies for Finding Snow",
"subtitle": "How do you plan a ski trip to ensure the best conditions? You can think about a resort’s track record, or which have the best snow-making machines. Or you can gamble.",
"image_url": "https://static01.nyt.com/images/2019/02/10/travel/03update-snowfall2/03update-snowfall2-jumbo.jpg?quality=90&auto=webp",
"default_action": {
"type": "web_url",
"url": "https://www.nytimes.com/2019/02/08/travel/ski-resort-snow-conditions.html",
"messenger_extensions": false,
"webview_height_ratio": "tall"
},
"buttons": [{
"type":"element_share"
}]
},
{
"title": "Viewing the Northern Lights: ‘It’s Almost Like Heavenly Visual Music’",
"subtitle": "Seeing the aurora borealis has become a must-do item for camera-toting tourists from Alaska to Greenland to Scandinavia. On a trip to northern Sweden, the sight proved elusive, if ultimately rewarding.",
"image_url": "https://static01.nyt.com/images/2019/02/17/travel/17Northern-Lights1/17Northern-Lights1-superJumbo.jpg?quality=90&auto=webp",
"default_action": {
"type": "web_url",
"url": "https://www.nytimes.com/2019/02/11/travel/northern-lights-tourism-in-sweden.html",
"messenger_extensions": false,
"webview_height_ratio": "tall"
},
"buttons": [{
"type":"element_share"
}]
},
{
"title": "Five Places to Visit in New Orleans",
"subtitle": "Big Freedia’s rap music is a part of the ether of modern New Orleans. So what better authentic travel guide to the city that so many tourists love to visit?",
"image_url": "https://static01.nyt.com/images/2019/02/17/travel/17NewOrleans-5Places6/17NewOrleans-5Places6-jumbo.jpg?quality=90&auto=webp",
"default_action": {
"type": "web_url",
"url": "https://www.nytimes.com/2019/02/12/travel/big-freedia-five-places-to-eat-and-visit-in-new-orleans.html",
"messenger_extensions": false,
"webview_height_ratio": "tall"
},
"buttons": [{
"type":"element_share"
}]
}]
}
}
}
});
Hope this helps!

Issue in handling inputs from previous buttons generated by prompts in Slack in Microsoft Bot builder node.js

In the condition when there are multiple buttons present on the same chat history, the user may click the button from previous messages, therefore I am not able to identify from which dialog/message the input came from.
Example:
As chat bot is being implemented for multiple channels, I am avoiding to use Slack's interactive messages, so my aim is to handle this on bot framework itself.
I tried getting information from session object as well as event_source but couldn't figure it out for a concrete solution.
Use a unique ID in callback_id in your button attachment to distinguish between different sets of buttons, e.g. between prompt #1 and prompt #2. The callback_id will be included in the request that Slack sends to your app once a button is pressed.
Together with the general context information of a request like Slack Team ID, channel ID, user ID your app should be able to react correctly.
Example for button definition (from official documentation):
{
"text": "Would you like to play a game?",
"attachments": [
{
"text": "Choose a game to play",
"fallback": "You are unable to choose a game",
"callback_id": "wopr_game",
"color": "#3AA3E3",
"attachment_type": "default",
"actions": [
{
"name": "game",
"text": "Chess",
"type": "button",
"value": "chess"
},
{
"name": "game",
"text": "Falken's Maze",
"type": "button",
"value": "maze"
},
{
"name": "game",
"text": "Thermonuclear War",
"style": "danger",
"type": "button",
"value": "war",
"confirm": {
"title": "Are you sure?",
"text": "Wouldn't you prefer a good game of chess?",
"ok_text": "Yes",
"dismiss_text": "No"
}
}
]
}
]
}

How to disable a slackbot button after clicking on it

I'm creating buttons for a slackbot using something like:
const messageB = {
"attachments": [
{
"text": "Essa mensagem foi útil?",
"callback_id": "button_feedback",
"color": "#3AA3E3",
"attachment_type": "default",
"actions": [
{
"name": "button_click_yes",
"text": "sim",
"type": "button",
"value": "yes"
},
{
"name": "button_click_no",
"text": "não",
"type": "button",
"value": "no"
}
]
}
]
};
But the button remain active after the message was sent, and can be used again by the user. I want to deactivate it, or delete it after it was used. But i can't find about it anywhere in the docs.
Clicking on a button will always fire a request to your Slack app. If you want to remove the button after it was clicked you need to update your original message with a new one that reflects the changed state (e.g. button removed). Its not possible to show deactivated buttons with Slack though, so you need to remove it.
To replace the original message all you need to do is respond to the Slack request with an updated message.
However, it will technically still be possible for users to click on your button twice (e.g. due to network delays), so you app should be able to response to multiple clicks on your buttons by the same user in an appropriate way.
See also here for the official documentation on the topic.
See also here and here for answer on a similar topic.

Resources