How to mention the team via incoming webhooks in MS Teams - json

I implemented a solution to mention individual team members similar to the one explained in the answer here however this only works for individual users.
I want to apply the same concept but mention the team itself (#team) however I can't find any documentation on it or any examples. At this point I'm not sure if it is supported yet.
This is my current working request:
let data = `{
"type": "message",
"attachments":
[
{
"contentType": "application/vnd.microsoft.card.adaptive",
"content":
{
"type": "AdaptiveCard",
"body": [
{
"type": "TextBlock",
"size": "Medium",
"weight": "Bolder",
"text": "",
"wrap": true,
"style": "heading"
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"items": [
{
"type": "Image",
"style": "Person",
"url": "` + memberImageURL + `",
"altText": "` + memberName + `",
"size": "Small"
}
],
"width": "auto"
},
{
"type": "Column",
"items": [
{
"type": "TextBlock",
"weight": "Bolder",
"text": "<at>` + memberName + ` UPN</at>",
"wrap": true
}
],
"width": "stretch"
}
]
},
{
"type": "FactSet",
"facts": [
{
"title": "Agile Team",
"value": "` + memberAgileTeam + `"
},
{
"title": "QA Team",
"value": "` + memberTeam + `"
}
]
},
{
"type": "TextBlock",
"text": "` + memberDescription + `",
"wrap": true
}
],
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.5",
"msteams": {
"entities": [
{
"type": "mention",
"text": "<at>` + memberName + ` UPN</at>",
"mentioned": {
"id": "` + memberEmail + `",
"name": "` + memberUsername + `"
}
}
]
}
}
}
]
}`;

Related

Why am I receiving a Webhook Message Delivery error on this POST request?

I tested the following JSON body on:
adaptivecards.io/designer
and I didn't face any issues with displaying the desired card. However, sending a POST request to my Teams Channel using an Incoming Webhook connector with this JSON body does not work.
{
"type": "message",
"attachments":
[
{
"contentType": "application/vnd.microsoft.card.adaptive",
"content":
{
"$schema": "https://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
"type": "TextBlock",
"text": "This card's action will show another card"
}
],
"actions": [
{
"type": "Action.ShowCard",
"title": "Action.ShowCard",
"card": {
"type": "AdaptiveCard",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.5",
"body": [
{
"type": "Table",
"gridStyle": "accent",
"columns": [
{
"width": 1
},
{
"width": 1
},
{
"width": 3
}
],
"rows": [
{
"type": "TableRow",
"cells": [
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "Name",
"wrap": true,
"weight": "Bolder"
}
]
},
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "Type",
"wrap": true,
"weight": "Bolder"
}
]
},
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "Description",
"wrap": true,
"weight": "Bolder"
}
]
}
],
"style": "accent"
},
{
"type": "TableRow",
"cells": [
{
"type": "TableCell",
"style": "good",
"items": [
{
"type": "TextBlock",
"text": "columns",
"wrap": true
}
]
},
{
"type": "TableCell",
"style": "warning",
"items": [
{
"type": "TextBlock",
"text": "ColumnDefinition[]",
"wrap": true
}
]
},
{
"type": "TableCell",
"style": "accent",
"items": [
{
"type": "TextBlock",
"text": "Defines the table's columns (number of columns, and column sizes).",
"wrap": true
}
]
}
]
},
{
"type": "TableRow",
"cells": [
{
"type": "TableCell",
"style": "good",
"items": [
{
"type": "TextBlock",
"text": "rows",
"wrap": true
}
]
},
{
"type": "TableCell",
"style": "accent",
"items": [
{
"type": "TextBlock",
"text": "TableRow[]",
"wrap": true
}
]
},
{
"type": "TableCell",
"style": "attention",
"items": [
{
"type": "TextBlock",
"text": "Defines the rows of the Table, each being a collection of cells. Rows are not required, which allows empty Tables to be generated via templating without breaking the rendering of the whole card.",
"wrap": true
}
]
}
]
}
]
},
{
"type": "Table",
"gridStyle": "accent",
"showGridLines": false,
"columns": [
{
"width": 1
},
{
"width": 1
},
{
"width": 3
}
],
"rows": [
{
"type": "TableRow",
"cells": [
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "Name",
"wrap": true,
"weight": "Bolder"
}
]
},
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "Type",
"wrap": true,
"weight": "Bolder"
}
]
},
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "Description",
"wrap": true,
"weight": "Bolder"
}
]
}
],
"style": "accent"
},
{
"type": "TableRow",
"cells": [
{
"type": "TableCell",
"style": "good",
"items": [
{
"type": "TextBlock",
"text": "columns",
"wrap": true
}
]
},
{
"type": "TableCell",
"style": "warning",
"items": [
{
"type": "TextBlock",
"text": "ColumnDefinition[]",
"wrap": true
}
]
},
{
"type": "TableCell",
"style": "accent",
"items": [
{
"type": "TextBlock",
"text": "Defines the table's columns (number of columns, and column sizes).",
"wrap": true
}
]
}
]
},
{
"type": "TableRow",
"cells": [
{
"type": "TableCell",
"style": "good",
"items": [
{
"type": "TextBlock",
"text": "rows",
"wrap": true
}
]
},
{
"type": "TableCell",
"style": "accent",
"items": [
{
"type": "TextBlock",
"text": "TableRow[]",
"wrap": true
}
]
},
{
"type": "TableCell",
"style": "attention",
"items": [
{
"type": "TextBlock",
"text": "Defines the rows of the Table, each being a collection of cells. Rows are not required, which allows empty Tables to be generated via templating without breaking the rendering of the whole card.",
"wrap": true
}
]
}
]
}
]
}
]
}
}
]
}
}
]
}
I should expect a card like this being sent to my MS Teams channel, however it results in the following error:
Webhook message delivery failed with error: Microsoft Teams endpoint returned HTTP error 400
This is what I expect the Teams message to look like:
Any ideas for why this is happening?
The issue here is Adaptive Card v1.5 is not supported so Table element can't be parsed properly and Teams returns 400 error code.
We are actively working on the fix.

