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.
For this example, we've created a board for the Zylker Campaigns team in Zoho Connect. The board has three sections: User Interface, Content Marketing, Customer Support. We'll see how the marketing team discusses about upcoming marketing initiatives and keeps track of tasks in their connect board.
The workflow behind creating this message action is pretty simple.
1. Once a user clicks on the Add Connect Task message action, the action's handler is triggered to display a form.
2. The user fills all the information required. We use the form change handler to modify the form field values based on the users' inputs. For example, display networks that the user is a part of by default and on selecting a specific network, we'll show the list boards that the user is a part of under the selected network. The same applies for sections as well.
3. On choosing the respective network, board and section, the user can add the task title, description, due date, assignee and more. Note that, the message on which the action was performed will be displayed as the task title by default. This can be modified.
4. On clicking Add Task, the form submit handler is invoked to create a task in Connect with all the provided details.
Prerequisites
Create a connection between Cliq and Connect:
You'll need an active connection between Cliq and Connect. To create a connection,
- Click on your display picture. This will open up the user panel. Now, click on Bots & Tools.
- Click on the Connections icon present on the left side menu of the Bots & Tools page.
- Now, click on Create Connection.
- In the Add Connections view, select the Zoho Oauth option.
- Name your connection. For example you can name your connection: zoho_connect or zohoconnect and choose the following scopes: zohopulse.networklist.READ, zohopulse.tasks.READ, zohopulse.tasks.CREATE
- Make sure the Use Credentials of Login User option is enabled.
- Click on the Create and Connect button to generate the invoke URL task with the connection name.
We'll be using this invoke URL task in our code.
Create a message action
To create a message action on Cliq,
- Click on your display picture. This will open up the user panel. Now, click on Bots & Tools.
- Click on Message Actions in the left pane.
Click on the Create Message Action button and fill in the required details.
Action Name: Provide your message action name. This field is mandatory.
Hint: Brief explanation about the message action.
Access Level: Decide who gets to access your message action. Choose between Organization, Team and Private. Default option is Private.
Choose what kind of messages should have the message action. Options are Text messages, Attachments and Links. For this example, we're choosing messages of the type Text.
- Click on Save & Edit Code.
Create a form function
To create a form function on Cliq,
- Click on your display picture. This will open up the user panel. Now, click on Bots & Tools.
- Click on Functions in the left pane. Click on the Create Function button and fill in the required details.
- Name: Give your function name. Ensure to use the same function name in your form's code as well.
- Description: Briefly describe how your function works.
- Function Type: Choose the component with which the function should be associated. For this example, we're using the function of the type: Form
Step 1: Configuring the message action handler
The message handler is triggered to return the Create Task form as a response.
- messageText = message.get("content").get("text");
- getNetworks = invokeurl
- [
- url :"https://connect.zoho.com/pulse/api/allScopes"
- type :GET
- connection: "" // Give your connection name
- ];
- getNetworks = getNetworks.get("allScopes").get("scopes");
- netWorkOptions = List();
- for each network in getNetworks
- {
- networkList = Map();
- networkList.put("label",network.get("name"));
- networkList.put("value",network.get("id"));
- netWorkOptions.add(networkList);
- }
- inputs = list();
- inputs.add({"type":"select","name":"networks","label":"Network","hint":"Select a network","placeholder":"Select a network!","mandatory":true,"value":"","options":netWorkOptions,"trigger_on_change":true});
- inputs.add({"type":"select","name":"boards","label":"Boards","hint":"Select a board","placeholder":"Select a board!","mandatory":true,"value":"","options":netWorkOptions,"disabled":"true","trigger_on_change":true});
- inputs.add({"type":"select","name":"sections","label":"Section","hint":"Select a section","placeholder":"Select a section!","mandatory":true,"value":"","options":netWorkOptions,"disabled":"true"});
- inputs.add({"name":"title","label":"Title","placeholder":messageText,"value":messageText,"hint":"Enter your task name","min_length":"0","max_length":"50","mandatory":true,"type":"text"});
- inputs.add({"type":"textarea","name":"note","label":"Description","hint":"Describe your task.","placeholder":"To be done by Tuesday","mandatory":false});
- inputs.add({"name":"duedate","label":"Due by","placeholder":"Give your task's due date.","mandatory":false,"type":"date"});
- inputs.add({"type":"select","name":"priority","label":"Priority","hint":"Choose your task priority","placeholder":"High","mandatory":true,"value":"High","options":{{"label":"No Priority","value":"None"},{"label":"Low","value":"Low"},{"label":"Medium","value":"Medium"},{"label":"High","value":"High"}}});
- addTask = {"name":"addTask","type":"form","title":"Add a task","hint":"Add a task to a board in Zoho Connect. ","button_label":"Add Task","inputs":inputs,"action":{"type":"invoke.function","name":"connectTask"}};
- return addTask;
Step 2: Configuring the form change handler
The form change handler will be triggered when the user is filling up the form. The handler is responsible for modifying the form field values based on the user's inputs.
- targetName = target.get("name");
- inputValues = form.get("values");
- networkID = inputValues.get("networks").get("value");
- actions = list();
- if(targetName.containsIgnoreCase("networks"))
- {
- getBoards = invokeurl
- [
- url :"https://connect.zoho.com/pulse/api/myBoards"
- type :GET
- parameters:{"scopeID":networkID}
- connection:"" // Give your connection name
- ];
- getBoards = getBoards.get("myBoards").get("boards");
- boardOptions = List();
- for each board in getBoards
- {
- boardList = Map();
- boardList.put("label",board.get("name"));
- boardList.put("value",board.get("id"));
- boardOptions.add(boardList);
- }
- actions.add({"type":"update","name":"boards","input":{"type":"select","name":"boards","label":"Boards","hint":"Select a board","placeholder":"Select a board!","mandatory":true,"options":boardOptions,"trigger_on_change":true}});
- }
- else if(targetName.containsIgnoreCase("boards"))
- {
- boardId = inputValues.get("boards").get("value");
- getResponse = invokeurl
- [
- url :"https://connect.zoho.com/pulse/api/boardSections"
- type :GET
- parameters:{"scopeID":networkID,"boardId":boardId}
- connection:"" // Give your connection name
- ];
- getSections = getResponse.get("boardSections").get("sections");
- sectionOptions = List();
- for each section in getSections
- {
- sectionList = Map();
- sectionList.put("label",section.get("name"));
- sectionList.put("value",section.get("id").toString());
- sectionOptions.add(sectionList);
- }
- getMembers = getResponse.get("boardSections").get("members");
- if(getMembers.isempty() == false)
- {
- boardMembers = List();
- for each member in getMembers
- {
- memberList = Map();
- memberList.put("label",member.get("name"));
- memberList.put("value",member.get("zuid"));
- boardMembers.add(memberList);
- }
- actions.add({"type":"update","name":"sections","input":{"type":"select","name":"sections","label":"Section","hint":"Select a section","placeholder":"Select a section!","mandatory":true,"options":sectionOptions}});
- actions.add({"type":"add_after","name":"duedate","input":{"type":"select","name":"members","multiple":true,"label":"Assignees","hint":"Add assignees","placeholder":"Assign task to a member","mandatory":false,"options":boardMembers}});
- }
- else
- {
- actions.add({"type":"update","name":"sections","input":{"type":"select","name":"sections","label":"Section","hint":"Select a section","placeholder":"Select a section!","mandatory":true,"options":sectionOptions}});
- }
- }
- return {"type":"form_modification","actions":actions};
Step 3: Configuring the form submit handler
We'll call the create task API in form submit handler. The submit handler typically receives all the inputs filled by the user and will be triggered on form submission.
- response = Map();
- formValues = form.get("values");
- scopeID = formValues.get("networks").get("value");
- boardId = formValues.get("boards").get("value");
- sectionId = formValues.get("sections").get("value");
- title = formValues.get("title");
- priority_value = formValues.get("priority").get("value");
- parameters = {"scopeID":scopeID,"boardId":boardId,"sectionId":sectionId,"title":title,"priority":priority_value};
- desc = formValues.get("note");
- if(desc != "" && !desc.isEmpty())
- {
- parameters.put("desc",desc);
- }
- duedate = formValues.get("duedate");
- if(duedate != "" && !duedate.isEmpty())
- {
- duedate = duedate.toList("-");
- eyear = duedate.get(0);
- emonth = duedate.get(1);
- edate = duedate.get(2);
- parameters.put("eyear",eyear);
- parameters.put("emonth",emonth);
- parameters.put("edate",edate);
- }
- assignee = formValues.get("members");
- if(assignee != {} && !assignee.isEmpty())
- {
- userIds = list();
- for each assgineeID in assignee
- {
- userIds.add(assgineeID.get("value"));
- }
- parameters.put("userIds",userIds.toString());
- }
- addTask = invokeurl
- [
- url :"https://connect.zoho.com/pulse/api/addTask"
- type :POST
- parameters:parameters
- connection:"" // Give your connection name
- ];
- if(addTask.get("addTask").get("stream").isEmpty() == false)
- {
- taskTitle = "[" + addTask.get("addTask").get("stream").get("task").get("title") + "](" + addTask.get("addTask").get("stream").get("url") + ")";
- taskpriority = addTask.get("addTask").get("stream").get("task").get("priority");
- tasksection = addTask.get("addTask").get("stream").get("task").get("section").get("name");
- taskboard = addTask.get("addTask").get("stream").get("partition").get("name");
- response = {"text":"Task added in " + taskboard + ". Take a look at the task details below.","card":{"title":"Task Details","theme":"modern-inline"},"slides":{{"type":"label","title":"Task Details: ","data":{{"Title":taskTitle},{"Priority":taskpriority},{"Section":tasksection},{"Board":taskboard}}}}};
- }
- return response;
End notes:
Message actions in Cliq are super versatile like all other Cliq platform components. You can choose to create a message action that's specific to a message type. This example can be customized even to suit messages of the type attachments and links. So go ahead and give it a try! You can download the source code file attached with this post or access this link here:
https://workdrive.zohoexternal.com/external/6OxchwzzBCF-J8HFH
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,