message share

SUSI AI is integrated to Facebook (blog). During the initial phase, SUSI FBbot had basic UI and functionalities like just “plain text” replies. Facebook provides many more features like replies enclosed in templates (blog link), sharing the replies by SUSI A.I. with friends, get started button or a persistent menu to show quick reply options to the user etc. All these features to enhance the user experience with SUSI AI chatbot. This blog post walks you through on adding these functionalities to the SUSI FBbot: Adding Get Started button A Get Started button is added to the SUSI FBbot to give the user a brief introduction about SUSI AI and what the user can try next. Clicking on the get started button , will send the message as “Get Started” to the SUSI FBbot: The reply message, provides the user with options to visit SUSI A.I. repository or to just start chatting. To have this button in our bot, we use this code snippet: // Add a get started button to the messenger request({ url: 'https://graph.facebook.com/v2.6/me/messenger_profile', qs: {access_token:token}, method: 'POST', json: { "get_started":{ "payload":"GET_STARTED_PAYLOAD" } } }, function(error, response, body) { // handle errors and response here }) When a user clicks this button, a postback is sent to the webhook of SUSI FBbot with payload as “GET_STARTED_PAYLOAD”. When we receive such postback, we reply with a message as shown above using generic template. Adding a persistent menu to the bot If not at the start, while chatting with SUSI AI for sometime, it is quite possible that the user becomes curious to visit the repository of SUSI A.I. . So we need a quick access to the “Visit repository” button all the time. Persistent menu, helps us with this feature: This way it is accessible at each point of time. Some other buttons can also be added to the menu like “Latest News” as shown in the image above. To have a persistent menu for the SUSI FBbot, the following code snippet is used: request({ url: 'https://graph.facebook.com/v2.6/me/messenger_profile', qs: {access_token:token}, method: 'POST', json: { "persistent_menu":[{ "locale":"default", "composer_input_disabled":false, "call_to_actions":[{ "type":"web_url", "title":"Visit Repository", "url":"https://github.com/fossasia/susi_server", "webview_height_ratio":"full" }] }] } }, function(error, response, body) { // handle errors and response }) We can add more buttons to the menu. JSON object having the required properties of that button can be appended to the key “call_to_actions” to do so. Adding a messenger code to join SUSI FBbot To enable Facebook users to chat with SUSI AI by scanning a code through messenger. This feature is added to the bot by making the following POST request: request({ url: 'https://graph.facebook.com/v2.6/me/messenger_codes', qs: {access_token:token}, method: 'POST', json: { type: "standard", image_size: 1000 } }, function(error, response, body) { // handle errors and response. }); Adding message sharing feature To increase the reach of SUSI A.I. to more users on Facebook, message sharing proves to be a big boon. The reply by SUSI A.I. to users can be shared with their friends. Along with the message we can also send…