Action.ShowCard inheriting width from ColumnSet in which it is called

I have created a MS Teams adaptive card below:
{
"type": "AdaptiveCard",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.3",
"body": [
{
"type": "TextBlock",
"text": "Account Ownership Change Request",
"wrap": true,
"id": "lblHeader",
"size": "Large",
"weight": "Bolder",
"color": "Default"
},
{
"type": "TextBlock",
"text": "Company",
"wrap": true,
"id": "lblCompany",
"separator": true,
"size": "Medium",
"color": "Accent",
"weight": "Bolder",
"horizontalAlignment": "Center"
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "Current Owner:",
"wrap": true,
"id": "lblCurrentOwner",
"weight": "Bolder"
},
{
"type": "TextBlock",
"text": "New Owner:",
"wrap": true,
"weight": "Bolder",
"id": "lblNewOwner"
}
]
},
{
"type": "Column",
"width": "auto",
"items": [
{
"type": "TextBlock",
"text": "X",
"wrap": true,
"id": "txtCurrentOwner"
},
{
"type": "TextBlock",
"text": "Y",
"wrap": true,
"id": "txtNewOwner"
}
]
}
]
},
{
"type": "TextBlock",
"text": "Please action using the below buttons.",
"wrap": true,
"spacing": "Large",
"id": "lblActions",
"color": "Default"
},
{
"type": "TextBlock",
"text": "Comments",
"wrap": true,
"id": "lblComments",
"size": "Small",
"color": "Default",
"spacing": "Large"
},
{
"type": "Input.Text",
"placeholder": "Add your comments here",
"id": "txtComments",
"isMultiline": true,
"spacing": "Small"
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"items": [
{
"type": "ActionSet",
"spacing": "None",
"actions": [
{
"type": "Action.ShowCard",
"title": "Reassign",
"id": "btnReassign",
"card": {
"type": "AdaptiveCard",
"width": "Full",
"body": [
{
"type": "Input.ChoiceSet",
"choices.data": {
"type": "Data.Query",
"dataset": "graph.microsoft.com/users"
},
"id": "ddlEmployeePicker",
"placeholder": "Type an employee name",
"label": "Assign to:",
"isRequired": true,
"spacing": "Medium",
"errorMessage": "Please provide an employee to reassign"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Submit",
"title": "Assign",
"style": "positive",
"id": "btnAssign"
}
],
"spacing": "Small",
"id": "asAssign"
}
]
}
}
]
}
],
"width": "auto",
"horizontalAlignment": "Center"
},
{
"type": "Column",
"width": "stretch",
"spacing": "ExtraLarge"
},
{
"type": "Column",
"width": "auto",
"items": [
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Submit",
"title": "Reject",
"id": "btnReject",
"style": "destructive"
}
]
}
],
"spacing": "Small",
"horizontalAlignment": "Center"
},
{
"type": "Column",
"items": [
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Submit",
"title": "Approve",
"id": "btnApprove"
}
]
}
],
"spacing": "Small",
"horizontalAlignment": "Center",
"width": "auto"
}
]
}
]
}
Which looks like this:
Once the Reassign button is clicked:
The issue is that once expanded the action buttons are squished and the dropdown list is displayed within the Reassign column. Is it possible to display the DDL outside and below the Reassign column so that it can be the full width of the adaptive card?
Could you please refer below json which uses factset having Action.ShowCard:
{
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
"type": "Container",
"items": [
{
"type": "TextBlock",
"text": "Publish Adaptive Card schema",
"weight": "bolder",
"size": "medium"
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "auto",
"items": [
{
"size": "small",
"style": "person",
"type": "Image",
"url": "https://pbs.twimg.com/profile_images/3647943215/d7f12830b3c17a5a9e4afcc370e3a37e_400x400.jpeg"
}
]
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "Matt Hidinger",
"weight": "bolder",
"wrap": true
},
{
"type": "TextBlock",
"spacing": "none",
"text": "Created {{DATE(2017-02-14T06:08:39Z, SHORT)}}",
"isSubtle": true,
"wrap": true
}
]
}
]
}
]
},
{
"type": "Container",
"items": [
{
"type": "TextBlock",
"text": "Now that we have defined the main rules and features of the format, we need to produce a schema and publish it to GitHub. The schema will be the starting point of our reference documentation.",
"wrap": true
},
{
"type": "FactSet",
"facts": [
{
"title": "Board:",
"value": "Adaptive Card"
},
{
"title": "List:",
"value": "Backlog"
},
{
"title": "Assigned to:",
"value": "Matt Hidinger"
},
{
"title": "Due date:",
"value": "Not set"
}
]
}
]
}
],
"actions": [
{
"type": "Action.ShowCard",
"title": "Set due date",
"card": {
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
"type": "Input.Date",
"id": "dueDate"
}
],
"actions": [
{
"type": "Action.Submit",
"title": "OK"
}
]
}
},
{
"type": "Action.ShowCard",
"title": "Set due date2",
"card": {
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
"type": "Input.Date",
"id": "dueDate2"
}
],
"actions": [
{
"type": "Action.Submit",
"title": "OK2"
}
]
}
},
{
"type": "Action.ShowCard",
"title": "Comment",
"card": {
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
"type": "Input.Text",
"id": "comment",
"isMultiline": true,
"placeholder": "Enter your comment"
}
],
"actions": [
{
"type": "Action.Submit",
"title": "OK"
}
]
}
}
]
}

