Cards & Functions: An inside view into how Cliq's custom buttons work!

Cards & Functions: An inside view into how Cliq's custom buttons work!

Message cards are simple templates which can be used to customise messages. In other words, responses on triggering an integration component (commands/ bots/ message actions) can be customised as a message easily with the templates. A message card can be styled with a title, image, buttons, table and so on! Adding a button helps in making the message more interactive and also provides a call to action. 

So where does a function fit here? 

A button can be triggered to perform an action on click, only when a function is associated with it. A function is a piece of code invoked when a button action is performed. The list of attributes triggered when a function is invoked, is explained in our functions handler help page. 

Sample use case scenario: Triggering functions on /issues command execution

Tracking issues is a great way to record bugs reported in a module of a product. The /issues command for instance will get a list of issues reported under the user's name. Each issue will have a button, on clicking which more information about the issue will be displayed. 

Pro Tip: Cliq offers a variety of message cards. Check them out here . You can also try building one using our message builder

/issues command workflow 

When a user executes the /issues command, the below given workflow is triggered
  1. Command suggestion handler is triggered and shows the user a list of portals
  2. Upon selection, the suggestion handler is triggered again to show a list of projects for the user to choose from
  3. Once the portal and project is selected, the command execution handler is invoked to get the list of issues for which the user is responsible for!
  4. Clicking on a button associated with each issue will get more details about the issue and display it as a separate card for the user to see. 
Watch this tutorial video on what functions are and how the /issues command execution and response works



Sample Functions Execution Code 

  1. response = Map();
  2. if(target.get("name") == ":bug: Info")
  3. {
  4. apiid = arguments.get("key").toList("-");
  5. portal = apiid.get(0);
  6. project = apiid.get(1);
  7. ID = apiid.get(2);
  8. bugdetails = invokeurl
  9. [
  10. url :"https://projects.zoho.com/restapi/portal/" + portal + "/projects/" + project + "/bugs/" + ID + "/"
  11. type :GET
  12. connection:" insert_your_connection_name "
  13. ];
  14. response = {"text":"Details about " + bugdetails.get("bugs").toMap().get("title"),"card":{"theme":"modern-inline"},"slides":{{"type":"label","data":{{"Reported By":bugdetails.get("bugs").toMap().get("reported_person")},{"Issue Status":bugdetails.get("bugs").toMap().get("status").toMap().get("type")}}}}};
  15. info response;
  16. }
  17. else if(target.get("name") == "All Open Issues")
  18. {
  19. info arguments;
  20. apiid = arguments.get("key").toList("-");
  21. portal = apiid.get(0);
  22. project = apiid.get(1);
  23. bugdetails = invokeurl
  24. [
  25. url :"https://projects.zoho.com/restapi/portal/" + portal + "/projects/" + project + "/bugs/?statustype=open"
  26. type :GET
  27. connection:" insert_your_connection_name "
  28. ];
  29. info bugdetails;
  30. bugs = bugdetails.toMap().get("bugs");
  31. info bugs.size();
  32. if(bugs.size() > 0)
  33. {
  34. rows = List();
  35. for each  bug in bugs
  36. {
  37. row = Map();
  38. info bug;
  39. row.put("Issue ID",bug.get("key"));
  40. row.put("Assigned To",bug.get("assignee_name"));
  41. row.put("Severity",bug.get("severity").toMap().get("type"));
  42. row.put("Issue Status",bug.get("status").toMap().get("type"));
  43. if(rows.size() <= 5)
  44. {
  45. rows.add(row);
  46. }
  47. }
  48. response = {"text":"Hey " + user.get("first_name") + " !  Recently reported issues!","card":{"theme":"modern-inline","title":"Issue List:"},"slides":{{"type":"table","title":"hello","data":{"headers":{"Issue ID","Assigned To","Severity","Issue Status"},"rows":rows}}}};
  49. }
  50. else
  51. {
  52. response = {"text":"Good news. Looks like there are no open issues in this project! :grinning:"};
  53. }
  54. }
  55. return response;

The /issues command execution and suggestion code is attached as a text file. Hope this has intrigued you to try it out right away.  Comments and suggestions are welcome! 

Best,
Manasa
Cliq





                            Zoho Desk Resources

                            • Desk Community Learning Series


                            • Digest


                            • Functions


                            • Meetups


                            • Kbase


                            • Resources


                            • Glossary


                            • Desk Marketplace


                            • MVP Corner


                            • Word of the Day



                                Zoho Marketing Automation
                                        • Sticky Posts

                                        • Convert a message on Cliq into a task on Zoho Connect

                                          Message actions in Cliq are a great way to transform messages in a conversation into actionable work items. In this post, we'll see how to build a custom message action that'll let you add a message as a task to board on Zoho Connect. If you haven't created
                                        • Cliq Bots - Post message to a bot using the command line!

                                          If you had read our post on how to post a message to a channel in a simple one-line command, then this sure is a piece of cake for you guys! For those of you, who are reading this for the first time, don't worry! Just read on. This post is all about how
                                        • Cliq Bots - How to make a bot respond to your messages?

                                          Bots are just like your buddies with whom you can interact. They carry out your tasks, keep you notified about your to-dos and come in handy when you need constant updates from a third party application.  So, how can you make your bot respond to a message? The bot message handler is a piece of code triggered when a message is sent to the bot. Message handlers help you customise your bot responses to make it look conversational. The message input from the user can be either a string or an option selected
                                        • Cliq Bots - Get notifications about any action on an application with the incoming webhook handler!

                                          Webhooks can be used to get notified about events happening in other applications inside Cliq. All bots in Cliq have their own incoming webhook endpoint. This makes it simple to post messages to the bot from external applications. Unlike the send message
                                        • The Slash Command Series - Types of Command Suggestions

                                          Hi Everybody! I hope you guys tried the /zdocs command and now have an idea of how command suggestions with click to execute work. If you have no clue of what command suggestion is, I recommend you to take a look at all the Slash Command Series posts, especially the one on Command Suggestions ! This post is all about the different types of command suggestions.  Customise your command suggestions  Did you know you could customise your command suggestion list with a title, description, image? Well,


                                        Manage your brands on social media



                                              Zoho TeamInbox Resources

                                                Zoho DataPrep Resources



                                                  Zoho CRM Plus Resources

                                                    Zoho Books Resources


                                                      Zoho Subscriptions Resources

                                                        Zoho Projects Resources


                                                          Zoho Sprints Resources


                                                            Qntrl Resources


                                                              Zoho Creator Resources


                                                                Zoho WorkDrive Resources



                                                                  Zoho Campaigns Resources

                                                                    Zoho CRM Resources

                                                                    • CRM Community Learning Series

                                                                      CRM Community Learning Series


                                                                    • Tips

                                                                      Tips

                                                                    • Functions

                                                                      Functions

                                                                    • Meetups

                                                                      Meetups

                                                                    • Kbase

                                                                      Kbase

                                                                    • Resources

                                                                      Resources

                                                                    • Digest

                                                                      Digest

                                                                    • CRM Marketplace

                                                                      CRM Marketplace

                                                                    • MVP Corner

                                                                      MVP Corner

                                                                    





                                                                    




                                                                        Design. Discuss. Deliver.

                                                                        Create visually engaging stories with Zoho Show.

                                                                        Get Started Now