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

Command suggestion handler is triggered and shows the user a list of portals
Upon selection, the suggestion handler is triggered again to show a list of projects for the user to choose from
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!
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

response = Map();
if(target.get("name") == ":bug: Info")
{
apiid = arguments.get("key").toList("-");
portal = apiid.get(0);
project = apiid.get(1);
ID = apiid.get(2);
bugdetails = invokeurl
[
url :"https://projects.zoho.com/restapi/portal/" + portal + "/projects/" + project + "/bugs/" + ID + "/"
type :GET
connection:" insert_your_connection_name "
];
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")}}}}};
info response;
}
else if(target.get("name") == "All Open Issues")
{
info arguments;
apiid = arguments.get("key").toList("-");
portal = apiid.get(0);
project = apiid.get(1);
bugdetails = invokeurl
[
url :"https://projects.zoho.com/restapi/portal/" + portal + "/projects/" + project + "/bugs/?statustype=open"
type :GET
connection:" insert_your_connection_name "
];
info bugdetails;
bugs = bugdetails.toMap().get("bugs");
info bugs.size();
if(bugs.size() > 0)
{
rows = List();
for each bug in bugs
{
row = Map();
info bug;
row.put("Issue ID",bug.get("key"));
row.put("Assigned To",bug.get("assignee_name"));
row.put("Severity",bug.get("severity").toMap().get("type"));
row.put("Issue Status",bug.get("status").toMap().get("type"));
if(rows.size() <= 5)
{
rows.add(row);
}
}
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}}}};
}
else
{
response = {"text":"Good news. Looks like there are no open issues in this project! :grinning:"};
}
}
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

Topic Participants
Manasa Manogaran

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,