Swagger JSON - How could I fix a response render error?

I have been trying to fix an error where the Swagger would not render my JSON response - here is an attached picture of it.
The console does not show any errors so I am struggling to allocate from where the issue could be coming - here is the console result.
I would be extremely thankful if someone could suggest a way to fix that problem.
Here is my code:
"paths": {
"/unit/{jobs}": {
"get": {
"tags": [
"Services"
],
"summary": "Jobs information",
"description": "Returns JSON with content of jobs details.",
"operationId": "unitJobs",
"security": [
{
"Application": []
},
{
"Profile": []
},
{
"Authorization": []
}
],
"parameters": [
{
"name": "jobs",
"in": "path",
"required": true,
"schema": {
"type": "string"
},
"description": "Jobs"
}
],
"responses": {
"200": {
"description": "Success!",
"content": {
"application/json": {
"schema": {
"$ref": "#/components/schemas/Job"
}
}
}
}
}
}
}
},
"components": {
"securitySchemes": {
"Application": {
"name": "X-Application",
"type": "apiKey",
"in": "header"
},
"Profile": {
"name": "X-Profile",
"type": "apiKey",
"in": "header"
},
"Authorization": {
"type": "http",
"scheme": "bearer"
}
},
"schemas": {
"Job": {
"properties": {
"id": {
"type": "integer",
"example": 2584075,
"description": "Unique identifier"
},
"currency_code": {
"type": "string",
"example": "GBP",
"description": "Currency code"
},
"payment_method": {
"type": "array"
},
"app_time": {
"type": "integer",
"example": 1504620000,
"description": "Appointment time for the job in UTC timestamp"
},
"flexible_from": {
"type": "integer",
"example": null,
"description": "Start of timeframe to execute the job in UTC timestamp"
},
"flexible_to": {
"type": "integer",
"example": null,
"description": "End of timeframe to execute the job in UTC timestamp"
},
"insufficient_travel_time_warning_time": {
"type": "integer",
"example": "1504616400",
"description": "Time up until Pro should leave previous job in order to get to this job in time in UTC timestamp"
},
"total_formatted": {
"type": "string",
"example": "£97",
"description": "Price of the service after discounts"
},
"base_total_formatted": {
"type": "string",
"example": "£97",
"description": "Price of the service before discounts"
},
"price_notes": {
"type": "array",
"example": [
"Credit applied",
"Compensation included"
],
"description": "Description notes for the price of the services."
},
"require_summary": {
"type": "integer",
"example": 4,
"description": "\n * `0` - No summary required \n * `1` - Should send summary at the end of the day \n * `2` - Should send summary now \n * `3` - Can’t proceed until summary sent \n * `4` - Summary sent"
},
"work_time": {
"type": "integer",
"example": 120,
"description": "Job duration in minutes"
},
"valid_to": {
"type": "integer",
"example": "1504620000",
"description": "Time after which job is no more valid and has to be updated in UTC timestamp"
},
"attachments.origin_key": {
"type": "string",
"example": "checklist",
"description": "\n Identifies where the attachment is coming from: \n * `checklist` - from answering a question that requires attachment \n * `job` - from job screen \n * `configurator` - from booking process when filling a choice item of type attachment"
},
"services_price_modifiers": {
"type": "array",
"example": ""
},
"reference_number": {
"type": "string",
"example": "20082602SYS",
"description": "Unique identifying number for each job"
},
"purchase_order_number": {
"type": "string",
"example": "12-13-14-15-16",
"description": "Unique number assigned to a purchase order form"
},
"contacts": {
"type": "array",
"items": {
"$ref": "#/components/schemas/Contact"
}
},
"message_templates": {
"type": "array",
"items": {
"$ref": "#/components/schemas/MessageTemplate"
}
},
"decline_reason_groups": {
"type": "array",
"items": {
"$ref": "#/components/schemas/DeclineReasonGroup"
}
},
"icons": {
"type": "array",
"items": {
"$ref": "#/components/schemas/Icon"
}
}
}
},
"Contact": {
"properties": {
"id": {
"type": "integer",
"example": 203,
"description": "Unique identifier"
},
"value": {
"type": "string",
"example": "02034042956",
"description": "Contact number"
},
"type": {
"$ref": "#/components/schemas/ContactType"
},
"description": {
"type": "string",
"example": "Customer Service",
"description": "Name of the corresponding department"
},
"display_positions": {
"type": "array",
"example": [
2,
3,
7
],
"description": ""
}
}
},
"MessageTemplate": {
"properties": {
"id": {
"type": "integer",
"example": 15,
"description": "Unique identifier"
},
"title": {
"type": "string",
"example": "In front of the property",
"description": "Template message title"
},
"message": {
"type": "string",
"example": "Dear [CLIENT_NAME], I am in front of your property. Please let me in or call our office on 02034041930. Your Fantastic Professional",
"description": "The containing text of the message"
},
"vars": {
"type": "array",
"items": {
"$ref": "#/components/schemas/Var"
},
},
"destination_option_title": {
"type": "string",
"example": "to office",
"description": "Optionally defines the destination of the title"
}
}
},
"DeclineReasonGroup": {
"properties": {
"title": {
"type": "string",
"example": "Technical issues",
"description": "Decline reason title"
},
"sort": {
"type": "integer",
"example": 100,
"description": ""
},
"decline_reasons": {
"type": "array",
"items": {
"$ref": "#/components/schemas/DeclineReason"
}
}
}
},
"Icon": {
"properties": {
"name": {
"type": "string",
"example": "Key:",
"description": "The name of the icon"
},
"note": {
"type": "string",
"example": "Yes",
"description": "Addiditonal information about the icon"
}
}
},
"Var": {
"properties": {
"variable": {
"type": "string",
"example": "CLIENT_NAME",
"description": "Different client details"
},
"type": {
"$ref": "#/components/schemas/VarType"
},
"field": {
"type": "string",
"example": "clientName",
"description": "Fields where the client's information is filled"
}
}
},
"DeclineReason": {
"properties": {
"id": {
"type": "integer",
"example": 11,
"description": "Unique identifier"
},
"name": {
"type": "string",
"example": "Car is broken",
"description": "The name of a decline reason"
},
"requires_comment": {
"type": "boolean",
"example": true,
"description": "Determines whether the comment section is required to be filled "
},
"success_message": {
"type": "string",
"example": "Please contact Stanimir Tomov on 07472761402 - he can find you another.",
"description": "The message which pops up after the request made is successful"
},
"sort": {
"type": "integer",
"example": 100,
"description": ""
}
}
},
"ContactType": {
"type": "integer",
"enum": [
1,
2,
3,
4
],
"description": "* `1` - Customer Service \n * `2` - Sales \n * `3` - Finance \n * `4` - Other"
},
"VarType": {
"type": "string",
"enum": [
"auto",
"manual"
],
"description": "* `auto` - information being filled automatically \n * `manual` - information being filled manually "
}
}
}
}
The problem is not the responses them selves, rather it is the definition of the 'payment_method' in the Job schema:
You need to define the items in an array definition, try this:
"payment_method": {
"type": "array",
"items": {
"type": "string"
}
}

In Adaptive Cards, how to create table using data binding to template?

The documentation on using template say that we can bind array data to iterate over a template, I am trying to use it to create a table, but I am not sure how to set this up.
Here is my data, it have 2 rows of data:
[
{
"ID": "1",
"Name": "bot1.atmx",
"Description": "Bot 1 Description"
},
{
"ID": "2",
"Name": "bot2.atmx",
"Description": "Bot 2 Description"
}
]
Here is template, which is just a simple table, notice the {id}, {name}, and {description} data binding language.
{
"type": "AdaptiveCard",
"body": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"items": [
{
"type": "TextBlock",
"size": "Medium",
"text": "ID"
}
],
"width": "30px"
},
{
"type": "Column",
"items": [
{
"type": "TextBlock",
"horizontalAlignment": "Left",
"size": "Medium",
"text": "Name"
}
],
"width": "100px"
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "Description",
"horizontalAlignment": "Left",
"size": "Medium"
}
]
}
]
},
{
"type": "ColumnSet",
"spacing": "None",
"columns": [
{
"type": "Column",
"items": [
{
"type": "TextBlock",
"text": "{ID}",
"wrap": true
}
],
"width": "30px"
},
{
"type": "Column",
"items": [
{
"type": "TextBlock",
"horizontalAlignment": "Left",
"text": "{Name}",
"wrap": true
}
],
"width": "100px"
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "{Description}"
}
]
}
]
}
],
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.0"
}
How can I bind this to create table?
You're not that far off.
Notice that the binding syntax changed in May 2020 from {name} to ${name} https://learn.microsoft.com/en-us/adaptive-cards/templating/
To make it work, give youre data a name, i.e:
{
"properties" :
[
{
"ID": "1",
"Name": "bot1.atmx",
"Description": "Bot 1 Description"
},
{
"ID": "2",
"Name": "bot2.atmx",
"Description": "Bot 2 Description"
}
]
}
and add a simple "$data": "${properties}", into you column-items like this:
...
"columns": [
{
"type": "Column",
"items": [
{
"$data": "${properties}",
"type": "TextBlock",
"size": "Medium",
"text": "${ID}"
}
],
"width": "30px"
},
{
...
But be aware, you're not creating a nice looking table, you don't have connected rows to aline the cells.
All you do is: draw 3 seperated columns next to each other. Adding more lines it will make it look like this:

AdaptiveCardsJson - Click to call option without opening new URL

I've got a Json AdaptiveCard that presents information on employees in the business with their name, job title, phone number, email etc..
We've set it up to dial their telephone number on a click to call, but clicking the number opens up a new URL which we don't want. We want it as a background action.
How can we achieve this? Here's our code (Look at the section that has FaceSet, then a Telephone value, it's that value that creates the click to call:
{
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.0",
"actions": [
{
"type": "Action.OpenUrl",
"title": "Call",
"url": "dial:{{Phone}}"
}
],
"body": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "auto",
"items": [
{
"type": "Image",
"url": "http://intranet.christiegroup.com/stafflisting/staff/{{Reference}}.jpg",
"size": "medium",
"style": "people"
}
]
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "{{FullName}}",
"weight": "bolder",
"wrap": true
},
{
"type": "TextBlock",
"spacing": "none",
"text": "{{JobTitle}}",
"isSubtle": true,
"wrap": true
},
{
"type": "FactSet",
"facts": [
{
"title": "Telephone:",
"value": "[{{Phone}}](dial:{{Phone}})"
},
{
"title": "Mobile:",
"value": "{{Mobile}}"
},
{
"title": "Email:",
"value": "{{Email}}"
}
]
}
]
}
]
}
]
}